From ab9b80dddb60a86931a2d36f882cd947a96939cc Mon Sep 17 00:00:00 2001
From: Luke Else <mail@luke-else.co.uk>
Date: Tue, 16 Sep 2025 13:25:02 +0100
Subject: [PATCH] fix: Trying to get the sideways text to render in prod

---
 package.json                      |  2 +-
 src/lib/components/Section.svelte | 10 ++++++++--
 src/lib/style.css                 |  8 +++++++-
 3 files changed, 16 insertions(+), 4 deletions(-)

diff --git a/package.json b/package.json
index cfc29b6..4710682 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@luke-else/component-lib",
-  "version": "1.0.9",
+  "version": "1.1.0",
   "description": "",
   "scripts": {
     "package": "svelte-package && pnpm run build:css",
diff --git a/src/lib/components/Section.svelte b/src/lib/components/Section.svelte
index d879372..8abcdaf 100644
--- a/src/lib/components/Section.svelte
+++ b/src/lib/components/Section.svelte
@@ -2,12 +2,18 @@
     export let label: string = '';
 </script>
 
+<style>
+    #sideway-label {
+        @apply tracking-widest [writing-mode:vertical-rl] [text-orientation:mixed];
+    }
+</style>
+
 <div id={label} class="relative flex flex-row w-full min-h-[300px] mt-5 mb-25">
     <!-- Sticky/Sliding Label -->
     <div class="hidden md:flex flex-col items-center mr-6">
         <div class="sticky top-24 left-0 z-10">
-            <span
-                class="text-2xl font-bold text-blue-400 tracking-widest [writing-mode:vertical-rl] [text-orientation:mixed]"
+            <span id="sideway-label"
+                class="text-2xl font-bold text-blue-400"
             >
                 {label}
             </span>
diff --git a/src/lib/style.css b/src/lib/style.css
index a461c50..07a7f6d 100644
--- a/src/lib/style.css
+++ b/src/lib/style.css
@@ -1 +1,7 @@
-@import "tailwindcss";
\ No newline at end of file
+@import "tailwindcss";
+
+@layer components {
+      .button {
+        @apply px-4 py-2 rounded-md bg-red-500 text-white;
+      }
+}
\ No newline at end of file