Placeholder content and CSS style sheets.

3 files changed, 50 insertions, 14 deletions

diff --git a/app/static/styles/home.css b/app/static/styles/home.css
index e2617bd..c875893 100644
--- a/app/static/styles/home.css
+++ b/app/static/styles/home.css
@@ -1,9 +1,20 @@
 .main {
     height: 100%;
     position: absolute;
-    z-index: 1;
+    z-index: 0;
     left: 3%;
     right: 3%;
+    overflow: hidden;
+}
+
+.feed-post {
+    height: 100%;
+    padding: 1px;
+    display: flex;
+    position: relative;
+    flex-wrap: wrap;
+    overflow: auto;
+    justify-content: space-around;
 }
 
 .tab-yes {
@@ -11,7 +22,6 @@
     width: 3%;
     float: left;
     position: fixed;
-    z-index: -1;
     left: 0;
     background: var(--yes);
 }
@@ -20,7 +30,6 @@
     width: 3%;
     float: right;
     position: fixed;
-    z-index: -1;
     right: 0;
     background: var(--no);
 }
@@ -46,11 +55,13 @@
 }
 
 .post {
+    max-height: 20%;
+    max-width: 30%;
     background: white;
     border-radius: 14px;
     padding: 1rem;
     margin: 1rem;
-    width: 20%;
+    overflow: hidden;
 }
 
 .post:hover {
@@ -58,4 +69,5 @@
     cursor: pointer;
     transition: 0.8s;
     color: white;
+    overflow: auto;
 }
diff --git a/app/static/styles/no.css b/app/static/styles/no.css
index 352a635..4673cf3 100644
--- a/app/static/styles/no.css
+++ b/app/static/styles/no.css
@@ -1,8 +1,9 @@
 .main {
     height: 100%;
-    position: absolute;
-    z-index: 1;
+    position: fixed;
+    z-index: 0;
     left: 7%;
+    overflow: auto;
 }
 
 .tab-yes {
@@ -48,10 +49,25 @@
     transition: 0.2s;
 }
 
-.post {
+/* Archive. */
+.feed-archive {
+    width: 100%;
+    display: flex;
+    position: relative;
+    flex-wrap: wrap;
+    justify-content: space-around;
+}
+
+.archive {
     background: white;
+    position: relative;
     border-radius: 14px;
     padding: 1rem;
-    margin: 1rem;
-    width: 20%;
+    margin: 0.5rem;
+}
+.archive:hover {
+    background: linear-gradient(to left, var(--no) 50%, var(--yes) 50%);
+    cursor: pointer;
+    transition: 0.8s;
+    color: white;
 }
diff --git a/app/static/styles/yes.css b/app/static/styles/yes.css
index 3e8e614..fa6b917 100644
--- a/app/static/styles/yes.css
+++ b/app/static/styles/yes.css
@@ -1,4 +1,4 @@
-/* Main page components. */
+/* Main page area. */
 .main {
     height: 100%;
     position: relative;
@@ -9,23 +9,26 @@
 /* Feeds. */
 .feed-message {
     height: 100%;
-    width: 30%;
+    width: 25%;
     position: relative;
     float: left;
     overflow: auto;
 }
-.feed-post {
+.feed-news {
     height: 100%;
-    width: 30%;
+    width: 55%;
+    display: flex;
     position: relative;
     float: left;
+    flex-wrap: wrap;
     overflow: auto;
+    justify-content: space-between;
 }
 .feed-ads {
     height: 100%;
     width: 20%;
     position: relative;
-    float: left;
+    float: right;
     overflow: auto;
 }
 
@@ -73,16 +76,21 @@
 
 /* News. */
 .news {
+    max-height: 10%;
+    max-width: 50%;
     background: white;
+    position: relative;
     border-radius: 14px;
     padding: 1rem;
     margin: 0.5rem;
+    overflow: hidden;
 }
 .news:hover {
     background: linear-gradient(to left, var(--no) 50%, var(--yes) 50%);
     cursor: pointer;
     transition: 0.8s;
     color: white;
+    overflow: auto;
 }
 
 /* Ads. */