From db8b64d063b9f2ea9f2caf18c030c5170bcc4748 Mon Sep 17 00:00:00 2001
From: Akshay <nerdypepper@tuta.io>
Date: Mon, 27 Jan 2020 18:01:44 +0530
Subject: responsive styles

---
 docs/style.css | 38 ++++++++++++++++++++++++++++++++------
 1 file changed, 32 insertions(+), 6 deletions(-)

(limited to 'docs/style.css')

diff --git a/docs/style.css b/docs/style.css
index fd7e37f..bdda208 100644
--- a/docs/style.css
+++ b/docs/style.css
@@ -30,10 +30,6 @@ html {
   font-size: 20px;
 }
 
-.posts {
-  width: 40%;
-}
-
 table {
   width: 100%;
   border-collapse: collapse;
@@ -52,8 +48,11 @@ td {
   padding: 0.5rem 0;
 }
 
-/* mobile devices */
-@media only screen and (max-width: 70em) {
+.posts {
+  width: 100%;
+}
+
+@media only screen and (min-width: 600px) {
   .posts {
     width: 100%;
   }
@@ -62,6 +61,33 @@ td {
   }
 }
 
+@media only screen and (min-width: 768px) {
+  .posts {
+    width: 80%;
+  }
+  html {
+    font-size: 18px;
+  }
+}
+
+@media only screen and (min-width: 992px) {
+  .posts {
+    width: 70%;
+  }
+  html {
+    font-size: 20px;
+  }
+}
+
+@media only screen and (min-width: 1200px) {
+  .posts {
+    width: 50%;
+  }
+  html {
+    font-size: 20px;
+  }
+}
+
 .posts {
   text-align: left;
   display: inline-block;
-- 
cgit v1.2.3