update CSS styles and add new project ideas with images

Author: ldgrp

css/input.css

@@ -65,7 +65,7 @@ body {
 }
 
 .entry-list .title {
-  @apply text-inherit text-lg decoration-dotted underline hover:decoration-solid
+  @apply text-inherit text-lg decoration-dotted underline underline-offset-2 hover:decoration-solid
 }
 
 footer a {
@@ -195,7 +195,7 @@ article td {
 }
 
 article img {
-  @apply mx-auto rounded-lg;
+  @apply mx-auto;
 }
 
 article figcaption {

ideas/external/brick-calendar.md

@@ -0,0 +1,7 @@
+---
+title: Brick Calendar
+date: 2025-04-21
+url: https://github.com/ldgrp/brick-calendar
+meta-img: /images/brick-calendar.png
+---
+

posts/external/2024-04-30-language-detection.md renamed to ideas/external/language-detection.md

@@ -2,4 +2,5 @@
 title: N-Gram Language Detection in JavaScript
 date: 2024-04-30
 url: https://ldgrp.me/sandbox/ngram-language-detection
+meta-img: /images/language-detection.png
 ---

images/brick-calendar.png

@@ -21,29 +21,25 @@ Senior Software Engineer at [Hall][hall]
 - Functional programming
 - Real-time collaboration
 - [Coffee][coffee]
-- Cooking
-- Baking
-- [Music][spotify]
+- Cooking / Baking
 - [Running][strava]
 - [Cycling][strava]
+- Snowboarding
 - Guitar
 - 3D printing
 :::
 
-
-## Posts
+## Projects
 ::: { .posts }
-$partial("templates/post-list.html")$
+$partial("templates/ideas-list.html")$
 :::
 
-## [Ideas][ideas]
-
+## Posts
 ::: { .posts }
-$partial("templates/ideas-list.html")$
+$partial("templates/post-list.html")$
 :::
 :::
 
-
 [email]: mailto:[email protected]
 [github]: https://github.com/ldgrp
 [linkedin]: https://linkedin.com/in/ldgrp

images/language-detection.png

@@ -3,7 +3,7 @@
         <span>Leo Orpilla III</span>
     </a>
     <div class="sm:absolute m-0 sm:m-4 top-0 right-0">
-        <button aria-label="Toggle Dark Mode" id="theme-toggle" type="button" class="text-gray-500 dark:text-gray-400 hover:text-yellow-600 dark:hover:text-yellow-500 focus:outline-none focus:ring-4 focus:ring-gray-200 dark:focus:ring-gray-700 rounded-lg text-sm p-2.5">
+        <button aria-label="Toggle Dark Mode" id="theme-toggle" type="button" class="text-gray-500 dark:text-gray-400 hover:text-yellow-600 dark:hover:text-yellow-500 focus:outline-none focus:ring-4 focus:ring-gray-200 dark:focus:ring-gray-700 text-sm p-2.5">
             <svg id="theme-toggle-dark-icon" class="hidden w-5 h-5" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z"></path></svg>
             <svg id="theme-toggle-light-icon" class="hidden w-5 h-5" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.706.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 6.464A1 1 0 106.465 5.05l-.708-.707a1 1 0 00-1.414 1.414l.707.707zm1.414 8.486l-.707.707a1 1 0 01-1.414-1.414l.707-.707a1 1 0 011.414 1.414zM4 11a1 1 0 100-2H3a1 1 0 000 2h1z" fill-rule="evenodd" clip-rule="evenodd"></path></svg>
         </button>

index.md

@@ -12,11 +12,8 @@
             </div>
             <div class="metadata">
                 <span class="date">$date$</span>
-                $if(status)$
-                <span class="status status-$status$">$status$</span>
-                $endif$
             </div>
-            <a class="title" href="$url$">$title$</a>
+            <a class="title group-hover:decoration-solid" href="$url$">$title$</a>
         </li>
     $endfor$
 </ul>

templates/header.html

@@ -1,6 +1,6 @@
 <ul class="entry-list">
     $for(posts)$
-        <li>
+        <li class="group">
             <div class="date">$date$</div>
             <a class="title" href="$url$">$title$</a> 
         </li>