design revisited

src/main/resources/static/add.css

@@ -128,7 +128,7 @@ form :has(#url) {
 #btn-bar {
     grid-column: 1 / 4;
     justify-content: end;
-    gap: 1rem;
+    gap: 1rem ;
 }
 
 /* button styling */

src/main/resources/static/main.css

@@ -148,6 +148,14 @@ header {
     --icon-size: 2rem;
 }
 
+:is(.downvote-btn, .upvote-btn):disabled {
+    filter: brightness(1.75);
+}
+
+:is(.downvote-btn, .upvote-btn).isVoted {
+    filter: brightness(1.1);
+}
+
 .downvote-btn {
     transform: rotate(180deg);
 }
@@ -172,10 +180,6 @@ header {
     --icon-size: 1rem;
 }
 
-.isVoted {
-    filter: brightness(1.75);
-}
-
 .divider {
     width: .05rem;
     height: 1rem;
@@ -194,10 +198,21 @@ header {
     transition: filter ease-out 50ms;
 }
 
-.btn.flat:is(:hover, :focus-visible) {
+.btn.flat:is(:hover, :focus-visible):not(:disabled) {
     filter: brightness(1.5);
 }
 
-.btn.flat:active {
+.btn.flat:active:not(:disabled){
     filter: brightness(1.75);
 }
+
+select * {
+    background-color: var(--fg-color);
+    color: var(--text-color);
+
+}
+
+select::selection {
+    background-color: #554094;
+}
+