From 2969163164759b2558e50e53f459fc2fee09d607 Mon Sep 17 00:00:00 2001
From: Cory Dransfeldt <hi@coryd.dev>
Date: Fri, 5 Jan 2024 10:13:25 -0800
Subject: [PATCH] fix: duplicate css + cleanup

---
 src/_includes/now.liquid                       | 2 ++
 src/_includes/partials/now/media-grid.liquid   | 3 +++
 src/_includes/partials/now/progress-bar.liquid | 6 ------
 src/assets/styles/widgets/forms.css            | 7 +------
 src/assets/styles/widgets/media-grid.css       | 4 ----
 src/assets/styles/widgets/post-graph.css       | 1 -
 src/assets/styles/widgets/progress-bar.css     | 5 -----
 src/posts/2023/2023-in-review.html             | 2 +-
 8 files changed, 7 insertions(+), 23 deletions(-)

diff --git a/src/_includes/now.liquid b/src/_includes/now.liquid
index e03a8b18..6677cd9d 100644
--- a/src/_includes/now.liquid
+++ b/src/_includes/now.liquid
@@ -3,6 +3,8 @@ layout: default
 ---
 {% capture css %}
   {% render "../assets/styles/pages/now.css" %}
+  {% render "../assets/styles/widgets/media-grid.css" %}
+  {% render "../assets/styles/widgets/progress-bar.css" %}
 {% endcapture %}
 <style>
   {{ css | cssmin }}
diff --git a/src/_includes/partials/now/media-grid.liquid b/src/_includes/partials/now/media-grid.liquid
index 08240b72..4f7dbe33 100644
--- a/src/_includes/partials/now/media-grid.liquid
+++ b/src/_includes/partials/now/media-grid.liquid
@@ -1,10 +1,13 @@
 {% if data.size > 0 %}
+  {% if embeddedStyles == true %}
   {% capture css %}
     {% render "../../../assets/styles/widgets/media-grid.css" %}
+    {% render "../../../assets/styles/widgets/progress-bar.css" %}
   {% endcapture %}
   <style>
     {{ css | cssmin }}
   </style>
+  {% endif %}
   {% assign media = data | normalizeMedia %}
   <h2 class="now__section--header flex--centered">
     {% tablericon icon title %}
diff --git a/src/_includes/partials/now/progress-bar.liquid b/src/_includes/partials/now/progress-bar.liquid
index 70111c27..d5576a92 100644
--- a/src/_includes/partials/now/progress-bar.liquid
+++ b/src/_includes/partials/now/progress-bar.liquid
@@ -1,10 +1,4 @@
 {% if percentage %}
-{% capture css %}
-  {% render "../../../assets/styles/widgets/progress-bar.css" %}
-{% endcapture %}
-<style>
-  {{ css | cssmin }}
-</style>
 <div class="progress-bar__wrapper">
   <div style="width:{{ percentage }}" class="progress-bar"></div>
 </div>
diff --git a/src/assets/styles/widgets/forms.css b/src/assets/styles/widgets/forms.css
index 18532c1d..7b075547 100644
--- a/src/assets/styles/widgets/forms.css
+++ b/src/assets/styles/widgets/forms.css
@@ -5,6 +5,7 @@ textarea {
   background-color: var(--white);
   width: 100%;
   border: 1px solid var(--blue-600);
+  outline: none;
   padding: .5rem;
   margin-bottom: 1.5rem;
   font-weight: 400 !important;
@@ -15,12 +16,6 @@ textarea {
   transition-duration: 300ms;
 }
 
-input[type="text"],
-input[type="email"],
-textarea {
-  outline: none;
-}
-
 input[type="text"]:focus,
 input[type="email"]:focus,
 textarea:focus {
diff --git a/src/assets/styles/widgets/media-grid.css b/src/assets/styles/widgets/media-grid.css
index 11bb2e93..39706fd4 100644
--- a/src/assets/styles/widgets/media-grid.css
+++ b/src/assets/styles/widgets/media-grid.css
@@ -61,11 +61,7 @@
   color: var(--white);
   font-size: var(--font-size-xs);
   line-height: var(--line-height-xs);
-  overflow: visible;
-  display: -webkit-box;
   text-shadow: rgba(0, 0, 0, 0.7) 0px 0px 10px;
-  -webkit-box-orient: vertical;
-  -webkit-line-clamp: 3;
 }
 
 .media__grid .item__image,
diff --git a/src/assets/styles/widgets/post-graph.css b/src/assets/styles/widgets/post-graph.css
index 5205b16d..367897e0 100644
--- a/src/assets/styles/widgets/post-graph.css
+++ b/src/assets/styles/widgets/post-graph.css
@@ -4,7 +4,6 @@
 }
 
 .post-graph__wrapper {
-  position: relative;
   display: flex;
   align-items: center;
   height: 2rem;
diff --git a/src/assets/styles/widgets/progress-bar.css b/src/assets/styles/widgets/progress-bar.css
index 6c9a38e6..7cd9d449 100644
--- a/src/assets/styles/widgets/progress-bar.css
+++ b/src/assets/styles/widgets/progress-bar.css
@@ -5,15 +5,10 @@
   overflow: hidden;
   height: 1rem;
   width: 100%;
-  margin-top: .25rem;
   margin-bottom: .25rem;
 }
 
 .progress-bar {
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  white-space: nowrap;
   background-color: var(--blue-600);
 }
 
diff --git a/src/posts/2023/2023-in-review.html b/src/posts/2023/2023-in-review.html
index ec7828b7..4d74e90b 100644
--- a/src/posts/2023/2023-in-review.html
+++ b/src/posts/2023/2023-in-review.html
@@ -16,7 +16,7 @@ tags: ['books', 'music', 'development', 'Eleventy']
   <li><a href="https://trakt.tv/users/cdransf">I watched a bunch of movies and TV</a>, but picking favorites feels weird when so much of that consisted of catching up on "classics" and things I'd either ignored or never seen.</li>
 </ul>
 
-{% render "partials/now/media-grid.liquid", data:roundups['2023'].books, icon: "books", title: "Favorite books", shape: "vertical", count: 6 %}
+{% render "partials/now/media-grid.liquid", data:roundups['2023'].books, icon: "books", title: "Favorite books", shape: "vertical", count: 6, embeddedStyles: true %}
 {% render "partials/now/media-grid.liquid", data:roundups['2023'].albums, icon: "vinyl", title: "Favorite albums", shape: "square", count: 8 %}
 
 <p><strong><a href="https://coryd.dev">I wrote some things:</a></strong></p>