From 5bc054014608f0e46483da6a017e808df22c4c28 Mon Sep 17 00:00:00 2001
From: vgaidarji <veaceslav.gaidarji@gmail.com>
Date: Sun, 8 Jan 2017 14:06:08 +0200
Subject: [PATCH] Fix mobile website initial width

On mobile devices where width < 960, blog content was overlapped by panel-cover
and users were unable to see it, but were able to scroll the page
---
 js/main.js | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/js/main.js b/js/main.js
index 1cb1b37334..ffe6fb8508 100755
--- a/js/main.js
+++ b/js/main.js
@@ -2,10 +2,20 @@
 layout: null
 ---
 $(document).ready(function () {
+  const WIDTH_TRESHOLD = 960
+  function setInitialPanelState() {
+    currentWidth = $('.panel-cover').width()
+    if (currentWidth < WIDTH_TRESHOLD) {
+      $('.panel-cover').addClass('panel-cover--collapsed')
+      $('.panel-cover__description').css('display', 'block')
+    }
+  }
+  setInitialPanelState();
+
   $('a.blog-button').click(function (e) {
     if ($('.panel-cover').hasClass('panel-cover--collapsed')) return
     currentWidth = $('.panel-cover').width()
-    if (currentWidth < 960) {
+    if (currentWidth < WIDTH_TRESHOLD) {
       $('.panel-cover').addClass('panel-cover--collapsed')
       $('.content-wrapper').addClass('animated slideInRight')
     } else {