@tarragon-ui/styles 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/fonts/Inter-Black.woff2 +0 -0
- package/dist/fonts/Inter-BlackItalic.woff2 +0 -0
- package/dist/fonts/Inter-Bold.woff2 +0 -0
- package/dist/fonts/Inter-BoldItalic.woff2 +0 -0
- package/dist/fonts/Inter-ExtraBold.woff2 +0 -0
- package/dist/fonts/Inter-ExtraBoldItalic.woff2 +0 -0
- package/dist/fonts/Inter-ExtraLight.woff2 +0 -0
- package/dist/fonts/Inter-ExtraLightItalic.woff2 +0 -0
- package/dist/fonts/Inter-Italic.woff2 +0 -0
- package/dist/fonts/Inter-Light.woff2 +0 -0
- package/dist/fonts/Inter-LightItalic.woff2 +0 -0
- package/dist/fonts/Inter-Medium.woff2 +0 -0
- package/dist/fonts/Inter-MediumItalic.woff2 +0 -0
- package/dist/fonts/Inter-Regular.woff2 +0 -0
- package/dist/fonts/Inter-SemiBold.woff2 +0 -0
- package/dist/fonts/Inter-SemiBoldItalic.woff2 +0 -0
- package/dist/fonts/Inter-Thin.woff2 +0 -0
- package/dist/fonts/Inter-ThinItalic.woff2 +0 -0
- package/dist/fonts/InterDisplay-Black.woff2 +0 -0
- package/dist/fonts/InterDisplay-BlackItalic.woff2 +0 -0
- package/dist/fonts/InterDisplay-Bold.woff2 +0 -0
- package/dist/fonts/InterDisplay-BoldItalic.woff2 +0 -0
- package/dist/fonts/InterDisplay-ExtraBold.woff2 +0 -0
- package/dist/fonts/InterDisplay-ExtraBoldItalic.woff2 +0 -0
- package/dist/fonts/InterDisplay-ExtraLight.woff2 +0 -0
- package/dist/fonts/InterDisplay-ExtraLightItalic.woff2 +0 -0
- package/dist/fonts/InterDisplay-Italic.woff2 +0 -0
- package/dist/fonts/InterDisplay-Light.woff2 +0 -0
- package/dist/fonts/InterDisplay-LightItalic.woff2 +0 -0
- package/dist/fonts/InterDisplay-Medium.woff2 +0 -0
- package/dist/fonts/InterDisplay-MediumItalic.woff2 +0 -0
- package/dist/fonts/InterDisplay-Regular.woff2 +0 -0
- package/dist/fonts/InterDisplay-SemiBold.woff2 +0 -0
- package/dist/fonts/InterDisplay-SemiBoldItalic.woff2 +0 -0
- package/dist/fonts/InterDisplay-Thin.woff2 +0 -0
- package/dist/fonts/InterDisplay-ThinItalic.woff2 +0 -0
- package/dist/main.min.css +1 -0
- package/package.json +44 -0
- package/readme.md +3 -0
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@layer tarragon-ui;@layer tarragon-ui.normalize, tarragon-ui.theme, tarragon-ui.layout, tarragon-ui.components, tarragon-ui.utilities;@font-face{font-display:swap;font-family:Inter;font-style:normal;font-weight:100;src:url(fonts/Inter-Thin.woff2) format("woff2")}@font-face{font-display:swap;font-family:Inter;font-style:italic;font-weight:100;src:url(fonts/Inter-ThinItalic.woff2) format("woff2")}@font-face{font-display:swap;font-family:Inter;font-style:normal;font-weight:200;src:url(fonts/Inter-ExtraLight.woff2) format("woff2")}@font-face{font-display:swap;font-family:Inter;font-style:italic;font-weight:200;src:url(fonts/Inter-ExtraLightItalic.woff2) format("woff2")}@font-face{font-display:swap;font-family:Inter;font-style:normal;font-weight:300;src:url(fonts/Inter-Light.woff2) format("woff2")}@font-face{font-display:swap;font-family:Inter;font-style:italic;font-weight:300;src:url(fonts/Inter-LightItalic.woff2) format("woff2")}@font-face{font-display:swap;font-family:Inter;font-style:normal;font-weight:400;src:url(fonts/Inter-Regular.woff2) format("woff2")}@font-face{font-display:swap;font-family:Inter;font-style:italic;font-weight:400;src:url(fonts/Inter-Italic.woff2) format("woff2")}@font-face{font-display:swap;font-family:Inter;font-style:normal;font-weight:500;src:url(fonts/Inter-Medium.woff2) format("woff2")}@font-face{font-display:swap;font-family:Inter;font-style:italic;font-weight:500;src:url(fonts/Inter-MediumItalic.woff2) format("woff2")}@font-face{font-display:swap;font-family:Inter;font-style:normal;font-weight:600;src:url(fonts/Inter-SemiBold.woff2) format("woff2")}@font-face{font-display:swap;font-family:Inter;font-style:italic;font-weight:600;src:url(fonts/Inter-SemiBoldItalic.woff2) format("woff2")}@font-face{font-display:swap;font-family:Inter;font-style:normal;font-weight:700;src:url(fonts/Inter-Bold.woff2) format("woff2")}@font-face{font-display:swap;font-family:Inter;font-style:italic;font-weight:700;src:url(fonts/Inter-BoldItalic.woff2) format("woff2")}@font-face{font-display:swap;font-family:Inter;font-style:normal;font-weight:800;src:url(fonts/Inter-ExtraBold.woff2) format("woff2")}@font-face{font-display:swap;font-family:Inter;font-style:italic;font-weight:800;src:url(fonts/Inter-ExtraBoldItalic.woff2) format("woff2")}@font-face{font-display:swap;font-family:Inter;font-style:normal;font-weight:900;src:url(fonts/Inter-Black.woff2) format("woff2")}@font-face{font-display:swap;font-family:Inter;font-style:italic;font-weight:900;src:url(fonts/Inter-BlackItalic.woff2) format("woff2")}@font-face{font-display:swap;font-family:InterDisplay;font-style:normal;font-weight:100;src:url(fonts/InterDisplay-Thin.woff2) format("woff2")}@font-face{font-display:swap;font-family:InterDisplay;font-style:italic;font-weight:100;src:url(fonts/InterDisplay-ThinItalic.woff2) format("woff2")}@font-face{font-display:swap;font-family:InterDisplay;font-style:normal;font-weight:200;src:url(fonts/InterDisplay-ExtraLight.woff2) format("woff2")}@font-face{font-display:swap;font-family:InterDisplay;font-style:italic;font-weight:200;src:url(fonts/InterDisplay-ExtraLightItalic.woff2) format("woff2")}@font-face{font-display:swap;font-family:InterDisplay;font-style:normal;font-weight:300;src:url(fonts/InterDisplay-Light.woff2) format("woff2")}@font-face{font-display:swap;font-family:InterDisplay;font-style:italic;font-weight:300;src:url(fonts/InterDisplay-LightItalic.woff2) format("woff2")}@font-face{font-display:swap;font-family:InterDisplay;font-style:normal;font-weight:400;src:url(fonts/InterDisplay-Regular.woff2) format("woff2")}@font-face{font-display:swap;font-family:InterDisplay;font-style:italic;font-weight:400;src:url(fonts/InterDisplay-Italic.woff2) format("woff2")}@font-face{font-display:swap;font-family:InterDisplay;font-style:normal;font-weight:500;src:url(fonts/InterDisplay-Medium.woff2) format("woff2")}@font-face{font-display:swap;font-family:InterDisplay;font-style:italic;font-weight:500;src:url(fonts/InterDisplay-MediumItalic.woff2) format("woff2")}@font-face{font-display:swap;font-family:InterDisplay;font-style:normal;font-weight:600;src:url(fonts/InterDisplay-SemiBold.woff2) format("woff2")}@font-face{font-display:swap;font-family:InterDisplay;font-style:italic;font-weight:600;src:url(fonts/InterDisplay-SemiBoldItalic.woff2) format("woff2")}@font-face{font-display:swap;font-family:InterDisplay;font-style:normal;font-weight:700;src:url(fonts/InterDisplay-Bold.woff2) format("woff2")}@font-face{font-display:swap;font-family:InterDisplay;font-style:italic;font-weight:700;src:url(fonts/InterDisplay-BoldItalic.woff2) format("woff2")}@font-face{font-display:swap;font-family:InterDisplay;font-style:normal;font-weight:800;src:url(fonts/InterDisplay-ExtraBold.woff2) format("woff2")}@font-face{font-display:swap;font-family:InterDisplay;font-style:italic;font-weight:800;src:url(fonts/InterDisplay-ExtraBoldItalic.woff2) format("woff2")}@font-face{font-display:swap;font-family:InterDisplay;font-style:normal;font-weight:900;src:url(fonts/InterDisplay-Black.woff2) format("woff2")}@font-face{font-display:swap;font-family:InterDisplay;font-style:italic;font-weight:900;src:url(fonts/InterDisplay-BlackItalic.woff2) format("woff2")}@font-feature-values InterVariable{@character-variant{alt-1:1;alt-3:9;alt-double-s:7;compact-lc-f:12;compact-lc-t:13;cv01:1;cv02:2;cv03:3;cv04:4;cv05:5;cv06:6;cv07:7;cv08:8;cv09:9;cv10:10;cv11:11;cv12:12;cv13:13;lc-l-with-tail:5;open-4:2;open-6:3;open-9:4;simplified-u:6;single-story-a:11;uc-g-with-spur:10;uc-i-with-serif:8}@styleset{circled-characters:5;disambiguation:2;disambiguation-except-zero:4;open-digits:1;round-quotes-and-commas:3;square-punctuation:7;square-quotes:8;squared-characters:6;ss01:1;ss02:2;ss03:3;ss04:4;ss05:5;ss06:6;ss07:7;ss08:8}}@font-feature-values Inter{@character-variant{alt-1:1;alt-3:9;alt-double-s:7;compact-lc-f:12;compact-lc-t:13;cv01:1;cv02:2;cv03:3;cv04:4;cv05:5;cv06:6;cv07:7;cv08:8;cv09:9;cv10:10;cv11:11;cv12:12;cv13:13;lc-l-with-tail:5;open-4:2;open-6:3;open-9:4;simplified-u:6;single-story-a:11;uc-g-with-spur:10;uc-i-with-serif:8}@styleset{circled-characters:5;disambiguation:2;disambiguation-except-zero:4;open-digits:1;round-quotes-and-commas:3;square-punctuation:7;square-quotes:8;squared-characters:6;ss01:1;ss02:2;ss03:3;ss04:4;ss05:5;ss06:6;ss07:7;ss08:8}}@font-feature-values InterDisplay{@character-variant{alt-1:1;alt-3:9;alt-double-s:7;compact-lc-f:12;compact-lc-t:13;cv01:1;cv02:2;cv03:3;cv04:4;cv05:5;cv06:6;cv07:7;cv08:8;cv09:9;cv10:10;cv11:11;cv12:12;cv13:13;lc-l-with-tail:5;open-4:2;open-6:3;open-9:4;simplified-u:6;single-story-a:11;uc-g-with-spur:10;uc-i-with-serif:8}@styleset{circled-characters:5;disambiguation:2;disambiguation-except-zero:4;open-digits:1;round-quotes-and-commas:3;square-punctuation:7;square-quotes:8;squared-characters:6;ss01:1;ss02:2;ss03:3;ss04:4;ss05:5;ss06:6;ss07:7;ss08:8}}@layer tarragon-ui.theme{.dark,:root{--color-text:oklch(96.19% 0 0deg);--color-text-muted:oklch(76.517% 0 0deg);--color-background-lightness:14%;--color-background-lightness--raised:calc(var(--color-background-lightness) + 7%);--color-background-lightness--interactive:calc(var(--color-background-lightness) + 11%);--color-background-chroma:0.006;--color-background-hue:286deg;--color-background-base:oklch(var(--color-background-lightness) var(--color-background-chroma) var(--color-background-hue));--color-on-background-base:var(--color-text);--color-background-raised:oklch(var(--color-background-lightness--raised) var(--color-background-chroma) var(--color-background-hue));--color-on-background-raised:var(--color-text);--color-background-interactive:oklch(var(--color-background-lightness--interactive) var(--color-background-chroma) var(--color-background-hue));--color-on-background-interactive:var(--color-text);--color-primary-lightness:70%;--color-primary-lightness--hover:calc(var(--color-primary-lightness) - 10%);--color-primary-chroma:0.17;--color-primary-hue:162deg;--color-primary:oklch(var(--color-primary-lightness) var(--color-primary-chroma) var(--color-primary-hue));--color-primary-hover:oklch(var(--color-primary-lightness--hover) var(--color-primary-chroma) var(--color-primary-hue));--color-on-primary:oklch(var(--color-background-lightness) var(--color-background-chroma) var(--color-background-hue));--color-muted-lightness:calc(var(--color-background-lightness) + 13%);--color-muted:oklch(var(--color-muted-lightness) var(--color-background-chroma) var(--color-background-hue));--color-on-muted:oklch(70.5% 0.015 286deg);--color-accent-lightness:97%;--color-accent-lightness--hover:calc(var(--color-accent-lightness) - 17%);--color-accent-chroma:0.001;--color-accent-hue:286deg;--color-accent:oklch(var(--color-accent-lightness) var(--color-accent-chroma) var(--color-accent-hue));--color-accent-hover:oklch(var(--color-accent-lightness--hover) var(--color-accent-chroma) var(--color-accent-hue));--color-on-accent:oklch(var(--color-background-lightness--raised) var(--color-background-chroma) var(--color-background-hue));--color-info-lightness:70%;--color-info-chroma:0.088;--color-info-hue:256deg;--color-info:oklch(var(--color-info-lightness) var(--color-info-chroma) var(--color-info-hue));--color-success-lightness:70%;--color-success-chroma:0.17;--color-success-hue:162deg;--color-success:oklch(var(--color-success-lightness) var(--color-success-chroma) var(--color-success-hue));--color-danger-lightness:60%;--color-danger-lightness--hover:calc(var(--color-danger-lightness) - 10%);--color-danger-chroma:0.191;--color-danger-hue:22deg;--color-danger:oklch(var(--color-danger-lightness) var(--color-danger-chroma) var(--color-danger-hue));--color-danger-hover:oklch(var(--color-danger-lightness--hover) var(--color-danger-chroma) var(--color-danger-hue));--color-on-danger:oklch(var(--color-background-lightness) var(--color-background-chroma) var(--color-background-hue));--color-warning-lightness:80%;--color-warning-chroma:0.1781;--color-warning-hue:92deg;--color-warning:oklch(var(--color-warning-lightness) var(--color-warning-chroma) var(--color-warning-hue));--color-border-lightness:50%;--color-border-lightness--hover:70%;--color-border-chroma:0;--color-border-hue:0deg;--color-border:oklch(var(--color-border-lightness) var(--color-border-chroma) var(--color-border-hue));--color-border-hover:oklch(var(--color-border-lightness--hover) var(--color-border-chroma) var(--color-border-hue));--outline-default:var(--size-3xs) solid var(--color-primary);--outline-offset:var(--size-3xs);--shadow-default:0px 2px 2px oklch(100% 0 0deg/7%),0px 2px 2px oklch(100% 0 0deg/15%);--shadow-danger:0px 2px 2px oklch(var(--color-danger-lightness) var(--color-danger-chroma) var(--color-danger-hue)/15%),0px 4px 4px oklch(var(--color-danger-lightness) var(--color-danger-chroma) var(--color-danger-hue)/30%);--color-backdrop:oklch(var(--color-background-lightness) var(--color-background-chroma) var(--color-background-hue)/50%)}.light{--color-text:oklch(15.789% 0 0deg);--color-text-muted:oklch(41.839% 0 0deg);--color-background-lightness:97%;--color-background-lightness--raised:calc(var(--color-background-lightness) - 2%);--color-background-lightness--interactive:calc(var(--color-background-lightness) - 5%);--color-background-chroma:0.004;--color-background-hue:56.38deg;--color-background-base:oklch(var(--color-background-lightness) var(--color-background-chroma) var(--color-background-hue));--color-on-background-base:var(--color-text);--color-background-raised:oklch(var(--color-background-lightness--raised) var(--color-background-chroma) var(--color-background-hue));--color-on-background-raised:var(--color-text);--color-background-interactive:oklch(var(--color-background-lightness--interactive) var(--color-background-chroma) var(--color-background-hue));--color-on-background-interactive:var(--color-text);--color-primary-lightness:50%;--color-primary-lightness--hover:calc(var(--color-primary-lightness) + 10%);--color-primary-chroma:0.17;--color-primary-hue:162deg;--color-primary:oklch(var(--color-primary-lightness) var(--color-primary-chroma) var(--color-primary-hue));--color-primary-hover:oklch(var(--color-primary-lightness--hover) var(--color-primary-chroma) var(--color-primary-hue));--color-on-primary:oklch(100% 0 0deg);--color-muted-lightness:calc(var(--color-background-lightness) - 15%);--color-muted:oklch(var(--color-muted-lightness) var(--color-background-chroma) var(--color-background-hue));--color-on-muted:oklch(15.789% 0 0deg);--color-accent-lightness:27%;--color-accent-lightness--hover:calc(var(--color-accent-lightness) + 13%);--color-accent-chroma:0.006;--color-accent-hue:286deg;--color-accent:oklch(var(--color-accent-lightness) var(--color-accent-chroma) var(--color-accent-hue));--color-accent-hover:oklch(var(--color-accent-lightness--hover) var(--color-accent-chroma) var(--color-accent-hue));--color-on-accent:oklch(98.5% 0 0deg);--color-info-lightness:40%;--color-info-chroma:0.088;--color-info-hue:256deg;--color-info:oklch(var(--color-info-lightness) var(--color-info-chroma) var(--color-info-hue));--color-success-lightness:50%;--color-success-chroma:0.17;--color-success-hue:162deg;--color-success:oklch(var(--color-success-lightness) var(--color-success-chroma) var(--color-success-hue));--color-danger-lightness:50%;--color-danger-lightness--hover:calc(var(--color-danger-lightness) + 5%);--color-danger-chroma:0.245;--color-danger-hue:27deg;--color-danger:oklch(var(--color-danger-lightness) var(--color-danger-chroma) var(--color-danger-hue));--color-danger-hover:oklch(var(--color-danger-lightness--hover) var(--color-danger-chroma) var(--color-danger-hue));--color-on-danger:oklch(96.19% 0 0deg);--color-warning-lightness:55%;--color-warning-chroma:0.2;--color-warning-hue:92deg;--color-warning:oklch(var(--color-warning-lightness) var(--color-warning-chroma) var(--color-warning-hue));--color-border-lightness:80%;--color-border-lightness--hover:60%;--color-border-chroma:0.004;--color-border-hue:286deg;--color-border:oklch(var(--color-border-lightness) var(--color-border-chroma) var(--color-border-hue));--color-border-hover:oklch(var(--color-border-lightness--hover) var(--color-border-chroma) var(--color-border-hue));--shadow-default:0px 2px 2px oklch(0% 0 0deg/7%),0px 4px 4px oklch(0% 0 0deg/15%);--shadow-danger:0px 2px 2px oklch(var(--color-danger-lightness) var(--color-danger-chroma) var(--color-danger-hue)/15%),0px 4px 4px oklch(var(--color-danger-lightness) var(--color-danger-chroma) var(--color-danger-hue)/30%);--color-backdrop:oklch(var(--color-background-lightness) var(--color-background-chroma) var(--color-background-hue)/50%)}:root{--radius-default:0.375rem;--radius-full:999px;--size-3xs:0.125rem;--size-2xs:0.25rem;--size-xs:0.5rem;--size-sm:0.75rem;--size-md:1rem;--size-lg:1.25rem;--size-xl:1.5rem;--size-2xl:1.75rem;--size-3xl:2rem;--size-4xl:4rem;--size-5xl:8rem;--size-6xl:16rem;--size-7xl:32rem;--size-8xl:64rem;--minimum-clickable-size:44px;--maximum-input-width:var(--size-7xl);--breakpoint-mobile:640px;--breakpoint-tablet:1024px;--breakpoint-desktop:1440px;--font-body:"Inter",-apple-system,blinkmacsystemfont,"Segoe UI",oxygen-sans,ubuntu,cantarell,"Helvetica Neue",sans-serif;--font-heading:"InterDisplay",-apple-system,blinkmacsystemfont,"Segoe UI",oxygen-sans,ubuntu,cantarell,"Helvetica Neue",sans-serif;--line-height-xs:1.2;--line-height-sm:1.4;--line-height-md:1.5;--text-xs:0.75rem;--text-sm:0.875rem;--text-md:1rem;--text-lg:1.125rem;--text-xl:1.25rem;--text-2xl:1.5rem;--text-3xl:1.875rem;--text-4xl:2.25rem;--text-5xl:3rem;--text-6xl:3.75rem;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700}}@layer tarragon-ui.theme{}@layer tarragon-ui.theme{}@layer tarragon-ui.theme{}@layer tarragon-ui.normalize{*,:after,:before{box-sizing:border-box}*{margin:0}body{-webkit-font-smoothing:antialiased;line-height:1.5}canvas,img,picture,svg,video{display:block;max-width:100%}button,input,select,textarea{font:inherit}h1,h2,h3,h4,h5,h6,p{overflow-wrap:break-word}p{text-wrap:pretty}h1,h2,h3,h4,h5,h6{text-wrap:balance}@media (prefers-reduced-motion:no-preference){html{interpolate-size:allow-keywords}}}@layer tarragon-ui.normalize{@media (prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}}@layer tarragon-ui.normalize{body{background-color:var(--color-background-base);color:var(--color-text-muted);display:grid;font-family:var(--font-body);font-weight:var(--font-weight-normal);grid-template-rows:auto 1fr auto;line-height:var(--line-height-md);min-height:100dvh}body:has(dialog[open]){overflow:hidden}}@layer tarragon-ui.layout{.container{display:flex;flex:1 1 auto;flex-direction:column;gap:var(--size-3xl);margin-inline:auto;max-width:var(--size-8xl);padding:var(--size-xl);width:100%;@media (width > 640px){padding:var(--size-3xl)}}}@layer tarragon-ui.layout{[class*=grid]{display:flex;flex-direction:column;gap:var(--size-md);grid-template-columns:repeat(12,1fr);grid-template-rows:1fr}.grid{display:grid}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr));grid-template-rows:auto}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:auto}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:auto}.grid-auto{--size-width:20ch;grid-template-columns:repeat(auto-fit,minmax(min(var(--size-width),100%),1fr));grid-template-rows:auto}.o-cell-one-fourth{grid-column:auto/span 3}.o-cell-three-fourths{grid-column:auto/span 9}.o-cell-one-third{grid-column:auto/span 4}.o-cell-two-thirds{grid-column:auto/span 8}.o-cell-half{grid-column:auto/span 6}.o-cell-full{grid-column:auto/span 12}@media (width > 640px){.grid-tablet{display:grid}.grid-tablet-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-tablet-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-tablet-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-tablet-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.o-cell-tablet-one-fourth{grid-column:auto/span 3}.o-cell-tablet-three-fourths{grid-column:auto/span 9}.o-cell-tablet-one-third{grid-column:auto/span 4}.o-cell-tablet-two-thirds{grid-column:auto/span 8}.o-cell-tablet-half{grid-column:auto/span 6}.o-cell-tablet-full{grid-column:auto/span 12}}@media (width > 1024px){.grid-desktop{display:grid}.grid-desktop-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-desktop-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-desktop-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-desktop-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.o-cell-desktop-one-fourth{grid-column:auto/span 3}.o-cell-desktop-three-fourths{grid-column:auto/span 9}.o-cell-desktop-one-third{grid-column:auto/span 4}.o-cell-desktop-two-thirds{grid-column:auto/span 8}.o-cell-desktop-half{grid-column:auto/span 6}.o-cell-desktop-full{grid-column:auto/span 12}}}@layer tarragon-ui.layout{.center{justify-content:center}.center,.cluster{align-items:center;display:flex}.cluster{flex-flow:row wrap;gap:var(--size-md)}}@layer tarragon-ui.layout{}@layer tarragon-ui.utilities{@media (width > 640px){.cluster-tablet{align-items:center;display:flex;flex-flow:row wrap;flex-wrap:wrap;gap:var(--size-md)}}@media (width > 1024px){.cluster-desktop{align-items:center;display:flex;flex-flow:row wrap;flex-wrap:wrap;gap:var(--size-md)}}}@layer tarragon-ui.layout{.split{align-items:center;flex-wrap:wrap;justify-content:space-between}.split,.stack{display:flex;gap:var(--size-md)}.stack{flex-direction:column}}@layer tarragon-ui.layout{}@layer tarragon-ui.utilities{@media (width > 640px){.stack-tablet{display:flex;flex-direction:column;gap:var(--size-md)}}@media (width > 1024px){.stack-desktop{display:flex;flex-direction:column;gap:var(--size-md)}}}@layer tarragon-ui.layout{.prose>:not(:first-child){margin-block-start:1em;&:where(h1,.h1,h2,.h2,h3,.h3,h4,.h4,h5,.h5,h6,.h6){margin-block-start:1.5em}}}@layer tarragon-ui.components{@scope (.accordion-group){:scope{align-items:stretch;border-radius:var(--radius-default);box-shadow:var(--shadow-default);display:flex;flex-direction:column;width:100%}details{border-bottom:1px solid var(--color-border);&:last-child,&:last-of-type{border-bottom:none}}summary{align-items:center;background-color:var(--color-background-interactive);color:var(--color-on-background-interactive);cursor:default;display:inline-flex;justify-content:space-between;list-style:none;min-height:var(--minimum-clickable-size);padding:var(--size-md);width:100%;&:hover{background-color:var(--color-muted)}&:focus-visible{background-color:var(--color-muted);outline:var(--outline-default);outline-offset:calc(var(--outline-offset)*-1)}}.accordion-content{background-color:var(--color-background-raised);color:var(--color-text-muted);padding:var(--size-md);padding-top:var(--size-xs)}details:open svg{transform:rotate(180deg)}details:first-of-type summary{border-top-left-radius:var(--radius-default);border-top-right-radius:var(--radius-default)}details:last-of-type:not(:open) summary{border-bottom-left-radius:var(--radius-default);border-bottom-right-radius:var(--radius-default)}details:last-of-type{border-bottom-left-radius:var(--radius-default);border-bottom-right-radius:var(--radius-default);overflow:hidden}details:only-of-type{box-shadow:var(--shadow-default)}}}@layer tarragon-ui.components{@scope (.alert){:scope{align-items:center;background-color:var(--color-background-raised);border:1px solid var(--color-info);border-radius:var(--radius-default);box-shadow:var(--shadow-default);color:var(--color-info);display:grid;font-size:var(--text-sm);gap:var(--size-xs);grid-template-columns:var(--size-md) 1fr;padding:var(--size-xs) var(--size-md);width:100%}:scope.alert-success{border-color:var(--color-success);color:var(--color-success)}:scope.alert-danger{border-color:var(--color-danger);box-shadow:var(--shadow-danger);color:var(--color-danger)}:scope.alert-warning{border-color:var(--color-warning);color:var(--color-warning)}:scope>svg{height:var(--size-md);width:var(--size-md)}a{color:inherit;&:focus-visible,&:hover{color:inherit}}.alert-title,h2{color:inherit;font-family:var(--font-heading);font-size:var(--text-lg);font-weight:var(--font-weight-semibold);grid-column-start:2;line-height:var(--line-height-md)}.alert-description,p,ul{font-size:var(--text-sm);grid-column-start:2}}}@layer tarragon-ui.components{.badge{align-items:center;background-color:var(--color-primary);border:1px solid transparent;border-radius:calc(var(--radius-default)*3);color:var(--color-on-primary);display:inline-flex;font-size:var(--text-xs);font-weight:var(--font-weight-medium);gap:var(--size-2xs);justify-content:center;overflow:hidden;padding:var(--size-2xs) var(--size-xs);white-space:nowrap;width:fit-content}.badge,.badge>svg{flex-shrink:0;pointer-events:none}.badge>svg{height:var(--size-xs);width:var(--size-xs)}.badge-accent{background-color:var(--color-accent);color:var(--color-on-accent)}.badge-danger{background-color:var(--color-danger);color:var(--color-on-danger)}.badge-outline{background-color:transparent;border-color:var(--color-border);color:var(--color-text)}}@layer tarragon-ui.components{.btn,button{align-items:center;background-color:var(--color-primary);border:none;border-radius:var(--radius-default);color:var(--color-on-primary);display:inline-flex;flex-shrink:0;font-size:var(--text-sm);font-weight:var(--font-weight-medium);gap:var(--size-xs);justify-content:center;min-height:var(--minimum-clickable-size);min-width:var(--minimum-clickable-size);padding:var(--size-xs) var(--size-md);text-decoration:none;transition:background-color .2s,box-shadow .2s,border-color .2s,color .2s;white-space:nowrap;&:focus-visible,&:hover{background-color:var(--color-primary-hover);box-shadow:var(--shadow-default);color:var(--color-on-primary)}&:focus-visible{outline:var(--outline-default);outline-offset:var(--outline-offset)}&.is-disabled,&:disabled{opacity:.5;pointer-events:none}& svg{flex-shrink:0;max-height:40px;max-width:100px;pointer-events:none}}.danger{background-color:var(--color-danger);color:var(--color-on-danger);&:focus-visible,&:hover{background-color:var(--color-danger-hover);box-shadow:var(--shadow-danger);color:var(--color-on-danger)}}.ghost{background-color:transparent;box-shadow:none;color:inherit;&:focus-visible,&:hover{background-color:var(--color-muted);color:inherit}}.link{background-color:transparent;box-shadow:none;color:inherit;cursor:pointer;&:focus-visible,&:hover{background-color:var(--color-muted);color:inherit;text-decoration:underline}}.outline{background-color:transparent;border:1px solid var(--color-border);color:var(--color-text);&:focus-visible,&:hover{background-color:var(--color-muted);color:var(--color-text)}}.accent{background-color:var(--color-accent);color:var(--color-on-accent);&:focus-visible,&:hover{background-color:var(--color-accent-hover);color:var(--color-on-accent)}}.btn[aria-current=page]:not(.primary){background-color:var(--color-background-interactive);color:var(--color-on-background-interactive)}.size-icon{height:var(--minimum-clickable-size);padding:var(--size-sm);width:var(--minimum-clickable-size)}@media (width > 640px){.size-button-tablet{height:unset;padding:var(--size-xs) var(--size-md);width:unset}}@media (width > 1024px){.size-button-desktop{height:unset;padding:var(--size-xs) var(--size-md);width:unset}}}@layer tarragon-ui.components{@scope (.breadcrumb){ul{flex-flow:row wrap;gap:0;list-style:none;min-height:min-content;padding:0;white-space:nowrap}li,ul{align-items:center;display:flex}li{font-size:var(--text-sm);font-weight:var(--font-weight-medium)}li:not(:first-of-type):before{background-color:#0000;border-right:1px solid;border-top:1px solid;content:"";display:block;height:.375rem;margin-left:.5rem;margin-right:.75rem;opacity:.4;rotate:45deg;width:.375rem}span{align-items:center;color:inherit;display:inline-flex;gap:var(--size-xs);text-decoration:none}[aria-current=page]{font-weight:var(--font-weight-bold)}}}@layer tarragon-ui.components{.card{--size-card-padding:var(--size-3xl);background:var(--color-background-raised);border:1px solid var(--color-border);border-radius:var(--radius-default);box-shadow:var(--shadow-default);display:flex;flex-direction:column;gap:var(--size-md);padding:var(--size-3xl)}.card-image{--size-card-image-margin:calc(var(--size-card-padding)*-1);border-bottom-left-radius:0;border-bottom-right-radius:0;margin-top:var(--size-card-image-margin);margin-inline:var(--size-card-image-margin)}.navigation-card{position:relative}.navigation-card-link{color:inherit;text-decoration:none;&:after{content:"";height:100%;left:0;position:absolute;top:0;width:100%}&:focus-visible,&:hover{text-decoration:underline}&:focus-visible{border-radius:var(--radius-default);outline:var(--outline-default);outline-offset:var(--outline-offset)}}}@layer tarragon-ui.components{input[type=checkbox]:not([role=switch]){appearance:none;background-color:var(--color-background-interactive);border:1px solid var(--color-border);border-radius:3px;display:inline-block;height:1rem;position:relative;transition:box-shadow .2s,border-color .2s,color .2s;vertical-align:middle;width:1rem;&:hover{box-shadow:var(--shadow-default)}&:focus-visible{outline:var(--outline-default);outline-offset:var(--outline-offset)}&:checked,&:indeterminate{background-color:var(--color-primary);border:1px solid var(--color-primary)}&:checked:before{border:solid var(--color-on-primary);border-width:0 2px 2px 0;content:"";height:.5rem;left:50%;position:absolute;top:50%;transform:translate(-50%,-60%) rotate(45deg);width:.3rem}&:indeterminate:before{border:solid var(--color-on-primary);border-width:0 0 2px;content:"";left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:.6rem}}}@layer tarragon-ui.components{dialog{background-color:var(--color-background-raised);border:1px solid var(--color-border);border-radius:var(--radius-default);box-shadow:var(--shadow-default);color:var(--color-on-background-raised);margin:auto;max-height:100vh;max-width:var(--size-7xl);overflow:hidden;padding:var(--size-3xl);width:90%}dialog[open]{display:flex;flex-direction:column;gap:var(--size-3xl)}dialog::backdrop{background-color:var(--color-backdrop)}dialog,dialog::backdrop{opacity:0;transition:display allow-discrete .3s,overlay allow-discrete .3s,opacity allow-discrete .3s}dialog[open],dialog[open]::backdrop{opacity:1}@starting-style{dialog[open],dialog[open]::backdrop{opacity:0}}dialog.full{width:100%}.drawer,dialog.full{border:none;border-radius:0;height:100%;max-width:100%}.drawer{background-color:var(--color-background-raised);border-left:1px solid var(--color-border);box-shadow:none;color:var(--color-on-background-raised);inset-inline:auto 0;margin:0;max-height:100%;overflow:hidden auto;padding:var(--size-3xl);width:clamp(var(--size-6xl),80%,var(--size-7xl))}}@layer tarragon-ui.components{}@layer tarragon-ui.components{@scope (.dropdown){:scope{position:relative;width:max-content}summary{cursor:default}ul{background-color:var(--color-background-raised);border:1px solid var(--color-border);border-radius:var(--radius-default);box-shadow:var(--shadow-default);color:var(--color-on-background-raised);list-style:none;margin-top:var(--size-2xs);max-height:calc(100dvh - var(--size-xs));max-width:calc(100vw - var(--size-xs));overflow-y:auto;padding:var(--size-xs);position:absolute;width:max-content;z-index:999}li{align-items:center;display:flex}a,button{align-items:center;background-color:inherit;border:none;border-radius:var(--radius-default);box-sizing:border-box;color:inherit;display:flex;font-size:var(--text-sm);font-weight:var(--font-weight-normal);gap:var(--size-md);justify-content:space-between;line-height:var(--line-height-md);min-height:var(--minimum-clickable-size);padding:var(--size-xs) var(--size-md);width:100%;&:hover{background-color:var(--color-muted);box-shadow:none;color:inherit}&:focus-visible{outline:var(--outline-default);outline-offset:var(--outline-offset)}}}}@layer tarragon-ui.components{figure{border-radius:var(--radius-default);box-shadow:var(--shadow-default);margin:0;overflow:hidden}.image{aspect-ratio:16/9;height:auto;max-width:100%;object-fit:cover;width:100%}figcaption{background-color:var(--color-background-raised);color:var(--color-on-background-raised);display:flex;flex-direction:column;font-size:var(--text-sm);gap:var(--size-xs);padding:var(--size-md)}.photo-by,figcaption{line-height:var(--line-height-md)}.photo-by{color:var(--color-text-muted);font-size:var(--text-xs);font-weight:var(--font-weight-bold)}form{display:flex;flex-direction:column;gap:var(--size-3xl)}.max-w-form,form{max-width:var(--maximum-input-width)}.action-footer{display:flex;flex-direction:row;gap:var(--size-xs);justify-content:end}.form-group{display:flex;flex-direction:column;gap:var(--size-2xs);width:100%}label{color:var(--color-text);font-size:var(--text-sm);font-weight:var(--font-weight-bold);line-height:var(--line-height-md)}}@layer tarragon-ui.components{label:has(input[type=checkbox]),label:has(input[type=radio]){align-items:center;color:var(--color-text);display:flex;font-size:var(--text-md);font-weight:var(--font-weight-medium);gap:var(--size-xs);min-height:var(--minimum-clickable-size);padding-block:var(--size-xs)}.form-message{align-items:center;color:var(--color-danger);display:inline-flex;font-size:var(--text-sm);gap:var(--size-2xs)}.form-message svg{width:var(--size-md)}fieldset{align-items:start;border:none;display:flex;flex-direction:column;gap:var(--size-3xl);margin:0;padding:0;padding-top:var(--size-xs);width:100%}.choice-group{gap:0}legend{color:var(--color-text-muted);font-size:var(--text-sm);font-weight:var(--font-weight-bold);line-height:var(--line-height-md);padding:0}tui-ajax-form{display:block;position:relative;.loading{border-radius:var(--radius-default);display:grid;height:100%;left:50%;place-content:center;position:absolute;top:50%;transform:translate(-50%,-50%);transition:all .3s ease-in;width:100%;z-index:5}&[is-submitting] form{visibility:hidden}&:not([is-submitting]) .loading{display:none}.alert{margin-top:var(--size-md)}}}@layer tarragon-ui.components{footer{align-items:start;background-color:var(--color-background-raised);display:flex;flex-direction:column;gap:var(--size-md);justify-content:space-between;padding:var(--size-3xl);@media (width > 640px){flex-direction:row;padding:var(--size-md) var(--size-5xl)}}.footer-about{display:flex;flex-direction:column;gap:var(--size-md);max-width:var(--size-7xl)}.footer-logo{height:var(--size-4xl);width:var(--size-5xl)}header{align-items:center;background-color:var(--color-background-base);border-bottom:1px solid var(--color-border);color:var(--color-on-background-base);display:flex;flex-direction:row;gap:var(--size-md);justify-content:space-between;padding:var(--size-2xl) var(--size-md)}.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6{color:var(--color-text);font-family:var(--font-heading)}.h1,.h2,h1,h2{font-weight:var(--font-weight-bold);line-height:var(--line-height-xs)}.h3,.h4,.h5,.h6,h3,h4,h5,h6{font-weight:var(--font-weight-semibold);line-height:var(--line-height-sm)}.h1,h1{font-size:clamp(var(--text-4xl),4vw + 1rem,var(--text-6xl))}.h2,h2{font-size:clamp(var(--text-3xl),2.5vw + 1rem,var(--text-4xl))}.h3,h3{font-size:clamp(var(--text-2xl),1.8vw + .75rem,var(--text-3xl))}.h4,h4{font-size:clamp(var(--text-xl),1.2vw + .5rem,var(--text-2xl))}.h5,h5{font-size:clamp(var(--text-lg),1vw + .25rem,var(--text-xl))}.h6,h6{font-size:clamp(var(--text-md),1vw + .1rem,var(--text-lg))}}@layer tarragon-ui.components{}@layer tarragon-ui.components{}@layer tarragon-ui.components{input[type=date],input[type=datetime-local],input[type=email],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=url]{background-color:var(--color-background-interactive);border:1px solid var(--color-border);border-radius:var(--radius-default);color:var(--color-text);font-size:var(--text-md);max-width:var(--maximum-input-width);min-height:var(--minimum-clickable-size);min-width:0;padding:var(--size-2xs) var(--size-md);transition:box-shadow .2s,border-color .2s,color .2s;width:100%;&::placeholder{color:var(--color-text-muted)}&::selection{background-color:var(--color-primary);color:var(--color-on-primary)}&:focus-visible{outline:var(--outline-default);outline-offset:var(--outline-offset)}&:disabled{opacity:.5;pointer-events:none}&:hover:not([disabled]){border-color:var(--color-border-hover);box-shadow:var(--shadow-default)}&[aria-invalid=true]{border-color:var(--color-danger)}&[aria-invalid=true]:focus-visible{outline:2px solid var(--color-danger);outline-offset:var(--outline-offset)}&[aria-invalid=true]:hover:not([disabled]){border-color:var(--color-danger-hover);box-shadow:var(--shadow-danger)}}}@layer tarragon-ui.components{a{color:var(--color-primary);cursor:pointer;text-decoration:underline;text-decoration-style:dashed;&:focus-visible,&:hover{color:var(--color-primary-hover);text-decoration-style:solid}&:focus-visible{border-radius:var(--radius-default);outline:var(--outline-default);outline-offset:var(--outline-offset)}}a[aria-current=page]:not(.primary){color:var(--color-accent);text-decoration:none;&:focus-visible,&:hover{color:var(--color-accent-hover);text-decoration:underline;text-decoration-style:solid}}.link-subtle{text-decoration:none;&:focus-visible,&:hover{color:var(--color-primary-hover);text-decoration:underline;text-decoration-style:solid}}}@layer tarragon-ui.components{ol,ul{font-size:var(--text-md);line-height:var(--line-height-md);margin:0;padding-inline:var(--size-3xl) 0;li:not(:first-child){margin-top:var(--size-xs)}}.list-unstyled{list-style:none;padding-inline:0;li:not(:first-child){margin:0}}}@layer tarragon-ui.components{progress{appearance:none;background-color:var(--color-background-interactive);border:1px solid var(--color-border);border-radius:var(--radius-default);color:var(--color-primary);height:.8rem;overflow:hidden;position:relative;width:100%;&::-moz-progress-bar{background-color:currentcolor;border-radius:var(--radius-default)}&::-webkit-progress-bar{background-color:transparent;border-radius:var(--radius-default)}&::-webkit-progress-value{background-color:var(--color-primary)}}}@layer tarragon-ui.components{input[type=radio]{align-items:center;appearance:none;background-clip:content-box;background-color:var(--color-background-interactive);border:1px solid var(--color-border);border-radius:var(--radius-full);box-sizing:border-box;display:flex;height:1.1rem;padding:0;place-content:center;position:relative;transition:box-shadow .2s,border-color .2s,color .2s;user-select:none;width:1.1rem;&:hover{box-shadow:var(--shadow-default)}&:checked{border-color:var(--color-primary)}&:checked,&:checked:before{background-color:var(--color-primary)}&:checked:before{border-radius:var(--radius-full);content:"";height:100%;position:absolute;width:100%}&:focus-visible{outline:var(--outline-default);outline-offset:var(--outline-offset)}}}@layer tarragon-ui.components{.search{align-items:center;display:flex;flex-direction:row;gap:0}.search input{border-bottom-right-radius:0;border-top-right-radius:0}.search button[type=submit]{border-bottom-left-radius:0;border-top-left-radius:0}}@layer tarragon-ui.components{select{appearance:none;background-color:var(--color-background-interactive);background-image:linear-gradient(45deg,transparent 50%,currentcolor 0),linear-gradient(135deg,currentcolor 50%,transparent 0);background-position:calc(100% - 20px) calc(1px + 50%),calc(100% - 16.1px) calc(1px + 50%);background-repeat:no-repeat;background-size:4px 4px,4px 4px;border:1px solid var(--color-border);border-radius:var(--radius-default);color:var(--color-text);font-size:var(--text-md);max-width:var(--maximum-input-width);min-height:var(--minimum-clickable-size);min-width:0;padding:var(--size-2xs) var(--size-xs);transition:box-shadow .2s,border-color .2s,color .2s;width:100%;&:focus-visible{outline:var(--outline-default);outline-offset:var(--outline-offset)}&:disabled{opacity:.5;pointer-events:none}&:hover:not([disabled]){border-color:var(--color-border-hover);box-shadow:var(--shadow-default)}&[aria-invalid=true]{border-color:var(--color-danger)}&[aria-invalid=true]:focus-visible{outline:2px solid var(--color-danger);outline-offset:var(--outline-offset)}&[aria-invalid=true]:hover:not([disabled]){border-color:var(--color-danger-hover);box-shadow:var(--shadow-danger)}}}@layer tarragon-ui.components{input[type=range]{--size-thumb-size:20px;--radius-thumb:var(--radius-full);--size-track-height:var(--size-md);--color-track-border:1px solid var(--color-border);--radius-track:var(--radius-default);--color-thumb:var(--color-primary);--color-track:var(--color-background-interactive);appearance:none;background:transparent;border-radius:var(--radius-default);width:100%}input[type=range]:focus-visible{outline:var(--outline-default);outline-offset:var(--outline-offset)}input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--color-thumb);border-color:var(--color-thumb);border-radius:var(--radius-thumb);height:var(--size-thumb-size);margin-top:-5px;width:var(--size-thumb-size)}input[type=range]::-moz-range-thumb{background:var(--color-thumb);border-color:var(--color-thumb);border-radius:var(--radius-thumb);height:var(--size-thumb-size);width:var(--size-thumb-size)}input[type=range]::-webkit-slider-runnable-track{background:var(--color-track);border:var(--color-track-border);border-radius:var(--radius-track);height:var(--size-track-height);width:100%}input[type=range]:focus::-webkit-slider-runnable-track{background:var(--color-track)}input[type=range]::-moz-range-track{background:var(--color-track);border:var(--color-track-border);border-radius:var(--radius-track);height:var(--size-track-height);width:100%}}@layer tarragon-ui.components{.separator{background-color:var(--color-border);height:1px;width:100%}.spinner{--color-spinner-outline:var(--color-primary);--font-size:var(--size-3xl);--size-border-width:max(var(--size-3xs),calc(var(--font-size)/12));aspect-ratio:1;display:grid;width:var(--font-size)}.spinner,.spinner:after,.spinner:before{border-radius:50%;grid-area:1/1/2/2}.spinner:after,.spinner:before{border:var(--size-border-width) solid var(--color-spinner-outline);content:""}.spinner:before{opacity:.3}.spinner:after{animation:spin-part-1 1.2s linear infinite alternate,spin-part-2 2.4s linear infinite}}@layer tarragon-ui.components{@keyframes spin-part-1{0%{clip-path:polygon(50% 50%,0 0,50% 0,50% 0,50% 0,50% 0,50% 0)}12.5%{clip-path:polygon(50% 50%,0 0,50% 0,100% 0,100% 0,100% 0,100% 0)}25%{clip-path:polygon(50% 50%,0 0,50% 0,100% 0,100% 100%,100% 100%,100% 100%)}50%{clip-path:polygon(50% 50%,0 0,50% 0,100% 0,100% 100%,50% 100%,0 100%)}62.5%{clip-path:polygon(50% 50%,100% 0,100% 0,100% 0,100% 100%,50% 100%,0 100%)}75%{clip-path:polygon(50% 50%,100% 100%,100% 100%,100% 100%,100% 100%,50% 100%,0 100%)}to{clip-path:polygon(50% 50%,50% 100%,50% 100%,50% 100%,50% 100%,50% 100%,0 100%)}}@keyframes spin-part-2{0%{transform:scaleY(1) rotate(0deg)}49.99%{transform:scaleY(1) rotate(135deg)}50%{transform:scaleY(-1) rotate(0deg)}to{transform:scaleY(-1) rotate(-135deg)}}}@layer tarragon-ui.utilities{@media (prefers-reduced-motion:reduce){.spinner{--color-spinner-outline:transparent;--size-border-width:transparent;aspect-ratio:auto;display:block}.spinner:after{content:attr(fallback) /""}}}@layer tarragon-ui.components{@scope (.steps){:scope{counter-reset:step;display:grid;gap:0;grid-auto-columns:1fr;grid-auto-flow:column;list-style:none;overflow:auto hidden;padding:0}:scope.steps-vertical{grid-auto-flow:row;grid-auto-rows:1fr}li{--color-step-bg:var(--color-muted);--color-step-fg:var(--color-on-muted);display:grid;grid-template-columns:auto;grid-template-rows:40px 1fr;min-width:4rem;place-items:center;text-align:center}li:not(:first-of-type):before{border:1px solid;color:var(--color-step-bg);content:"";height:.5rem;margin-inline-start:-100%;top:0;width:100%}li:after,li:not(:first-of-type):before{background-color:var(--color-step-bg);grid-column-start:1;grid-row-start:1}li:after{border:1px solid var(--color-step-bg);border-radius:var(--radius-full);color:var(--color-step-fg);content:counter(step);counter-increment:step;display:grid;height:2rem;place-items:center;place-self:center;position:relative;width:2rem;z-index:1}.step-complete:after,.step-complete:before{--color-step-bg:var(--color-primary);--color-step-fg:var(--color-on-primary)}:scope.steps-vertical li{display:grid;gap:.5rem;grid-template-columns:40px 1fr;grid-template-rows:auto;justify-items:start;min-height:4rem}:scope.steps-vertical li:before{height:100%;margin-inline-start:50%;translate:-50% -50%;width:.5rem}}}@layer tarragon-ui.components{@scope ([type="checkbox"][role="switch"]){:scope{--color-switch-fill:var(--color-primary);--size-switch-height:var(--size-xl);--size-switch-width:0.9;appearance:none;background-color:var(--color-background-interactive);border:1px solid var(--color-border);border-radius:var(--radius-full);display:inline-block;height:var(--size-switch-height);transition:box-shadow .2s ease-in-out,border-color .2s ease-in-out;width:calc(var(--size-switch-height)*(1 + var(--size-switch-width)));&:hover{box-shadow:var(--shadow-default)}&:focus-visible{outline:var(--outline-default);outline-offset:var(--outline-offset)}}:scope:after{aspect-ratio:1;background-color:var(--color-accent);border:max(2px,var(--size-3xs)) solid var(--color-background-interactive);border-radius:50%;content:"";display:block;height:100%;transition:translate .2s ease-in-out}:scope:checked{border-color:var(--color-switch-fill)}:scope:checked:after{background-color:var(--color-switch-fill);translate:calc(var(--size-switch-height)*var(--size-switch-width)) 0}}}@layer tarragon-ui.components{table{background-color:inherit;border-collapse:collapse;box-shadow:var(--shadow-default);color:var(--color-text);font-size:var(--text-md);line-height:var(--line-height-md);width:100%}caption{padding:var(--size-xs)}thead{background-color:var(--color-background-base);color:var(--color-on-background-base);font-weight:var(--font-weight-semibold);text-align:left}tbody{background-color:var(--color-background-interactive);color:var(--color-on-background-interactive)}tbody tr:hover{background-color:var(--color-muted)}td,th{border:1px solid var(--color-border);padding:var(--size-xs);text-align:left}tfoot{background-color:var(--color-background-base);color:var(--color-on-background-base)}p{font-size:var(--text-md)}blockquote,p{line-height:var(--line-height-md)}blockquote{border-left:.25rem solid var(--color-border);color:var(--color-text-muted);font-size:var(--text-lg);font-style:italic;margin-left:0;padding-left:1rem}code{background-color:var(--color-muted);border-radius:.25rem;color:var(--color-text);font-family:monospace;font-size:var(--text-sm);padding:.2em .4em}}@layer tarragon-ui.components{pre{background-color:var(--color-muted);border:1px solid var(--color-border);border-radius:var(--radius-default);box-shadow:var(--shadow-default);color:var(--color-text);display:block;font-size:var(--text-sm);line-height:var(--line-height-md);overflow:auto;padding:var(--size-xs);tab-size:2;white-space:pre-wrap;word-break:break-all;code{background-color:inherit;border-radius:0;color:inherit;font-size:inherit;padding:0}@media (width > 640px){tab-size:4}}}@layer tarragon-ui.components{textarea{background-color:var(--color-background-interactive);border:1px solid var(--color-border);border-radius:var(--radius-default);color:var(--color-text);font-size:var(--text-md);max-width:var(--maximum-input-width);min-height:var(--minimum-clickable-size);min-width:0;padding:var(--size-2xs) var(--size-md);resize:vertical;transition:box-shadow .2s,border-color .2s,color .2s;width:100%}textarea:hover{border-color:var(--color-border-hover);box-shadow:var(--shadow-default)}textarea:focus-visible{outline:var(--outline-default);outline-offset:var(--outline-offset)}textarea::placeholder{color:var(--color-text-muted)}textarea::selection{background-color:var(--color-primary);color:var(--color-on-primary)}textarea:disabled{opacity:.5;pointer-events:none}}@layer tarragon-ui.utilities{.animate-spin{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(1turn)}}}@layer tarragon-ui.utilities{.nowrap{flex-wrap:nowrap}.items-start{align-items:start}.gap-0{gap:0}.gap-3xs{gap:var(--size-3xs)}.gap-2xs{gap:var(--size-2xs)}.gap-xs{gap:var(--size-xs)}.gap-sm{gap:var(--size-sm)}.gap-md{gap:var(--size-md)}.gap-lg{gap:var(--size-lg)}.gap-xl{gap:var(--size-xl)}.gap-2xl{gap:var(--size-2xl)}.gap-3xl{gap:var(--size-3xl)}.gap-4xl{gap:var(--size-4xl)}.aspect-ratio-1x1{aspect-ratio:1/1}.aspect-ratio-3x2{aspect-ratio:3/2}.aspect-ratio-4x3{aspect-ratio:4/3}.aspect-ratio-16x9{aspect-ratio:16/9}.aspect-ratio-21x9{aspect-ratio:21/9}.margin-top-auto{margin-top:auto}.padding-0{padding:0}.padding-inline-start-0{padding-inline-start:0}.padding-inline-end-0{padding-inline-end:0}.padding-3xs{padding:var(--size-3xs)}.padding-inline-start-3xs{padding-inline-start:var(--size-3xs)}.padding-inline-end-3xs{padding-inline-end:var(--size-3xs)}.padding-2xs{padding:var(--size-2xs)}.padding-inline-start-2xs{padding-inline-start:var(--size-2xs)}.padding-inline-end-2xs{padding-inline-end:var(--size-2xs)}.padding-xs{padding:var(--size-xs)}.padding-inline-start-xs{padding-inline-start:var(--size-xs)}.padding-inline-end-xs{padding-inline-end:var(--size-xs)}.padding-sm{padding:var(--size-sm)}.padding-inline-start-sm{padding-inline-start:var(--size-sm)}.padding-inline-end-sm{padding-inline-end:var(--size-sm)}.padding-md{padding:var(--size-md)}.padding-inline-start-md{padding-inline-start:var(--size-md)}.padding-inline-end-md{padding-inline-end:var(--size-md)}.padding-lg{padding:var(--size-lg)}.padding-inline-start-lg{padding-inline-start:var(--size-lg)}.padding-inline-end-lg{padding-inline-end:var(--size-lg)}.padding-xl{padding:var(--size-xl)}.padding-inline-start-xl{padding-inline-start:var(--size-xl)}.padding-inline-end-xl{padding-inline-end:var(--size-xl)}.padding-2xl{padding:var(--size-2xl)}.padding-inline-start-2xl{padding-inline-start:var(--size-2xl)}.padding-inline-end-2xl{padding-inline-end:var(--size-2xl)}.padding-3xl{padding:var(--size-3xl)}.padding-inline-start-3xl{padding-inline-start:var(--size-3xl)}.padding-inline-end-3xl{padding-inline-end:var(--size-3xl)}.padding-4xl{padding:var(--size-4xl)}.padding-inline-start-4xl{padding-inline-start:var(--size-4xl)}.padding-inline-end-4xl{padding-inline-end:var(--size-4xl)}.h-full{height:100%}.w-full{width:100%}.overflow-auto{overflow:auto}.overflow-x-auto{overflow-x:auto}.text-2xl{font-size:var(--text-2xl)}.text-2xl,.text-xl{line-height:var(--line-height-sm)}.text-xl{font-size:var(--text-xl)}.text-lg{font-size:var(--text-lg)}.text-lg,.text-sm{line-height:var(--line-height-md)}.text-sm{font-size:var(--text-sm)}.text-xs{font-size:var(--text-xs);line-height:var(--line-height-md)}.text-muted{color:var(--color-text-muted)}.text-danger{color:var(--color-danger)}.text-center{text-align:center}.text-right{text-align:right}.text-capitalize{text-transform:capitalize}.text-uppercase{text-transform:uppercase}.text-lowercase{text-transform:lowercase}.text-decoration-none{text-decoration:none}.font-italic{font-style:italic}.font-medium{font-weight:var(--font-weight-medium)}.font-bold{font-weight:var(--font-weight-bold)}.text-lead{color:var(--color-text);font-size:var(--text-xl);font-weight:var(--font-weight-medium);line-height:var(--line-height-sm)}[data-state=not-ready],[hidden]{display:none}.visually-hidden{border:0;clip-path:inset(50%);height:1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}}@layer tarragon-ui.utilities{}@layer tarragon-ui.utilities{}@layer tarragon-ui.utilities{}@layer tarragon-ui.utilities{}@layer tarragon-ui.utilities{}@layer tarragon-ui.utilities{}@layer tarragon-ui.utilities{.visually-hidden-focusable{border:0;clip-path:inset(50%);height:1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px;&:active,&:focus{clip-path:inherit;height:auto;margin:0;overflow:visible;position:static;white-space:inherit;width:auto}}@media (width > 640px){.hide-above-tablet{display:none}}@media (width > 1024px){.hide-above-desktop{display:none}}@media (width <= calc(640px - 1px)){.show-above-tablet{display:none}.visually-hidden-below-tablet{border:0;clip-path:inset(50%);height:1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}}@media (width <= calc(1024px - 1px)){.show-above-desktop{display:none}.visually-hidden-below-desktop{border:0;clip-path:inset(50%);height:1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}}}
|
package/package.json
ADDED
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@tarragon-ui/styles",
|
|
3
|
+
"type": "module",
|
|
4
|
+
"version": "0.1.0",
|
|
5
|
+
"description": "Simple and opinionated CSS styles for Tarragon UI.",
|
|
6
|
+
"main": "dist/main.min.css",
|
|
7
|
+
"style": "dist/main.min.css",
|
|
8
|
+
"files": [
|
|
9
|
+
"dist"
|
|
10
|
+
],
|
|
11
|
+
"exports": {
|
|
12
|
+
".": {
|
|
13
|
+
"development": "./src/main.css",
|
|
14
|
+
"default": "./dist/main.min.css"
|
|
15
|
+
},
|
|
16
|
+
"./fonts/*": "./dist/fonts/*",
|
|
17
|
+
"./package.json": "./package.json"
|
|
18
|
+
},
|
|
19
|
+
"devDependencies": {
|
|
20
|
+
"cssnano": "^7.1.1",
|
|
21
|
+
"postcss": "^8.5.6",
|
|
22
|
+
"postcss-cli": "^11.0.1",
|
|
23
|
+
"postcss-import": "^16.1.1",
|
|
24
|
+
"stylelint": "^16.24.0",
|
|
25
|
+
"stylelint-config-clean-order": "^7.0.0",
|
|
26
|
+
"stylelint-config-standard": "^39.0.0"
|
|
27
|
+
},
|
|
28
|
+
"keywords": [
|
|
29
|
+
"tarragon",
|
|
30
|
+
"ui",
|
|
31
|
+
"css",
|
|
32
|
+
"styles",
|
|
33
|
+
"design-system"
|
|
34
|
+
],
|
|
35
|
+
"publishConfig": {
|
|
36
|
+
"access": "public"
|
|
37
|
+
},
|
|
38
|
+
"scripts": {
|
|
39
|
+
"build": "mkdir -p dist/fonts && cp -R src/fonts/*.woff2 dist/fonts && postcss src/main.css -o dist/main.min.css",
|
|
40
|
+
"clean": "rm -rf dist",
|
|
41
|
+
"prebuild": "pnpm clean",
|
|
42
|
+
"lint": "stylelint '**/*.css' --fix"
|
|
43
|
+
}
|
|
44
|
+
}
|
package/readme.md
ADDED