From 532f417ff41b02a9deadfe2d25168a8325895338 Mon Sep 17 00:00:00 2001
From: Chris Cochrun <chris@cochrun.xyz>
Date: Thu, 22 May 2025 07:07:02 -0500
Subject: [PATCH] fixing icons

---
 .../staff/chris-and-abbie-cochrun/_index.md   |   4 +-
 static/css/main.css                           | 111 ++----------------
 templates/shortcodes/icon.html                |   6 +-
 3 files changed, 18 insertions(+), 103 deletions(-)

diff --git a/content/staff/chris-and-abbie-cochrun/_index.md b/content/staff/chris-and-abbie-cochrun/_index.md
index 6c440e0..64ef38a 100644
--- a/content/staff/chris-and-abbie-cochrun/_index.md
+++ b/content/staff/chris-and-abbie-cochrun/_index.md
@@ -11,8 +11,8 @@ extra:
 Chris and Abbie Cochrun serve together on TFC Staff! Chris grew up in Agra KS as a part of the Eastern Heights TFC group, Abbie grew up as a part of the Northern Valley TFC group and they got to know each other through TFC! Chris handles a lot of IT and video related things for TFC and Abbie is TFC’s graphic designer.
 
 Subscribe to our newsletters!
-- [ {{ icon("email") }} Email](http://eepurl.com/dPuMqz)
-- [ {{ icon("rss") }} RSS](index.xml)
+- [ {{ icon(icon="email") }} Email](http://eepurl.com/dPuMqz)
+- [ {{ icon(icon="rss") }} RSS](index.xml)
 
 <!-- You can check out my own website at [cochrun.xyz](https://cochrun.xyz)! -->
 
diff --git a/static/css/main.css b/static/css/main.css
index f39d390..cdd0771 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -261,9 +261,6 @@
   .bottom-4 {
     bottom: calc(var(--spacing) * 4);
   }
-  .-left-1 {
-    left: calc(var(--spacing) * -1);
-  }
   .-left-1\/2 {
     left: calc(calc(1/2 * 100%) * -1);
   }
@@ -318,9 +315,6 @@
   .mx-auto {
     margin-inline: auto;
   }
-  .my-0 {
-    margin-block: calc(var(--spacing) * 0);
-  }
   .my-2 {
     margin-block: calc(var(--spacing) * 2);
   }
@@ -436,9 +430,6 @@
   .h-0 {
     height: calc(var(--spacing) * 0);
   }
-  .h-2 {
-    height: calc(var(--spacing) * 2);
-  }
   .h-2\/3 {
     height: calc(2/3 * 100%);
   }
@@ -457,9 +448,15 @@
   .h-9 {
     height: calc(var(--spacing) * 9);
   }
+  .h-10 {
+    height: calc(var(--spacing) * 10);
+  }
   .h-12 {
     height: calc(var(--spacing) * 12);
   }
+  .h-15 {
+    height: calc(var(--spacing) * 15);
+  }
   .h-16 {
     height: calc(var(--spacing) * 16);
   }
@@ -478,45 +475,18 @@
   .h-64 {
     height: calc(var(--spacing) * 64);
   }
-  .h-100 {
-    height: calc(var(--spacing) * 100);
-  }
-  .h-150 {
-    height: calc(var(--spacing) * 150);
-  }
-  .h-156 {
-    height: calc(var(--spacing) * 156);
-  }
-  .h-256 {
-    height: calc(var(--spacing) * 256);
-  }
-  .h-450 {
-    height: calc(var(--spacing) * 450);
-  }
   .h-full {
     height: 100%;
   }
   .h-screen {
     height: 100vh;
   }
-  .max-h-12 {
-    max-height: calc(var(--spacing) * 12);
-  }
-  .w-1 {
-    width: calc(var(--spacing) * 1);
-  }
   .w-1\/3 {
     width: calc(1/3 * 100%);
   }
-  .w-2 {
-    width: calc(var(--spacing) * 2);
-  }
   .w-2\/3 {
     width: calc(2/3 * 100%);
   }
-  .w-3 {
-    width: calc(var(--spacing) * 3);
-  }
   .w-3\/4 {
     width: calc(3/4 * 100%);
   }
@@ -532,8 +502,8 @@
   .w-9 {
     width: calc(var(--spacing) * 9);
   }
-  .w-11 {
-    width: calc(var(--spacing) * 11);
+  .w-10 {
+    width: calc(var(--spacing) * 10);
   }
   .w-11\/12 {
     width: calc(11/12 * 100%);
@@ -541,6 +511,9 @@
   .w-12 {
     width: calc(var(--spacing) * 12);
   }
+  .w-15 {
+    width: calc(var(--spacing) * 15);
+  }
   .w-24 {
     width: calc(var(--spacing) * 24);
   }
@@ -556,15 +529,6 @@
   .w-64 {
     width: calc(var(--spacing) * 64);
   }
-  .w-100 {
-    width: calc(var(--spacing) * 100);
-  }
-  .w-150 {
-    width: calc(var(--spacing) * 150);
-  }
-  .w-600 {
-    width: calc(var(--spacing) * 600);
-  }
   .w-auto {
     width: auto;
   }
@@ -589,15 +553,9 @@
   .flex-none {
     flex: none;
   }
-  .flex-shrink {
-    flex-shrink: 1;
-  }
   .flex-shrink-0 {
     flex-shrink: 0;
   }
-  .flex-grow {
-    flex-grow: 1;
-  }
   .grow {
     flex-grow: 1;
   }
@@ -651,24 +609,9 @@
   .place-content-center {
     place-content: center;
   }
-  .place-content-end {
-    place-content: end;
-  }
-  .place-items-center {
-    place-items: center;
-  }
-  .content-center {
-    align-content: center;
-  }
-  .content-end {
-    align-content: flex-end;
-  }
   .items-center {
     align-items: center;
   }
-  .items-end {
-    align-items: flex-end;
-  }
   .justify-between {
     justify-content: space-between;
   }
@@ -754,12 +697,6 @@
   .overscroll-none {
     overscroll-behavior: none;
   }
-  .\!rounded-lg {
-    border-radius: var(--radius-lg) !important;
-  }
-  .\!rounded-md {
-    border-radius: var(--radius-md) !important;
-  }
   .rounded-full {
     border-radius: calc(infinity * 1px);
   }
@@ -830,9 +767,6 @@
   .bg-gray-500 {
     background-color: var(--color-gray-500);
   }
-  .bg-gray-600 {
-    background-color: var(--color-gray-600);
-  }
   .bg-gray-700 {
     background-color: var(--color-gray-700);
   }
@@ -854,14 +788,11 @@
   .fill-current {
     fill: currentcolor;
   }
-  .object-contain {
-    object-fit: contain;
-  }
   .object-cover {
     object-fit: cover;
   }
-  .object-fill {
-    object-fit: fill;
+  .object-scale-down {
+    object-fit: scale-down;
   }
   .p-1 {
     padding: calc(var(--spacing) * 1);
@@ -878,9 +809,6 @@
   .p-5 {
     padding: calc(var(--spacing) * 5);
   }
-  .px-1 {
-    padding-inline: calc(var(--spacing) * 1);
-  }
   .px-1\.5 {
     padding-inline: calc(var(--spacing) * 1.5);
   }
@@ -917,12 +845,6 @@
   .py-6 {
     padding-block: calc(var(--spacing) * 6);
   }
-  .py-8 {
-    padding-block: calc(var(--spacing) * 8);
-  }
-  .py-10 {
-    padding-block: calc(var(--spacing) * 10);
-  }
   .pt-1 {
     padding-top: calc(var(--spacing) * 1);
   }
@@ -1098,10 +1020,6 @@
   .ring-black {
     --tw-ring-color: var(--color-black);
   }
-  .outline {
-    outline-style: var(--tw-outline-style);
-    outline-width: 1px;
-  }
   .outline-2 {
     outline-style: var(--tw-outline-style);
     outline-width: 2px;
@@ -1113,9 +1031,6 @@
     --tw-blur: blur(8px);
     filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
   }
-  .filter {
-    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
-  }
   .transition {
     transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter;
     transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
diff --git a/templates/shortcodes/icon.html b/templates/shortcodes/icon.html
index b0ce077..98c4855 100644
--- a/templates/shortcodes/icon.html
+++ b/templates/shortcodes/icon.html
@@ -1,6 +1,6 @@
-{% set icon = "icons/" ~ icon ~ ".svg" %}
+{% set icon = load_data(path="icons/" ~ icon ~ ".svg") %}
 {% if icon %}
-  <span class="relative inline-block align-text-bottom icon">
-    {{ icon | safe }}
+<span class="w-6 h-6 relative inline-block align-text-bottom icon">
+    {{icon | safe}}
   </span>
 {% endif %}