Files
fab-store/config/tailwind.config.js
2025-10-27 04:17:14 +00:00

129 lines
4.0 KiB
JavaScript

const defaultTheme = require("tailwindcss/defaultTheme");
module.exports = {
content: [
'public/*.html',
'app/helpers/**/*.rb',
'app/javascript/**/*.js',
'app/views/spree/**/*.erb',
'app/views/devise/**/*.erb',
'app/views/themes/**/*.erb',
process.env.SPREE_STOREFRONT_PATH + '/app/helpers/**/*.rb',
process.env.SPREE_STOREFRONT_PATH + '/app/javascript/**/*.js',
process.env.SPREE_STOREFRONT_PATH + '/app/views/themes/**/*.erb',
process.env.SPREE_STOREFRONT_PATH + '/app/views/spree/**/*.erb',
process.env.SPREE_STOREFRONT_PATH + '/app/views/devise/**/*.erb'
],
plugins: [
require("@tailwindcss/typography"),
require("@tailwindcss/forms"),
require("@tailwindcss/aspect-ratio"),
],
variants: {
scrollbar: ["rounded"],
},
safelist: [
"hidden",
"lg:grid",
"grid",
"text-xs",
"text-sm",
"text-base",
"text-lg",
"text-xl",
"text-2xl",
"text-3xl",
"text-4xl",
"text-left",
"text-right",
"text-center",
"cursor-wait",
"lg:sr-only",
],
theme: {
extend: {
fontFamily: {
body: ["var(--font-body)", ...defaultTheme.fontFamily.sans],
},
screens: {
lg: { raw: "(min-width: 1024px) { &:not(.force-mobile-view *) }" },
},
animation: {
fadeIn: "fadeIn 0.5s ease-in-out",
},
keyframes: {
fadeIn: {
"0%": { opacity: 0 },
"100%": { opacity: 1 },
},
},
colors: {
primary: "var(--primary)",
accent: "var(--accent)",
neutral: "var(--neutral)",
danger: "var(--danger)",
success: "var(--success)",
"accent-100": "var(--accent-100)",
"neutral-50": "var(--neutral-50)",
"neutral-100": "var(--neutral-100)",
"neutral-200": "var(--neutral-200)",
"neutral-300": "var(--neutral-300)",
"neutral-400": "var(--neutral-400)",
"neutral-500": "var(--neutral-500)",
"neutral-600": "var(--neutral-600)",
"neutral-700": "var(--neutral-700)",
"neutral-800": "var(--neutral-800)",
"neutral-900": "var(--neutral-900)",
background: "var(--background)",
"section-background": "var(--section-background, var(--background))",
text: "var(--text)",
button: "rgba(var(--button-rgb), <alpha-value>)",
"button-text": "var(--button-text)",
"button-hover": "var(--button-hover)",
"button-hover-text": "var(--button-hover-text)",
"secondary-button": "var(--secondary-button)",
"secondary-button-text": "var(--secondary-button-text)",
"secondary-button-hover": "var(--secondary-button-hover)",
"secondary-button-hover-text": "var(--secondary-button-hover-text)",
"button-light": "var(--button-light)",
"button-light-text": "var(--button-light-text)",
"button-light-hover": "var(--button-light-hover)",
"button-light-hover-text": "var(--button-light-hover-text)",
input: "var(--input)",
"input-bg": "var(--input-bg)",
"input-text": "var(--input-text)",
"input-focus": "var(--input-focus)",
"input-focus-bg": "var(--input-focus-bg)",
"input-focus-text": "var(--input-focus-text)",
},
letterSpacing: {
widest: "0.07rem",
},
typography: {
DEFAULT: {
css: {
"--tw-prose-body": "var(--text)",
"--tw-prose-headings": "var(--text)",
"--tw-prose-bold": "var(--text)",
"--tw-prose-links": "var(--text)",
"--tw-prose-counters": "var(--text)",
"--tw-prose-bullets": "var(--text)",
"--tw-prose-lead": "var(--text)",
"--tw-prose-hr": "var(--border-default-color)",
"--tw-prose-th-borders": "var(--border-default-color)",
"--tw-prose-td-borders": "var(--border-default-color)",
"--tw-prose-quote-borders": "var(--border-default-color)",
"--tw-prose-quotes": "var(--text)",
},
},
},
},
},
};