@canopy-iiif/app 0.10.12 → 0.10.14

package/ui/styles/components/_interstitial-hero.scss

@@ -10,10 +10,10 @@
   &--hero {
     --hero-height: 520px;
     --hero-bg-start: var(--color-gray-50);
-    --hero-bg-mid: var(--color-brand-100);
-    --hero-bg-end: var(--color-brand-200);
-    --hero-dot-bg: var(--color-brand-300);
-    --hero-dot-active-bg: var(--color-brand-700);
+    --hero-bg-mid: var(--color-accent-100);
+    --hero-bg-end: var(--color-accent-200);
+    --hero-dot-bg: var(--color-accent-300);
+    --hero-dot-active-bg: var(--color-accent-700);
 
     background: linear-gradient(
       173deg,
@@ -336,15 +336,15 @@
     &:focus-visible {
       background-color: color-mix(
         in srgb,
-        var(--color-brand-200) 55%,
+        var(--color-accent-200) 55%,
         transparent
       );
       border-color: color-mix(
         in srgb,
-        var(--color-brand-400) 70%,
+        var(--color-accent-400) 70%,
         transparent
       );
-      color: var(--color-brand-700);
+      color: var(--color-accent-700);
     }
   }
 

package/ui/styles/components/_sub-navigation.scss

@@ -32,7 +32,7 @@
 }
 
 .canopy-sub-navigation__link:hover {
-  color: var(--color-brand-default);
+  color: var(--color-accent-default);
 }
 
 .canopy-sub-navigation__link.is-label {
@@ -92,7 +92,7 @@
   background-color: rgba(255, 255, 255, 1);
   border-color: var(--color-gray-300);
   outline: none;
-  box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-brand-200) 60%, transparent);
+  box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-accent-200) 60%, transparent);
 }
 
 .canopy-layout__content-nav.is-collapsed .canopy-content-navigation {

package/ui/styles/components/header/_logo.scss

@@ -16,13 +16,13 @@
       display: block;
 
       circle.canopy-logo-backlight {
-        fill: var(--color-brand-900);
-        color: var(--color-brand-900);
+        fill: var(--color-accent-900);
+        color: var(--color-accent-900);
       }
 
       path.canopy-logo-overlay {
-        fill: var(--color-brand-default);
-        color: var(--color-brand-default);
+        fill: var(--color-accent-default);
+        color: var(--color-accent-default);
       }
     }
   }
@@ -30,13 +30,13 @@
   html.dark .canopy-logo {
     svg {
       circle.canopy-logo-backlight {
-        fill: var(--color-brand-200) !important;
-        color: var(--color-brand-200) !important;
+        fill: var(--color-accent-200) !important;
+        color: var(--color-accent-200) !important;
       }
 
       path.canopy-logo-overlay {
-        fill: var(--color-brand-500) !important;
-        color: var(--color-brand-500) !important;
+        fill: var(--color-accent-500) !important;
+        color: var(--color-accent-500) !important;
       }
     }
   }

package/ui/styles/components/header/_navbar.scss

@@ -16,7 +16,7 @@
 
   .canopy-nav-links a:hover,
   .canopy-nav-links a:focus-visible {
-    color: var(--color-brand-default);
+    color: var(--color-accent-default);
     outline: none;
   }
 

package/ui/styles/components/search/_filters.scss

@@ -98,8 +98,8 @@
 
     &:focus {
       outline: none;
-      border-color: var(--color-brand-500);
-      box-shadow: 0 0 0 1px var(--color-brand-500);
+      border-color: var(--color-accent-500);
+      box-shadow: 0 0 0 1px var(--color-accent-500);
     }
   }
 
@@ -142,8 +142,8 @@
     height: 1rem;
     border-radius: 0.375rem;
     border: 1px solid var(--color-gray-300);
-    color: var(--color-brand-500);
-    accent-color: var(--color-brand-500);
+    color: var(--color-accent-500);
+    accent-color: var(--color-accent-500);
   }
 
   .canopy-search-filters__facet-label {
@@ -199,13 +199,13 @@
 
   .canopy-search-filters__button--primary {
     border: none;
-    background: var(--color-brand-600);
+    background: var(--color-accent-600);
     color: var(--color-gray-50);
   }
 
   .canopy-search-filters__button--primary:hover,
   .canopy-search-filters__button--primary:focus-visible {
-    background: var(--color-brand-700);
+    background: var(--color-accent-700);
     outline: none;
   }
 

package/ui/styles/components/search/_form.scss

@@ -54,7 +54,7 @@
   }
 
   &:focus-within {
-    background-color: var(--color-brand-100);
+    background-color: var(--color-accent-100);
 
     input[data-canopy-search-form-input] {
       opacity: 1;
@@ -62,7 +62,7 @@
     }
 
     svg {
-      fill: var(--color-brand-default);
+      fill: var(--color-accent-default);
     }
   }
 
@@ -86,19 +86,19 @@
     background-color var(--duration-fast) var(--easing-standard);
 
   &:focus-within {
-    border-color: var(--color-brand-500);
+    border-color: var(--color-accent-500);
     box-shadow:
-      0 0 0 2px color-mix(in srgb, var(--color-brand-500) 45%, transparent),
+      0 0 0 2px color-mix(in srgb, var(--color-accent-500) 45%, transparent),
       var(--shadow-sm);
 
     .canopy-search-form__icon {
-      color: var(--color-brand-500);
+      color: var(--color-accent-500);
     }
   }
 
   &[data-has-value="1"] {
     .canopy-search-form__icon {
-      color: var(--color-brand-500);
+      color: var(--color-accent-500);
     }
   }
 }
@@ -129,14 +129,14 @@
 
   &:hover,
   &:focus-visible {
-    color: var(--color-brand-default);
+    color: var(--color-accent-default);
   }
 
   &:focus-visible {
     outline: none;
     box-shadow:
       0 0 0 2px var(--color-gray-100),
-      0 0 0 4px color-mix(in srgb, var(--color-brand-800) 65%, transparent);
+      0 0 0 4px color-mix(in srgb, var(--color-accent-800) 65%, transparent);
     border-radius: 999px;
   }
 }
@@ -167,7 +167,7 @@
   border-radius: 0.382rem;
   margin-right: 1px;
   border: 0;
-  background: var(--color-brand-default);
+  background: var(--color-accent-default);
   color: #fff;
   font-weight: 300;
   font-size: 1rem;
@@ -179,7 +179,7 @@
 
   &:hover,
   &:focus-visible {
-    background: var(--color-brand-800);
+    background: var(--color-accent-800);
     box-shadow: var(--shadow-md);
   }
 
@@ -187,7 +187,7 @@
     outline: none;
     box-shadow:
       0 0 0 2px var(--color-gray-100),
-      0 0 0 4px color-mix(in srgb, var(--color-brand-500) 65%, transparent);
+      0 0 0 4px color-mix(in srgb, var(--color-accent-500) 65%, transparent);
   }
 
   &:active {

package/ui/styles/components/search/_results.scss

@@ -26,8 +26,8 @@
 
     &.active,
     &:hover {
-      color: var(--color-brand-default);
-      background-color: var(--color-brand-100);
+      color: var(--color-accent-default);
+      background-color: var(--color-accent-100);
       border-radius: 0.382rem;
       font-weight: 400;
     }

package/ui/styles/index.css

@@ -1,73 +1,73 @@
 /* canopy-theme */
 @layer properties {
   :root {
-  --color-brand-50: #fdfdfe;
-  --color-brand-100: #edf2fe;
-  --color-brand-200: #e1e9ff;
-  --color-brand-300: #c1d0ff;
-  --color-brand-400: #abbdf9;
-  --color-brand-500: #8da4ef;
-  --color-brand-600: #3e63dd;
-  --color-brand-700: #3358d4;
-  --color-brand-800: #3a5bc7;
-  --color-brand-900: #172245;
-  --color-brand-default: #3358d4;
-  --color-gray-50: #fcfcfd;
-  --color-gray-100: #f0f0f3;
-  --color-gray-200: #e8e8ec;
-  --color-gray-300: #d9d9e0;
-  --color-gray-400: #cdced6;
-  --color-gray-500: #b9bbc6;
-  --color-gray-600: #8b8d98;
-  --color-gray-700: #80838d;
-  --color-gray-800: #60646c;
-  --color-gray-900: #111316;
-  --color-gray-default: #111316;
-  --color-gray-muted: #8b8d98;
-  --colors-accent: #3358d4 !important;
-  --colors-accentAlt: #3a5bc7 !important;
-  --colors-accentMuted: #abbdf9 !important;
-  --colors-primary: #111316 !important;
-  --colors-primaryAlt: #111316 !important;
-  --colors-primaryMuted: #111316 !important;
-  --colors-secondary: #fcfcfd !important;
-  --colors-secondaryAlt: #fcfcfd !important;
-  --colors-secondaryMuted: #fcfcfd !important;
+  --color-accent-50: #fdfdfc;
+  --color-accent-100: #f2f0e7;
+  --color-accent-200: #eae6db;
+  --color-accent-300: #d8d0bf;
+  --color-accent-400: #cbc0aa;
+  --color-accent-500: #b9a88d;
+  --color-accent-600: #978365;
+  --color-accent-700: #8c7a5e;
+  --color-accent-800: #71624b;
+  --color-accent-900: #2c2820;
+  --color-accent-default: #8c7a5e;
+  --color-gray-50: #fdfdfc;
+  --color-gray-100: #f1f0ef;
+  --color-gray-200: #e9e8e6;
+  --color-gray-300: #dad9d6;
+  --color-gray-400: #cfceca;
+  --color-gray-500: #bcbbb5;
+  --color-gray-600: #8d8d86;
+  --color-gray-700: #82827c;
+  --color-gray-800: #63635e;
+  --color-gray-900: #141311;
+  --color-gray-default: #141311;
+  --color-gray-muted: #8d8d86;
+  --colors-accent: #8c7a5e !important;
+  --colors-accentAlt: #71624b !important;
+  --colors-accentMuted: #cbc0aa !important;
+  --colors-primary: #141311 !important;
+  --colors-primaryAlt: #141311 !important;
+  --colors-primaryMuted: #141311 !important;
+  --colors-secondary: #fdfdfc !important;
+  --colors-secondaryAlt: #fdfdfc !important;
+  --colors-secondaryMuted: #fdfdfc !important;
   color-scheme: light;
   }
   :host {
-  --color-brand-50: #fdfdfe;
-  --color-brand-100: #edf2fe;
-  --color-brand-200: #e1e9ff;
-  --color-brand-300: #c1d0ff;
-  --color-brand-400: #abbdf9;
-  --color-brand-500: #8da4ef;
-  --color-brand-600: #3e63dd;
-  --color-brand-700: #3358d4;
-  --color-brand-800: #3a5bc7;
-  --color-brand-900: #172245;
-  --color-brand-default: #3358d4;
-  --color-gray-50: #fcfcfd;
-  --color-gray-100: #f0f0f3;
-  --color-gray-200: #e8e8ec;
-  --color-gray-300: #d9d9e0;
-  --color-gray-400: #cdced6;
-  --color-gray-500: #b9bbc6;
-  --color-gray-600: #8b8d98;
-  --color-gray-700: #80838d;
-  --color-gray-800: #60646c;
-  --color-gray-900: #111316;
-  --color-gray-default: #111316;
-  --color-gray-muted: #8b8d98;
-  --colors-accent: #3358d4 !important;
-  --colors-accentAlt: #3a5bc7 !important;
-  --colors-accentMuted: #abbdf9 !important;
-  --colors-primary: #111316 !important;
-  --colors-primaryAlt: #111316 !important;
-  --colors-primaryMuted: #111316 !important;
-  --colors-secondary: #fcfcfd !important;
-  --colors-secondaryAlt: #fcfcfd !important;
-  --colors-secondaryMuted: #fcfcfd !important;
+  --color-accent-50: #fdfdfc;
+  --color-accent-100: #f2f0e7;
+  --color-accent-200: #eae6db;
+  --color-accent-300: #d8d0bf;
+  --color-accent-400: #cbc0aa;
+  --color-accent-500: #b9a88d;
+  --color-accent-600: #978365;
+  --color-accent-700: #8c7a5e;
+  --color-accent-800: #71624b;
+  --color-accent-900: #2c2820;
+  --color-accent-default: #8c7a5e;
+  --color-gray-50: #fdfdfc;
+  --color-gray-100: #f1f0ef;
+  --color-gray-200: #e9e8e6;
+  --color-gray-300: #dad9d6;
+  --color-gray-400: #cfceca;
+  --color-gray-500: #bcbbb5;
+  --color-gray-600: #8d8d86;
+  --color-gray-700: #82827c;
+  --color-gray-800: #63635e;
+  --color-gray-900: #141311;
+  --color-gray-default: #141311;
+  --color-gray-muted: #8d8d86;
+  --colors-accent: #8c7a5e !important;
+  --colors-accentAlt: #71624b !important;
+  --colors-accentMuted: #cbc0aa !important;
+  --colors-primary: #141311 !important;
+  --colors-primaryAlt: #141311 !important;
+  --colors-primaryMuted: #141311 !important;
+  --colors-secondary: #fdfdfc !important;
+  --colors-secondaryAlt: #fdfdfc !important;
+  --colors-secondaryMuted: #fdfdfc !important;
   color-scheme: light;
   }
 }
@@ -97,7 +97,7 @@
   }
   a {
     text-decoration: none;
-    color: var(--color-brand-default);
+    color: var(--color-accent-default);
   }
   a:hover {
     text-decoration: underline;
@@ -109,7 +109,7 @@
     font-family: inherit;
   }
   ::selection {
-    background-color: var(--color-brand-200);
+    background-color: var(--color-accent-200);
   }
 }
 @layer base {
@@ -191,12 +191,12 @@
     transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
   }
   .canopy-button--primary {
-    background-color: var(--color-brand-default);
+    background-color: var(--color-accent-default);
     color: var(--color-gray-50);
     box-shadow: 0 18px 32px -22px rgba(15, 23, 42, 0.55);
   }
   .canopy-button--primary:hover, .canopy-button--primary:focus-visible {
-    background-color: var(--color-brand-800);
+    background-color: var(--color-accent-800);
     color: var(--color-gray-50);
   }
   .canopy-button--secondary {
@@ -205,9 +205,9 @@
     background-color: var(--color-gray-50);
   }
   .canopy-button--secondary:hover, .canopy-button--secondary:focus-visible {
-    border-color: color-mix(in srgb, var(--color-brand-400) 65%, transparent);
-    background-color: color-mix(in srgb, var(--color-brand-200) 25%, transparent);
-    color: var(--color-brand-700);
+    border-color: color-mix(in srgb, var(--color-accent-400) 65%, transparent);
+    background-color: color-mix(in srgb, var(--color-accent-200) 25%, transparent);
+    color: var(--color-accent-700);
   }
   .canopy-button-group {
     display: flex;
@@ -237,7 +237,7 @@
     padding: clamp(2rem, 4vw, 3rem) clamp(1.25rem, 4vw, 4rem);
     margin: 2rem 0;
     border-radius: 1.25rem;
-    background: linear-gradient(173deg, transparent 0%, var(--color-brand-200) 100%);
+    background: linear-gradient(173deg, transparent 0%, var(--color-accent-200) 100%);
   }
   .canopy-button-group--interstitial .canopy-button-group__actions {
     justify-content: center;
@@ -305,7 +305,7 @@
   display: block;
 }
 .canopy-card:hover, .canopy-annotation-card:hover, .canopy-card:focus, .canopy-annotation-card:focus {
-  color: var(--color-brand-default);
+  color: var(--color-accent-default);
   box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.07), 0 1px 2px 0 rgba(0, 0, 0, 0.07);
 }
 
@@ -314,7 +314,7 @@
 }
 .canopy-annotation-card mark {
   color: var(--color-gray-900);
-  background-color: var(--color-brand-300);
+  background-color: var(--color-accent-300);
   padding: 0.1rem 0.25rem;
   border-radius: 0.25rem;
   margin: 0 -0.25rem;
@@ -552,20 +552,20 @@
     display: block;
   }
   .canopy-logo svg circle.canopy-logo-backlight {
-    fill: var(--color-brand-900);
-    color: var(--color-brand-900);
+    fill: var(--color-accent-900);
+    color: var(--color-accent-900);
   }
   .canopy-logo svg path.canopy-logo-overlay {
-    fill: var(--color-brand-default);
-    color: var(--color-brand-default);
+    fill: var(--color-accent-default);
+    color: var(--color-accent-default);
   }
   html.dark .canopy-logo svg circle.canopy-logo-backlight {
-    fill: var(--color-brand-200) !important;
-    color: var(--color-brand-200) !important;
+    fill: var(--color-accent-200) !important;
+    color: var(--color-accent-200) !important;
   }
   html.dark .canopy-logo svg path.canopy-logo-overlay {
-    fill: var(--color-brand-500) !important;
-    color: var(--color-brand-500) !important;
+    fill: var(--color-accent-500) !important;
+    color: var(--color-accent-500) !important;
   }
 }
 @layer components {
@@ -584,7 +584,7 @@
   }
   .canopy-nav-links a:hover,
   .canopy-nav-links a:focus-visible {
-    color: var(--color-brand-default);
+    color: var(--color-accent-default);
     outline: none;
   }
   .canopy-modal--nav .canopy-modal__panel {
@@ -762,10 +762,10 @@
 .canopy-interstitial--hero {
   --hero-height: 520px;
   --hero-bg-start: var(--color-gray-50);
-  --hero-bg-mid: var(--color-brand-100);
-  --hero-bg-end: var(--color-brand-200);
-  --hero-dot-bg: var(--color-brand-300);
-  --hero-dot-active-bg: var(--color-brand-700);
+  --hero-bg-mid: var(--color-accent-100);
+  --hero-bg-end: var(--color-accent-200);
+  --hero-dot-bg: var(--color-accent-300);
+  --hero-dot-active-bg: var(--color-accent-700);
   background: linear-gradient(173deg, var(--hero-bg-start) 5rem, var(--hero-bg-mid) 61.8%, var(--hero-bg-end) 100%);
   min-height: var(--hero-height);
 }
@@ -1024,9 +1024,9 @@
   transform: rotate(-45deg);
 }
 .canopy-interstitial__nav-btn:hover, .canopy-interstitial__nav-btn:focus-visible {
-  background-color: color-mix(in srgb, var(--color-brand-200) 55%, transparent);
-  border-color: color-mix(in srgb, var(--color-brand-400) 70%, transparent);
-  color: var(--color-brand-700);
+  background-color: color-mix(in srgb, var(--color-accent-200) 55%, transparent);
+  border-color: color-mix(in srgb, var(--color-accent-400) 70%, transparent);
+  color: var(--color-accent-700);
 }
 .canopy-interstitial__pagination {
   position: absolute;
@@ -1147,14 +1147,14 @@
   transition: opacity var(--duration-fast) ease;
 }
 .canopy-search-form-shell:focus-within {
-  background-color: var(--color-brand-100);
+  background-color: var(--color-accent-100);
 }
 .canopy-search-form-shell:focus-within input[data-canopy-search-form-input] {
   opacity: 1;
   caret-color: var(--color-gray-900);
 }
 .canopy-search-form-shell:focus-within svg {
-  fill: var(--color-brand-default);
+  fill: var(--color-accent-default);
 }
 .canopy-search-form-shell[data-has-value="1"] input[data-canopy-search-form-input] {
   opacity: 1;
@@ -1172,14 +1172,14 @@
   transition: border-color var(--duration-fast) var(--easing-standard), box-shadow var(--duration-fast) var(--easing-standard), background-color var(--duration-fast) var(--easing-standard);
 }
 .canopy-search-form:focus-within {
-  border-color: var(--color-brand-500);
-  box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-brand-500) 45%, transparent), var(--shadow-sm);
+  border-color: var(--color-accent-500);
+  box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-accent-500) 45%, transparent), var(--shadow-sm);
 }
 .canopy-search-form:focus-within .canopy-search-form__icon {
-  color: var(--color-brand-500);
+  color: var(--color-accent-500);
 }
 .canopy-search-form[data-has-value="1"] .canopy-search-form__icon {
-  color: var(--color-brand-500);
+  color: var(--color-accent-500);
 }
 
 .canopy-search-form__label {
@@ -1207,11 +1207,11 @@
   transition: color var(--duration-fast) var(--easing-standard);
 }
 .canopy-search-form__clear:hover, .canopy-search-form__clear:focus-visible {
-  color: var(--color-brand-default);
+  color: var(--color-accent-default);
 }
 .canopy-search-form__clear:focus-visible {
   outline: none;
-  box-shadow: 0 0 0 2px var(--color-gray-100), 0 0 0 4px color-mix(in srgb, var(--color-brand-800) 65%, transparent);
+  box-shadow: 0 0 0 2px var(--color-gray-100), 0 0 0 4px color-mix(in srgb, var(--color-accent-800) 65%, transparent);
   border-radius: 999px;
 }
 
@@ -1238,7 +1238,7 @@
   border-radius: 0.382rem;
   margin-right: 1px;
   border: 0;
-  background: var(--color-brand-default);
+  background: var(--color-accent-default);
   color: #fff;
   font-weight: 300;
   font-size: 1rem;
@@ -1247,12 +1247,12 @@
   cursor: pointer;
 }
 .canopy-search-form__submit:hover, .canopy-search-form__submit:focus-visible {
-  background: var(--color-brand-800);
+  background: var(--color-accent-800);
   box-shadow: var(--shadow-md);
 }
 .canopy-search-form__submit:focus-visible {
   outline: none;
-  box-shadow: 0 0 0 2px var(--color-gray-100), 0 0 0 4px color-mix(in srgb, var(--color-brand-500) 65%, transparent);
+  box-shadow: 0 0 0 2px var(--color-gray-100), 0 0 0 4px color-mix(in srgb, var(--color-accent-500) 65%, transparent);
 }
 .canopy-search-form__submit:active {
   transform: translateY(1px);
@@ -1291,8 +1291,8 @@
   transition: all 0.2s ease-in-out;
 }
 .canopy-search-tabs button.active, .canopy-search-tabs button:hover {
-  color: var(--color-brand-default);
-  background-color: var(--color-brand-100);
+  color: var(--color-accent-default);
+  background-color: var(--color-accent-100);
   border-radius: 0.382rem;
   font-weight: 400;
 }
@@ -1483,8 +1483,8 @@
   }
   .canopy-search-filters__quick-input:focus {
     outline: none;
-    border-color: var(--color-brand-500);
-    box-shadow: 0 0 0 1px var(--color-brand-500);
+    border-color: var(--color-accent-500);
+    box-shadow: 0 0 0 1px var(--color-accent-500);
   }
   .canopy-search-filters__quick-clear {
     border-radius: 0.375rem;
@@ -1520,8 +1520,8 @@
     height: 1rem;
     border-radius: 0.375rem;
     border: 1px solid var(--color-gray-300);
-    color: var(--color-brand-500);
-    accent-color: var(--color-brand-500);
+    color: var(--color-accent-500);
+    accent-color: var(--color-accent-500);
   }
   .canopy-search-filters__facet-label {
     display: flex;
@@ -1568,12 +1568,12 @@
   }
   .canopy-search-filters__button--primary {
     border: none;
-    background: var(--color-brand-600);
+    background: var(--color-accent-600);
     color: var(--color-gray-50);
   }
   .canopy-search-filters__button--primary:hover,
   .canopy-search-filters__button--primary:focus-visible {
-    background: var(--color-brand-700);
+    background: var(--color-accent-700);
     outline: none;
   }
   @media (max-width: 48rem) {
@@ -1628,7 +1628,7 @@
 }
 
 .canopy-sub-navigation__link:hover {
-  color: var(--color-brand-default);
+  color: var(--color-accent-default);
 }
 
 .canopy-sub-navigation__link.is-label {
@@ -1684,7 +1684,7 @@
   background-color: rgb(255, 255, 255);
   border-color: var(--color-gray-300);
   outline: none;
-  box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-brand-200) 60%, transparent);
+  box-shadow: 0 0 0 2px color-mix(in srgb, var(--color-accent-200) 60%, transparent);
 }
 
 .canopy-layout__content-nav.is-collapsed .canopy-content-navigation {
@@ -1712,5 +1712,4 @@
 
 /**
  * Define source files for utility classes
- */
-@source "../dist";
+ */

package/ui/styles/index.scss

@@ -7,4 +7,4 @@
 /**
  * Define source files for utility classes
  */
-@source "../dist";
+// @source "../dist";

package/ui/tailwind-config.js

@@ -130,6 +130,8 @@ function defineCanopyTailwindConfig(metaUrlOrOptions, maybeOptions) {
     config.theme = mergeTheme(config.theme, theme);
   }
 
+  config.theme = mergeTheme(config.theme, {colors: {}});
+
   return config;
 }