mirror of
https://github.com/unraid/api.git
synced 2026-02-18 05:58:28 -06:00
fix: tailwind config types
This commit is contained in:
@@ -1,203 +1,201 @@
|
||||
import type { Config } from 'tailwindcss';
|
||||
/** @type {import('tailwindcss').Config} */
|
||||
import type { Config } from "tailwindcss";
|
||||
import type { PluginAPI } from "tailwindcss/types/config";
|
||||
export default <Partial<Config>>{
|
||||
safelist: [
|
||||
'DropdownWrapper_blip',
|
||||
'unraid_mark_1',
|
||||
'unraid_mark_2',
|
||||
'unraid_mark_3',
|
||||
'unraid_mark_4',
|
||||
'unraid_mark_6',
|
||||
'unraid_mark_7',
|
||||
'unraid_mark_8',
|
||||
'unraid_mark_9',
|
||||
"DropdownWrapper_blip",
|
||||
"unraid_mark_1",
|
||||
"unraid_mark_2",
|
||||
"unraid_mark_3",
|
||||
"unraid_mark_4",
|
||||
"unraid_mark_6",
|
||||
"unraid_mark_7",
|
||||
"unraid_mark_8",
|
||||
"unraid_mark_9",
|
||||
],
|
||||
theme: {
|
||||
extend: {
|
||||
fontFamily: {
|
||||
'sans': 'clear-sans,ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji',
|
||||
sans: "clear-sans,ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji",
|
||||
},
|
||||
colors: {
|
||||
inherit: 'inherit',
|
||||
transparent: 'transparent',
|
||||
inherit: "inherit",
|
||||
transparent: "transparent",
|
||||
|
||||
black: '#1c1b1b',
|
||||
'grey-darkest': '#222',
|
||||
'grey-darker': '#606f7b',
|
||||
'grey-dark': '#383735',
|
||||
'grey-mid': '#999999',
|
||||
grey: '#e0e0e0',
|
||||
'grey-light': '#dae1e7',
|
||||
'grey-lighter': '#f1f5f8',
|
||||
'grey-lightest': '#f2f2f2',
|
||||
white: '#ffffff',
|
||||
black: "#1c1b1b",
|
||||
"grey-darkest": "#222",
|
||||
"grey-darker": "#606f7b",
|
||||
"grey-dark": "#383735",
|
||||
"grey-mid": "#999999",
|
||||
grey: "#e0e0e0",
|
||||
"grey-light": "#dae1e7",
|
||||
"grey-lighter": "#f1f5f8",
|
||||
"grey-lightest": "#f2f2f2",
|
||||
white: "#ffffff",
|
||||
|
||||
'orange-dark': '#f15a2c',
|
||||
orange: '#ff8c2f',
|
||||
'unraid-red': '#E22828',
|
||||
"orange-dark": "#f15a2c",
|
||||
orange: "#ff8c2f",
|
||||
"unraid-red": "#E22828",
|
||||
|
||||
alpha: 'var(--color-alpha)',
|
||||
beta: 'var(--color-beta)',
|
||||
gamma: 'var(--color-gamma)',
|
||||
'gamma-opaque': 'var(--color-gamma-opaque)',
|
||||
alpha: "var(--color-alpha)",
|
||||
beta: "var(--color-beta)",
|
||||
gamma: "var(--color-gamma)",
|
||||
"gamma-opaque": "var(--color-gamma-opaque)",
|
||||
},
|
||||
// Unfortunately due to webGUI CSS setting base HTML font-size to .65% or something we must use pixel values for web components
|
||||
fontSize: {
|
||||
'10px': '10px',
|
||||
'12px': '12px',
|
||||
'14px': '14px',
|
||||
'16px': '16px',
|
||||
'18px': '18px',
|
||||
'20px': '20px',
|
||||
'24px': '24px',
|
||||
'30px': '30px',
|
||||
"10px": "10px",
|
||||
"12px": "12px",
|
||||
"14px": "14px",
|
||||
"16px": "16px",
|
||||
"18px": "18px",
|
||||
"20px": "20px",
|
||||
"24px": "24px",
|
||||
"30px": "30px",
|
||||
},
|
||||
spacing: {
|
||||
'-8px': '-8px',
|
||||
'2px': '2px',
|
||||
'4px': '4px',
|
||||
'6px': '6px',
|
||||
'8px': '8px',
|
||||
'10px': '10px',
|
||||
'12px': '12px',
|
||||
'14px': '14px',
|
||||
'16px': '16px',
|
||||
'20px': '20px',
|
||||
'24px': '24px',
|
||||
'28px': '28px',
|
||||
'32px': '32px',
|
||||
'36px': '36px',
|
||||
'40px': '40px',
|
||||
'64px': '64px',
|
||||
'80px': '80px',
|
||||
'90px': '90px',
|
||||
'150px': '150px',
|
||||
'160px': '160px',
|
||||
'200px': '200px',
|
||||
'260px': '260px',
|
||||
'300px': '300px',
|
||||
'310px': '310px',
|
||||
'350px': '350px',
|
||||
'448px': '448px',
|
||||
'512px': '512px',
|
||||
'640px': '640px',
|
||||
'800px': '800px',
|
||||
"-8px": "-8px",
|
||||
"2px": "2px",
|
||||
"4px": "4px",
|
||||
"6px": "6px",
|
||||
"8px": "8px",
|
||||
"10px": "10px",
|
||||
"12px": "12px",
|
||||
"14px": "14px",
|
||||
"16px": "16px",
|
||||
"20px": "20px",
|
||||
"24px": "24px",
|
||||
"28px": "28px",
|
||||
"32px": "32px",
|
||||
"36px": "36px",
|
||||
"40px": "40px",
|
||||
"64px": "64px",
|
||||
"80px": "80px",
|
||||
"90px": "90px",
|
||||
"150px": "150px",
|
||||
"160px": "160px",
|
||||
"200px": "200px",
|
||||
"260px": "260px",
|
||||
"300px": "300px",
|
||||
"310px": "310px",
|
||||
"350px": "350px",
|
||||
"448px": "448px",
|
||||
"512px": "512px",
|
||||
"640px": "640px",
|
||||
"800px": "800px",
|
||||
},
|
||||
minWidth: {
|
||||
'86px': '86px',
|
||||
'160px': '160px',
|
||||
'260px': '260px',
|
||||
'300px': '300px',
|
||||
'310px': '310px',
|
||||
'350px': '350px',
|
||||
'800px': '800px',
|
||||
"86px": "86px",
|
||||
"160px": "160px",
|
||||
"260px": "260px",
|
||||
"300px": "300px",
|
||||
"310px": "310px",
|
||||
"350px": "350px",
|
||||
"800px": "800px",
|
||||
},
|
||||
maxWidth: {
|
||||
'86px': '86px',
|
||||
'160px': '160px',
|
||||
'260px': '260px',
|
||||
'300px': '300px',
|
||||
'310px': '310px',
|
||||
'350px': '350px',
|
||||
'640px': '640px',
|
||||
'800px': '800px',
|
||||
'1024px': '1024px',
|
||||
"86px": "86px",
|
||||
"160px": "160px",
|
||||
"260px": "260px",
|
||||
"300px": "300px",
|
||||
"310px": "310px",
|
||||
"350px": "350px",
|
||||
"640px": "640px",
|
||||
"800px": "800px",
|
||||
"1024px": "1024px",
|
||||
},
|
||||
screens: {
|
||||
'2xs': '470px',
|
||||
xs: '530px',
|
||||
tall: { raw: '(min-height: 700px)' },
|
||||
"2xs": "470px",
|
||||
xs: "530px",
|
||||
tall: { raw: "(min-height: 700px)" },
|
||||
},
|
||||
/**
|
||||
* @todo modify prose classes to use pixels for webgui…sadge https://tailwindcss.com/docs/typography-plugin#customizing-the-default-theme
|
||||
*/
|
||||
// @ts-expect-error - because spending too much time here to figure this out would cost a lot of money
|
||||
typography: theme => ({
|
||||
|
||||
typography: (theme: PluginAPI["theme"]) => ({
|
||||
DEFAULT: {
|
||||
css: {
|
||||
color: theme('colors.beta'),
|
||||
color: theme("colors.beta"),
|
||||
a: {
|
||||
color: theme('colors.orange'),
|
||||
textDecoration: 'underline',
|
||||
'&:hover': {
|
||||
color: theme('colors.orange-dark'),
|
||||
color: theme("colors.orange"),
|
||||
textDecoration: "underline",
|
||||
"&:hover": {
|
||||
color: theme("colors.orange-dark"),
|
||||
},
|
||||
},
|
||||
'--tw-prose-body': theme('colors.beta'),
|
||||
'--tw-prose-headings': theme('colors.beta'),
|
||||
'--tw-prose-lead': theme('colors.beta'),
|
||||
'--tw-prose-links': theme('colors.orange'),
|
||||
'--tw-prose-bold': theme('colors.beta'),
|
||||
'--tw-prose-counters': theme('colors.beta'),
|
||||
'--tw-prose-bullets': theme('colors.beta'),
|
||||
'--tw-prose-hr': theme('colors.beta'),
|
||||
'--tw-prose-quotes': theme('colors.beta'),
|
||||
'--tw-prose-quote-borders': theme('colors.beta'),
|
||||
'--tw-prose-captions': theme('colors.beta'),
|
||||
'--tw-prose-code': theme('colors.beta'),
|
||||
'--tw-prose-pre-code': theme('colors.beta'),
|
||||
'--tw-prose-pre-bg': theme('colors.alpha'),
|
||||
'--tw-prose-th-borders': theme('colors.beta'),
|
||||
'--tw-prose-td-borders': theme('colors.beta'),
|
||||
'--tw-prose-invert-body': theme('colors.alpha'),
|
||||
'--tw-prose-invert-headings': theme('colors.alpha'),
|
||||
'--tw-prose-invert-lead': theme('colors.alpha'),
|
||||
'--tw-prose-invert-links': theme('colors.orange'),
|
||||
'--tw-prose-invert-bold': theme('colors.alpha'),
|
||||
'--tw-prose-invert-counters': theme('colors.alpha'),
|
||||
'--tw-prose-invert-bullets': theme('colors.alpha'),
|
||||
'--tw-prose-invert-hr': theme('colors.alpha'),
|
||||
'--tw-prose-invert-quotes': theme('colors.alpha'),
|
||||
'--tw-prose-invert-quote-borders': theme('colors.alpha'),
|
||||
'--tw-prose-invert-captions': theme('colors.alpha'),
|
||||
'--tw-prose-invert-code': theme('colors.alpha'),
|
||||
'--tw-prose-invert-code-bg': theme('colors.gamma-opaque'),
|
||||
'--tw-prose-invert-pre-code': theme('colors.alpha'),
|
||||
'--tw-prose-invert-pre-bg': theme('colors.beta'),
|
||||
'--tw-prose-invert-th-borders': theme('colors.alpha'),
|
||||
'--tw-prose-invert-td-borders': theme('colors.alpha'),
|
||||
"--tw-prose-body": theme("colors.beta"),
|
||||
"--tw-prose-headings": theme("colors.beta"),
|
||||
"--tw-prose-lead": theme("colors.beta"),
|
||||
"--tw-prose-links": theme("colors.orange"),
|
||||
"--tw-prose-bold": theme("colors.beta"),
|
||||
"--tw-prose-counters": theme("colors.beta"),
|
||||
"--tw-prose-bullets": theme("colors.beta"),
|
||||
"--tw-prose-hr": theme("colors.beta"),
|
||||
"--tw-prose-quotes": theme("colors.beta"),
|
||||
"--tw-prose-quote-borders": theme("colors.beta"),
|
||||
"--tw-prose-captions": theme("colors.beta"),
|
||||
"--tw-prose-code": theme("colors.beta"),
|
||||
"--tw-prose-pre-code": theme("colors.beta"),
|
||||
"--tw-prose-pre-bg": theme("colors.alpha"),
|
||||
"--tw-prose-th-borders": theme("colors.beta"),
|
||||
"--tw-prose-td-borders": theme("colors.beta"),
|
||||
"--tw-prose-invert-body": theme("colors.alpha"),
|
||||
"--tw-prose-invert-headings": theme("colors.alpha"),
|
||||
"--tw-prose-invert-lead": theme("colors.alpha"),
|
||||
"--tw-prose-invert-links": theme("colors.orange"),
|
||||
"--tw-prose-invert-bold": theme("colors.alpha"),
|
||||
"--tw-prose-invert-counters": theme("colors.alpha"),
|
||||
"--tw-prose-invert-bullets": theme("colors.alpha"),
|
||||
"--tw-prose-invert-hr": theme("colors.alpha"),
|
||||
"--tw-prose-invert-quotes": theme("colors.alpha"),
|
||||
"--tw-prose-invert-quote-borders": theme("colors.alpha"),
|
||||
"--tw-prose-invert-captions": theme("colors.alpha"),
|
||||
"--tw-prose-invert-code": theme("colors.alpha"),
|
||||
"--tw-prose-invert-code-bg": theme("colors.gamma-opaque"),
|
||||
"--tw-prose-invert-pre-code": theme("colors.alpha"),
|
||||
"--tw-prose-invert-pre-bg": theme("colors.beta"),
|
||||
"--tw-prose-invert-th-borders": theme("colors.alpha"),
|
||||
"--tw-prose-invert-td-borders": theme("colors.alpha"),
|
||||
},
|
||||
},
|
||||
black: {
|
||||
css: {
|
||||
'--tw-prose-body': theme('colors.black'),
|
||||
'--tw-prose-headings': theme('colors.black'),
|
||||
'--tw-prose-lead': theme('colors.black'),
|
||||
'--tw-prose-links': theme('colors.black'),
|
||||
'--tw-prose-bold': theme('colors.black'),
|
||||
'--tw-prose-counters': theme('colors.black'),
|
||||
'--tw-prose-bullets': theme('colors.black'),
|
||||
'--tw-prose-hr': theme('colors.black'),
|
||||
'--tw-prose-quotes': theme('colors.black'),
|
||||
'--tw-prose-quote-borders': theme('colors.black'),
|
||||
'--tw-prose-captions': theme('colors.black'),
|
||||
'--tw-prose-code': theme('colors.black'),
|
||||
'--tw-prose-pre-code': theme('colors.black'),
|
||||
'--tw-prose-pre-bg': theme('colors.black'),
|
||||
'--tw-prose-th-borders': theme('colors.black'),
|
||||
'--tw-prose-td-borders': theme('colors.black'),
|
||||
'--tw-prose-invert-body': theme('colors.grey-darkest'),
|
||||
'--tw-prose-invert-headings': theme('colors.grey-darkest'),
|
||||
'--tw-prose-invert-lead': theme('colors.grey-darkest'),
|
||||
'--tw-prose-invert-links': theme('colors.grey-darkest'),
|
||||
'--tw-prose-invert-bold': theme('colors.grey-darkest'),
|
||||
'--tw-prose-invert-counters': theme('colors.grey-darkest'),
|
||||
'--tw-prose-invert-bullets': theme('colors.grey-darkest'),
|
||||
'--tw-prose-invert-hr': theme('colors.grey-darkest'),
|
||||
'--tw-prose-invert-quotes': theme('colors.grey-darkest'),
|
||||
'--tw-prose-invert-quote-borders': theme('colors.grey-darkest'),
|
||||
'--tw-prose-invert-captions': theme('colors.grey-darkest'),
|
||||
'--tw-prose-invert-code': theme('colors.grey-darkest'),
|
||||
'--tw-prose-invert-pre-code': theme('colors.grey-darkest'),
|
||||
'--tw-prose-invert-pre-bg': 'rgb(0 0 0 / 50%)',
|
||||
'--tw-prose-invert-th-borders': theme('colors.grey-darkest'),
|
||||
'--tw-prose-invert-td-borders': theme('colors.grey-darkest'),
|
||||
"--tw-prose-body": theme("colors.black"),
|
||||
"--tw-prose-headings": theme("colors.black"),
|
||||
"--tw-prose-lead": theme("colors.black"),
|
||||
"--tw-prose-links": theme("colors.black"),
|
||||
"--tw-prose-bold": theme("colors.black"),
|
||||
"--tw-prose-counters": theme("colors.black"),
|
||||
"--tw-prose-bullets": theme("colors.black"),
|
||||
"--tw-prose-hr": theme("colors.black"),
|
||||
"--tw-prose-quotes": theme("colors.black"),
|
||||
"--tw-prose-quote-borders": theme("colors.black"),
|
||||
"--tw-prose-captions": theme("colors.black"),
|
||||
"--tw-prose-code": theme("colors.black"),
|
||||
"--tw-prose-pre-code": theme("colors.black"),
|
||||
"--tw-prose-pre-bg": theme("colors.black"),
|
||||
"--tw-prose-th-borders": theme("colors.black"),
|
||||
"--tw-prose-td-borders": theme("colors.black"),
|
||||
"--tw-prose-invert-body": theme("colors.grey-darkest"),
|
||||
"--tw-prose-invert-headings": theme("colors.grey-darkest"),
|
||||
"--tw-prose-invert-lead": theme("colors.grey-darkest"),
|
||||
"--tw-prose-invert-links": theme("colors.grey-darkest"),
|
||||
"--tw-prose-invert-bold": theme("colors.grey-darkest"),
|
||||
"--tw-prose-invert-counters": theme("colors.grey-darkest"),
|
||||
"--tw-prose-invert-bullets": theme("colors.grey-darkest"),
|
||||
"--tw-prose-invert-hr": theme("colors.grey-darkest"),
|
||||
"--tw-prose-invert-quotes": theme("colors.grey-darkest"),
|
||||
"--tw-prose-invert-quote-borders": theme("colors.grey-darkest"),
|
||||
"--tw-prose-invert-captions": theme("colors.grey-darkest"),
|
||||
"--tw-prose-invert-code": theme("colors.grey-darkest"),
|
||||
"--tw-prose-invert-pre-code": theme("colors.grey-darkest"),
|
||||
"--tw-prose-invert-pre-bg": "rgb(0 0 0 / 50%)",
|
||||
"--tw-prose-invert-th-borders": theme("colors.grey-darkest"),
|
||||
"--tw-prose-invert-td-borders": theme("colors.grey-darkest"),
|
||||
},
|
||||
},
|
||||
}),
|
||||
}
|
||||
},
|
||||
},
|
||||
plugins: [
|
||||
require('@tailwindcss/typography'),
|
||||
],
|
||||
plugins: [require("@tailwindcss/typography")],
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user