Update style.css

ozgursozluk/static/style.css

@@ -43,22 +43,13 @@ header a {
     padding: 0.5rem 0.2rem;
 }
 
-main {
-    width: 80%;
-    margin: 0 auto;
-}
-
 nav {
-    width: 35%;
+    width: 100%;
     margin: 0 auto;
+    max-width: 450px;
     text-align: center;
 }
 
-nav a {
-    padding: 0.5rem;
-    display: inline-block;
-}
-
 form {
     padding-top: 0.5rem;
 }
@@ -87,6 +78,18 @@ form input, form select, form button {
     background-color: var(--button-bg);
 }
 
+.searchbox > form {
+    display: flex;
+}
+
+.searchbox > form input {
+    width: 100%;
+}
+
+.searchbox > form button {
+    margin-left: 0.5rem;
+}
+
 .title {
     text-align: center;
     font-weight: normal;
@@ -106,7 +109,8 @@ form input, form select, form button {
 }
 
 .topic {
-    width: 70%;
+    width: 100%;
+    max-width: 900px;
     margin: 0 auto;
 }
 
@@ -145,9 +149,10 @@ form input, form select, form button {
 }
 
 .author {
-    width: 50%;
+    width: 100%;
+    max-width: 600px;
     text-align: center;
-    margin: 3rem auto 1rem auto;
+    margin: 2rem auto 1rem auto;
     background-color: var(--entry-bg);
 }
 
@@ -162,13 +167,18 @@ form input, form select, form button {
 }
 
 .settings {
-    width: 50%;
+    width: 100%;
     margin: 0 auto;
-    padding-top: 3rem;
+    max-width: 600px;
+    padding-top: 1rem;
 }
 
 @media screen and (max-width: 992px) {
-    main, nav, .topic, .author, .settings {
+    nav {
+        max-width: none;
+    }
+
+    main, nav {
         width: 100%;
     }