New Header Mobile, Widgets

src/AppBundle/Resources/public/css/new_header.css

@@ -1104,9 +1104,6 @@
     border-radius: 4px;
 }
 
-#content {
-
-}
 .travel-wrapper {
     border: #ddd 1px solid;
 }
@@ -1203,10 +1200,108 @@
 #topNav {
     margin-bottom: 0px;
 }
-.nav-main-collapse-bottom {
 
+.btn-mobile-info { 
+    display: none;
+}
+
+@media (max-width: 786px) {
+    #eKomiSeal_default img {
+        height: 66px !important;
+    }
+    .home-info-box {
+        height: 78px;
+    }
+    .home-message.small {
+        min-height: 90px;
+    }
+
+    .home-info-box .c4 li {
+        margin-left: 12px;
+        font-size: 0.9em;
+    }
+    h1 {
+        font-size: 22px;
+        line-height: 26px;
+        max-height: 52px;
+        overflow: hidden;
+        margin-bottom: 8px;
+        font-weight: 500;
+        text-overflow:ellipsis;
+        display: -webkit-box;
+        -webkit-line-clamp: 2; /* number of lines to show */
+        -webkit-box-orient: vertical;
+    }
+    .section {
+        padding-top: 5px;
+    }
+    hr {
+        margin-top: 5px;
+        margin-bottom: 5px;
+    }
+    #sidebar .widget a.collapse-widget {
+        padding: 2px 0 2px 4px;
+    }
+    #sidebar .widget a.collapse-widget {
+        font-size: 16px;
+    }
+
+    .h3, h3 {
+        font-size:22px
+    }
+
+    .travel-wrapper .box_mid {
+        min-height: 132px;
+    }
+    .btn-mobile-info {
+        display: block;
+        float: right;
+        margin-right: 4px;
+    }
+}
+
+@media (max-width: 320px) {
+    #topNav button.btn-mobile {
+        margin-left: 2px;
+    }
+    #topNav button.btn-mobile-info {
+        margin-right: 2px;
+    }
+    #header #topNav a.logo>img {
+        height: 28px!important;
+    }
 }
 
 
+.myanimated {
+    -webkit-animation-duration: 1s;
+    animation-duration: 1s;
+    -webkit-animation-fill-mode: both;
+    animation-fill-mode: both;
+}
 
 
+@-webkit-keyframes myfadein {
+    from { opacity: 0; }
+    to { opacity: 1; }
+}
+@keyframes myfadein {
+    from { opacity: 0; }
+    to { opacity: 1; }
+}
+.my_fadein {
+    -webkit-animation-name: myfadein;
+    animation-name: myfadein;
+}
+@-webkit-keyframes myfadeout {
+    from { opacity: 1; }
+    to { opacity: 0; }
+}
+@keyframes myfadeout {
+    from { opacity: 1; }
+    to { opacity: 0; }
+}
+.my_fadeout {
+    -webkit-animation-name: myfadeout;
+    animation-name: myfadeout;
+}

src/AppBundle/Resources/public/js/custom.js

@@ -11,12 +11,12 @@ var collapse_on_responsive = function() {
         if(collapse_status !== 'mobile'){
             collapse_status = 'mobile';
             //close
-            jQuery('.widget').find('.collapse-widget:not(.open)').addClass('collapsed');
-            jQuery('.widget').find('.collapse:not(.open)').removeClass('in');
+            //jQuery('.widget').find('.collapse-widget:not(.open)').addClass('collapsed');
+            //jQuery('.widget').find('.collapse:not(.open)').removeClass('in');
         }else{
             //first init mobile - open
-          jQuery('.widget').find('.collapse-widget.open').removeClass('collapsed');
-          jQuery('.widget').find('.collapse.open').addClass('in');
+          //jQuery('.widget').find('.collapse-widget.open').removeClass('collapsed');
+          //jQuery('.widget').find('.collapse.open').addClass('in');
       }
   }else{
         if(collapse_status !== 'desktop') {
@@ -758,20 +758,28 @@ $(document).ready(function() {
 
         var _header_el = $('#header');
         var _topBar_H = $("#topBar").outerHeight() || 0;
+        var _mobile_info_effect = false;
 
-        // Force fixed header on mobile to avoid "jump" effect.
-        if(window.width <= 992 && _topBar_H < 1) {
+        var windowWidht = jQuery(document).width();
+        // Force fixed header on mobile to avoid "jump" effect
+        if(windowWidht<= 992 && _topBar_H < 1) {
             var _scrollTop 	= $(document).scrollTop();
             var _header_H 	= _header_el.outerHeight() || 0;
             _header_el.addClass('fixed');
             $('body').css({"padding-top":_header_H+"px"});
         }
+        if(windowWidht <= 786){
+            window.scroll(0, _topBar_H);
+            _mobile_info_effect = true;
+        }
+        $('.btn-mobile-info').on('click', function(){
+            jQuery('html,body').animate({scrollTop: 0}, 300, 'easeInOutExpo');
+
+        });
 
         $(window).scroll(function() {
             _topBar_H = $("#topBar").outerHeight() || 0;
-            // console.log(_topBar_H);
-            if((window.width > 992 && _topBar_H < 1) || _topBar_H > 0) { // 992 to disable on mobile
-
+            if((windowWidht > 992 && _topBar_H < 1) || _topBar_H > 0) { // 992 to disable on mobile
                 var _scrollTop 	= $(document).scrollTop();
                 if(_scrollTop > _topBar_H) {
                     _header_el.addClass('fixed');
@@ -781,6 +789,19 @@ $(document).ready(function() {
                     $('body').css({"padding-top":"0px"});
                     _header_el.removeClass('fixed');
                 }
+
+                if(_mobile_info_effect){
+                    if(_scrollTop <= 0){
+                        setTimeout(function () {
+                            $('.btn-mobile-info').removeClass('my_fadein').addClass('my_fadeout');
+                        }, 100);
+                     }else{
+                        setTimeout(function () {
+                            $('.btn-mobile-info').removeClass('my_fadeout').addClass('my_fadein');
+                        }, 100);
+
+                    }
+                }
             }
         });
     }