feat(settings): cool button style

1 files changed, 37 insertions, 0 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;
+}