From 96172e6db4ad2dcc1e1763a4910add8a0cea4bac Mon Sep 17 00:00:00 2001
From: limepotato <limepot@protonmail.ch>
Date: Mon, 8 Jul 2024 17:16:08 -0600
Subject: [PATCH] Style a bit

---
 public/css/classes.css | 32 +++++++++-----------------------
 public/css/limepot.css |  2 ++
 src/pages/index.astro  |  4 ++--
 3 files changed, 13 insertions(+), 25 deletions(-)

diff --git a/public/css/classes.css b/public/css/classes.css
index d1fbc34..ec3055c 100644
--- a/public/css/classes.css
+++ b/public/css/classes.css
@@ -30,13 +30,13 @@
     padding: 0.5em;
     margin-top: 1em;
     margin-bottom: 1em;
-    border: 3px solid #fab387;
+    border: 3px solid var(--accent-color);
     border-radius: 5px;
     opacity: 0.9;
     background: rgba(0, 0, 0, .66);
-    -webkit-box-shadow: 0 0 20px #f5a97f;
-    -moz-box-shadow: 0 0 20px #f5a97f;
-    box-shadow: 0 0 20px #f5a97f;
+    -webkit-box-shadow: 0 0 20px var(--accent-color);
+    -moz-box-shadow: 0 0 20px var(--accent-color);
+    box-shadow: 0 0 20px var(--accent-color);
 }
 
 .small-quote {
@@ -44,30 +44,16 @@
     color: #a6adc8;
 }
 
-.ntfy-send::before {
-    content: "[[";
-}
-
-.ntfy-send::after {
-    content: "]]";
-}
-
-.ntfy-box {
-    margin: 0 1ch;
-    padding: 1ch 2ch 2ch 2ch;
-    background: #ffffff13;
-    border-radius: 10px;
-}
-
 textarea {
-    width: 85%;
+    width: 82%;
     appearance: none;
     outline: none;
     font-family: inherit;
     background: transparent;
     color: inherit;
     border-bottom: 1px solid currentColor;
-    -webkit-box-shadow: 0 0 20px #f5a97f;
-    -moz-box-shadow: 0 0 20px #f5a97f;
-    box-shadow: 0 0 20px #f5a97f;
+    border-radius: 10px;
+    -webkit-box-shadow: 0 0 20px var(--accent-color);
+    -moz-box-shadow: 0 0 20px var(--accent-color);
+    box-shadow: 0 0 20px var(--accent-color);
 }
\ No newline at end of file
diff --git a/public/css/limepot.css b/public/css/limepot.css
index 315898f..5ff9267 100644
--- a/public/css/limepot.css
+++ b/public/css/limepot.css
@@ -20,6 +20,8 @@
     font-family: system-ui, sans-serif;
     line-height: 1.6;
     margin: auto;
+
+    --accent-color: #fab387;
 }
 
 footer {
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 521ac79..4aac1c7 100755
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -66,8 +66,8 @@ import Layout from "../layouts/Layout.astro";
       <p><a href="https://www.youtube.com/channel/UCk_yKIpDnMv_DvuDb9RGfcA">==> Youtube</a></p>
       <br>
       <div class="ntfy-box">
-        <p>send me a notification! type words and press send</p>
-        <textarea id="ntfy-input" placeholder="Hi Nelle~!"></textarea><a class="ntfy-send nob4" href="javascript:sendNotification()">send</a>
+        <h4>send me a notification! type words and press send</h4>
+        <textarea id="ntfy-input" placeholder="Hi Nelle~!"></textarea><button class="ntfy-send nob4 custom-btn btn-1" onclick="javascript:sendNotification()" style="margin-left:10px;">Send</button>
       </div>
     </div>
   </main>