Issue button fix (#2006)

* Move @media to top of file together with the rest * Fix cut off dropdown menu on mobile
Ombi-app · Feb 23, 2018 · 1fc36f8 · 1fc36f8
1 parent 6482cfe
commit 1fc36f8
Showing 1 changed file with 44 additions and 43 deletions.
diff --git a/src/Ombi/ClientApp/styles/base.scss b/src/Ombi/ClientApp/styles/base.scss
@@ -22,6 +22,49 @@ $i: !important;
     }
 }
 
+@media only screen and (max-width: 768px) {
+
+    .table-usermanagement {
+        /* Force table to not be like tables anymore */
+        display: block;
+
+        thead, tbody, th, td, tr {
+            display: block;
+        }
+
+        /* Hide table headers (but not display: none;, for accessibility) */
+        thead tr {
+            position: absolute;
+            top: -9999px;
+            left: -9999px;
+        }
+
+        td {
+            /* Behave  like a "row" */
+            border: none;
+            border-bottom: 1px solid #eee;
+            position: relative;
+            padding-left: 50% $i;
+            min-height: 25px;
+        }
+
+        td:before {
+            /* Now like a table header */
+            position: absolute;
+            /* Top/left values mimic padding */
+            top: 6px;
+            left: 6px;
+            width: 45%;
+            padding-right: 10px;
+            white-space: nowrap;
+        }
+        /* Label the data */
+        .td-labelled:before {
+            content: attr(data-label)
+        }
+    }
+}
+
 @media (max-width: 48em) {
     .home {
         padding-top: 1rem;
@@ -843,6 +886,7 @@ textarea {
 
 .ui-treetable tbody td {
     white-space: inherit;
+    overflow: visible;
 }
 
 table a:not(.btn) {
@@ -897,49 +941,6 @@ a > h4:hover {
     padding-top:15px;
 }
 
-@media only screen and (max-width: 768px) {
-
-    .table-usermanagement {
-        /* Force table to not be like tables anymore */
-        display: block;
-
-        thead, tbody, th, td, tr {
-            display: block;
-        }
-
-        /* Hide table headers (but not display: none;, for accessibility) */
-        thead tr {
-            position: absolute;
-            top: -9999px;
-            left: -9999px;
-        }
-
-        td {
-            /* Behave  like a "row" */
-            border: none;
-            border-bottom: 1px solid #eee;
-            position: relative;
-            padding-left: 50% $i;
-            min-height: 25px;
-        }
-
-        td:before {
-            /* Now like a table header */
-            position: absolute;
-            /* Top/left values mimic padding */
-            top: 6px;
-            left: 6px;
-            width: 45%;
-            padding-right: 10px;
-            white-space: nowrap;
-        }
-        /* Label the data */
-        .td-labelled:before {
-            content: attr(data-label)
-        }
-    }
-}
-
 .searchWidth {
     width: 94%;
 }