feat: move global toc to top of page on small screens

IATI · Jun 6, 2024 · fe6516d · fe6516d
1 parent a1dac16
commit fe6516d
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 5 deletions.
diff --git a/styles/_globaltoc.scss b/styles/_globaltoc.scss
@@ -3,12 +3,10 @@
 .globaltoc {
   @extend .iati-card;
   margin: $padding-block;
-  flex: 0 0 250px;
-  align-self: flex-start;
 
-  display: none;
-  @media (min-width: 1000px) {
-    display: block;
+  @media (min-width: $screen-lg) {
+    flex: 0 0 250px;
+    align-self: flex-start;
   }
 
   & .caption {

diff --git a/styles/_layout.scss b/styles/_layout.scss
@@ -3,6 +3,11 @@
 .iati-main {
   display: flex;
   padding: 0;
+  flex-direction: column;
+
+  @media (min-width: $screen-lg) {
+    flex-direction: row;
+  }
 }
 
 .document {