@keboola/tailwind-config 0.1.1 → 0.2.0

package/colors.ts

@@ -14,6 +14,9 @@ export default {
   background: 'rgb(var(--color-background) / <alpha-value>)',
   foreground: 'rgb(var(--color-foreground) / <alpha-value>)',
 
+  // Raised container chrome (Modal/Card/Sheet). White in light, lifted off background in dark.
+  surface: 'rgb(var(--color-surface) / <alpha-value>)',
+
   popover: {
     DEFAULT: 'rgb(var(--color-popover) / <alpha-value>)',
     foreground: 'rgb(var(--color-popover-foreground) / <alpha-value>)',
@@ -69,8 +72,8 @@ export default {
     900: '#101114',
   },
   primary: {
-    DEFAULT: '#1F8FFF',
-    foreground: '#FFFFFF',
+    DEFAULT: 'rgb(var(--color-primary) / <alpha-value>)',
+    foreground: 'rgb(var(--color-primary-foreground) / <alpha-value>)',
     100: '#e0ffe0',
     200: '#baf5ba',
     300: '#93f593',

package/index.js

@@ -21,6 +21,15 @@ export default {
           700: 'url(#aigradient-700)',
         },
       },
+      // Lucide icons are stroke-based — exposing the AI gradient as a
+      // stroke utility lets us paint the visible line with the gradient,
+      // not just the (often empty) interior fill area.
+      stroke: {
+        aigradient: {
+          600: 'url(#aigradient-600)',
+          700: 'url(#aigradient-700)',
+        },
+      },
       screens: {
         'sm-legacy': '992px',
         'md-legacy': '1092px',
@@ -37,6 +46,7 @@ export default {
         'marching-ants': 'marching-ants 1s linear infinite',
         'spinner-dots': 'spinner-dots 1s ease-in-out infinite',
         'progress-bar': 'progress-bar var(--progress-bar-duration, 3s) linear forwards',
+        'caret-blink': 'caret-blink 1.25s ease-out infinite',
       },
       keyframes: {
         shimmer: {
@@ -91,6 +101,10 @@ export default {
           from: { width: '0%' },
           to: { width: '100%' },
         },
+        'caret-blink': {
+          '0%, 70%, 100%': { opacity: '1' },
+          '20%, 50%': { opacity: '0' },
+        },
       },
       backgroundImage: {
         'loader-gradient': 'radial-gradient(circle closest-side,#000 90%,#0000)',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@keboola/tailwind-config",
-  "version": "0.1.1",
+  "version": "0.2.0",
   "description": "Shared Tailwind CSS v3 config for the Keboola UI platform — semantic color palette, plugins, and the `tw-` class prefix.",
   "license": "MIT",
   "type": "module",

package/typography.ts

@@ -82,8 +82,15 @@ export const typography = {
       'p:last-child': {
         marginBottom: 0,
       },
-      'ul, ol': {
-        listStyle: 'initial',
+      ul: {
+        listStyleType: 'disc',
+        marginTop: 0,
+        marginBottom: '10px',
+        paddingLeft: '24px',
+        lineHeight: '1.42857143',
+      },
+      ol: {
+        listStyleType: 'decimal',
         marginTop: 0,
         marginBottom: '10px',
         paddingLeft: '24px',