feat(update): huge changes

styles/main.css

@@ -1,26 +1,27 @@
-@import url(../../.cache/material/colors.css);
+@import "./colors.css";
 @import "./bar.css";
 @import "./notification.css";
 @import "./osd.css";
 @import "./launcher.css";
 @import "./dashboard.css";
+@import "./dock.css";
+@import "./notif_center.css";
 
 * {
   all: unset;
-  color: @foreground;
-  font-size: 16px;
-  font-family: "Chakra Petch";
+  color: var(--foreground);
+  font-size: 15px;
+  font-family: "Monaspace Radon";
 }
 
 /*
  * ── tooltip ───────────────────────────────────────────────────────────
 */
-
 tooltip {
   border: solid 1px;
-  border-radius: 10px;
-  border-color: @surface;
-  background-color: @shadow;
+  border-radius: 16px;
+  border-color: var(--outline);
+  background-color: var(--surface);
   animation: tooltipShow 0.25s cubic-bezier(0.5, 0.25, 0, 1);
 }
 
@@ -39,38 +40,12 @@ tooltip > * {
   border-radius: 10px;
 }
 
-/*
- * ── dock ──────────────────────────────────────────────────────────────
-*/
-#dock-icon {
-  padding: 0px 2px 0px 2px;
+#corner {
+  background-color: var(--surface);
+  border-radius: 0;
 }
 
-#dock {
-  padding: 10px;
-  background-color: alpha(@shadow, 0.5);
-  border: 0.5px solid alpha(@outlineVariant, 0.4);
-  border-radius: 12px;
-  margin-bottom: 2px;
-}
-
-#dock-separator {
-  border-right: 1px solid alpha(@foreground, 0.5);
-}
-
-#dock-app-button {
-  padding: 2px;
-  margin-left: 2px;
-  margin-right: 2px;
-  border-radius: 12px;
-}
-
-.show-dock {
-  opacity: 1;
-  margin: 0;
-}
-
-.hide-dock {
-  opacity: 1;
-  margin: -80px;
+#corner-container {
+  min-width: 20px;
+  min-height: 20px;
 }