Change flex direction of top stories in tablet mode, change homepage …

…resizing to be based on tablet size
ubyssey · Nov 19, 2024 · 811eca5 · 811eca5
1 parent b3c8983
commit 811eca5
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 2 deletions.
diff --git a/ubyssey/static_src/src/styles/components/_infinitefeed.scss b/ubyssey/static_src/src/styles/components/_infinitefeed.scss
@@ -51,7 +51,7 @@
         padding: 0;
     }
 
-    @media ($bp-smaller-than-phablet) {
+    @media ($bp-smaller-than-tablet) {
         display:none;
     }
 }

diff --git a/ubyssey/static_src/src/styles/modules/_homepage.scss b/ubyssey/static_src/src/styles/modules/_homepage.scss
@@ -215,7 +215,7 @@ html.hairlines {
   width: 100%;
   padding-bottom: 3em;
 
-  @media ($bp-larger-than-phablet) {
+  @media ($bp-larger-than-tablet) {
       margin-right: 20px;
       width: 50%;
       padding-right: 20px;

diff --git a/ubyssey/static_src/src/styles/objects/_article_top.scss b/ubyssey/static_src/src/styles/objects/_article_top.scss
@@ -139,6 +139,16 @@
     }
 }
 
+@media ($bp-smaller-than-tablet) {
+    .o-article--top_article {
+        flex-direction: row-reverse;
+        justify-content: left;
+        .o-article__right {
+            margin-left: 0;
+            margin-right: 1em;
+        }
+    }
+}
 
 [color-css-theme="light"] {
     .o-article--top_article {