Tweak to color shadows, sidebar font-size, general small fixes (#36)

scss/chat.scss

@@ -15,9 +15,17 @@ body.has-full-page-chat {
   background-color: var(--background-color);
 }
 
-.chat-drawer .chat-drawer-container {
-  box-shadow: 0px 0px 0px 2px var(--d-chat-border);
-  border: none;
+.chat-drawer-container {
+  .is-expanded & {
+    box-shadow: 0px 0px 0px 2px var(--d-chat-border);
+  }
+  .chat-drawer.is-expanded & {
+    border: none;
+  }
+}
+
+.chat-drawer-outlet-container {
+  z-index: z("composer", "content") + 1;
 }
 
 .chat-drawer .channels-list-container .chat-channel-row {
@@ -35,3 +43,7 @@ body.has-full-page-chat {
   text-transform: uppercase;
   font-size: var(--font-down-1);
 }
+
+.chat-composer__wrapper {
+  background: var(--d-content-background);
+}

scss/color-choice.scss

@@ -21,7 +21,7 @@
   border: none;
 }
 
-html.cusom-color-horizon {
+html.custom-color-horizon {
   --accent-base-color: #595bca;
 }
 

scss/color-exploration.scss

@@ -41,11 +41,11 @@
     oklch(from var(--accent-color) calc(l * 1.85) calc(c * 2) h)
   );
   --topic-card-shadow: light-dark(
-    oklch(from var(--accent-color) calc(l * 2) calc(c * 0.1) h / 0.5),
+    oklch(from var(--accent-color) calc(l * 1.85) calc(c * 0.5) h),
     oklch(from var(--accent-color) calc(l * 0.2) calc(c * 0.01) h / 0.25)
   );
   --button-box-shadow: light-dark(
-    oklch(from var(--accent-color) calc(l * 1.25) calc(c * 0.35) h),
+    oklch(from var(--accent-color) calc(l * 2) calc(c * 0.125) h),
     oklch(from var(--accent-color) calc(l * 0.75) calc(c * 0.5) h)
   );
   --d-selected: light-dark(

scss/misc.scss

@@ -73,7 +73,6 @@ input[type="color"]:focus,
   background-color: var(--background-color);
 }
 
-
 .fk-d-menu__trigger.topic-list-layout-trigger {
   display: none;
 }

scss/sidebar.scss

@@ -21,7 +21,6 @@
     padding: 0;
   }
   .sidebar-section-link {
-    font-size: var(--font-up-1);
     transition: none;
     border-radius: var(--d-border-radius);
   }

scss/topic-cards.scss

@@ -361,7 +361,7 @@ body.user-messages-page .topic-list-item {
 
 .topic-list-item {
   background: var(--d-content-background);
-  box-shadow: 0px 0px 26px 1px var(--topic-card-shadow);
+  box-shadow: 0px 0px 12px 1px var(--topic-card-shadow);
   &:hover {
     .discourse-no-touch & {
       border-color: var(--accent-color);

scss/topic.scss

@@ -47,12 +47,15 @@
 }
 
 #topic-title {
-  @include breakpoint(extra-large, $rule: min-width) {
+  @include breakpoint(medium, $rule: min-width) {
     z-index: z("composer", "content") - 1;
-    padding: var(--spacing-block-l) var(--spacing-inline-xl);
+    padding: var(--spacing-block-m) var(--spacing-inline-xl);
     margin-bottom: 0;
+    position: sticky;
     top: var(--header-offset);
     background: var(--d-content-background);
+    border-top-right-radius: var(--d-border-radius-large);
+    border-top-left-radius: var(--d-border-radius-large);
   }
 }
 .container.posts,