Home page: Add placeholder for "Upcoming Events"

Not wired up to anything yet.
HHS · May 23, 2022 · 8bad408 · 8bad408
1 parent 85b5f79
commit 8bad408
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 13 deletions.
diff --git a/_blocks/upcoming-events/block.md b/_blocks/upcoming-events/block.md
@@ -3,23 +3,21 @@ name: Upcoming events
 ---
 
 <ul class="usa-collection">
-<li class="usa-collection__item usa-collection__item--no-border">
+<li class="usa-collection__item">
 <div class="usa-collection__calendar-date">
 <time datetime="2020-09-30T12:00:00+01:00">
 <span class="usa-collection__calendar-date-month">SEP</span>
 <span class="usa-collection__calendar-date-day">30</span>
 </time>
 </div>
 <div class="usa-collection__body">
-<span class="usa-tag">Workshop/seminar</span>
-<h3 class="usa-collection__heading">
-Thriving Thursday: Mind your mood
-</h3>
+<span class="usa-tag bg-accent-warm-dark">Workshop/seminar</span>
+<h4 class="usa-collection__heading">
+  <a href="#">Thriving Thursday: Mind your mood</a>
+</h4>
 <p class="usa-collection__description">
-<%= uswds_icon "alarm" %>
-Thu, Apr 28, 2022<br>
-11:00 am – 12:00 pm ET<br>
-Location: Virtual<br>
+  Thu, Apr 28, 2022 | 11:00 am – 12:00 pm ET<br>
+  Location: Virtual<br>
 </p>
 </div>
 </li>

diff --git a/_pages/home/index.md b/_pages/home/index.md
@@ -43,9 +43,7 @@ Clinical fellows and other health professionals affiliated with Duke or the NIH
 
 ### Upcoming events
 
-(This will be a dynamic listing of upcoming events)
-
-
+{::content_block slug="upcoming-events/block" /}
 
 {:/column}
 {:/columns}

diff --git a/app/assets/stylesheets/uswds-settings.scss b/app/assets/stylesheets/uswds-settings.scss
@@ -12,6 +12,7 @@
   $theme-header-max-width: "desktop-lg",
 
   // Colors
+  $theme-color-accent-warm-dark: "gold-50",
   $theme-color-primary: "cyan-50",
   $theme-color-primary-darker: "cyan-70",
   $theme-color-primary-dark: "mint-cool-60",
@@ -43,5 +44,9 @@
     "padding",
     "text-align",
     "text-transform"
-  )
+  ),
+  // Add !important to USWDS utility classes.
+  // This is _not_ recommended if you're doing Atomic CSS-type styling with
+  // utility classes, but that's not what we're doing here.
+  $utilities-use-important: true
 );
diff --git a/app/assets/stylesheets/uswds-tweaks.scss b/app/assets/stylesheets/uswds-tweaks.scss
@@ -1,5 +1,10 @@
 @use "uswds-core" as uswds;
 
+// Don't add top border to collection items
+.usa-collection__item {
+  border-top: none;
+}
+
 // Constrain logo vertically inside navbar
 .usa-navbar .usa-logo img {
   max-height: uswds.units(4);