1 files changed, 71 insertions, 25 deletions

diff --git a/app/static/styles/yes.css b/app/static/styles/yes.css
index 96443e1..3e8e614 100644
--- a/app/static/styles/yes.css
+++ b/app/static/styles/yes.css
@@ -1,54 +1,100 @@
+/* Main page components. */
 .main {
     height: 100%;
-    right: 6%;
-    left: 0;
-    position: absolute;
-    z-index: 1;
-    background: linear-gradient(to top, var(--secondary-color), var(--primary-color)) fixed;
+    position: relative;
+    z-index: 0;
+    overflow: hidden;
 }
 
-.tab-home {
+/* Feeds. */
+.feed-message {
     height: 100%;
-    width: 3%;
-    float: right;
+    width: 30%;
     position: relative;
-    z-index: 0;
-    background: var(--home);
+    float: left;
+    overflow: auto;
+}
+.feed-post {
+    height: 100%;
+    width: 30%;
+    position: relative;
+    float: left;
+    overflow: auto;
+}
+.feed-ads {
+    height: 100%;
+    width: 20%;
+    position: relative;
+    float: left;
+    overflow: auto;
 }
 
+/* Tabs. */
 .tab-no {
     height: 100%;
     width: 3%;
     float: right;
     position: relative;
-    z-index: -1;
     background: var(--no);
 }
-
-.tab-home:hover ~ .main {
-    right: 9%;
-    transition: 0.2s;
+.tab-home {
+    height: 100%;
+    width: 3%;
+    float: right;
+    position: relative;
+    background: var(--home);
 }
-
 .tab-home:hover {
-    width: 6%;
+    width: 4%;
     transition: 0.2s;
 }
-
-.tab-no:hover ~ .main {
-    right: 9%;
+.tab-no:hover ~ .tab-home {
+    width: 5%;
     transition: 0.2s;
 }
-
 .tab-no:hover {
-    width: 6%;
+    width: 4%;
     transition: 0.2s;
 }
 
-.post {
+/* Messages. */
+.message {
     background: white;
     border-radius: 14px;
     padding: 1rem;
-    margin: 1rem;
-    width: 20%;
+    margin: 0.5rem;
+}
+.message:hover {
+    background: linear-gradient(to left, var(--no) 50%, var(--yes) 50%);
+    cursor: pointer;
+    transition: 0.8s;
+    color: white;
+}
+
+/* News. */
+.news {
+    background: white;
+    border-radius: 14px;
+    padding: 1rem;
+    margin: 0.5rem;
+}
+.news:hover {
+    background: linear-gradient(to left, var(--no) 50%, var(--yes) 50%);
+    cursor: pointer;
+    transition: 0.8s;
+    color: white;
+}
+
+/* Ads. */
+.ad {
+    background: white;
+    border-radius: 14px;
+    padding: 1rem;
+    margin: 0.5rem;
+}
+.ad:hover {
+    background: linear-gradient(to left, var(--no) 50%, var(--yes) 50%);
+    cursor: pointer;
+    transition: 0.8s;
+    color: white;
 }