actually just using fuckin sass lol

CohenLabPrinceton · Aug 15, 2020 · 145cd61 · 145cd61
1 parent 6c58cce
commit 145cd61
Show file tree

Hide file tree

Showing 4 changed files with 23 additions and 2 deletions.
diff --git a/_docs/_src/sass/_theme_etc_local.sass b/_docs/_src/sass/_theme_etc_local.sass
@@ -0,0 +1,16 @@
+.header-img {
+  display: flex
+  align-items: end
+  margin-bottom: 2rem
+  @media (min-width: $breakpoint-tablet){
+    flex-wrap: wrap
+  }
+
+  & > img {
+    width: 40%
+    //min-width: 400px
+    @media (min-width: $breakpoint-tablet){
+      width: 100%
+    }
+  }
+}
diff --git a/_docs/_src/sass/_theme_variables.sass b/_docs/_src/sass/_theme_variables.sass
@@ -7,6 +7,10 @@ $static-img:                          "../img/"
 
 $accent-color: darken($red, 15%)
 
+$breakpoint-full: 1300px
+$breakpoint-tablet: 1100px
+$breakpoint-half: 840px
+
 $nav-content-width:                   1000px
 $nav-media-query:                     (($nav-desktop-width) + ($nav-content-width))
 

diff --git a/_docs/_src/sass/theme.sass b/_docs/_src/sass/theme.sass
@@ -51,3 +51,4 @@
 @import theme_mathjax
 @import theme_font_awesome_compatibility
 @import theme_font_local
+@import theme_etc_local
diff --git a/_docs/index.rst b/_docs/index.rst
@@ -1,7 +1,7 @@
 .. raw:: html
 
-   <div style="display: flex; align-items:end; margin-bottom: 2rem; flex-wrap: wrap;">
-      <img alt="People's Ventilator Project logo" src="images/pvp_logo_fulltext.png" style="width: 40%; min-width: 400px">
+   <div class="header-img" >
+      <img alt="People's Ventilator Project logo" src="images/pvp_logo_fulltext.png">
       <div style="margin-left: 2em;">
          <h1>A fully-open</h1>
          <h1>Supply-chain resilient</h1>