From 060330a8a4835c3f4bbf5eaada5a1af581ad78fe Mon Sep 17 00:00:00 2001
From: Korbs <korbs@sudovanilla.org>
Date: Thu, 12 Dec 2024 18:46:07 -0500
Subject: [PATCH] Change style of Aside component

---
 package.json          |  2 +-
 src/styles/index.scss | 23 ++++++++++++++---------
 2 files changed, 15 insertions(+), 10 deletions(-)

diff --git a/package.json b/package.json
index d4d6262..6be04a0 100755
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "butterflyvu",
   "type": "module",
-  "version": "0.1.61",
+  "version": "0.1.62",
   "license": "GPL-3.0-only",
   "author": {
     "name": "SudoVanilla"
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 40617d7..a5ebed9 100755
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -245,36 +245,41 @@ header {
     }
 
     .aside {
-        border-left: 6px transparent solid;
-        padding-left: 24px;
         padding-top: 12px;
         padding-bottom: 12px;
         &#aside-Note {
             color: var(--aside-note);
-            border-color: var(--aside-note);
+            h2 {background: var(--aside-note);}
             svg {stroke: var(--aside-note);}
         }
         &#aside-Warning {
             color: var(--aside-warning);
-            border-color: var(--aside-warning);
+            h2 {background: var(--aside-warning);}
             svg {stroke: var(--aside-warning);}
         }
         &#aside-Dangerous {
             color: var(--aside-dangerous);
-            border-color: var(--aside-dangerous);
+            h2 {background: var(--aside-dangerous);}
             svg {stroke: var(--aside-dangerous);}
         }
         &#aside-Successful {
             color: var(--aside-successful);
-            border-color: var(--aside-successful);
+            h2 {background: var(--aside-successful); svg {stroke: rgb(0, 0, 0) !important;}}
             svg {stroke: var(--aside-successful);}
         }
         h2 {
             display: flex;
             align-items: center;
-            gap: 12px;
-            font-size: 24px;
-            padding-bottom: 6px;
+            gap: 6px;
+            width: fit-content;
+            border-radius: 3rem;
+            font-size: 12px;
+            padding: 4px 12px 4px 8px;
+            margin-bottom: 6px;
+            color: black;
+            svg {
+                width: 16px;
+            }
         }
         * {
             margin: 0px;