adding img shortcode and using it in groups

content/groups/_index.md

@@ -2,7 +2,6 @@
 title = "Groups"
 description = ""
 template = "section.html"
-
 +++
 
 Many of the TFC Staff pour their hearts and hours into these groups. We work within the community and kids to share Jesus's love.

content/groups/atwood/index.md

@@ -2,22 +2,22 @@
 title: "Atwood"
 date: 2022-10-28T10:20:04-05:00
 tags: ["Jenny Popp"]
-featured_image: ""
-description: ""
-summary: "- Start Time: 6:30 for HS and 6:00 for JH (Supper for both)\n- End Time: 8:30 for HS and 8:00 for JH\n- Location: 5ten Youth Center, 510 Main, Atwood KS\n- 1st and 3rd Wed. is HS\n- 2nd and 4th Wed is JH"
+description: "- Start Time: 6:30 for HS and 6:00 for JH (Supper for both)\n- End Time: 8:30 for HS and 8:00 for JH\n- Location: 5ten Youth Center, 510 Main, Atwood KS\n- 1st and 3rd Wed. is HS\n- 2nd and 4th Wed is JH"
+template: "simple_page.html"
 weight: 80
+extra:
+    image: "featured.jpg"
 ---
-![Atwood](featured.jpg "The Atwood Group")
+{{ img(path="featured.jpg" width=600 height=500) }}
 
-# High School
+## High School
 - Start Time: 1st & 3rd Wednesday of month, 6:30 PM (Supper provided)
 - End Time: 8:30
 - Location: 5ten Youth Center, 510 Main, Atwood KS
 - Ages: 9-12th Grade
 
-{{< spacing >}}
 
-# Junior High
+## Junior High
 - Start Time: 2nd & 4th Wednesday of month, 6:00 PM (Supper provided)
 - End Time: 8:00
 - Location: 5ten Youth Center, 510 Main, Atwood KS

content/groups/codell/index.md

@@ -2,12 +2,13 @@
 title: "Codell"
 date: 2022-10-28T10:20:20-05:00
 tags: ['Associate Group']
-featured_image: ""
-description: ""
-summary: "- Wednesdays 6:45-8:15pm (Supper Provided)\n- Ages: 6th-12th Grade\n- Location: Codell Community Church, 409 Codell Rd. Codell, KS 67663"
+description: "- Wednesdays 6:45-8:15pm (Supper Provided)\n- Ages: 6th-12th Grade\n- Location: Codell Community Church, 409 Codell Rd. Codell, KS 67663"
+template: "simple_page.html"
 weight: 90
+extra:
+    image: "featured.jpg"
 ---
-![Codell](featured.jpg "The Codell Group")
+{{ img(path="featured.jpg" width=1000 height=500) }}
 
 - Wednesdays 6:45-8:15pm (Supper Provided)
 - Ages: 6th-12th Grade

content/groups/colby/index.md

@@ -2,11 +2,13 @@
 title: "Colby"
 date: 2022-10-28T10:20:25-05:00
 tags: ['Associate Group']
-featured_image: ""
 description: "- Wednesdays 6:30-8:00 pm (meal provided)\n- Colby Wesleyan Church 320 W Pine St. Colby Kansas 67701\n- Ages: 5th - 12th grade"
 weight: 100
+template: "simple_page.html"
+extra:
+    image: "featured.jpg"
 ---
-![Colby](featured.jpg "The Colby Group")
+{{ img(path="featured.jpg" width=800 height=500) }}
 
 - Wednesdays 6:30-8:00 pm (meal provided)
 - Colby Wesleyan Church 320 W Pine St. Colby Kansas 67701

content/groups/logan/index.md

@@ -2,12 +2,13 @@
 title: "Logan"
 date: 2022-10-28T10:19:27-05:00
 tags: ["April Teves"]
-featured_image: ""
-description: ""
-summary: "- Start Time: Monday, 6:30 PM (Supper provided)\n- End Time: 8:30\n- Location: First Christian Church 204 N. Douglas, Logan, KS 67646\n- Ages: 6-12th Grade"
+description: "- Start Time: Monday, 6:30 PM (Supper provided)\n- End Time: 8:30\n- Location: First Christian Church 204 N. Douglas, Logan, KS 67646\n- Ages: 6-12th Grade"
+template: "simple_page.html"
 weight: 50
+extra:
+    image: "featured.jpg"
 ---
-![Logan](featured.jpg "The Logan Group")
+{{ img(path="featured.jpg" width=800 height=500) }}
 
 - Start Time: Monday, 6:30 PM (Supper provided)
 - End Time: 8:30

content/groups/northern-valley/index.md

@@ -1,12 +1,14 @@
 ---
 title: "Northern Valley"
 date: 2022-10-28T10:19:57-05:00
-tags: ["Chris Cochrun", "Dani Rouse"]
-featured_image: "featured.jpg"
+tags: ["Chris Cochrun"]
 description: "- Start Time: Wednesday, Junior High 5:00 PM, High School 6:30 PM (supper for both at 6:30)\n- End Time: 8:30\n- Location: Almena Community Building\n- Ages: 6-8th Grade"
 weight: 30
+template: "simple_page.html"
+extra:
+    image: "featured.jpg"
 ---
-![Northern Valley](featured.jpg "The Nothern Valley Group")
+{{ img(path="featured.jpg" width=800 height=400) }}
 
 - Start Time: Wednesday, Junior High 5:00 PM, High School 6:30 PM (supper for both at 6:30)
 - End Time: 8:30

content/groups/phillipsburg/index.md

@@ -3,11 +3,13 @@ title: "Phillipsburg"
 date: 2022-10-28T10:19:41-05:00
 tags: ["Brian Fischer", "Billy Cayou"]
 featured_image: ""
-description: ""
-summary: "- Start Time: Wednesday, 6:30 PM (Supper provided)\n- End Time: 8:30\n- Location: Community Church of God, 135 10th Street, Phillipsburg, KS 67661\n- Ages: 6-12th Grade"
+description: "- Start Time: Wednesday, 6:30 PM (Supper provided)\n- End Time: 8:30\n- Location: Community Church of God, 135 10th Street, Phillipsburg, KS 67661\n- Ages: 6-12th Grade"
+template: "simple_page.html"
 weight: 10
+extra:
+    image: "featured.jpg"
 ---
-![Phillipsburg](featured.jpg "The Phillipsburg Group")
+{{ img(path="featured.jpg" width=600 height=300) }}
 
 - Start Time: Wednesday, 6:30 PM (Supper provided)
 - End Time: 8:30

content/groups/smith-center/index.md

@@ -2,12 +2,13 @@
 title: "Smith Center"
 date: 2022-10-28T10:20:16-05:00
 tags: ["Tom and Brenda Colorassi"]
-featured_image: ""
-description: ""
-summary: "- Start Time: Wednesday, 6:30 PM\n- End Time: 8:00\n- Location: New Covenant Church in Smith Center\n- Ages: 6-12th Grade"
+description: "- Start Time: Wednesday, 6:30 PM\n- End Time: 8:00\n- Location: New Covenant Church in Smith Center\n- Ages: 6-12th Grade"
+template: "simple_page.html"
 weight: 70
+extra:
+    image: "featured.jpg"
 ---
-![Smith Center](featured.jpg "The Colorassi Family")
+{{ img(path="featured.jpg" width=600 height=500) }}
 
 # Details
 - Start Time: Wednesday, 6:30 PM

content/groups/southern-valley/index.md

@@ -2,12 +2,13 @@
 title: "Southern Valley"
 date: 2022-10-28T10:19:49-05:00
 tags: ["Rob Lewis"]
-featured_image: ""
-description: ""
-summary: "- Start Time: Wednesday, 6:30 PM (Supper provided)\n- End Time: 9:00\n- Location: Rob’s House  904 Howard St Oxford NE 68967\n- Ages: 6-12th Grade"
+description: "- Start Time: Wednesday, 6:30 PM (Supper provided)\n- End Time: 9:00\n- Location: Rob’s House  904 Howard St Oxford NE 68967\n- Ages: 6-12th Grade"
 weight: 40
+template: "simple_page.html"
+extra:
+    image: "featured.jpg"
 ---
-![Southern Valley](featured.jpg "The Southern Valley Group")
+{{ img(path="featured.jpg" width=600 height=450) }}
 
 - Start Time: Wednesday, 6:30 PM (Supper provided)
 - End Time: 9:00

content/groups/thunder-ridge/index.md

@@ -2,12 +2,13 @@
 title: "Thunder Ridge"
 date: 2022-10-28T10:19:34-05:00
 tags: ["Ethan Rose", "Janice Lundquist"]
-featured_image: ""
-description: ""
-summary: "- Start Time: Wednesday, 6:30 PM (Supper provided)\n- End Time: 8:30\n- Location: United Methodist Church 667 Southern Ave, Agra, KS 67621\n- Ages: 6-12th Grade"
+description: "- Start Time: Wednesday, 6:30 PM (Supper provided) \n - End Time: 8:30\n- Location: United Methodist Church 667 Southern Ave, Agra, KS 67621\n- Ages: 6-12th Grade"
 weight: 20
+template: "simple_page.html"
+extra:
+    image: "featured.jpg"
 ---
-![Thunder Ridge](featured.jpg "The Thunder Ridge Group")
+{{ img(path="featured.jpg" width=600 height=300) }}
 
 - Start Time: Wednesday, 6:30 PM (Supper provided)
 - End Time: 8:30

content/groups/wakeeney/index.md

@@ -2,12 +2,13 @@
 title: "Wakeeney"
 date: 2022-10-28T10:20:11-05:00
 tags: ["April Teves"]
-featured_image: ""
-description: ""
-summary: "- Start Time: Wednesday, 6:00 PM (Supper provided)\n- End Time: 7:30\n- Location: Church of God, Wakeeney KS\n- Ages: 6-12th Grade"
+description: "- Start Time: Wednesday, 6:00 PM (Supper provided)\n- End Time: 7:30\n- Location: Church of God, Wakeeney KS\n- Ages: 6-12th Grade"
+template: "simple_page.html"
 weight: 60
+extra:
+    image: "featured.jpg"
 ---
-![Wakeeney](featured.jpg "The Wakeeney Group")
+{{ img(path="featured.jpg" width=600 height=300) }}
 
 - Start Time: Wednesday, 6:00 PM (Supper provided)
 - End Time: 7:30

static/css/main.css

@@ -261,6 +261,9 @@
   .bottom-4 {
     bottom: calc(var(--spacing) * 4);
   }
+  .-left-1 {
+    left: calc(var(--spacing) * -1);
+  }
   .-left-1\/2 {
     left: calc(calc(1/2 * 100%) * -1);
   }
@@ -315,6 +318,9 @@
   .mx-auto {
     margin-inline: auto;
   }
+  .my-0 {
+    margin-block: calc(var(--spacing) * 0);
+  }
   .my-2 {
     margin-block: calc(var(--spacing) * 2);
   }
@@ -430,6 +436,9 @@
   .h-0 {
     height: calc(var(--spacing) * 0);
   }
+  .h-2 {
+    height: calc(var(--spacing) * 2);
+  }
   .h-2\/3 {
     height: calc(2/3 * 100%);
   }
@@ -469,6 +478,21 @@
   .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%;
   }
@@ -478,12 +502,21 @@
   .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%);
   }
@@ -499,6 +532,9 @@
   .w-9 {
     width: calc(var(--spacing) * 9);
   }
+  .w-11 {
+    width: calc(var(--spacing) * 11);
+  }
   .w-11\/12 {
     width: calc(11/12 * 100%);
   }
@@ -520,6 +556,15 @@
   .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;
   }
@@ -544,9 +589,15 @@
   .flex-none {
     flex: none;
   }
+  .flex-shrink {
+    flex-shrink: 1;
+  }
   .flex-shrink-0 {
     flex-shrink: 0;
   }
+  .flex-grow {
+    flex-grow: 1;
+  }
   .grow {
     flex-grow: 1;
   }
@@ -603,6 +654,9 @@
   .place-content-end {
     place-content: end;
   }
+  .place-items-center {
+    place-items: center;
+  }
   .content-center {
     align-content: center;
   }
@@ -806,6 +860,9 @@
   .object-cover {
     object-fit: cover;
   }
+  .object-fill {
+    object-fit: fill;
+  }
   .p-1 {
     padding: calc(var(--spacing) * 1);
   }
@@ -821,6 +878,9 @@
   .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);
   }
@@ -836,6 +896,9 @@
   .px-6 {
     padding-inline: calc(var(--spacing) * 6);
   }
+  .py-0 {
+    padding-block: calc(var(--spacing) * 0);
+  }
   .py-0\.5 {
     padding-block: calc(var(--spacing) * 0.5);
   }
@@ -854,6 +917,12 @@
   .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);
   }
@@ -1029,6 +1098,10 @@
   .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;
@@ -1040,6 +1113,9 @@
     --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));
@@ -1208,13 +1284,6 @@
       }
     }
   }
-  .hover\:\!bg-gray-500 {
-    &:hover {
-      @media (hover: hover) {
-        background-color: var(--color-gray-500) !important;
-      }
-    }
-  }
   .hover\:bg-blue-900 {
     &:hover {
       @media (hover: hover) {
@@ -1314,13 +1383,6 @@
       }
     }
   }
-  .hover\:\!outline-blue-500 {
-    &:hover {
-      @media (hover: hover) {
-        outline-color: var(--color-blue-500) !important;
-      }
-    }
-  }
   .hover\:file\:ring-2 {
     &:hover {
       @media (hover: hover) {
@@ -1677,16 +1739,6 @@
       color: var(--color-white);
     }
   }
-  .dark\:outline-blue-500 {
-    @media (prefers-color-scheme: dark) {
-      outline-color: var(--color-blue-500);
-    }
-  }
-  .dark\:outline-blue-800 {
-    @media (prefers-color-scheme: dark) {
-      outline-color: var(--color-blue-800);
-    }
-  }
   .dark\:hover\:\!bg-blue-700 {
     @media (prefers-color-scheme: dark) {
       &:hover {
@@ -1696,15 +1748,6 @@
       }
     }
   }
-  .dark\:hover\:\!bg-gray-700 {
-    @media (prefers-color-scheme: dark) {
-      &:hover {
-        @media (hover: hover) {
-          background-color: var(--color-gray-700) !important;
-        }
-      }
-    }
-  }
   .dark\:hover\:bg-gray-600 {
     @media (prefers-color-scheme: dark) {
       &:hover {
@@ -1723,15 +1766,6 @@
       }
     }
   }
-  .dark\:hover\:\!outline-blue-700 {
-    @media (prefers-color-scheme: dark) {
-      &:hover {
-        @media (hover: hover) {
-          outline-color: var(--color-blue-700) !important;
-        }
-      }
-    }
-  }
   .\[\&\>\*\]\:py-4 {
     &>* {
       padding-block: calc(var(--spacing) * 4);

templates/section.html

@@ -48,7 +48,7 @@
 
         <div class="flex flex-col flex-3">
             <h2 class="text-2xl text-bold"><a href='{{ page.permalink }}'>{{ page.title }}</a></h2>
-            <p class="text-bold text-ellipsis">{{ page.description }}</p>
+            <p class="text-bold text-ellipsis">{{ page.description | linebreaksbr | safe }}</p>
 
             <!-- Summary -->
             <div class="text-bold mt-8">

templates/shortcodes/img.html

@@ -0,0 +1,8 @@
+{% if not op %} {% set op = "fill" -%} {% endif %}
+{% if not height %} {% set height = 450 -%} {% endif %}
+{% if not width %} {% set width = 600 -%} {% endif %}
+{% set image = resize_image(path=page.colocated_path ~ path, width=width, height=height, op=op) %}
+<div class="w-full rounded-lg place-content-center">
+    <img class="py-0 rounded-lg shadow-xl object-cover w-[{{width}}px] h-[{{height}}px]"
+         src="{{ image.url }}" />
+</div>