Improved responsiveness

publiclab · Apr 15, 2022 · e4d8840 · e4d8840
1 parent 70aaff8
commit e4d8840
Showing 1 changed file with 17 additions and 3 deletions.
diff --git a/app/views/layouts/_header.html.erb b/app/views/layouts/_header.html.erb
@@ -79,7 +79,7 @@
           </div>
         </li>
 
-        <li class="nav-item dropdown" style="min-width:80px; margin-left:-25px;">
+        <li class="nav-item dropdown about" style="min-width:80px;">
           <div class="nav-link" data-toggle="dropdown" onclick="location.href='#'">
             <!-- <a > -->
             <%= t('layout._header.about.about_title') %>
@@ -94,10 +94,10 @@
           </div>
         </li>
 
-        <li class="nav-item d-sm-none d-lg-inline" style="padding:0 10px; width:90px;">
+        <li class="nav-item d-sm-none d-lg-inline store" style="padding:0 10px;">
           <a class="nav-link btn btn-outline-secondary" target="_blank" href="//store.publiclab.org"><%= t('layout._header.store') %></a>
         </li>
-        <li class="nav-item d-sm-none d-lg-inline" style="padding:0 10px; width:90px;">
+        <li class="nav-item d-sm-none d-lg-inline donate" style="padding:0 10px;">
           <a class="nav-link btn btn-outline-secondary" href="/donate"><%= t('layout._header.donate') %></a>
         </li>
 
@@ -259,6 +259,20 @@
       overflow-y: auto;
       -webkit-overflow-scrolling:touch;
     }
+    .store{
+      margin-bottom:5px;
+    }
+  }
+  @media (min-width:768px){
+    .about{
+      margin-left:-25px;
+    }
+    .store{
+      width:90px;
+    }
+    .donate{
+      width:90px;
+    }
   }
 </style>