Responsive UI.

2022-06-07 18:16:18 +04:30
parent ebf3f45c11
commit 54454bbb85
5 changed files with 126 additions and 33 deletions
@@ -1,3 +1,16 @@
+@media (min-width: 650px) {
+  .search {
+    width: 35%;
+    min-width: 300px;
+  }
+}
+
+@media (max-width: 650px) {
+  .search {
+    width: 200px;
+  }
+}
+
 .App {
  min-height: 100vh;
  display: flex;
@@ -21,8 +34,6 @@
  font-size: 1.2rem;
  padding-left: 10px;
  border: none;
-  width: 35%;
-  min-width: 300px;
  box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px, rgba(0, 0, 0, 0.3) 0px 7px 13px -3px, rgba(0, 0, 0, 0.2) 0px -3px 0px inset;
 }