Просмотр исходного кода

added responsive behavior

Former-commit-id: dacbdd29b62551f2c5f5e3af6baa079df8400e71
Gildas 6 лет назад
Родитель
Сommit
4028685cc4
1 измененных файлов с 21 добавлено и 3 удалено
  1. 21 3
      extension/ui/pages/pendings.css

+ 21 - 3
extension/ui/pages/pendings.css

@@ -110,7 +110,9 @@ header button {
     color: #888;
 }
 
-html.side-panel, .side-panel .result-head , .side-panel main {
+html.side-panel,
+.side-panel .result-head,
+.side-panel main {
     background-color: #fbfbfb;
 }
 
@@ -130,10 +132,26 @@ html.side-panel, .side-panel .result-head , .side-panel main {
     display: none;
 }
 
-.side-panel .result-row>span, .side-panel .result-row>span>span {
+.side-panel .result-row>span,
+.side-panel .result-row>span>span {
     padding: 0px;
 }
 
+@media (max-width:400px) {
+
+    main,
+    header,
+    header>button {
+        font-size: 11px;
+    }
+
+    .result-row {
+        padding-top: 3px;
+        padding-bottom: 3px;
+        min-height: 30px;
+    }
+}
+
 @media (prefers-color-scheme: dark) {
     html {
         background-color: #373737;
@@ -187,6 +205,6 @@ html.side-panel, .side-panel .result-head , .side-panel main {
     }
 
     .side-panel .result-cancel button {
-        color: #fdfdfd;        
+        color: #fdfdfd;
     }
 }