From f06d5f33f27fe36c30677103f4faf3c5d77f3543 Mon Sep 17 00:00:00 2001
From: "David T. Sadler" <davidtsadler@googlemail.com>
Date: Sun, 1 Mar 2020 22:36:17 +0000
Subject: Give each category their own style

---
 source/_assets/sass/_blog.scss        | 8 ++++++++
 source/_layouts/master.blade.php      | 9 ++++-----
 source/_partials/postStub.blade.php   | 3 ++-
 source/assets/build/css/main.css      | 8 ++++++++
 source/assets/build/mix-manifest.json | 2 +-
 5 files changed, 23 insertions(+), 7 deletions(-)
diff --git a/source/_assets/sass/_blog.scss b/source/_assets/sass/_blog.scss
index c54a038..ea6d264 100644
--- a/source/_assets/sass/_blog.scss
+++ b/source/_assets/sass/_blog.scss
@@ -20,3 +20,11 @@
     grid-column-gap: 1rem;
   }
 }
+
+a.php {
+  background-color: #8892BF;
+}
+
+a.mysql {
+  background-color: #F29221;
+}
diff --git a/source/_layouts/master.blade.php b/source/_layouts/master.blade.php
index 05402f8..c8398a5 100644
--- a/source/_layouts/master.blade.php
+++ b/source/_layouts/master.blade.php
@@ -1,3 +1,4 @@
+<?php use \Illuminate\Support\Str; ?>
 <!doctype html>
 <html lang="en">
     <head>
@@ -7,11 +8,9 @@
     <div id="main-sidebar-container">
         <article>@yield('article')</article>
         <aside>
-            <ol>
-                @foreach ($page->allCategories($posts) as $category)
-                    <li><a href="/categories/{{ \Illuminate\Support\Str::slug($category) }}">{{ $category }}</a></li>
-                @endforeach
-            </ol>
+            @foreach ($page->allCategories($posts) as $category)
+                <a class="rounded p-1 text-gray-200 {{Str::slug($category) }}" href="/categories/{{ Str::slug($category) }}">{{ $category }}</a>
+            @endforeach
         </aside>
     </div>
   </body>
diff --git a/source/_partials/postStub.blade.php b/source/_partials/postStub.blade.php
index 734d23f..84976cf 100644
--- a/source/_partials/postStub.blade.php
+++ b/source/_partials/postStub.blade.php
@@ -1,3 +1,4 @@
+<?php use \Illuminate\Support\Str; ?>
 <li class="md:flex md:flex-row md:justify-between hover:bg-gray-800 p-4 pb-8">
     <a class="text-green-300" title="Go to post" href="{{ $post->getUrl() }}">
         <h4 class="text-3xl font-bold">{{$post->title }}</h4>
@@ -9,7 +10,7 @@
         </time> 
         <div class="order-1 md:order-2">
             @foreach ($post->categories as $category)
-                <span class="inline-block bg-green-800 rounded py-2 px-4"><a class="text-gray-200" href="/categories/{{ \Illuminate\Support\Str::slug($category) }}">{{ $category }}</a></span>
+                <a class="inline-block rounded py-2 px-4 text-gray-200 {{Str::slug($category) }}" href="/categories/{{ Str::slug($category) }}">{{ $category }}</a>
             @endforeach
         </div>
     </div>
diff --git a/source/assets/build/css/main.css b/source/assets/build/css/main.css
index 1005b36..80061c5 100644
--- a/source/assets/build/css/main.css
+++ b/source/assets/build/css/main.css
@@ -646,6 +646,14 @@ video {
   }
 }
 
+a.php {
+  background-color: #8892BF;
+}
+
+a.mysql {
+  background-color: #F29221;
+}
+
 .sr-only {
   position: absolute;
   width: 1px;
diff --git a/source/assets/build/mix-manifest.json b/source/assets/build/mix-manifest.json
index 15db49c..9320607 100644
--- a/source/assets/build/mix-manifest.json
+++ b/source/assets/build/mix-manifest.json
@@ -1,4 +1,4 @@
 {
     "/js/main.js": "/js/main.js?id=d2fc77312aa2cec93616",
-    "/css/main.css": "/css/main.css?id=9fcba6b7d4d71a671a70"
+    "/css/main.css": "/css/main.css?id=c2151c72f0646ef2af84"
 }
-- 
cgit v1.2.3-13-gbd6f

