From 48ffcbd431ea9d12a73a55c233a4fd3834575d5e Mon Sep 17 00:00:00 2001
From: Fuwn <contact@fuwn.me>
Date: Thu, 4 Jan 2024 08:06:45 -0800
Subject: feat(settings): cool button style

---
 src/app.css                      | 37 +++++++++++++++++++++++++++++++++++++
 src/routes/settings/+page.svelte |  8 ++++----
 2 files changed, 41 insertions(+), 4 deletions(-)

diff --git a/src/app.css b/src/app.css
index 9d54f143..1eae8061 100644
--- a/src/app.css
+++ b/src/app.css
@@ -23,10 +23,19 @@ select {
 	place-content: center;
 }
 
+input[type='text'],
+input[type='number'],
+input[type='date'],
+input[type='time'],
+button {
+	padding: 0.25em 0.5em;
+}
+
 select {
 	transform: translateY(0em);
 	margin-top: 0.25em;
 	margin-bottom: 0.25em;
+	padding: 0.25em 0.5em;
 }
 
 input[type='checkbox'] {
@@ -48,3 +57,31 @@ input[type='checkbox']:checked:before {
 	left: 50%;
 	transform: translate(-50%, -50%);
 }
+
+input[type='checkbox']:active {
+	transform: scale(0.975);
+	transition: transform 0.15s ease-in-out;
+}
+
+input[type='checkbox']:hover {
+	background-color: var(--base0A);
+}
+
+button {
+	cursor: pointer;
+	position: relative;
+	background-color: var(--base0B);
+	color: var(--base00);
+	border: none;
+	border-radius: 4px;
+	transition: background-color 0.15s ease-in-out;
+}
+
+button:hover {
+	background-color: var(--base0A);
+}
+
+button:active {
+	transform: scale(0.975);
+	transition: transform 0.15s ease-in-out;
+}
diff --git a/src/routes/settings/+page.svelte b/src/routes/settings/+page.svelte
index 3d8aee18..f61b236b 100644
--- a/src/routes/settings/+page.svelte
+++ b/src/routes/settings/+page.svelte
@@ -34,8 +34,7 @@
 	Please log in to modify settings.
 {:else}
 	<Category title="RSS Feeds" id="feeds">
-		<a
-			href={'#'}
+		<button
 			on:click={() =>
 				navigator.clipboard.writeText(
 					`https://${
@@ -45,8 +44,9 @@
 					}`
 				)}
 		>
-			Click to copy AniList notifications RSS feed URL and token
-		</a>
+			Copy to clipboard
+		</button>
+		Your AniList notifications RSS feed URL
 		<SettingHint lineBreak>Do not share this link with <b>anyone</b>!</SettingHint>
 	</Category>
 	<Category title="Display"><Display /></Category>
-- 
cgit v1.2.3