fix width (???), return button backgrounds

src/lib/app.css

@@ -79,7 +79,7 @@ header, #widgets {
 }
 
 main {
-    width: 732px;
+    width: 700px;
 }
 
 img.emoji {

src/lib/ui/Button.svelte

@@ -63,7 +63,7 @@
         border-radius: 8px;
         border: 2px solid var(--bg-700);
 
-        background-color: transparent;
+        background-color: var(--bg-700);
         color: var(--text);
 
         transition-property: border-color, background-color, color;
@@ -79,11 +79,13 @@
     }
 
     button:hover {
-        background-color: color-mix(in srgb, transparent, var(--bg-700) 50%);
+        border-color: color-mix(in srgb, var(--bg-700), black 10%);
+        background-color: color-mix(in srgb, var(--bg-700), black 10%);
     }
 
     button:active {
-        background-color: var(--bg-700);
+        border-color: color-mix(in srgb, var(--bg-700), black 20%);
+        background-color: color-mix(in srgb, var(--bg-700), black 20%);
     }
 
     button.active {
@@ -124,18 +126,11 @@
     button.disabled {
         color: var(--text);
         opacity: .5;
+        background: transparent;
         border-color: transparent;
         cursor: initial;
     }
 
-    button.disabled:hover {
-        background-color: transparent;
-    }
-
-    button.disabled:active {
-        background-color: transparent;
-    }
-
     .icon:not(:empty) {
         height: 1.8em;
         margin-right: 8px;

src/lib/ui/Modal.svelte

@@ -38,7 +38,7 @@
         z-index: 101;
 
         padding: 16px;
-        width: 732px;
+        width: 700px;
         border-radius: 8px;
         box-shadow: 0px 16px 64px 4px rgba(0,0,0,0.5);
         animation: modal_pop_up .15s cubic-bezier(0.22, 1, 0.36, 1);

src/lib/ui/post/Post.svelte

@@ -74,8 +74,6 @@
 
 <style>
     .post-container {
-        width: 732px;
-        max-width: 732px;
         display: flex;
         flex-direction: column;
         border-top: 1px solid color-mix(in srgb, transparent, var(--text) 25%);