Merge pull request #6 from openclassify/mostafa

topbar was fixed in mobile responsive

Author: Muammer Top

resources/css/theme.css

@@ -418,8 +418,8 @@ body.expand #topbar .topbar-left .logo span {
     }
 }
 #search {
-    border-bottom: 1px solid {{ setting_value('visiosoft.theme.defaultadmin::background_color') }};
-padding-top: 8px;
+    border-bottom: 1px solid #ddd;
+    padding-top: 8px;
 }
 .btn-search {
     display: inline-block;
@@ -428,7 +428,7 @@ padding-top: 8px;
     padding: 0 !important;
     margin-top: 5px;
     background-color: inherit;
-color: {{ setting_value('visiosoft.theme.defaultadmin::background_color') }};
+color: #ddd;
 }
 .dropdown-menu {
     z-index: 9999;
@@ -658,7 +658,7 @@ select + .select2 {
         margin-right: 0 !important;
     }
     .topbar-breadcrumb {
-        padding: 10px 0 !important;
+        padding: 0px 0 !important;
     }
 }
 @media (max-width: 767px) {
@@ -3023,9 +3023,6 @@ margin-right: 1rem  !important;
 .user-action-dropdown {
     background: #fff !important;
 }
-#search .search-bar::placeholder {
-color: {{ setting_value('visiosoft.theme.defaultadmin::text_color')}};
-}
 #topbar .button-menu .button-menu-mobile {
 color: {{ setting_value('visiosoft.theme.defaultadmin::links_color')}};
 }
@@ -3335,7 +3332,7 @@ background-color: inherit !important;
     opacity: 0.5;
 }
 #search .search-bar::placeholder {
-color: {{ setting_value('visiosoft.theme.defaultadmin::background_color') }} !important;
+color: #aaa !important;
 }
 
 .login-form-block {
@@ -3405,3 +3402,50 @@ color: #4764a4 !important;
     opacity: 0.3;
     font-size: 0.7rem;
 }
+
+
+
+@media (max-width: 991px) {
+    .top-bar {
+    background: {{ setting_value('visiosoft.theme.defaultadmin::secondary_color')}};
+    width: calc(100% - 60px);
+    }
+
+    .top-bar .user-action-dropdown {
+    background: {{ setting_value('visiosoft.theme.defaultadmin::secondary_color')}} !important;
+    color: {{ setting_value('visiosoft.theme.defaultadmin::background_color')}} !important;
+    }
+
+    .help-icon svg #Path_20512, #Path_20511 {
+    fill: {{ setting_value('visiosoft.theme.defaultadmin::background_color') }};
+    }
+
+    .help-icon svg {
+        width: 20px;
+        height: 20px;
+    }
+
+    .top-bar {
+        height: 53px;
+    }
+    .top-bar #search {
+        padding-top: 0;
+    }
+    .top-bar #search .search-bar {
+        display: block;
+        position: relative;
+    }
+    .top-bar #search .btn-search {
+        display: none;
+    }
+    .topbar-breadcrumb {
+        padding-top: 0;
+    }
+    #main {
+        padding-top: 45px !important;
+    }
+    .menu-action {
+        text-align: left;
+        padding-left: 14px;
+    }
+}

resources/views/partials/topbar.twig

@@ -16,7 +16,7 @@
                             </li>
                         {% endfor %}
                         {{ addBlock('admin/topbar')|raw }}
-                        <li class="nav-item dropdown floatright">
+                        <li class="nav-item dropdown floatright user-info">
                             <a href="javascript:void(0);" data-toggle="dropdown">
                                 <button class="btn user-action-dropdown dropdown-toggle none-border">
                                     {{ name|raw }}