@design.estate/dees-catalog 3.55.1 → 3.55.2

package/dist_watch/bundle.js

@@ -196410,9 +196410,8 @@ __publicField(_DeesSimpleAppDash, "styles", [
   themeDefaultStyles,
   cssManager.defaultStyles,
   i`
-      /* TODO: Migrate hardcoded values to --dees-* CSS variables */
       :host {
-        color: ${cssManager.bdTheme("hsl(0 0% 15%)", "hsl(0 0% 90%)")};
+        color: var(--dees-color-text-primary);
         user-select: none;
         display: block;
         overflow: hidden;
@@ -196436,8 +196435,8 @@ __publicField(_DeesSimpleAppDash, "styles", [
         left: 0px;
         height: calc(100% - 24px);
         width: 240px;
-        background: ${cssManager.bdTheme("#fafafa", "#0a0a0a")};
-        border-right: 1px solid ${cssManager.bdTheme("#e5e5e5", "#1a1a1a")};
+        background: var(--dees-color-bg-secondary);
+        border-right: 1px solid var(--dees-color-border-default);
         font-size: 13px;
         font-family: 'Geist Sans', sans-serif;
         z-index: 2;
@@ -196448,7 +196447,7 @@ __publicField(_DeesSimpleAppDash, "styles", [
 
       .sidebar-header {
         padding: 20px 16px;
-        border-bottom: 1px solid ${cssManager.bdTheme("#e5e5e5", "#1a1a1a")};
+        border-bottom: 1px solid var(--dees-color-border-default);
         display: flex;
         align-items: center;
         gap: 12px;
@@ -196461,7 +196460,7 @@ __publicField(_DeesSimpleAppDash, "styles", [
         width: 36px;
         height: 36px;
         border-radius: 10px;
-        background: ${cssManager.bdTheme("#f0f0f0", "#1a1a1a")};
+        background: var(--dees-color-bg-tertiary);
         box-shadow: ${cssManager.bdTheme(
     "0 1px 2px rgb(0 0 0 / 0.05)",
     "0 1px 2px rgb(0 0 0 / 0.2)"
@@ -196470,13 +196469,13 @@ __publicField(_DeesSimpleAppDash, "styles", [
 
       .header-icon-wrapper dees-icon {
         font-size: 18px;
-        color: ${cssManager.bdTheme("#0a0a0a", "#fafafa")};
+        color: var(--dees-color-text-primary);
       }
 
       .appName {
         font-size: 15px;
         font-weight: 600;
-        color: ${cssManager.bdTheme("#0a0a0a", "#fafafa")};
+        color: var(--dees-color-text-primary);
         white-space: nowrap;
         overflow: hidden;
         text-overflow: ellipsis;
@@ -196487,7 +196486,7 @@ __publicField(_DeesSimpleAppDash, "styles", [
         overflow-y: auto;
         padding: 12px 8px;
         scrollbar-width: thin;
-        scrollbar-color: ${cssManager.bdTheme("hsl(0 0% 85%)", "hsl(0 0% 20%)")} transparent;
+        scrollbar-color: var(--dees-color-scrollbar-thumb) transparent;
       }
 
       .viewTabs-container::-webkit-scrollbar {
@@ -196499,12 +196498,12 @@ __publicField(_DeesSimpleAppDash, "styles", [
       }
 
       .viewTabs-container::-webkit-scrollbar-thumb {
-        background: ${cssManager.bdTheme("hsl(0 0% 85%)", "hsl(0 0% 20%)")};
+        background: var(--dees-color-scrollbar-thumb);
         border-radius: 3px;
       }
 
       .viewTabs-container::-webkit-scrollbar-thumb:hover {
-        background: ${cssManager.bdTheme("hsl(0 0% 75%)", "hsl(0 0% 30%)")};
+        background: var(--dees-color-scrollbar-thumb-hover);
       }
 
       .section-label {
@@ -196512,7 +196511,7 @@ __publicField(_DeesSimpleAppDash, "styles", [
         font-weight: 600;
         text-transform: uppercase;
         letter-spacing: 0.05em;
-        color: ${cssManager.bdTheme("#737373", "#737373")};
+        color: var(--dees-color-text-muted);
         padding: 8px 12px 8px;
         margin-bottom: 4px;
       }
@@ -196530,25 +196529,25 @@ __publicField(_DeesSimpleAppDash, "styles", [
         padding: 10px 12px;
         cursor: default;
         transition: all 0.15s ease;
-        color: ${cssManager.bdTheme("#525252", "#a3a3a3")};
+        color: var(--dees-color-text-secondary);
         user-select: none;
         position: relative;
         border-radius: 8px;
       }
 
       .viewTab:hover {
-        background: ${cssManager.bdTheme("rgba(0, 0, 0, 0.04)", "rgba(255, 255, 255, 0.06)")};
+        background: var(--dees-color-hover);
         color: ${cssManager.bdTheme("#262626", "#e5e5e5")};
       }
 
       .viewTab:active {
-        background: ${cssManager.bdTheme("rgba(0, 0, 0, 0.06)", "rgba(255, 255, 255, 0.08)")};
+        background: var(--dees-color-active);
         transform: scale(0.99);
       }
 
       .viewTab.selected {
-        background: ${cssManager.bdTheme("rgba(0, 0, 0, 0.06)", "rgba(255, 255, 255, 0.08)")};
-        color: ${cssManager.bdTheme("#0a0a0a", "#fafafa")};
+        background: var(--dees-color-active);
+        color: var(--dees-color-text-primary);
         font-weight: 500;
       }
 
@@ -196560,7 +196559,7 @@ __publicField(_DeesSimpleAppDash, "styles", [
         bottom: 8px;
         width: 3px;
         border-radius: 0 2px 2px 0;
-        background: ${cssManager.bdTheme("#0a0a0a", "#fafafa")};
+        background: var(--dees-color-text-primary);
       }
 
       .viewTab dees-icon {
@@ -196575,7 +196574,7 @@ __publicField(_DeesSimpleAppDash, "styles", [
 
       .viewTab.selected dees-icon {
         opacity: 1;
-        color: ${cssManager.bdTheme("#0a0a0a", "#fafafa")};
+        color: var(--dees-color-text-primary);
       }
 
       .viewTab span {
@@ -196587,7 +196586,7 @@ __publicField(_DeesSimpleAppDash, "styles", [
 
       .appActions {
         padding: 12px 8px;
-        border-top: 1px solid ${cssManager.bdTheme("#e5e5e5", "#1a1a1a")};
+        border-top: 1px solid var(--dees-color-border-default);
       }
 
       .action {
@@ -196598,7 +196597,7 @@ __publicField(_DeesSimpleAppDash, "styles", [
         border-radius: 8px;
         cursor: default;
         transition: all 0.15s ease;
-        color: ${cssManager.bdTheme("#525252", "#a3a3a3")};
+        color: var(--dees-color-text-secondary);
       }
 
       .action:hover {
@@ -196626,7 +196625,7 @@ __publicField(_DeesSimpleAppDash, "styles", [
         bottom: 24px;
         width: calc(100% - 240px);
         overflow: auto;
-        background: ${cssManager.bdTheme("#fafafa", "#0a0a0a")};
+        background: var(--dees-color-bg-secondary);
         overscroll-behavior: contain;
       }
 
@@ -196666,14 +196665,14 @@ __publicField(_DeesSimpleAppDash, "styles", [
       }
 
       .controlbar {
-        color: ${cssManager.bdTheme("hsl(0 0% 40%)", "hsl(0 0% 60%)")};
+        color: var(--dees-color-text-muted);
         position: absolute;
         bottom: 0px;
         left: 0px;
         width: 100%;
         height: 24px;
-        background: ${cssManager.bdTheme("hsl(0 0% 94%)", "hsl(0 0% 6%)")};
-        border-top: 1px solid ${cssManager.bdTheme("hsl(0 0% 85%)", "hsl(0 0% 15%)")};
+        background: var(--dees-color-bg-tertiary);
+        border-top: 1px solid var(--dees-color-border-default);
         z-index: 11;
         display: flex;
         justify-content: flex-end;
@@ -196692,9 +196691,9 @@ __publicField(_DeesSimpleAppDash, "styles", [
         height: 100%;
         white-space: nowrap;
         cursor: default;
-        color: ${cssManager.bdTheme("hsl(0 0% 40%)", "hsl(0 0% 60%)")};
+        color: var(--dees-color-text-muted);
         transition: all 0.15s ease;
-        border-left: 1px solid ${cssManager.bdTheme("hsl(0 0% 80%)", "hsl(0 0% 20%)")};
+        border-left: 1px solid var(--dees-color-border-strong);
 
       }
 
@@ -196703,8 +196702,8 @@ __publicField(_DeesSimpleAppDash, "styles", [
       }
 
       .control:hover {
-        background: ${cssManager.bdTheme("hsl(0 0% 88%)", "hsl(0 0% 12%)")};
-        color: ${cssManager.bdTheme("hsl(0 0% 20%)", "hsl(0 0% 80%)")};
+        background: var(--dees-color-hover);
+        color: var(--dees-color-text-primary);
       }
 
       .control dees-icon {
@@ -196739,7 +196738,7 @@ __publicField(_DeesSimpleAppDash, "styles", [
         font-size: 13px;
         font-family: 'Geist Sans', sans-serif;
         font-weight: 500;
-        border-bottom: 1px solid ${cssManager.bdTheme("hsl(0 0% 91%)", "hsl(0 0% 13%)")};
+        border-bottom: 1px solid var(--dees-color-border-default);
         animation: bannerSlideDown 0.25s cubic-bezier(0.4, 0, 0.2, 1) forwards;
       }
 
@@ -197002,9 +197001,8 @@ __publicField(_DeesSimpleLogin, "styles", [
   themeDefaultStyles,
   cssManager.defaultStyles,
   i`
-      /* TODO: Migrate hardcoded values to --dees-* CSS variables */
       :host {
-        color: ${cssManager.bdTheme("hsl(0 0% 3.9%)", "hsl(0 0% 98%)")};
+        color: var(--dees-color-text-primary);
         user-select: none;
         display: block;
         width: 100%;
@@ -197021,7 +197019,7 @@ __publicField(_DeesSimpleLogin, "styles", [
         height: 100%;
         top: 0;
         left: 0;
-        background: ${cssManager.bdTheme("hsl(0 0% 100%)", "hsl(0 0% 3.9%)")};
+        background: var(--dees-color-bg-primary);
       }
 
       .slotContainer {
@@ -197054,17 +197052,17 @@ __publicField(_DeesSimpleLogin, "styles", [
         font-size: 24px;
         font-weight: 600;
         letter-spacing: -0.025em;
-        color: ${cssManager.bdTheme("hsl(0 0% 9%)", "hsl(0 0% 98%)")};
+        color: var(--dees-color-text-primary);
       }
 
       .subheader {
         font-size: 14px;
-        color: ${cssManager.bdTheme("hsl(0 0% 45.1%)", "hsl(0 0% 63.9%)")};
+        color: var(--dees-color-text-muted);
       }
 
       .login-card {
-        background: ${cssManager.bdTheme("hsl(0 0% 100%)", "hsl(0 0% 9%)")};
-        border: 1px solid ${cssManager.bdTheme("hsl(0 0% 89.8%)", "hsl(0 0% 14.9%)")};
+        background: var(--dees-color-bg-primary);
+        border: 1px solid var(--dees-color-border-default);
         border-radius: 8px;
         padding: 24px;
       }