@kruzer/styles 3.0.0-alpha.33 → 3.0.0-alpha.4

package/dist/kruzer-tailwind-preset.cjs

@@ -1,33 +1,6 @@
 module.exports = {
-  theme: {
+	theme: {
     extend: {
-      keyframes: {
-        slideDownAndFade: {
-          from: { opacity: "0", transform: "translateY(-2px)" },
-          to: { opacity: "1", transform: "translateY(0)" },
-        },
-        slideLeftAndFade: {
-          from: { opacity: "0", transform: "translateX(2px)" },
-          to: { opacity: "1", transform: "translateX(0)" },
-        },
-        slideUpAndFade: {
-          from: { opacity: "0", transform: "translateY(2px)" },
-          to: { opacity: "1", transform: "translateY(0)" },
-        },
-        slideRightAndFade: {
-          from: { opacity: "0", transform: "translateX(-2px)" },
-          to: { opacity: "1", transform: "translateX(0)" },
-        },
-      },
-      animation: {
-        slideDownAndFade:
-          "slideDownAndFade 400ms cubic-bezier(0.16, 1, 0.3, 1)",
-        slideLeftAndFade:
-          "slideLeftAndFade 400ms cubic-bezier(0.16, 1, 0.3, 1)",
-        slideUpAndFade: "slideUpAndFade 400ms cubic-bezier(0.16, 1, 0.3, 1)",
-        slideRightAndFade:
-          "slideRightAndFade 400ms cubic-bezier(0.16, 1, 0.3, 1)",
-      },
       gridTemplateColumns: {
         xs: "repeat(auto-fill,minmax(12.5rem,1fr))",
         sm: "repeat(auto-fill,minmax(22rem,1fr))",
@@ -38,13 +11,13 @@ module.exports = {
         "span-full": "1 / -1",
       },
       screens: {
-        "2md": "930px",
+        '2md': '930px',
       },
       lineHeight: {
-        120: "120%",
-        140: "140%",
+        120: '120%',
+        140: '140%',
       },
-      aria: {
+       aria: {
         invalid: 'invalid="true"',
       },
     },
@@ -104,212 +77,13 @@ module.exports = {
         70: "rgb(var(--brand-70) / <alpha-value>)",
         80: "rgb(var(--brand-80) / <alpha-value>)",
       },
-      post: "rgb(var(--post) / <alpha-value>)",
-      delete: "rgb(var(--delete) / <alpha-value>)",
-      put: "rgb(var(--put) / <alpha-value>)",
-      patch: "rgb(var(--patch) / <alpha-value>)",
-      get: "rgb(var(--get) / <alpha-value>)",
-      body: "rgb(var(--body-background) / <alpha-value>)",
+      "post": "rgb(var(--post) / <alpha-value>)",
+      "delete": "rgb(var(--delete) / <alpha-value>)",
+      "put": "rgb(var(--put) / <alpha-value>)",
+      "patch": "rgb(var(--patch) / <alpha-value>)",
+      "get": "rgb(var(--get) / <alpha-value>)",
+      body: 'rgb(var(--body-background) / <alpha-value>)',
       transparent: "transparent",
-      customer: {
-        primary: {
-          100: "var(--color-customer-primary-100)",
-          200: "var(--color-customer-primary-200)",
-          300: "var(--color-customer-primary-300)",
-          400: "var(--color-customer-primary-400)",
-          500: "var(--color-customer-primary-500)",
-          600: "var(--color-customer-primary-600)",
-          700: "var(--color-customer-primary-700)",
-          800: "var(--color-customer-primary-800)",
-          900: "var(--color-customer-primary-900)",
-        },
-        secondary: {
-          100: "var(--color-customer-secondary-100)",
-          200: "var(--color-customer-secondary-200)",
-          300: "var(--color-customer-secondary-300)",
-          400: "var(--color-customer-secondary-400)",
-          500: "var(--color-customer-secondary-500)",
-          600: "var(--color-customer-secondary-600)",
-          700: "var(--color-customer-secondary-700)",
-          800: "var(--color-customer-secondary-800)",
-          900: "var(--color-customer-secondary-900)",
-        },
-        tertiary: {
-          100: "var(--color-customer-tertiary-100)",
-          200: "var(--color-customer-tertiary-200)",
-          300: "var(--color-customer-tertiary-300)",
-          400: "var(--color-customer-tertiary-400)",
-          500: "var(--color-customer-tertiary-500)",
-          600: "var(--color-customer-tertiary-600)",
-          700: "var(--color-customer-tertiary-700)",
-          800: "var(--color-customer-tertiary-800)",
-          900: "var(--color-customer-tertiary-900)",
-        },
-      },
-      brand: {
-        primary: {
-          100: "#EAEEFA",
-          200: "#D6DCF5",
-          300: "#8397E2",
-          400: "#4C79FA",
-          500: "#3151CE",
-          600: "#2746AD",
-          700: "#1D317C",
-          800: "#142052",
-          900: "#0A1029",
-        },
-        navy: {
-          100: "#C9D1FF",
-          200: "#9AA5E2",
-          300: "#48507D",
-          400: "#2A2E45",
-          500: "#232534",
-          600: "#1C1E2A",
-          700: "#191C2A",
-          800: "#0E0F15",
-          900: "#07070A",
-        },
-        paper: {
-          100: "#FEFDFB",
-          200: "#FEFCF9",
-          300: "#FDFBF6",
-          400: "#FDF9F3",
-          500: "#FCF8F0",
-          600: "#F7ECD6",
-          700: "#F2E0BD",
-          800: "#EDD4A3",
-          900: "#EBCE96",
-        },
-        green: {
-          100: "#E4F7E4",
-          200: "#C9EEC8",
-          300: "#AFE6AD",
-          400: "#8FFF85",
-          500: "#79D576",
-          600: "#62AC5D",
-          700: "#4C8B4A",
-          800: "#366534",
-          900: "#1F401E",
-        },
-      },
-      product: {
-        oms: {
-          100: "#F8DFD6",
-          200: "#F1BFAD",
-          300: "#EA9E85",
-          400: "#DF8738",
-          500: "#DC5E33",
-          600: "#CF4A11",
-          700: "#84381F",
-          800: "#582614",
-          900: "#2C130A",
-        },
-        pim: {
-          100: "#E8F1EF",
-          200: "#D2E5E3",
-          300: "#C2D7D5",
-          400: "#A3BCB9",
-          500: "#345B57",
-          600: "#27443F",
-          700: "#1F3734",
-          800: "#152423",
-          900: "#0A1211",
-        },
-        appstore: {
-          100: "#E9F7FF",
-          200: "#D5EFFE",
-          300: "#AADEFD",
-          400: "#A6E6FD",
-          500: "#72C8FC",
-          600: "#65B0D8",
-          700: "#4589B3",
-          800: "#184A6A",
-          900: "#012B45",
-        },
-        devtools: {
-          100: "#F7C9E8",
-          200: "#E0A5CD",
-          300: "#B35C96",
-          400: "#9F127A",
-          500: "#861360",
-          600: "#640D4D",
-          700: "#500B3A",
-          800: "#360826",
-          900: "#1B0413",
-        },
-        black: {
-          100: "#E5E7EB",
-          200: "#D1D5DB",
-          300: "#9CA3AF",
-          400: "#6B7280",
-          500: "#374151",
-          600: "#1F2937",
-          700: "#111827",
-          800: "#0B0F19",
-          900: "#05070D",
-        },
-        neutral: {
-          100: "#F4F4F8",
-          200: "#EEEFF4",
-          300: "#E3E3ED",
-          400: "#D9DAE5",
-          500: "#C6C9D9",
-          600: "#A9ADC0",
-          700: "#989DAD",
-          800: "#777D8A",
-          900: "#3D4150",
-        },
-      },
-      system: {
-        neutral: {
-          100: "#F4F4F8",
-          200: "#EEEFF4",
-          300: "#E3E3ED",
-          400: "#D9DAE5",
-          500: "#C6C9D9",
-          600: "#A9ADC0",
-          700: "#989DAD",
-          800: "#777D8A",
-          900: "#3D4150",
-        },
-        success: {
-          100: "#D1FADF",
-          200: "#A6F4C5",
-          300: "#6CE9A6",
-          400: "#32D583",
-          500: "#12B76A",
-          600: "#039855",
-          700: "#027A48",
-          800: "#05603A",
-          900: "#054F31",
-        },
-        error: {
-          100: "#FEE4E2",
-          200: "#FECDCA",
-          300: "#FECDCA",
-          400: "#F97066",
-          500: "#F04438",
-          600: "#D92D20",
-          700: "#B42318",
-          800: "#912018",
-          900: "#7A271A",
-        },
-        warning: {
-          100: "#FEF0C7",
-          200: "#FEDF89",
-          300: "#FEC84B",
-          400: "#FDB022",
-          500: "#F79009",
-          600: "#DC6803",
-          700: "#B54708",
-          800: "#93370D",
-          900: "#7A2E0E",
-        },
-        global: {
-          100: "#FFFFFF",
-          900: "#1A1A1A",
-        },
-      },
     },
     spacing: {
       0: "0",
@@ -347,15 +121,13 @@ module.exports = {
       base: "1rem",
       md: "1.077rem",
       "2md": "1.231rem",
-      xl: "1.538rem",
+      "xl": "1.538rem",
       "2xl": "2rem",
       "3xl": "2.462rem",
     },
     fontFamily: {
-      sans: ["Fira Sans", "sans-serif"],
-      mono: ["Fira Mono", "monospace"],
-      dmsans: ["DMSans", "sans-serif"],
-      inter: ["Inter", "sans-serif"],
+      'sans': ['Fira Sans', 'sans-serif'],
+      'mono': ['Fira Mono', 'monospace'],
     },
     fontWeight: {
       regular: 400,
@@ -364,10 +136,34 @@ module.exports = {
       bold: 700,
     },
     boxShadow: {
-      sm: "0px 3px 10px 0px rgba(0, 0, 0, 0.05)",
-      DEFAULT: "0px 2px 10px 0px rgba(0, 0, 0, 0.1)",
-      md: "0 0px 20px -1px rgb(0 0 0 / 0.1)",
-      bordered: "0 0px 0px 3px rgb(0 0 0 / 0.1)",
+      sm: '0px 3px 10px 0px rgba(0, 0, 0, 0.05)',
+      DEFAULT: '0px 2px 10px 0px rgba(0, 0, 0, 0.1)',
+      md: '0 0px 20px -1px rgb(0 0 0 / 0.1)',
+      bordered: '0 0px 0px 3px rgb(0 0 0 / 0.1)',
+    },
+    keyframes: {
+      slideDownAndFade: {
+        from: { opacity: '0', transform: 'translateY(-2px)' },
+        to: { opacity: '1', transform: 'translateY(0)' },
+      },
+      slideLeftAndFade: {
+        from: { opacity: '0', transform: 'translateX(2px)' },
+        to: { opacity: '1', transform: 'translateX(0)' },
+      },
+      slideUpAndFade: {
+        from: { opacity: '0', transform: 'translateY(2px)' },
+        to: { opacity: '1', transform: 'translateY(0)' },
+      },
+      slideRightAndFade: {
+        from: { opacity: '0', transform: 'translateX(-2px)' },
+        to: { opacity: '1', transform: 'translateX(0)' },
+      },
+    },
+    animation: {
+      slideDownAndFade: 'slideDownAndFade 400ms cubic-bezier(0.16, 1, 0.3, 1)',
+      slideLeftAndFade: 'slideLeftAndFade 400ms cubic-bezier(0.16, 1, 0.3, 1)',
+      slideUpAndFade: 'slideUpAndFade 400ms cubic-bezier(0.16, 1, 0.3, 1)',
+      slideRightAndFade: 'slideRightAndFade 400ms cubic-bezier(0.16, 1, 0.3, 1)',
     },
   },
-};
+}

package/dist/styles.min.scss

@@ -1 +1 @@
-@import"https://fonts.googleapis.com/css2?family=Fira+Mono:wght@400;500&family=Fira+Sans:wght@400;500;600;700&display=swap";@tailwind base;@tailwind components;@tailwind utilities;*{margin:0;padding:0;box-sizing:border-box}body{position:relative}@media(max-width: 640px){html{font-size:16px}}@media(min-width: 640px){html{font-size:13px}}@layer base{:root{--neutral-0: 255 255 255;--neutral-25: 250 250 250;--neutral-50: 243 243 243;--neutral-100: 230 230 230;--neutral-150: 217 217 217;--neutral-200: 204 204 204;--neutral-250: 191 191 191;--neutral-300: 179 179 179;--neutral-350: 165 165 165;--neutral-400: 153 153 153;--neutral-450: 140 140 140;--neutral-500: 128 128 128;--neutral-550: 115 115 115;--neutral-600: 102 102 102;--neutral-650: 90 90 90;--neutral-700: 76 76 76;--neutral-750: 64 64 64;--neutral-800: 51 51 51;--neutral-850: 38 38 38;--neutral-900: 21 24 30;--primary-0: 246 248 254;--primary-50: 232 239 253;--primary-100: 206 227 253;--primary-500: 9 112 246;--primary-600: 7 90 197;--primary-900: 2 22 49;--success-100: 240 254 230;--success-500: 116 217 38;--success-600: 93 173 31;--danger-100: 254 232 230;--danger-500: 246 24 9;--danger-600: 197 19 7;--warning-100: 254 244 230;--warning-500: 246 143 9;--warning-600: 197 114 7;--brand-10: 155 212 255;--brand-20: 55 170 255;--brand-30: 89 131 247;--brand-40: 87 153 247;--brand-50: 27 123 247;--brand-60: 27 105 253;--brand-70: 11 94 215;--brand-80: 8 43 94;--post: var(--success-600);--delete: var(--danger-500);--put: var(--warning-500);--patch: 180 45 255;--get: var(--primary-500);--body-background: var(--neutral-50);--color-customer-primary-100: #f0f9ff;--color-customer-primary-200: #e0f2fe;--color-customer-primary-300: #bae6fd;--color-customer-primary-400: #7dd3fc;--color-customer-primary-500: #38bdf8;--color-customer-primary-600: #0ea5e9;--color-customer-primary-700: #0284c7;--color-customer-primary-800: #0369a1;--color-customer-primary-900: #0c4a6e;--color-customer-secondary-100: #f5f5f5;--color-customer-secondary-200: #e5e5e5;--color-customer-secondary-300: #d4d4d4;--color-customer-secondary-400: #a3a3a3;--color-customer-secondary-500: #737373;--color-customer-secondary-600: #525252;--color-customer-secondary-700: #404040;--color-customer-secondary-800: #262626;--color-customer-secondary-900: #0a0a0a;--color-customer-tertiary-100: #f9fafb;--color-customer-tertiary-200: #f3f4f6;--color-customer-tertiary-300: #e5e7eb;--color-customer-tertiary-400: #d1d5db;--color-customer-tertiary-500: #9ca3af;--color-customer-tertiary-600: #6b7280;--color-customer-tertiary-700: #4b5563;--color-customer-tertiary-800: #374151;--color-customer-tertiary-900: #1f2937}}@font-face{font-family:"DM Sans";src:url("/assets/fonts/DMSans-Light.woff2") format("woff2");font-weight:300;font-style:normal;font-display:swap}@font-face{font-family:"DM Sans";src:url("/assets/fonts/DMSans-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:"DM Sans";src:url("/assets/fonts/DMSans-Italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}@font-face{font-family:"DM Sans";src:url("/assets/fonts/DMSans-Medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:"DM Sans";src:url("/assets/fonts/DMSans-SemiBold.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:"DM Sans";src:url("/assets/fonts/DMSans-Bold.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:"Inter";src:url("/assets/fonts/Inter-Light.woff2") format("woff2");font-weight:300;font-style:normal;font-display:swap}@font-face{font-family:"Inter";src:url("/assets/fonts/Inter-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:"Inter";src:url("/assets/fonts/Inter-Italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}@font-face{font-family:"Inter";src:url("/assets/fonts/Inter-Medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}@font-face{font-family:"Inter";src:url("/assets/fonts/Inter-SemiBold.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:"Inter";src:url("/assets/fonts/Inter-Bold.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}body{font-family:"Fira Sans",sans-serif;font-weight:400;font-style:normal;@apply text-neutral-700}h1{@apply text-3xl;line-height:140%}h2{@apply text-2xl;line-height:140%}h3{@apply text-xl;line-height:140%}h4{@apply text-2md;line-height:140%}h4{@apply text-md;line-height:140%}a,p,span{@apply text-base;line-height:140%}small{@apply text-sm;line-height:120%}p{white-space:normal;line-height:140%}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{@apply bg-neutral-600 rounded}.krz-grid-xs{@apply grid grid-cols-xs gap-4}.krz-grid-sm{@apply grid grid-cols-sm gap-4}.krz-grid-md{@apply grid grid-cols-md gap-4}.krz-grid-lg{@apply grid grid-cols-lg gap-4}
+@import"https://fonts.googleapis.com/css2?family=Fira+Mono:wght@400;500&family=Fira+Sans:wght@400;500;600;700&display=swap";@tailwind base;@tailwind components;@tailwind utilities;*{margin:0;padding:0;box-sizing:border-box}body{position:relative}@media(max-width: 640px){html{font-size:16px}}@media(min-width: 640px){html{font-size:13px}}@layer base{:root{--neutral-0: 255 255 255;--neutral-25: 250 250 250;--neutral-50: 243 243 243;--neutral-100: 230 230 230;--neutral-150: 217 217 217;--neutral-200: 204 204 204;--neutral-250: 191 191 191;--neutral-300: 179 179 179;--neutral-350: 165 165 165;--neutral-400: 153 153 153;--neutral-450: 140 140 140;--neutral-500: 128 128 128;--neutral-550: 115 115 115;--neutral-600: 102 102 102;--neutral-650: 90 90 90;--neutral-700: 76 76 76;--neutral-750: 64 64 64;--neutral-800: 51 51 51;--neutral-850: 38 38 38;--neutral-900: 21 24 30;--primary-0: 246 248 254;--primary-50: 232 239 253;--primary-100: 206 227 253;--primary-500: 9 112 246;--primary-600: 7 90 197;--primary-900: 2 22 49;--success-100: 240 254 230;--success-500: 116 217 38;--success-600: 93 173 31;--danger-100: 254 232 230;--danger-500: 246 24 9;--danger-600: 197 19 7;--warning-100: 254 244 230;--warning-500: 246 143 9;--warning-600: 197 114 7;--brand-10: 155 212 255;--brand-20: 55 170 255;--brand-30: 89 131 247;--brand-40: 87 153 247;--brand-50: 27 123 247;--brand-60: 27 105 253;--brand-70: 11 94 215;--brand-80: 8 43 94;--post: var(--success-600);--delete: var(--danger-500);--put: var(--warning-500);--patch: 180 45 255;--get: var(--primary-500);--body-background: var(--neutral-50)}}body{font-family:"Fira Sans",sans-serif;font-weight:400;font-style:normal}h1{@apply text-3xl;line-height:140%}h2{@apply text-2xl;line-height:140%}h3{@apply text-xl;line-height:140%}h4{@apply text-2md;line-height:140%}h4{@apply text-md;line-height:140%}a,p,span{@apply text-base;line-height:140%}small{@apply text-sm;line-height:120%}p{white-space:normal;line-height:140%}

package/package.json

@@ -1,20 +1,15 @@
 {
   "name": "@kruzer/styles",
-  "version": "3.0.0-alpha.33",
+  "version": "3.0.0-alpha.4",
   "type": "module",
-  "main": "./dist/styles.js",
-  "module": "./dist/styles.js",
   "files": [
     "dist/styles.min.scss",
-    "dist/kruzer-tailwind-preset.cjs",
-    "dist/styles.js",
-    "dist/assets"
+    "dist/kruzer-tailwind-preset.cjs"
   ],
   "scripts": {
     "dev": "vite",
     "build": "sass src/styles/main.scss src/styles/styles.min.scss --no-source-map --style compressed && tsc && vite build",
-    "preview": "vite preview",
-    "publish": "npm publish --tag alpha"
+    "preview": "vite preview"
   },
   "keywords": [
     "scss",

package/dist/styles.js

@@ -1 +0,0 @@
-