@m11g/library 0.0.1 → 0.0.3

package/src/assets/css/elements/buttons.css

@@ -1,23 +0,0 @@
-button {
-  padding: 0;
-  font-family: var(--font-family);
-  font-size: 1em;
-  color: currentcolor;
-  cursor: pointer;
-  background-color: transparent;
-  border: 0;
-
-  &:disabled {
-    cursor: not-allowed;
-  }
-}
-
-a {
-  color: var(--color-fg);
-  text-decoration-thickness: 1px;
-  text-underline-offset: 0.2em;
-
-  &:hover {
-    text-decoration-thickness: 2px;
-  }
-}

package/src/assets/css/elements/form.css

@@ -1,75 +0,0 @@
-form {
-  margin-block-end: var(--spacing-4);
-}
-
-fieldset {
-  padding: 0;
-  margin: 0 0 var(--spacing-2);
-  border: 0;
-}
-
-legend {
-  display: block;
-  padding: 0;
-  margin-block-end: var(--spacing-2);
-  font-family: var(--font-family-heading);
-  font-size: var(--font-size-h2);
-  font-weight: var(--font-weight-medium);
-  line-height: var(--line-height-heading);
-}
-
-label {
-  display: block;
-  margin-block-end: var(--spacing-1);
-}
-
-textarea {
-  line-height: var(--line-height);
-  resize: vertical;
-
-  @supports (field-sizing: content) {
-    min-block-size: 7lh;
-    resize: none;
-    field-sizing: content;
-  }
-}
-
-select,
-input[type="date"],
-input[type="email"],
-input[type="number"],
-input[type="password"],
-input[type="search"],
-input[type="tel"],
-input[type="text"],
-input[type="time"],
-input[type="url"],
-textarea {
-  display: block;
-  inline-size: 100%;
-  padding: var(--spacing-3) var(--spacing-2);
-  margin-block-end: var(--spacing-1);
-  font-family: var(--font-family);
-  font-size: var(--font-size-base);
-  line-height: var(--line-height-heading);
-  color: currentcolor;
-  background: transparent;
-  border: 2px solid var(--chakra-colors-gray-800);
-  border-radius: 0;
-  transition: border-color var(--transition);
-
-  &:focus-visible {
-    outline: none;
-    border-color: var(--color-primary-solid);
-  }
-}
-
-input[type="checkbox"],
-input[type="radio"],
-input[type="range"] {
-  accent-color: var(--color-primary-solid);
-}
-
-::placeholder {
-  color: var(--chakra-colors-gray-400);
-}

package/src/assets/css/elements/scaffolding.css

@@ -1,62 +0,0 @@
-:root {
-  color-scheme: light dark;
-  interpolate-size: allow-keywords;
-}
-
-::selection {
-  color: var(--color-primary-fg);
-  background: var(--color-primary-emphasized);
-}
-
-* {
-  &,
-  &::after,
-  &::before {
-    box-sizing: border-box;
-  }
-}
-
-:focus-visible {
-  outline: var(--color-primary-solid) solid 2px;
-  outline-offset: 2px;
-}
-
-html {
-  scroll-behavior: smooth;
-  text-size-adjust: 100%;
-}
-
-body {
-  margin: 0;
-  color: var(--color-fg);
-  background: var(--color-bg);
-}
-
-ul,
-ol {
-  padding-inline-start: 0;
-  margin: 0 0 var(--spacing-4);
-  list-style-position: outside;
-}
-
-figure {
-  display: block;
-  margin: 0;
-}
-
-img {
-  max-inline-size: 100%;
-  block-size: auto;
-}
-
-dl {
-  margin: 0 0 var(--spacing-4);
-}
-
-dt {
-  font-weight: var(--font-weight-bold);
-}
-
-dd {
-  margin: 0 0 var(--spacing-2);
-}

package/src/assets/css/elements/transition.css

@@ -1,4 +0,0 @@
-:root {
-  /* Prevent the default animation */
-  view-transition-name: none;
-}

package/src/assets/css/elements/typography.css

@@ -1,80 +0,0 @@
-html {
-  font-size: var(--font-size-base);
-  text-size-adjust: 100%;
-}
-
-body {
-  scrollbar-gutter: stable;
-  font-family: var(--font-family);
-  font-weight: var(--font-weight-normal);
-  line-height: var(--line-height);
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-
-p {
-  margin: 0 0 var(--spacing-4);
-  text-wrap: pretty;
-}
-
-h1,
-h2,
-h3 {
-  font-family: var(--font-family-heading);
-  font-weight: var(--font-weight-medium);
-  line-height: var(--line-height-heading);
-  text-wrap: balance;
-  overflow-wrap: break-word;
-}
-
-h1 {
-  margin: var(--spacing-1) 0 var(--spacing-4);
-  font-size: var(--font-size-h1);
-  font-weight: var(--font-weight-bold);
-}
-
-h2 {
-  margin: var(--spacing-1) 0 var(--spacing-2);
-  font-size: var(--font-size-h2);
-  font-weight: var(--font-weight-bold);
-}
-
-h3 {
-  margin: 0 0 var(--spacing-2);
-  font-size: var(--font-size-h3);
-  font-weight: var(--font-weight-bold);
-}
-
-pre,
-blockquote {
-  font-family: var(--font-family-heading);
-  font-weight: var(--font-weight-medium);
-  line-height: var(--line-height-heading);
-}
-
-pre {
-  padding: var(--spacing-4);
-  font-family: "Courier New", Courier, monospace;
-  line-height: var(--line-height-heading);
-  white-space: pre-wrap;
-  background-color: var(--color-panel-bg);
-  box-shadow: var(--shadow);
-}
-
-blockquote {
-  position: relative;
-  padding-inline-start: var(--spacing-6);
-  margin: var(--spacing-4) var(--spacing-4) var(--spacing-6);
-
-  &::before {
-    position: absolute;
-    inset-inline-start: 0;
-    display: inline-block;
-    font-size: var(--font-size-h1);
-    content: "“";
-  }
-}
-
-strong {
-  font-weight: var(--font-weight-bold);
-}

package/src/assets/css/media-queries/media-queries.css

@@ -1,3 +0,0 @@
-@custom-media --sm (width >= 640px);
-@custom-media --md (width >= 768px);
-@custom-media --lg (width >= 1024px);

package/src/assets/css/mixins/list-reset.css

@@ -1,5 +0,0 @@
-@define-mixin list-reset {
-  padding-inline-start: 0;
-  margin-block-end: 0;
-  list-style: none;
-}

package/src/assets/css/variables/_base.css

@@ -1,7 +0,0 @@
-@import "./colors.css";
-@import "./grid.css";
-@import "./spacings.css";
-@import "./typography.css";
-@import "./transitions.css";
-@import "./z-index.css";
-@import "./chakra.css";

package/src/assets/css/variables/chakra.css

@@ -1,160 +0,0 @@
-:root {
-  --chakra-aspect-ratios-square: 1 / 1;
-  --chakra-aspect-ratios-landscape: 4 / 3;
-  --chakra-aspect-ratios-portrait: 3 / 4;
-  --chakra-aspect-ratios-wide: 16 / 9;
-  --chakra-aspect-ratios-ultrawide: 18 / 5;
-  --chakra-aspect-ratios-golden: 1.618 / 1;
-  --chakra-animations-spin: spin 1s linear infinite;
-  --chakra-animations-ping: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite;
-  --chakra-animations-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
-  --chakra-animations-bounce: bounce 1s infinite;
-  --chakra-blurs-sm: 4px;
-  --chakra-blurs-md: 8px;
-  --chakra-blurs-lg: 12px;
-  --chakra-blurs-xl: 16px;
-  --chakra-blurs-2xl: 24px;
-  --chakra-blurs-3xl: 40px;
-  --chakra-blurs-4xl: 64px;
-  --chakra-borders-xs: 0.5px solid;
-  --chakra-borders-sm: 1px solid;
-  --chakra-borders-md: 2px solid;
-  --chakra-borders-lg: 4px solid;
-  --chakra-borders-xl: 8px solid;
-  --chakra-colors-transparent: transparent;
-  --chakra-colors-current: currentcolor;
-  --chakra-colors-black: oklch(14.1% 0.004 285.8deg);
-  --chakra-colors-white: oklch(100% 0 0deg);
-  --chakra-colors-white-alpha-50: oklch(100% 0 0deg / 4%);
-  --chakra-colors-white-alpha-100: oklch(100% 0 0deg / 6%);
-  --chakra-colors-white-alpha-200: oklch(100% 0 0deg / 8%);
-  --chakra-colors-white-alpha-300: oklch(100% 0 0deg / 16%);
-  --chakra-colors-white-alpha-400: oklch(100% 0 0deg / 24%);
-  --chakra-colors-white-alpha-500: oklch(100% 0 0deg / 36%);
-  --chakra-colors-white-alpha-600: oklch(100% 0 0deg / 48%);
-  --chakra-colors-white-alpha-700: oklch(100% 0 0deg / 64%);
-  --chakra-colors-white-alpha-800: oklch(100% 0 0deg / 80%);
-  --chakra-colors-white-alpha-900: oklch(100% 0 0deg / 92%);
-  --chakra-colors-white-alpha-950: oklch(100% 0 0deg / 95%);
-  --chakra-colors-black-alpha-50: oklch(0% 0 0deg / 4%);
-  --chakra-colors-black-alpha-100: oklch(0% 0 0deg / 6%);
-  --chakra-colors-black-alpha-200: oklch(0% 0 0deg / 8%);
-  --chakra-colors-black-alpha-300: oklch(0% 0 0deg / 16%);
-  --chakra-colors-black-alpha-400: oklch(0% 0 0deg / 24%);
-  --chakra-colors-black-alpha-500: oklch(0% 0 0deg / 36%);
-  --chakra-colors-black-alpha-600: oklch(0% 0 0deg / 48%);
-  --chakra-colors-black-alpha-700: oklch(0% 0 0deg / 64%);
-  --chakra-colors-black-alpha-800: oklch(0% 0 0deg / 80%);
-  --chakra-colors-black-alpha-900: oklch(0% 0 0deg / 92%);
-  --chakra-colors-black-alpha-950: oklch(0% 0 0deg / 95%);
-  --chakra-colors-gray-50: oklch(98.5% 0 0deg);
-  --chakra-colors-gray-100: oklch(96.7% 0.001 286.4deg);
-  --chakra-colors-gray-200: oklch(92% 0.004 286.3deg);
-  --chakra-colors-gray-300: oklch(87.1% 0.005 286.3deg);
-  --chakra-colors-gray-400: oklch(71.2% 0.013 286.1deg);
-  --chakra-colors-gray-500: oklch(55.2% 0.014 285.9deg);
-  --chakra-colors-gray-600: oklch(44.2% 0.015 285.8deg);
-  --chakra-colors-gray-700: oklch(37% 0.012 285.8deg);
-  --chakra-colors-gray-800: oklch(27.4% 0.005 286deg);
-  --chakra-colors-gray-900: oklch(21% 0.006 285.9deg);
-  --chakra-colors-gray-950: oklch(17.8% 0 0deg);
-  --chakra-colors-red-50: oklch(97.1% 0.013 17.4deg);
-  --chakra-colors-red-100: oklch(93.6% 0.031 17.7deg);
-  --chakra-colors-red-200: oklch(88.5% 0.059 18.3deg);
-  --chakra-colors-red-300: oklch(80.8% 0.103 19.6deg);
-  --chakra-colors-red-400: oklch(71.1% 0.166 22.2deg);
-  --chakra-colors-red-500: oklch(63.7% 0.208 25.3deg);
-  --chakra-colors-red-600: oklch(57.7% 0.215 27.3deg);
-  --chakra-colors-red-700: oklch(44.2% 0.163 27.1deg);
-  --chakra-colors-red-800: oklch(29.1% 0.095 25.3deg);
-  --chakra-colors-red-900: oklch(21.6% 0.059 23.4deg);
-  --chakra-colors-red-950: oklch(17.4% 0.04 22.2deg);
-  --chakra-colors-orange-50: oklch(98% 0.016 73.7deg);
-  --chakra-colors-orange-100: oklch(95.4% 0.037 75.2deg);
-  --chakra-colors-orange-200: oklch(90.1% 0.073 70.7deg);
-  --chakra-colors-orange-300: oklch(83.7% 0.117 66.3deg);
-  --chakra-colors-orange-400: oklch(75.8% 0.159 55.9deg);
-  --chakra-colors-orange-500: oklch(70.5% 0.187 47.6deg);
-  --chakra-colors-orange-600: oklch(64.6% 0.194 41.1deg);
-  --chakra-colors-orange-700: oklch(45.2% 0.138 38.8deg);
-  --chakra-colors-orange-800: oklch(37.1% 0.104 38deg);
-  --chakra-colors-orange-900: oklch(24.5% 0.07 36.1deg);
-  --chakra-colors-orange-950: oklch(18.3% 0.044 38.1deg);
-  --chakra-colors-yellow-50: oklch(98.7% 0.026 102.2deg);
-  --chakra-colors-yellow-100: oklch(97.3% 0.069 103.2deg);
-  --chakra-colors-yellow-200: oklch(94.5% 0.124 101.5deg);
-  --chakra-colors-yellow-300: oklch(90.5% 0.166 98.1deg);
-  --chakra-colors-yellow-400: oklch(86.1% 0.173 91.9deg);
-  --chakra-colors-yellow-500: oklch(79.5% 0.162 86deg);
-  --chakra-colors-yellow-600: oklch(68.1% 0.142 75.8deg);
-  --chakra-colors-yellow-700: oklch(48.4% 0.102 68.2deg);
-  --chakra-colors-yellow-800: oklch(42.1% 0.09 57.7deg);
-  --chakra-colors-yellow-900: oklch(28.6% 0.064 53.8deg);
-  --chakra-colors-yellow-950: oklch(21.3% 0.044 55.6deg);
-  --chakra-colors-green-50: oklch(98.2% 0.018 155.8deg);
-  --chakra-colors-green-100: oklch(96.2% 0.043 156.7deg);
-  --chakra-colors-green-200: oklch(92.5% 0.081 156deg);
-  --chakra-colors-green-300: oklch(87.1% 0.136 154.4deg);
-  --chakra-colors-green-400: oklch(80% 0.182 151.7deg);
-  --chakra-colors-green-500: oklch(72.3% 0.192 149.6deg);
-  --chakra-colors-green-600: oklch(62.7% 0.17 149.2deg);
-  --chakra-colors-green-700: oklch(45.8% 0.117 150.3deg);
-  --chakra-colors-green-800: oklch(36.4% 0.082 152.6deg);
-  --chakra-colors-green-900: oklch(24.2% 0.055 154.1deg);
-  --chakra-colors-green-950: oklch(19% 0.04 155.8deg);
-  --chakra-colors-teal-50: oklch(98.4% 0.014 180.7deg);
-  --chakra-colors-teal-100: oklch(95.3% 0.05 180.8deg);
-  --chakra-colors-teal-200: oklch(91% 0.093 180.4deg);
-  --chakra-colors-teal-300: oklch(85.5% 0.125 181.1deg);
-  --chakra-colors-teal-400: oklch(78.5% 0.133 181.9deg);
-  --chakra-colors-teal-500: oklch(70.4% 0.123 182.5deg);
-  --chakra-colors-teal-600: oklch(60% 0.104 184.7deg);
-  --chakra-colors-teal-700: oklch(43.2% 0.072 185.7deg);
-  --chakra-colors-teal-800: oklch(34.7% 0.051 191.2deg);
-  --chakra-colors-teal-900: oklch(24.8% 0.04 192.2deg);
-  --chakra-colors-teal-950: oklch(18.6% 0.029 190.9deg);
-  --chakra-colors-blue-50: oklch(97% 0.014 254.6deg);
-  --chakra-colors-blue-100: oklch(93.2% 0.032 255.6deg);
-  --chakra-colors-blue-200: oklch(88.2% 0.057 254.1deg);
-  --chakra-colors-blue-300: oklch(84% 0.082 251deg);
-  --chakra-colors-blue-400: oklch(71.4% 0.143 254.6deg);
-  --chakra-colors-blue-500: oklch(62.3% 0.188 259.8deg);
-  --chakra-colors-blue-600: oklch(54.6% 0.215 262.9deg);
-  --chakra-colors-blue-700: oklch(40.8% 0.174 264.4deg);
-  --chakra-colors-blue-800: oklch(34.9% 0.121 264.9deg);
-  --chakra-colors-blue-900: oklch(26% 0.08 268.4deg);
-  --chakra-colors-blue-950: oklch(20% 0.053 268.4deg);
-  --chakra-colors-cyan-50: oklch(98.4% 0.019 200.9deg);
-  --chakra-colors-cyan-100: oklch(95.6% 0.044 203.4deg);
-  --chakra-colors-cyan-200: oklch(91.7% 0.077 205deg);
-  --chakra-colors-cyan-300: oklch(86.5% 0.115 207.1deg);
-  --chakra-colors-cyan-400: oklch(79.7% 0.134 211.5deg);
-  --chakra-colors-cyan-500: oklch(71.5% 0.126 215.2deg);
-  --chakra-colors-cyan-600: oklch(60.9% 0.111 221.7deg);
-  --chakra-colors-cyan-700: oklch(44.2% 0.078 222.6deg);
-  --chakra-colors-cyan-800: oklch(35.3% 0.057 226.6deg);
-  --chakra-colors-cyan-900: oklch(26.8% 0.046 229.2deg);
-  --chakra-colors-cyan-950: oklch(20.9% 0.033 227.7deg);
-  --chakra-colors-purple-50: oklch(97.7% 0.014 308.3deg);
-  --chakra-colors-purple-100: oklch(94.6% 0.033 307.2deg);
-  --chakra-colors-purple-200: oklch(90.2% 0.06 306.7deg);
-  --chakra-colors-purple-300: oklch(82.7% 0.108 306.4deg);
-  --chakra-colors-purple-400: oklch(72.2% 0.177 305.5deg);
-  --chakra-colors-purple-500: oklch(62.7% 0.233 303.9deg);
-  --chakra-colors-purple-600: oklch(55.8% 0.252 302.3deg);
-  --chakra-colors-purple-700: oklch(42% 0.197 302.4deg);
-  --chakra-colors-purple-800: oklch(33.9% 0.146 305.1deg);
-  --chakra-colors-purple-900: oklch(25.4% 0.125 301.7deg);
-  --chakra-colors-purple-950: oklch(18% 0.083 304.1deg);
-  --chakra-colors-pink-50: oklch(97.1% 0.014 343.2deg);
-  --chakra-colors-pink-100: oklch(94.8% 0.028 342.3deg);
-  --chakra-colors-pink-200: oklch(89.9% 0.059 343.2deg);
-  --chakra-colors-pink-300: oklch(82.3% 0.11 346deg);
-  --chakra-colors-pink-400: oklch(72.5% 0.175 349.8deg);
-  --chakra-colors-pink-500: oklch(65.6% 0.212 354.3deg);
-  --chakra-colors-pink-600: oklch(59.2% 0.218 0.6deg);
-  --chakra-colors-pink-700: oklch(47.3% 0.177 3deg);
-  --chakra-colors-pink-800: oklch(35.4% 0.129 3.6deg);
-  --chakra-colors-pink-900: oklch(25.9% 0.094 3.3deg);
-  --chakra-colors-pink-950: oklch(19.9% 0.066 1.1deg);
-}

package/src/assets/css/variables/colors.css

@@ -1,205 +0,0 @@
-:root {
-  --color-black: var(--chakra-colors-black);
-  --color-white: var(--chakra-colors-white);
-
-  /* PANEL */
-  --shadow:
-    0px 8px 16px color-mix(in srgb, black 64%, transparent),
-    0px 0px 1px inset color-mix(in srgb, var(--chakra-colors-gray-300) 30%, transparent);
-
-  /* PRIMARY */
-  --color-primary-fg: var(--color-teal-fg);
-  --color-primary-subtle: var(--color-teal-subtle);
-  --color-primary-muted: var(--color-teal-muted);
-  --color-primary-emphasized: var(--color-teal-emphasized);
-  --color-primary-solid: var(--color-teal-solid);
-  --color-primary-focusring: var(--color-teal-focusring);
-  --color-primary-border: var(--color-teal-border);
-
-  /* BODY */
-  --color-body-background: var(--chakra-colors-black);
-  --color-body-text: var(--chakra-colors-gray-50);
-
-  /* CAKRA */
-  --color-bg: light-dark(var(--chakra-colors-white), var(--chakra-colors-black));
-  --color-bg-subtle: light-dark(var(--chakra-colors-gray-50), var(--chakra-colors-gray-950));
-  --color-bg-muted: light-dark(var(--chakra-colors-gray-100), var(--chakra-colors-gray-900));
-  --color-bg-emphasized: light-dark(var(--chakra-colors-gray-200), var(--chakra-colors-gray-800));
-  --color-bg-inverted: light-dark(var(--chakra-colors-black), var(--chakra-colors-white));
-  --color-bg-panel: light-dark(var(--chakra-colors-white), var(--chakra-colors-gray-950));
-  --color-bg-error: light-dark(var(--chakra-colors-red-50), var(--chakra-colors-red-950));
-  --color-bg-warning: light-dark(var(--chakra-colors-orange-50), var(--chakra-colors-orange-950));
-  --color-bg-success: light-dark(var(--chakra-colors-green-50), var(--chakra-colors-green-950));
-  --color-bg-info: light-dark(var(--chakra-colors-blue-50), var(--chakra-colors-blue-950));
-  --color-fg: light-dark(var(--chakra-colors-black), var(--chakra-colors-gray-50));
-  --color-fg-muted: light-dark(var(--chakra-colors-gray-600), var(--chakra-colors-gray-400));
-  --color-fg-subtle: light-dark(var(--chakra-colors-gray-400), var(--chakra-colors-gray-500));
-  --color-fg-inverted: light-dark(var(--chakra-colors-gray-50), var(--chakra-colors-black));
-  --color-fg-error: light-dark(var(--chakra-colors-red-500), var(--chakra-colors-red-400));
-  --color-fg-warning: light-dark(var(--chakra-colors-orange-600), var(--chakra-colors-orange-300));
-  --color-fg-success: light-dark(var(--chakra-colors-green-600), var(--chakra-colors-green-300));
-  --color-fg-info: light-dark(var(--chakra-colors-blue-600), var(--chakra-colors-blue-300));
-  --color-border: light-dark(var(--chakra-colors-gray-200), var(--chakra-colors-gray-800));
-  --color-border-muted: light-dark(var(--chakra-colors-gray-100), var(--chakra-colors-gray-900));
-  --color-border-subtle: light-dark(var(--chakra-colors-gray-50), var(--chakra-colors-gray-950));
-  --color-border-emphasized: light-dark(var(--chakra-colors-gray-300), var(--chakra-colors-gray-700));
-  --color-border-inverted: light-dark(var(--chakra-colors-gray-800), var(--chakra-colors-gray-200));
-  --color-border-error: light-dark(var(--chakra-colors-red-500), var(--chakra-colors-red-400));
-  --color-border-warning: light-dark(var(--chakra-colors-orange-500), var(--chakra-colors-orange-400));
-  --color-border-success: light-dark(var(--chakra-colors-green-500), var(--chakra-colors-green-400));
-  --color-border-info: light-dark(var(--chakra-colors-blue-500), var(--chakra-colors-blue-400));
-
-  /* gray */
-  --color-gray-contrast: light-dark(var(--chakra-colors-white), var(--chakra-colors-black));
-  --color-gray-fg: light-dark(var(--chakra-colors-gray-800), var(--chakra-colors-gray-200));
-  --color-gray-subtle: light-dark(var(--chakra-colors-gray-100), var(--chakra-colors-gray-900));
-  --color-gray-muted: light-dark(var(--chakra-colors-gray-200), var(--chakra-colors-gray-800));
-  --color-gray-emphasized: light-dark(var(--chakra-colors-gray-300), var(--chakra-colors-gray-700));
-  --color-gray-solid: light-dark(var(--chakra-colors-gray-900), var(--chakra-colors-white));
-  --color-gray-focus-ring: light-dark(var(--chakra-colors-gray-400), var(--chakra-colors-gray-400));
-  --color-gray-border: light-dark(var(--chakra-colors-gray-200), var(--chakra-colors-gray-800));
-
-  /* red */
-  --color-red-contrast: light-dark(white, white);
-  --color-red-fg: light-dark(var(--chakra-colors-red-700), var(--chakra-colors-red-300));
-  --color-red-subtle: light-dark(var(--chakra-colors-red-100), var(--chakra-colors-red-900));
-  --color-red-muted: light-dark(var(--chakra-colors-red-200), var(--chakra-colors-red-800));
-  --color-red-emphasized: light-dark(var(--chakra-colors-red-300), var(--chakra-colors-red-700));
-  --color-red-solid: light-dark(var(--chakra-colors-red-600), var(--chakra-colors-red-600));
-  --color-red-focus-ring: light-dark(var(--chakra-colors-red-500), var(--chakra-colors-red-500));
-  --color-red-border: light-dark(var(--chakra-colors-red-500), var(--chakra-colors-red-400));
-
-  /* orange */
-  --color-orange-contrast: light-dark(white, black);
-  --color-orange-fg: light-dark(var(--chakra-colors-orange-700), var(--chakra-colors-orange-300));
-  --color-orange-subtle: light-dark(var(--chakra-colors-orange-100), var(--chakra-colors-orange-900));
-  --color-orange-muted: light-dark(var(--chakra-colors-orange-200), var(--chakra-colors-orange-800));
-  --color-orange-emphasized: light-dark(var(--chakra-colors-orange-300), var(--chakra-colors-orange-700));
-  --color-orange-solid: light-dark(var(--chakra-colors-orange-600), var(--chakra-colors-orange-500));
-  --color-orange-focus-ring: light-dark(var(--chakra-colors-orange-500), var(--chakra-colors-orange-500));
-  --color-orange-border: light-dark(var(--chakra-colors-orange-500), var(--chakra-colors-orange-400));
-
-  /* green */
-  --color-green-contrast: light-dark(white, white);
-  --color-green-fg: light-dark(var(--chakra-colors-green-700), var(--chakra-colors-green-300));
-  --color-green-subtle: light-dark(var(--chakra-colors-green-100), var(--chakra-colors-green-900));
-  --color-green-muted: light-dark(var(--chakra-colors-green-200), var(--chakra-colors-green-800));
-  --color-green-emphasized: light-dark(var(--chakra-colors-green-300), var(--chakra-colors-green-700));
-  --color-green-solid: light-dark(var(--chakra-colors-green-600), var(--chakra-colors-green-600));
-  --color-green-focus-ring: light-dark(var(--chakra-colors-green-500), var(--chakra-colors-green-500));
-  --color-green-border: light-dark(var(--chakra-colors-green-500), var(--chakra-colors-green-400));
-
-  /* blue */
-  --color-blue-contrast: light-dark(white, white);
-  --color-blue-fg: light-dark(var(--chakra-colors-blue-700), var(--chakra-colors-blue-300));
-  --color-blue-subtle: light-dark(var(--chakra-colors-blue-100), var(--chakra-colors-blue-900));
-  --color-blue-muted: light-dark(var(--chakra-colors-blue-200), var(--chakra-colors-blue-800));
-  --color-blue-emphasized: light-dark(var(--chakra-colors-blue-300), var(--chakra-colors-blue-700));
-  --color-blue-solid: light-dark(var(--chakra-colors-blue-600), var(--chakra-colors-blue-600));
-  --color-blue-focus-ring: light-dark(var(--chakra-colors-blue-500), var(--chakra-colors-blue-500));
-  --color-blue-border: light-dark(var(--chakra-colors-blue-500), var(--chakra-colors-blue-400));
-
-  /* yellow */
-  --color-yellow-contrast: light-dark(black, black);
-  --color-yellow-fg: light-dark(var(--chakra-colors-yellow-800), var(--chakra-colors-yellow-300));
-  --color-yellow-subtle: light-dark(var(--chakra-colors-yellow-100), var(--chakra-colors-yellow-900));
-  --color-yellow-muted: light-dark(var(--chakra-colors-yellow-200), var(--chakra-colors-yellow-800));
-  --color-yellow-emphasized: light-dark(var(--chakra-colors-yellow-300), var(--chakra-colors-yellow-700));
-  --color-yellow-solid: light-dark(var(--chakra-colors-yellow-300), var(--chakra-colors-yellow-300));
-  --color-yellow-focus-ring: light-dark(var(--chakra-colors-yellow-500), var(--chakra-colors-yellow-500));
-  --color-yellow-border: light-dark(var(--chakra-colors-yellow-500), var(--chakra-colors-yellow-500));
-
-  /* teal */
-  --color-teal-contrast: light-dark(white, white);
-  --color-teal-fg: light-dark(var(--chakra-colors-teal-700), var(--chakra-colors-teal-300));
-  --color-teal-subtle: light-dark(var(--chakra-colors-teal-100), var(--chakra-colors-teal-900));
-  --color-teal-muted: light-dark(var(--chakra-colors-teal-200), var(--chakra-colors-teal-800));
-  --color-teal-emphasized: light-dark(var(--chakra-colors-teal-300), var(--chakra-colors-teal-700));
-  --color-teal-solid: light-dark(var(--chakra-colors-teal-600), var(--chakra-colors-teal-600));
-  --color-teal-focus-ring: light-dark(var(--chakra-colors-teal-500), var(--chakra-colors-teal-500));
-  --color-teal-border: light-dark(var(--chakra-colors-teal-500), var(--chakra-colors-teal-400));
-
-  /* purple */
-  --color-purple-contrast: light-dark(white, white);
-  --color-purple-fg: light-dark(var(--chakra-colors-purple-700), var(--chakra-colors-purple-300));
-  --color-purple-subtle: light-dark(var(--chakra-colors-purple-100), var(--chakra-colors-purple-900));
-  --color-purple-muted: light-dark(var(--chakra-colors-purple-200), var(--chakra-colors-purple-800));
-  --color-purple-emphasized: light-dark(var(--chakra-colors-purple-300), var(--chakra-colors-purple-700));
-  --color-purple-solid: light-dark(var(--chakra-colors-purple-600), var(--chakra-colors-purple-600));
-  --color-purple-focus-ring: light-dark(var(--chakra-colors-purple-500), var(--chakra-colors-purple-500));
-  --color-purple-border: light-dark(var(--chakra-colors-purple-500), var(--chakra-colors-purple-400));
-
-  /* pink */
-  --color-pink-contrast: light-dark(white, white);
-  --color-pink-fg: light-dark(var(--chakra-colors-pink-700), var(--chakra-colors-pink-300));
-  --color-pink-subtle: light-dark(var(--chakra-colors-pink-100), var(--chakra-colors-pink-900));
-  --color-pink-muted: light-dark(var(--chakra-colors-pink-200), var(--chakra-colors-pink-800));
-  --color-pink-emphasized: light-dark(var(--chakra-colors-pink-300), var(--chakra-colors-pink-700));
-  --color-pink-solid: light-dark(var(--chakra-colors-pink-600), var(--chakra-colors-pink-600));
-  --color-pink-focus-ring: light-dark(var(--chakra-colors-pink-500), var(--chakra-colors-pink-500));
-  --color-pink-border: light-dark(var(--chakra-colors-pink-500), var(--chakra-colors-pink-400));
-
-  /* cyan */
-  --color-cyan-contrast: light-dark(white, white);
-  --color-cyan-fg: light-dark(var(--chakra-colors-cyan-700), var(--chakra-colors-cyan-300));
-  --color-cyan-subtle: light-dark(var(--chakra-colors-cyan-100), var(--chakra-colors-cyan-900));
-  --color-cyan-muted: light-dark(var(--chakra-colors-cyan-200), var(--chakra-colors-cyan-800));
-  --color-cyan-emphasized: light-dark(var(--chakra-colors-cyan-300), var(--chakra-colors-cyan-700));
-  --color-cyan-solid: light-dark(var(--chakra-colors-cyan-600), var(--chakra-colors-cyan-600));
-  --color-cyan-focus-ring: light-dark(var(--chakra-colors-cyan-500), var(--chakra-colors-cyan-500));
-  --color-cyan-border: light-dark(var(--chakra-colors-cyan-500), var(--chakra-colors-cyan-400));
-
-  /* shadows */
-  --shadows-xs:
-    light-dark(
-      0px 1px 2px color-mix(in srgb, var(--chakra-colors-gray-900) 10%, transparent),
-      0px 0px 1px color-mix(in srgb, var(--chakra-colors-gray-900) 20%, transparent),
-      0px 1px 1px color-mix(in srgb, black 64%, transparent),
-      0px 0px 1px inset color-mix(in srgb, var(--chakra-colors-gray-300) 20%, transparent)
-    );
-  --shadows-sm:
-    light-dark(
-      0px 2px 4px color-mix(in srgb, var(--chakra-colors-gray-900) 10%, transparent),
-      0px 0px 1px color-mix(in srgb, var(--chakra-colors-gray-900) 30%, transparent),
-      0px 2px 4px color-mix(in srgb, black 64%, transparent),
-      0px 0px 1px inset color-mix(in srgb, var(--chakra-colors-gray-300) 30%, transparent)
-    );
-  --shadows-md:
-    light-dark(
-      0px 4px 8px color-mix(in srgb, var(--chakra-colors-gray-900) 10%, transparent),
-      0px 0px 1px color-mix(in srgb, var(--chakra-colors-gray-900) 30%, transparent),
-      0px 4px 8px color-mix(in srgb, black 64%, transparent),
-      0px 0px 1px inset color-mix(in srgb, var(--chakra-colors-gray-300) 30%, transparent)
-    );
-  --shadows-lg:
-    light-dark(
-      0px 8px 16px color-mix(in srgb, var(--chakra-colors-gray-900) 10%, transparent),
-      0px 0px 1px color-mix(in srgb, var(--chakra-colors-gray-900) 30%, transparent),
-      0px 8px 16px color-mix(in srgb, black 64%, transparent),
-      0px 0px 1px inset color-mix(in srgb, var(--chakra-colors-gray-300) 30%, transparent)
-    );
-  --shadows-xl:
-    light-dark(
-      0px 16px 24px color-mix(in srgb, var(--chakra-colors-gray-900) 10%, transparent),
-      0px 0px 1px color-mix(in srgb, var(--chakra-colors-gray-900) 30%, transparent),
-      0px 16px 24px color-mix(in srgb, black 64%, transparent),
-      0px 0px 1px inset color-mix(in srgb, var(--chakra-colors-gray-300) 30%, transparent)
-    );
-  --shadows-2xl:
-    light-dark(
-      0px 24px 40px color-mix(in srgb, var(--chakra-colors-gray-900) 16%, transparent),
-      0px 0px 1px color-mix(in srgb, var(--chakra-colors-gray-900) 30%, transparent),
-      0px 24px 40px color-mix(in srgb, black 64%, transparent),
-      0px 0px 1px inset color-mix(in srgb, var(--chakra-colors-gray-300) 30%, transparent)
-    );
-  --shadows-inner:
-    light-dark(
-      inset 0 2px 4px 0 color-mix(in srgb, black 5%, transparent),
-      inset 0 2px 4px 0 black
-    );
-  --shadows-inset:
-    light-dark(
-      inset 0 0 0 1px color-mix(in srgb, black 5%, transparent),
-      inset 0 0 0 1px color-mix(in srgb, var(--chakra-colors-gray-300) 5%, transparent)
-    );
-}

package/src/assets/css/variables/grid.css

@@ -1,6 +0,0 @@
-:root {
-  --container-size-sm: 26rem;
-  --container-size-md: 48rem;
-  --container-size-lg: 64rem;
-  --gutter: var(--spacing-4);
-}

package/src/assets/css/variables/spacings.css

@@ -1,10 +0,0 @@
-:root {
-  --spacing-1: 0.25rem;
-  --spacing-2: 0.5rem;
-  --spacing-3: 0.75rem;
-  --spacing-4: 1rem;
-  --spacing-6: 1.5rem;
-  --spacing-8: 2rem;
-  --spacing-12: 3rem;
-  --spacing-16: 4rem;
-}

package/src/assets/css/variables/transitions.css

@@ -1,10 +0,0 @@
-:root {
-  --transition-timing-function: cubic-bezier(0.45, 0, 0.55, 1);
-  --transition-duration: 0.01s;
-
-  @media (prefers-reduced-motion: no-preference) {
-    --transition-duration: 0.25s;
-  }
-
-  --transition: var(--transition-timing-function) var(--transition-duration);
-}