fix: styling for small screens

src/components/docker-registry-ui.riot

@@ -214,6 +214,10 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
       display: flex;
     }
 
+    material-navbar .nav-wrapper .menu {
+      flex-shrink: 1;
+    }
+
     material-footer {
       color: var(--footer-neutral-text);
       background-color: var(--footer-background);

src/components/search-bar.riot

@@ -45,8 +45,7 @@
   <style>
     :host material-input {
       line-height: initial;
-      max-width: 20%;
-      min-width: 13em;
+      min-width: 5em;
     }
 
     @media screen and (max-width: 400px) {
@@ -54,9 +53,5 @@
         display: none;
       }
     }
-
-    :host material-input input {
-      color: #fff;
-    }
   </style>
 </search-bar>

src/style.scss

@@ -116,6 +116,12 @@ material-spinner {
   font-weight: 400;
 }
 
+@media screen and (max-width: 600px) {
+  .logo {
+    padding-left: 0;
+  }
+}
+
 h2 {
   padding: 16px;
   margin: auto;