finish front page

tidymodels · May 24, 2023 · eb01854 · eb01854
1 parent f30048c
commit eb01854
Show file tree

Hide file tree

Showing 6 changed files with 88 additions and 5 deletions.
diff --git a/docs/images/parsnip-flagger.jpg b/docs/images/parsnip-flagger.jpg
diff --git a/docs/index.html b/docs/index.html
@@ -232,10 +232,17 @@
 </div>
 </div>
 </div>
-<section id="stay-up-to-date" class="level1 band third">
-<h1>STAY UP TO DATE</h1>
+<div class="band third">
+<div class="bandContent">
+<div class="hideOnMobile">
+<img class="bee1" src="images/parsnip-flagger.jpg" alt="">
+</div>
+<div class="blurb">
+<p><span class="tagline">STAY UP TO DATE</span></p>
 <p>Hear about the latest tidymodels news at the <a href="https://www.tidyverse.org/tags/tidymodels/">tidyverse blog</a>.</p>
-</section>
+</div>
+</div>
+</div>
 </div>
 
 

diff --git a/docs/site_libs/bootstrap/bootstrap.min.css b/docs/site_libs/bootstrap/bootstrap.min.css
diff --git a/docs/site_libs/bootstrap/images/tidy-back-03.svg b/docs/site_libs/bootstrap/images/tidy-back-03.svg
diff --git a/index.qmd b/index.qmd
@@ -81,9 +81,16 @@ Whether you are just starting out today or have years of experience with modelin
 ::::
 
 :::: {.band .third}
-# STAY UP TO DATE
+:::: {.bandContent}
+
+<div class="hideOnMobile"><img class="bee1" src="images/parsnip-flagger.jpg" alt=""></div>
+
+::: {.blurb}
+[STAY UP TO DATE]{.tagline}
 
 Hear about the latest tidymodels news at the [tidyverse blog](https://www.tidyverse.org/tags/tidymodels/).
+:::
+::::
 ::::
 
 :::::
diff --git a/styles-frontpage.scss b/styles-frontpage.scss
@@ -97,6 +97,16 @@
     }
   }
 
+  .bee1 {
+    display: block;
+    position: absolute;
+    bottom: 10px;
+    left: 10px;
+    width: 100px;
+    height: auto;
+
+  }
+
   .band.first {
     height: 690px;
 
@@ -126,6 +136,8 @@
   }
 
   .band.second {
+    height: 952px;
+
     background-color: #fcfcfc;
     border-bottom: solid 1pt #d9d9d9;
     border-top: solid 1pt #d9d9d9;
@@ -159,6 +171,29 @@
 
   .band.third {
     background-color: #ffffff;
+    height: 450px;
+
+    .bandContent {
+      max-width: 1100px;
+      margin: 0 auto;
+      height: 450px;
+      padding-top: 100px;
+      padding-bottom: 100px;
+      background-image: url(images/tidy-back-03.svg);
+      background-repeat: no-repeat;
+      background-size: 650px 450px;
+
+      display: -webkit-flex;
+      -webkit-justify-content: space-between;
+    }
+
+    span.tagline {
+      text-transform: uppercase;
+      font-size: 1.2rem !important;
+      font-weight: bold;
+      letter-spacing: 2px;
+    }
+
   }
 
   /* size & position adjustments */