Elgato_dark/ToolJet
1
0
Fork 0
mirror of https://github.com/ToolJet/ToolJet synced 2026-04-21 21:47:17 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 5
ToolJet/frontend/tailwind.config.js
Nithin David Thomas 433d44d61f
feat: Rocket v2 design system — foundation + 18 components (#15543) 
* fix(rocket-v2): fix Tailwind dark mode selector for .dark-theme class

Update darkMode from ['class'] to ['class', '[class~="dark-theme"]'] so
Tailwind's dark: modifier activates on ToolJet's .dark-theme class convention.

Co-Authored-By: Claude Sonnet 4.6 <[email protected]>

* fix(rocket-v2): fix background-warning-stong typo in tailwind.config.js

Corrects token key and CSS var reference from 'stong' to 'strong' so
tw-bg-background-warning-strong resolves to the correct CSS variable
defined in componentdesign.scss.

Co-Authored-By: Claude Sonnet 4.6 <[email protected]>

* feat(rocket-v2): add radius, overlay, and shadcn semantic bridge tokens

Adds to componentdesign.scss (light + dark):
- Radius tokens: --radius-sm/md/lg/xl/full
- Overlay backdrop: --overlay-backdrop
- shadcn semantic bridges: --background, --foreground, --primary,
  --secondary, --muted, --accent, --destructive, --border, --input,
  --ring, --radius, --popover, --card, --sidebar-* — all pointing to
  ToolJet tokens so Radix internals resolve to correct colours.

Co-Authored-By: Claude Sonnet 4.6 <[email protected]>

* feat(rocket-v2): add borderRadius token entries to tailwind.config.js

Maps tw-rounded-sm/md/lg/xl/full to the radius CSS vars defined in
componentdesign.scss, enabling token-driven border radii in Rocket HOCs.

Co-Authored-By: Claude Sonnet 4.6 <[email protected]>

* feat(rocket-v2): redirect shadcn ui alias to Rocket/shadcn directory

Updates components.json "ui" alias from @/components/ui to
@/components/ui/Rocket/shadcn so npx shadcn add installs primitives
into the correct isolated directory that Rocket HOCs wrap.

Co-Authored-By: Claude Sonnet 4.6 <[email protected]>

* feat(rocket-v2): add ARCHITECTURE.md guard to Rocket/shadcn directory

Documents that Rocket/shadcn/ is CLI-managed only and must never be
hand-edited. Explains the install → shadcn-to-v3 → HOC wrap workflow.

Co-Authored-By: Claude Sonnet 4.6 <[email protected]>

* feat(rocket-v2): create Rocket/index.js barrel for public component API

Establishes the single public import point for all Rocket HOC components.
Exports will be added here via /create-rocket-component as components are built.

Co-Authored-By: Claude Sonnet 4.6 <[email protected]>

* fix(rocket-v2): fix Storybook webpack — replace MiniCssExtractPlugin.loader with style-loader

When build-storybook runs (NODE_ENV=production), webpack.config.js uses
MiniCssExtractPlugin.loader in CSS rules. But Storybook's webpack never
receives the MiniCssExtractPlugin plugin, causing a build failure.

In webpackFinal, replace any mini-css-extract-plugin loader entries in
the merged custom rules with style-loader, which is the correct approach
for Storybook's browser-injected CSS model.

Co-Authored-By: Claude Sonnet 4.6 <[email protected]>

* feat(ai-friendly-frontend): add initial brainstorming document for AI integration

* feat(rocket-v2): enhance create-rocket-component workflow and HOC template with spec file integration

* feat(rocket-v2): implement Button component with variants, design spec, and Storybook stories

* feat(rocket-v2): update Button component to use shadcn as structural base, enhance variants, and add icon-only support

* feat(rocket/avatar): add Rocket Avatar component with 7 size variants

Wraps shadcn Avatar (Radix-backed) with ToolJet token styling.
Includes spec from Figma, HOC with CVA size variants (xs–2xl),
scaled fallback text, and Storybook stories.

Co-Authored-By: Claude Opus 4.6 <[email protected]>

* feat(rocket/inline-info): add Rocket InlineInfo component

Wraps shadcn Alert (role="alert") with ToolJet token styling.
Three types (info/warning/danger) × four variants (ghost/secondary/outline/filled).
Includes Figma spec, auto icon per type, action slot, and Storybook stories.

Co-Authored-By: Claude Opus 4.6 <[email protected]>

* feat(rocket/input): add Input, Field, and InputGroup components

- Input HOC: wraps shadcn input with CVA size variants (large/default/small),
  ToolJet token mapping (bg, border, text, placeholder, focus ring, error, disabled),
  browser resets for preflight-off env
- Field HOC: wraps 5 shadcn field sub-components (Field, FieldLabel, FieldDescription,
  FieldError, FieldGroup) with ToolJet tokens, re-exports 5 structural sub-components
- InputGroup HOC: wraps shadcn input-group with size prop, ToolJet border/focus/error
  tokens; InputGroupInput uses Rocket Input with group-context overrides
- Install shadcn primitives: input, label, field, separator, input-group, textarea
- Fix field.jsx unprefixed Tailwind classes for orientation variants
- Add @tailwindcss/container-queries plugin
- Extend tailwind-merge shadow classGroup with custom elevation tokens
- Add Rocket reset in componentdesign.scss for legacy input[type=text] outline
- Storybook stories for all components with all states

Co-Authored-By: Claude Opus 4.6 <[email protected]>

* feat(rocket/select): add Select component with variants, design spec, and Storybook stories

* feat(rocket/toggle): add Toggle and ToggleGroup components with shadcn base

Toggle wraps @radix-ui/react-toggle with ghost/outline variants and 4 sizes.
ToggleGroup implements segmented control pattern per Figma spec with grey pill
container and white active items. Shared toggleBaseClasses for DRY styling
between both components. Includes shadcn class leak overrides (svg sizing,
min-width, hover background).

Co-Authored-By: Claude Opus 4.6 <[email protected]>

* feat(rocket/combobox): add Combobox component with base UI integration and sub-components

* feat(rocket/pagination): add Pagination component with size variants and Figma spec

Compound component wrapping shadcn pagination primitive with 7 sub-components:
Pagination, PaginationContent, PaginationItem, PaginationLink, PaginationPrevious,
PaginationNext, PaginationEllipsis. Size (large/default/small) flows from root
via React context. Active page styled with white bg + border per Figma spec.

Co-Authored-By: Claude Opus 4.6 <[email protected]>

* feat(rocket/tooltip): add Rocket Tooltip component with Figma spec

Co-Authored-By: Claude Opus 4.6 <[email protected]>

* feat: add Combobox component with specifications and stories

- Introduced the Combobox component as a searchable dropdown for single-select use.
- Created detailed design specifications for the Combobox, including sub-components, props, and token mappings.
- Added stories for the Combobox showcasing various states, sizes, and usage examples.
- Updated Input and InputGroup components to ensure compatibility with the new Combobox.
- Refactored InputGroup to include InputGroupSelect for better integration with dropdowns.
- Enhanced InputGroup stories to demonstrate new features and variations.

* feat(rocket/label): add Label component with variants, props, and design specifications

* feat(rocket/dropdown-menu): add DropdownMenu component with sub-components

Co-Authored-By: Claude Opus 4.6 <[email protected]>

* feat(rocket/dialog): add Dialog component with size variants and Figma spec

Co-Authored-By: Claude Opus 4.6 <[email protected]>

* docs(skill): update compound component decision guide in create-rocket-component

Co-Authored-By: Claude Opus 4.6 <[email protected]>

* feat: update design specifications for Input, Pagination, Toggle, and ToggleGroup components

* feat(rocket/empty): add Empty component with illustrations and page-level empty states

Adds Rocket Empty compound component (Shape E) with size context propagation,
co-located SVG illustrations using shared --illu-* CSS tokens for automatic
dark mode, and three page-level empty states (Apps, DataSources, Workflows).

Co-Authored-By: Claude Opus 4.6 <[email protected]>

* fix(rocket/button): add missing danger-secondary hover/pressed states and misc fixes

- Add bg token overrides for danger+secondary compound variant (hover, pressed, disabled)
- Fix ghost/ghostBrand/outline variants: use correct text tokens and shadow-elevation-none
- Use tw-contents on leading/trailing visual wrappers for proper icon layout

Co-Authored-By: Claude Opus 4.6 <[email protected]>

* fix(rocket): standardize size prop naming to small/default/large across components

Rename sm→small, lg→large, xl→extraLarge in Label, Dialog, and Tooltip
stories for consistent sizing convention across the Rocket design system.
Also clean up DropdownMenu formatting.

Co-Authored-By: Claude Opus 4.6 <[email protected]>

* feat: implement sizing standard for Rocket components and update related styles

* fix(rocket/combobox): review fixes — tokens, check position, InputGroup bugs

- Replace tw-bg-switch-tag with tw-bg-background-surface-layer-02 for
  disabled state (Combobox + Select) to match Input pattern
- Move check indicator from right to left to match Select pattern
- Fix InputGroupAddon not forwarding align prop (clear/chevron on wrong side)
- Remove unused superstruct import from InputGroup
- Add tw-p-0 on ComboboxList, tw-p-2 on ComboboxContent (8px total inset)
- Reduce InputGroupAddon gap from gap-2 to gap-1
- Hide empty InputGroupAddon via empty:tw-hidden (loading state extra space)
- Add WithGroups story using ComboboxGroup/Label/Separator
- Add WithClear standalone story
- Update spec: fix inaccurate re-export list, update token references

Co-Authored-By: Claude Opus 4.6 <[email protected]>

* feat(dialog): refactor Dialog component to use Radix primitives and update styles

* fix: remove unnecessary focus ring offset from various components

* feat(rocket/breadcrumb): add Rocket Breadcrumb component

Compound component (Shape E) wrapping shadcn breadcrumb primitives with
ToolJet design tokens. Uses tw-font-body-small for links and
tw-font-title-small for current page. Includes ellipsis, custom
separator, and disabled link support.

Co-Authored-By: Claude Opus 4.6 <[email protected]>

* feat(rocket/tabs): add Rocket Tabs component

Compound component wrapping shadcn/Radix tabs with three variants
(underline, underline-inverted, pill), three sizes (large, default, small),
and support for icon/badge slots. Uses React context to pass variant
from TabsList to TabsTrigger for clean per-variant styling.

Co-Authored-By: Claude Opus 4.6 <[email protected]>

* docs(rocket): add README with architecture, component guide, and LLM onboarding

Co-Authored-By: Claude Opus 4.6 <[email protected]>

* feat(rocket/switch): add Rocket Switch component

Co-Authored-By: Claude Opus 4.6 <[email protected]>

* chore: update dependencies and remove unused packages

- Removed "@base-ui/react" and its dependencies.
- Downgraded several Radix UI packages to specific versions.
- Removed "@tailwindcss/container-queries" and "cmdk" packages.
- Updated various dependencies to their latest compatible versions.
- Cleaned up redundant node_modules entries for improved package management.

* chore: update submodule references for frontend and server

* fix(rocket): address PR review findings across 6 components

- Remove conflicting tw-shadow-sm on Switch (elevation shadow now applies)
- Fix Select trigger shadow to elevation-000 per spec
- Remove unused ShadcnTooltipContent import in Tooltip
- Remove outdated dashed border on Empty root
- Remove bare "tw-" conversion artifact in shadcn PaginationItem
- Add proper disabled handling (aria-disabled, tabIndex, pointer-events) to Pagination link components

Co-Authored-By: Claude Opus 4.6 (1M context) <[email protected]>

* fix(rocket/empty): add border-none class to emptyVariants for consistent styling

---------

Co-authored-by: Claude Sonnet 4.6 <[email protected]>
2026-04-01 12:04:29 +05:30

299 lines
13 KiB
JavaScript
Raw Blame History

/** @type {import('tailwindcss').Config} */
const plugin = require('tailwindcss/plugin');
module.exports = {
darkMode: ['class', '[class~="dark-theme"]'],
content: [
'./pages/**/*.{js,jsx}',
'./components/**/*.{js,jsx}',
'./app/**/*.{js,jsx}',
'./src/**/*.{js,jsx}',
'./ee/**/*.{js,jsx}',
],
prefix: 'tw-',
corePlugins: {
preflight: false,
},
theme: {
extend: {
colors: {
'page-default': 'var(--page-default)',
'page-weak': 'var(--page-weak)',
'background-surface-layer-01': 'var(--background-surface-layer-01)',
'background-surface-layer-02': 'var(--background-surface-layer-02)',
'background-surface-layer-03': 'var(--background-surface-layer-03)',
'background-accent-strong': 'var(--background-accent-strong)',
'background-accent-weak': 'var(--background-accent-weak)',
'background-success-strong': 'var(--background-success-strong)',
'background-success-weak': 'var(--background-success-weak)',
'background-error-strong': 'var(--background-error-strong)',
'background-error-weak': 'var(--background-error-weak)',
'background-warning-strong': 'var(--background-warning-strong)',
'background-warning-weak': 'var(--background-warning-weak)',
'background-inverse': 'var(--background-inverse)',
'text-default': 'var(--text-default)',
'text-medium': 'var(--text-medium)',
'text-placeholder': 'var(--text-placeholder)',
'text-inverse': 'var(--text-inverse)',
'text-brand': 'var(--text-brand)',
'text-accent': 'var(--text-brand)',
'text-selected': 'var(--text-selected)',
'text-success': 'var(--text-success)',
'text-warning': 'var(--text-warning)',
'text-danger': 'var(--text-danger)',
'text-on-solid': 'var(--text-on-solid)',
'text-disabled': 'var(--text-disabled)',
'text-disabled-on-solid': 'var(--text-disabled-on-solid)',
'icon-strong': 'var(--icon-strong)',
'icon-default': 'var(--icon-default)',
'icon-weak': 'var(--icon-weak)',
'icon-inverse': 'var(--icon-inverse)',
'icon-on-solid': 'var(--icon-on-solid)',
'icon-accent': 'var(--icon-accent)',
'icon-brand': 'var(--icon-brand)',
'icon-success': 'var(--icon-success)',
'icon-warning': 'var(--icon-warning)',
'icon-danger': 'var(--icon-danger)',
'icon-disabled': 'var(--icon-disabled)',
'border-strong': 'var(--border-strong)',
'border-default': 'var(--border-default)',
'border-weak': 'var(--border-weak)',
'border-accent-strong': 'var(--border-accent-strong)',
'border-accent-weak': 'var(--border-accent-weak)',
'border-success-strong': 'var(--border-success-strong)',
'border-success-weak': 'var(--border-success-weak)',
'border-warning-strong': 'var(--border-warning-strong)',
'border-warning-weak': 'var(--border-warning-weak)',
'border-danger-strong': 'var(--border-danger-strong)',
'border-danger-weak': 'var(--border-danger-weak)',
'border-disabled': 'var(--border-disabled)',
'interactive-weak': 'var(--interactive-weak)',
'interactive-default': 'var(--interactive-default)',
'interactive-hover': 'var(--interactive-hover)',
'interactive-selected': 'var(--interactive-selected)',
'interactive-disabled': 'var(--interactive-disabled)',
'interactive-focus-outline': 'var(--interactive-focus-outline)',
'interactive-focus-inner-shadow': 'var(--interactive-focus-inner-shadow)',
'button-primary': 'var(--button-primary)',
'button-primary-hover': 'var(--button-primary-hover)',
'button-primary-pressed': 'var(--button-primary-pressed)',
'button-primary-disabled': 'var(--button-primary-disabled)',
'button-secondary': 'var(--button-secondary)',
'button-secondary-hover': 'var(--button-secondary-hover)',
'button-secondary-pressed': 'var(--button-secondary-pressed)',
'button-secondary-disabled': 'var(--button-secondary-disabled)',
'button-outline': 'var(--button-outline)',
'button-outline-hover': 'var(--button-outline-hover)',
'button-outline-pressed': 'var(--button-outline-pressed)',
'button-outline-disabled': 'var(--button-outline-disabled)',
'button-danger-primary': 'var(--button-danger-primary)',
'button-danger-primary-hover': 'var(--button-danger-primary-hover)',
'button-danger-primary-pressed': 'var(--button-danger-primary-pressed)',
'button-danger-primary-disabled': 'var(--button-danger-primary-disabled)',
'button-danger-secondary': 'var(--button-danger-secondary)',
'button-danger-secondary-hover': 'var(--button-danger-secondary-hover)',
'button-danger-secondary-pressed': 'var(--button-danger-secondary-pressed)',
'button-danger-secondary-disabled': 'var(--button-danger-secondary-disabled)',
'switch-tab': 'var(--switch-tab)',
'switch-tag': 'var(--switch-tag)',
'switch-background-off': 'var(--switch-background-off)',
'switch-background-on': 'var(--switch-background-on)',
'slider-handle': 'var(--slider-handle)',
'slider-track': 'var(--slider-track)',
'slider-fill': 'var(--slider-fill)',
},
boxShadow: {
'interactive-focus-outline': ' 0px 0px 0px 2px var(--interactive-focus-outline)',
'interactive-focus-outline-inset': 'inset 0px 0px 0px 2px #fff',
'elevation-none': '0px 0px 0px 0px rgba(0, 0, 0, 0.0)',
'elevation-000': '0px 1px 0px 0px rgba(0, 0, 0, 0.10)',
'elevation-100': '0px 1px 1px 0px rgba(48, 50, 51, 0.10), 0px 0px 1px 0px rgba(48, 50, 51, 0.05)',
'elevation-200': '0px 2px 4px 0px rgba(48, 50, 51, 0.10), 0px 0px 1px 0px rgba(48, 50, 51, 0.05)',
'elevation-300': '0px 4px 8px 0px rgba(48, 50, 51, 0.10), 0px 0px 1px 0px rgba(48, 50, 51, 0.05)',
'elevation-400': '0px 8px 16px 0px rgba(48, 50, 51, 0.10), 0px 0px 1px 0px rgba(48, 50, 51, 0.05)',
'elevation-500': '0px 16px 24px 0px rgba(48, 50, 51, 0.09), 0px 0px 1px 0px rgba(48, 50, 51, 0.05)',
'elevation-600': '0px 24px 40px 0px rgba(48, 50, 51, 0.08), 0px 0px 1px 0px rgba(48, 50, 51, 0.05)',
'elevation-700': '0px 32px 50px 0px rgba(48, 50, 51, 0.08), 0px 0px 1px 0px rgba(48, 50, 51, 0.05)',
},
ringOffsetColor: {
DEFAULT: 'var(--background-surface-layer-01)',
},
borderRadius: {
sm: 'var(--radius-sm)',
md: 'var(--radius-md)',
lg: 'var(--radius-lg)',
xl: 'var(--radius-xl)',
full: 'var(--radius-full)',
},
fontSize: {
sm: ['11px', '16px'],
base: ['12px', '18px'],
lg: ['14px', '20px'],
xl: ['16px', '24px'],
},
fontWeight: {
thin: '100',
hairline: '100',
extralight: '200',
light: '300',
normal: '400',
medium: '500',
semibold: '600',
bold: '700',
extrabold: '800',
black: '900',
},
},
},
plugins: [
require('@tailwindcss/container-queries'),
require('tailwindcss-animate'),
plugin(({ addUtilities }) => {
const newUtilities = {
'.font-display-small': {
fontFamily: 'var(--font-family-inter)',
fontWeight: 'var(--font-weight-medium)',
fontSize: 'var(--font-size-display-small)',
lineHeight: 'var(--line-height-display-medium)',
letterSpacing: 'var(--letter-spacing-display-medium)',
fontSmoothing: 'antialiased',
},
'.font-title-heavy-xx-large': {
fontFamily: 'var(--font-family-inter)',
fontWeight: 'var(--font-weight-semi-bold)',
fontSize: 'var(--font-size-xx-large)',
lineHeight: 'var(--line-height-xx-large)',
letterSpacing: 'var(--letter-spacing-xx-large)',
fontSmoothing: 'subpixel-antialiased',
},
'.font-title-xx-large': {
fontFamily: 'var(--font-family-inter)',
fontWeight: 'var(--font-weight-medium)',
fontSize: 'var(--font-size-xx-large)',
lineHeight: 'var(--line-height-xx-large)',
letterSpacing: 'var(--letter-spacing-xx-large)',
fontSmoothing: 'subpixel-antialiased',
},
'.font-body-xx-large': {
fontFamily: 'var(--font-family-inter)',
fontWeight: 'var(--font-weight-regular)',
fontSize: 'var(--font-size-xx-large)',
lineHeight: 'var(--line-height-xx-large)',
letterSpacing: 'var(--letter-spacing-xx-large)',
fontSmoothing: 'antialiased',
},
'.font-code-regular': {
fontFamily: 'var(--font-family-geist-mono)',
fontWeight: 'var(--font-weight-regular)',
fontSize: 'var(--font-size-default)',
lineHeight: 'var(--line-height-default)',
},
'.font-title-heavy-x-large': {
fontFamily: 'var(--font-family-inter)',
fontWeight: 'var(--font-weight-semi-bold)',
fontSize: 'var(--font-size-x-large)',
lineHeight: 'var(--line-height-x-large)',
letterSpacing: 'var(--letter-spacing-x-large)',
fontSmoothing: 'subpixel-antialiased',
},
'.font-title-x-large': {
fontFamily: 'var(--font-family-inter)',
fontWeight: 'var(--font-weight-medium)',
fontSize: 'var(--font-size-x-large)',
lineHeight: 'var(--line-height-x-large)',
letterSpacing: 'var(--letter-spacing-x-large)',
fontSmoothing: 'subpixel-antialiased',
},
'.font-body-x-large': {
fontFamily: 'var(--font-family-inter)',
fontWeight: 'var(--font-weight-regular)',
fontSize: 'var(--font-size-x-large)',
lineHeight: 'var(--line-height-x-large)',
letterSpacing: 'var(--letter-spacing-x-large)',
fontSmoothing: 'antialiased',
},
'.font-title-heavy-large': {
fontFamily: 'var(--font-family-inter)',
fontWeight: 'var(--font-weight-semi-bold)',
fontSize: 'var(--font-size-large)',
lineHeight: 'var(--line-height-large)',
letterSpacing: 'var(--letter-spacing-large)',
fontSmoothing: 'subpixel-antialiased',
},
'.font-title-large': {
fontFamily: 'var(--font-family-inter)',
fontWeight: 'var(--font-weight-medium)',
fontSize: 'var(--font-size-large)',
lineHeight: 'var(--line-height-large)',
letterSpacing: 'var(--letter-spacing-large)',
fontSmoothing: 'subpixel-antialiased',
},
'.font-body-large': {
fontFamily: 'var(--font-family-inter)',
fontWeight: 'var(--font-weight-regular)',
fontSize: 'var(--font-size-large)',
lineHeight: 'var(--line-height-large)',
letterSpacing: 'var(--letter-spacing-large)',
fontSmoothing: 'antialiased',
},
'.font-title-heavy-medium': {
fontFamily: 'var(--font-family-inter)',
fontWeight: 'var(--font-weight-semi-bold)',
fontSize: 'var(--font-size-default)',
lineHeight: 'var(--line-height-default)',
letterSpacing: 'var(--letter-spacing-default)',
fontSmoothing: 'subpixel-antialiased',
},
'.font-title-default': {
fontFamily: 'var(--font-family-inter)',
fontWeight: 'var(--font-weight-medium)',
fontSize: 'var(--font-size-default)',
lineHeight: 'var(--line-height-default)',
letterSpacing: 'var(--letter-spacing-default)',
fontSmoothing: 'subpixel-antialiased',
},
'.font-body-default': {
fontFamily: 'var(--font-family-inter)',
fontWeight: 'var(--font-weight-regular)',
fontSize: 'var(--font-size-default)',
lineHeight: 'var(--line-height-default)',
letterSpacing: 'var(--letter-spacing-default)',
fontSmoothing: 'antialiased',
},
'.font-title-heavy-small': {
fontFamily: 'var(--font-family-inter)',
fontWeight: 'var(--font-weight-semi-bold)',
fontSize: 'var(--font-size-small)',
lineHeight: 'var(--line-height-small)',
letterSpacing: 'var(--letter-spacing-small)',
fontSmoothing: 'subpixel-antialiased',
},
'.font-title-small': {
fontFamily: 'var(--font-family-inter)',
fontWeight: 'var(--font-weight-medium)',
fontSize: 'var(--font-size-small)',
lineHeight: 'var(--line-height-small)',
letterSpacing: 'var(--letter-spacing-small)',
fontSmoothing: 'subpixel-antialiased',
},
'.font-body-small': {
fontFamily: 'var(--font-family-inter)',
fontWeight: 'var(--font-weight-regular)',
fontSize: 'var(--font-size-small)',
lineHeight: 'var(--line-height-small)',
letterSpacing: 'var(--letter-spacing-small)',
fontSmoothing: 'antialiased',
},
'.font-title-section-title': {
fontFamily: 'var(--font-family-inter)',
fontWeight: 'var(--font-weight-semi-bold)',
fontSize: 'var(--font-size-small)',
lineHeight: 'var(--line-height-small)',
letterSpacing: 'var(--letter-spacing-small)',
fontSmoothing: 'subpixel-antialiased',
},
};
addUtilities(newUtilities, ['responsive', 'hover']);
}),
],
};
Reference in a new issue View git blame Copy permalink