From d2a5bf359a4f964af342fa1d078fa16b1bd87f8b Mon Sep 17 00:00:00 2001
From: Fuwn <contact@fuwn.me>
Date: Tue, 23 Jan 2024 23:00:53 -0800
Subject: refactor(styles): move out to src

---
 src/app.css                   |  16 ++---
 src/lib/Styles/badge.css      |  16 -----
 src/lib/Styles/card.css       |  53 ----------------
 src/lib/Styles/colours.css    |  43 -------------
 src/lib/Styles/details.scss   |  22 -------
 src/lib/Styles/features.css   |   7 ---
 src/lib/Styles/input.css      | 141 ------------------------------------------
 src/lib/Styles/normalise.css  |  23 -------
 src/lib/Styles/scroll.css     |   4 --
 src/lib/Styles/typography.css |  21 -------
 src/styles/badge.css          |  16 +++++
 src/styles/card.css           |  53 ++++++++++++++++
 src/styles/colours.css        |  43 +++++++++++++
 src/styles/details.scss       |  22 +++++++
 src/styles/features.css       |   7 +++
 src/styles/input.css          | 141 ++++++++++++++++++++++++++++++++++++++++++
 src/styles/normalise.css      |  23 +++++++
 src/styles/scroll.css         |   4 ++
 src/styles/typography.css     |  21 +++++++
 19 files changed, 338 insertions(+), 338 deletions(-)
 delete mode 100644 src/lib/Styles/badge.css
 delete mode 100644 src/lib/Styles/card.css
 delete mode 100644 src/lib/Styles/colours.css
 delete mode 100644 src/lib/Styles/details.scss
 delete mode 100644 src/lib/Styles/features.css
 delete mode 100644 src/lib/Styles/input.css
 delete mode 100644 src/lib/Styles/normalise.css
 delete mode 100644 src/lib/Styles/scroll.css
 delete mode 100644 src/lib/Styles/typography.css
 create mode 100644 src/styles/badge.css
 create mode 100644 src/styles/card.css
 create mode 100644 src/styles/colours.css
 create mode 100644 src/styles/details.scss
 create mode 100644 src/styles/features.css
 create mode 100644 src/styles/input.css
 create mode 100644 src/styles/normalise.css
 create mode 100644 src/styles/scroll.css
 create mode 100644 src/styles/typography.css

(limited to 'src')

diff --git a/src/app.css b/src/app.css
index defc1350..6065e88a 100644
--- a/src/app.css
+++ b/src/app.css
@@ -1,8 +1,8 @@
-@import '$lib/Styles/card.css';
-@import '$lib/Styles/typography.css';
-@import '$lib/Styles/input.css';
-@import '$lib/Styles/normalise.css';
-@import '$lib/Styles/badge.css';
-@import '$lib/Styles/colours.css';
-@import '$lib/Styles/features.css';
-@import '$lib/Styles/scroll.css';
+@import './styles/card.css';
+@import './styles/typography.css';
+@import './styles/input.css';
+@import './styles/normalise.css';
+@import './styles/badge.css';
+@import './styles/colours.css';
+@import './styles/features.css';
+@import './styles/scroll.css';
diff --git a/src/lib/Styles/badge.css b/src/lib/Styles/badge.css
deleted file mode 100644
index 38cae6e4..00000000
--- a/src/lib/Styles/badge.css
+++ /dev/null
@@ -1,16 +0,0 @@
-.button-badge:hover {
-	background-color: var(--base0C);
-	cursor: unset;
-}
-
-.button-badge:active {
-	transform: scale(0.75);
-}
-
-.badge-info {
-	background-color: var(--base0E);
-}
-
-.badge-info:hover {
-	background-color: var(--base0E);
-}
diff --git a/src/lib/Styles/card.css b/src/lib/Styles/card.css
deleted file mode 100644
index d41d4224..00000000
--- a/src/lib/Styles/card.css
+++ /dev/null
@@ -1,53 +0,0 @@
-@import './details.scss';
-
-details,
-.card {
-	box-shadow: rgba(0, 0, 11, 0.1) 0px 7px 29px 0px;
-}
-
-@media (prefers-color-scheme: light) {
-	details,
-	.card {
-		box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
-	}
-}
-
-#header {
-	box-shadow: rgba(0, 0, 11, 0.2) 0px 7px 29px 0px, 0 0 0 5px var(--base02);
-}
-
-@media (prefers-color-scheme: light) {
-	#header {
-		box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px, 0 0 0 5px var(--base02);
-	}
-}
-
-.card {
-	background-color: var(--base0011);
-	padding: 1rem;
-	border-radius: 8px;
-	backdrop-filter: blur(4px);
-	-webkit-backdrop-filter: blur(4px);
-}
-
-.card details,
-.no-shadow {
-	box-shadow: none;
-}
-
-.card-small {
-	padding: 0.5rem;
-}
-
-.card-clear {
-	background-color: transparent;
-	box-shadow: none;
-	padding: 0;
-}
-
-.card-centered {
-	margin: 0 auto;
-	display: flex;
-	flex-direction: column;
-	justify-content: center;
-}
diff --git a/src/lib/Styles/colours.css b/src/lib/Styles/colours.css
deleted file mode 100644
index 43030e1c..00000000
--- a/src/lib/Styles/colours.css
+++ /dev/null
@@ -1,43 +0,0 @@
-:root {
-	--base00: #f8f8f8;
-	--base001: #ffffff;
-	--base0011: #ffffff80;
-	--base01: #e8e8e8;
-	--base02: #d8d8d8;
-	--base03: #b8b8b8;
-	--base04: #585858;
-	--base05: #383838;
-	--base06: #282828;
-	--base07: #181818;
-	--base08: #ab4642;
-	--base09: #dc9656;
-	--base0A: #f7ca88;
-	--base0B: #a1b56c;
-	--base0C: #86c1b9;
-	--base0D: #7cafc2;
-	--base0E: #ba8baf;
-	--base0F: #a16946;
-}
-
-@media (prefers-color-scheme: dark) {
-	:root {
-		--base00: #080808;
-		--base001: #0c0c0c;
-		--base0011: #0c0c0c80;
-		--base01: #181818;
-		--base02: #282828;
-		--base03: #484848;
-		--base04: #a8a8a8;
-		--base05: #c8c8c8;
-		--base06: #d8d8d8;
-		--base07: #f8f8f8;
-		--base08: #9a4541;
-		--base09: #cb9555;
-		--base0A: #f6c987;
-		--base0B: #a0b45b;
-		--base0C: #85c0b8;
-		--base0D: #7baeb1;
-		--base0E: #b98aae;
-		--base0F: #a06845;
-	}
-}
diff --git a/src/lib/Styles/details.scss b/src/lib/Styles/details.scss
deleted file mode 100644
index 86f496d6..00000000
--- a/src/lib/Styles/details.scss
+++ /dev/null
@@ -1,22 +0,0 @@
-details {
-	background-color: var(--base0011);
-	padding: 1rem;
-	border-radius: 8px;
-}
-
-summary {
-	font-size: 1.05em;
-	font-weight: 600;
-	cursor: pointer;
-	list-style: none;
-}
-
-summary small {
-	font-weight: normal;
-}
-
-.details-unstyled {
-	background-color: transparent;
-	padding: 0;
-	border-radius: 0;
-}
diff --git a/src/lib/Styles/features.css b/src/lib/Styles/features.css
deleted file mode 100644
index 73b5e468..00000000
--- a/src/lib/Styles/features.css
+++ /dev/null
@@ -1,7 +0,0 @@
-#mai {
-	position: fixed;
-	left: 0;
-	bottom: 0;
-	height: auto;
-	width: 10vh;
-}
diff --git a/src/lib/Styles/input.css b/src/lib/Styles/input.css
deleted file mode 100644
index 381f2ebe..00000000
--- a/src/lib/Styles/input.css
+++ /dev/null
@@ -1,141 +0,0 @@
-input,
-select {
-	cursor: pointer;
-	position: relative;
-	background-color: var(--base01);
-	/* margin: 0; */
-	/* width: 1.15em;
-	height: 1.15em; */
-	padding: 0.25em;
-	border: none;
-	border-radius: 4px;
-	transform: translateY(0.175em);
-	place-content: center;
-	transition: background-color 0.15s ease-in-out, transform 0.15s ease-in-out;
-	box-shadow: 0 4px 30px var(--base01);
-}
-
-@media (prefers-color-scheme: dark) {
-	input,
-	select {
-		background-color: var(--base07);
-		/* color: var(--base05); */
-	}
-}
-
-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'] {
-	-webkit-appearance: none;
-	appearance: none;
-	margin: 0;
-	width: 1.15em;
-	height: 1.15em;
-	transition: background-color 0.15s ease-in-out, transform 0.15s ease-in-out;
-}
-
-input[type='checkbox']:checked {
-	background-color: var(--base0C);
-}
-
-input[type='checkbox']:checked:before {
-	position: absolute;
-	top: 50%;
-	left: 50%;
-	transform: translate(-50%, -50%);
-}
-
-input[type='checkbox']:active {
-	transform: scale(1);
-	transition: transform 0.15s ease-in-out;
-}
-
-input[type='checkbox']:hover {
-	background-color: var(--base0A);
-}
-
-button {
-	cursor: pointer;
-	position: relative;
-	background-color: var(--base0C);
-	color: var(--base00);
-	border: none;
-	border-radius: 4px;
-	transition: background-color 0.15s ease-in-out, transform 0.15s ease-in-out;
-	box-shadow: 0 4px 30px var(--base01);
-}
-
-button:hover {
-	background-color: var(--base0A);
-}
-
-button:active {
-	transform: scale(0.975);
-}
-
-input:disabled,
-select:disabled,
-button:disabled {
-	cursor: not-allowed;
-	opacity: 0.5;
-}
-
-input:disabled:hover,
-select:disabled:hover,
-button:disabled:hover {
-	background-color: var(--base0C);
-}
-
-input:disabled:active,
-select:disabled:active,
-button:disabled:active {
-	transform: scale(1);
-}
-
-.small-button {
-	transform: scale(0.875);
-}
-
-.small-button:active {
-	transform: scale(0.75);
-}
-
-.unclickable-button {
-	transform: scale(1);
-}
-
-.unclickable-button:active {
-	transform: scale(1) !important;
-}
-
-.smaller-button {
-	background-color: var(--base0C);
-	transform: scale(0.75);
-}
-
-.button-square {
-	background-color: var(--base0C);
-	transform: scale(0.75);
-	padding: 0.125em 0.575em;
-}
-
-.button-lined {
-	transform: translateY(0.175em);
-}
-
-.button-action {
-	background-color: var(--base0E);
-}
diff --git a/src/lib/Styles/normalise.css b/src/lib/Styles/normalise.css
deleted file mode 100644
index 85f6442c..00000000
--- a/src/lib/Styles/normalise.css
+++ /dev/null
@@ -1,23 +0,0 @@
-ul,
-ol {
-	margin: 0;
-}
-
-ul,
-li::marker {
-	content: unset !important;
-}
-
-a:hover {
-	text-decoration: none !important;
-}
-
-a:focus {
-	outline: none;
-}
-
-code {
-	color: var(--base07);
-	padding: 0.25em 0.5em;
-	border-radius: 4px;
-}
diff --git a/src/lib/Styles/scroll.css b/src/lib/Styles/scroll.css
deleted file mode 100644
index d7f246d1..00000000
--- a/src/lib/Styles/scroll.css
+++ /dev/null
@@ -1,4 +0,0 @@
-* {
-	scrollbar-width: thin;
-	scrollbar-color: var(--base03) transparent;
-}
diff --git a/src/lib/Styles/typography.css b/src/lib/Styles/typography.css
deleted file mode 100644
index e502fa90..00000000
--- a/src/lib/Styles/typography.css
+++ /dev/null
@@ -1,21 +0,0 @@
-/* Kosugi, M PLUS 1 Code */
-/* @import url('https://fonts.googleapis.com/css2?family=Ubuntu:wght@300;400;500;550;700;800&display=swap'); */
-@import url('https://proxy.due.moe/?q=https://fonts.googleapis.com/css?family=DM+Sans:400,500,600,700&display=swap');
-
-body {
-	font-family: 'DM Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,
-		Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
-	font-size: 1em;
-	line-height: 1.5;
-	/* font-weight: 300; */
-	/* text-shadow: 0 0 0.25em var(--base01); */
-	padding: 1.25rem;
-}
-
-#wrapped {
-	font-family: inherit;
-	font-size: inherit;
-	line-height: inherit;
-	font-weight: 400;
-	text-shadow: none;
-}
diff --git a/src/styles/badge.css b/src/styles/badge.css
new file mode 100644
index 00000000..38cae6e4
--- /dev/null
+++ b/src/styles/badge.css
@@ -0,0 +1,16 @@
+.button-badge:hover {
+	background-color: var(--base0C);
+	cursor: unset;
+}
+
+.button-badge:active {
+	transform: scale(0.75);
+}
+
+.badge-info {
+	background-color: var(--base0E);
+}
+
+.badge-info:hover {
+	background-color: var(--base0E);
+}
diff --git a/src/styles/card.css b/src/styles/card.css
new file mode 100644
index 00000000..d41d4224
--- /dev/null
+++ b/src/styles/card.css
@@ -0,0 +1,53 @@
+@import './details.scss';
+
+details,
+.card {
+	box-shadow: rgba(0, 0, 11, 0.1) 0px 7px 29px 0px;
+}
+
+@media (prefers-color-scheme: light) {
+	details,
+	.card {
+		box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
+	}
+}
+
+#header {
+	box-shadow: rgba(0, 0, 11, 0.2) 0px 7px 29px 0px, 0 0 0 5px var(--base02);
+}
+
+@media (prefers-color-scheme: light) {
+	#header {
+		box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px, 0 0 0 5px var(--base02);
+	}
+}
+
+.card {
+	background-color: var(--base0011);
+	padding: 1rem;
+	border-radius: 8px;
+	backdrop-filter: blur(4px);
+	-webkit-backdrop-filter: blur(4px);
+}
+
+.card details,
+.no-shadow {
+	box-shadow: none;
+}
+
+.card-small {
+	padding: 0.5rem;
+}
+
+.card-clear {
+	background-color: transparent;
+	box-shadow: none;
+	padding: 0;
+}
+
+.card-centered {
+	margin: 0 auto;
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
+}
diff --git a/src/styles/colours.css b/src/styles/colours.css
new file mode 100644
index 00000000..43030e1c
--- /dev/null
+++ b/src/styles/colours.css
@@ -0,0 +1,43 @@
+:root {
+	--base00: #f8f8f8;
+	--base001: #ffffff;
+	--base0011: #ffffff80;
+	--base01: #e8e8e8;
+	--base02: #d8d8d8;
+	--base03: #b8b8b8;
+	--base04: #585858;
+	--base05: #383838;
+	--base06: #282828;
+	--base07: #181818;
+	--base08: #ab4642;
+	--base09: #dc9656;
+	--base0A: #f7ca88;
+	--base0B: #a1b56c;
+	--base0C: #86c1b9;
+	--base0D: #7cafc2;
+	--base0E: #ba8baf;
+	--base0F: #a16946;
+}
+
+@media (prefers-color-scheme: dark) {
+	:root {
+		--base00: #080808;
+		--base001: #0c0c0c;
+		--base0011: #0c0c0c80;
+		--base01: #181818;
+		--base02: #282828;
+		--base03: #484848;
+		--base04: #a8a8a8;
+		--base05: #c8c8c8;
+		--base06: #d8d8d8;
+		--base07: #f8f8f8;
+		--base08: #9a4541;
+		--base09: #cb9555;
+		--base0A: #f6c987;
+		--base0B: #a0b45b;
+		--base0C: #85c0b8;
+		--base0D: #7baeb1;
+		--base0E: #b98aae;
+		--base0F: #a06845;
+	}
+}
diff --git a/src/styles/details.scss b/src/styles/details.scss
new file mode 100644
index 00000000..86f496d6
--- /dev/null
+++ b/src/styles/details.scss
@@ -0,0 +1,22 @@
+details {
+	background-color: var(--base0011);
+	padding: 1rem;
+	border-radius: 8px;
+}
+
+summary {
+	font-size: 1.05em;
+	font-weight: 600;
+	cursor: pointer;
+	list-style: none;
+}
+
+summary small {
+	font-weight: normal;
+}
+
+.details-unstyled {
+	background-color: transparent;
+	padding: 0;
+	border-radius: 0;
+}
diff --git a/src/styles/features.css b/src/styles/features.css
new file mode 100644
index 00000000..73b5e468
--- /dev/null
+++ b/src/styles/features.css
@@ -0,0 +1,7 @@
+#mai {
+	position: fixed;
+	left: 0;
+	bottom: 0;
+	height: auto;
+	width: 10vh;
+}
diff --git a/src/styles/input.css b/src/styles/input.css
new file mode 100644
index 00000000..381f2ebe
--- /dev/null
+++ b/src/styles/input.css
@@ -0,0 +1,141 @@
+input,
+select {
+	cursor: pointer;
+	position: relative;
+	background-color: var(--base01);
+	/* margin: 0; */
+	/* width: 1.15em;
+	height: 1.15em; */
+	padding: 0.25em;
+	border: none;
+	border-radius: 4px;
+	transform: translateY(0.175em);
+	place-content: center;
+	transition: background-color 0.15s ease-in-out, transform 0.15s ease-in-out;
+	box-shadow: 0 4px 30px var(--base01);
+}
+
+@media (prefers-color-scheme: dark) {
+	input,
+	select {
+		background-color: var(--base07);
+		/* color: var(--base05); */
+	}
+}
+
+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'] {
+	-webkit-appearance: none;
+	appearance: none;
+	margin: 0;
+	width: 1.15em;
+	height: 1.15em;
+	transition: background-color 0.15s ease-in-out, transform 0.15s ease-in-out;
+}
+
+input[type='checkbox']:checked {
+	background-color: var(--base0C);
+}
+
+input[type='checkbox']:checked:before {
+	position: absolute;
+	top: 50%;
+	left: 50%;
+	transform: translate(-50%, -50%);
+}
+
+input[type='checkbox']:active {
+	transform: scale(1);
+	transition: transform 0.15s ease-in-out;
+}
+
+input[type='checkbox']:hover {
+	background-color: var(--base0A);
+}
+
+button {
+	cursor: pointer;
+	position: relative;
+	background-color: var(--base0C);
+	color: var(--base00);
+	border: none;
+	border-radius: 4px;
+	transition: background-color 0.15s ease-in-out, transform 0.15s ease-in-out;
+	box-shadow: 0 4px 30px var(--base01);
+}
+
+button:hover {
+	background-color: var(--base0A);
+}
+
+button:active {
+	transform: scale(0.975);
+}
+
+input:disabled,
+select:disabled,
+button:disabled {
+	cursor: not-allowed;
+	opacity: 0.5;
+}
+
+input:disabled:hover,
+select:disabled:hover,
+button:disabled:hover {
+	background-color: var(--base0C);
+}
+
+input:disabled:active,
+select:disabled:active,
+button:disabled:active {
+	transform: scale(1);
+}
+
+.small-button {
+	transform: scale(0.875);
+}
+
+.small-button:active {
+	transform: scale(0.75);
+}
+
+.unclickable-button {
+	transform: scale(1);
+}
+
+.unclickable-button:active {
+	transform: scale(1) !important;
+}
+
+.smaller-button {
+	background-color: var(--base0C);
+	transform: scale(0.75);
+}
+
+.button-square {
+	background-color: var(--base0C);
+	transform: scale(0.75);
+	padding: 0.125em 0.575em;
+}
+
+.button-lined {
+	transform: translateY(0.175em);
+}
+
+.button-action {
+	background-color: var(--base0E);
+}
diff --git a/src/styles/normalise.css b/src/styles/normalise.css
new file mode 100644
index 00000000..85f6442c
--- /dev/null
+++ b/src/styles/normalise.css
@@ -0,0 +1,23 @@
+ul,
+ol {
+	margin: 0;
+}
+
+ul,
+li::marker {
+	content: unset !important;
+}
+
+a:hover {
+	text-decoration: none !important;
+}
+
+a:focus {
+	outline: none;
+}
+
+code {
+	color: var(--base07);
+	padding: 0.25em 0.5em;
+	border-radius: 4px;
+}
diff --git a/src/styles/scroll.css b/src/styles/scroll.css
new file mode 100644
index 00000000..d7f246d1
--- /dev/null
+++ b/src/styles/scroll.css
@@ -0,0 +1,4 @@
+* {
+	scrollbar-width: thin;
+	scrollbar-color: var(--base03) transparent;
+}
diff --git a/src/styles/typography.css b/src/styles/typography.css
new file mode 100644
index 00000000..e502fa90
--- /dev/null
+++ b/src/styles/typography.css
@@ -0,0 +1,21 @@
+/* Kosugi, M PLUS 1 Code */
+/* @import url('https://fonts.googleapis.com/css2?family=Ubuntu:wght@300;400;500;550;700;800&display=swap'); */
+@import url('https://proxy.due.moe/?q=https://fonts.googleapis.com/css?family=DM+Sans:400,500,600,700&display=swap');
+
+body {
+	font-family: 'DM Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,
+		Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+	font-size: 1em;
+	line-height: 1.5;
+	/* font-weight: 300; */
+	/* text-shadow: 0 0 0.25em var(--base01); */
+	padding: 1.25rem;
+}
+
+#wrapped {
+	font-family: inherit;
+	font-size: inherit;
+	line-height: inherit;
+	font-weight: 400;
+	text-shadow: none;
+}
-- 
cgit v1.2.3