Adjust menu bar spacing responsive.

Makes it possible to read the upper buttons on mobile devices.
AtChina · Sep 26, 2015 · f51adca · f51adca
1 parent d0d6b21
commit f51adca
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 3 deletions.
diff --git a/controller/static/app/layout/dashboard.html b/controller/static/app/layout/dashboard.html
@@ -43,7 +43,6 @@
  <div class="ui active inverted dimmer" ng-show="isLoadingView">
  <div class="ui loader"></div>
  </div>
- <div id="menu-bar-spacer"></div>
  <div id="content" ui-view>
  </div>
 </div>

diff --git a/controller/static/main.css b/controller/static/main.css
@@ -10,8 +10,28 @@
  text-transform: none;
 }
 
-#menu-bar-spacer {
- padding: 20px;
+@media (min-width: 931px) {
+ #content {
+ margin-top: 3rem;
+ }
+}
+
+@media (max-width: 930px) {
+ #content {
+ margin-top: 5.5rem;
+ }
+}
+
+@media (max-width: 480px) {
+ #content {
+ margin-top: 8rem;
+ }
+}
+
+@media (max-width: 350px) {
+ #content {
+ margin-top: 10.5rem;
+ }
 }
 
 .ui.small.model.transition {