mirror of
https://github.com/ershisan99/DevToysWeb.git
synced 2025-12-16 12:32:48 +00:00
f1c3bd2971
recreate project by using https://github.com/shadcn/next-template App: - support dark mode - add toggle theme button - add clear search button - add search button - add current page indicator - add tool group pages - add settings tool - add 1 tab format option to Json format tool - add paste button to some tools - add file button to some tools - add copy button to some tools - add clear button to some tools - change favicon - change search hit rate - change each page title - change icons from Material Icons to Lucide - change sidebar scroll area - change editor from Ace to Monaco - change parsable separators of number base converter - change default value of format option of number base converter - change default values of some tool forms - change some styles - remove disabled tools - remove real-time search - fix uri encoding tool Dev: - MUI + Emotion -> Radix UI + Tailwind CSS - Next.js 12 Pages -> Next.js 13 App Router - React 17 -> React 18 - many other packages upgraded - use useState instead of recoil - use Next.js typedRoutes instead of pathpida - clean npm scripts - format import statements by Prettier - no component separations between container and presenter - effective component memoizations - add vscode settings - many refactors
108 lines
3.3 KiB
JavaScript
108 lines
3.3 KiB
JavaScript
const { fontFamily } = require("tailwindcss/defaultTheme");
|
|
|
|
/** @type {import('tailwindcss').Config} */
|
|
module.exports = {
|
|
darkMode: ["class"],
|
|
content: ["app/**/*.{ts,tsx}", "components/**/*.{ts,tsx}"],
|
|
theme: {
|
|
extend: {
|
|
colors: {
|
|
background: "hsl(var(--background))",
|
|
foreground: "hsl(var(--foreground))",
|
|
muted: {
|
|
DEFAULT: "hsl(var(--muted))",
|
|
foreground: "hsl(var(--muted-foreground))",
|
|
},
|
|
accent: {
|
|
DEFAULT: "hsl(var(--accent))",
|
|
foreground: "hsl(var(--accent-foreground))",
|
|
},
|
|
border: "hsl(var(--border))",
|
|
separator: "hsl(var(--separator))",
|
|
page: "hsl(var(--page))",
|
|
card: {
|
|
DEFAULT: "hsl(var(--card))",
|
|
foreground: "hsl(var(--card-foreground))",
|
|
hover: "hsl(var(--card-hover))",
|
|
icon: {
|
|
DEFAULT: "hsl(var(--card-icon))",
|
|
hover: "hsl(var(--card-icon-hover))",
|
|
},
|
|
muted: {
|
|
foreground: "hsl(var(--card-muted-foreground))",
|
|
},
|
|
},
|
|
configuration: "hsl(var(--configuration))",
|
|
switch: {
|
|
DEFAULT: "hsl(var(--switch))",
|
|
hover: "hsl(var(--switch-hover))",
|
|
},
|
|
select: {
|
|
DEFAULT: "hsl(var(--select))",
|
|
hover: "hsl(var(--select-hover))",
|
|
content: {
|
|
DEFAULT: "hsl(var(--select-content))",
|
|
foreground: "hsl(var(--select-content-foreground))",
|
|
},
|
|
item: {
|
|
hover: "hsl(var(--select-item-hover))",
|
|
},
|
|
},
|
|
input: {
|
|
DEFAULT: "hsl(var(--input))",
|
|
hover: "hsl(var(--input-hover))",
|
|
focus: "hsl(var(--input-focus))",
|
|
},
|
|
textarea: {
|
|
DEFAULT: "hsl(var(--textarea))",
|
|
hover: "hsl(var(--textarea-hover))",
|
|
focus: "hsl(var(--textarea-focus))",
|
|
},
|
|
primary: {
|
|
DEFAULT: "hsl(var(--primary))",
|
|
foreground: "hsl(var(--primary-foreground))",
|
|
hover: "hsl(var(--primary-hover))",
|
|
},
|
|
secondary: {
|
|
DEFAULT: "hsl(var(--secondary))",
|
|
foreground: "hsl(var(--secondary-foreground))",
|
|
hover: "hsl(var(--secondary-hover))",
|
|
},
|
|
tooltip: {
|
|
DEFAULT: "hsl(var(--tooltip))",
|
|
foreground: "hsl(var(--tooltip-foreground))",
|
|
},
|
|
indicator: {
|
|
DEFAULT: "hsl(var(--indicator))",
|
|
hover: "hsl(var(--indicator-hover))",
|
|
},
|
|
link: "hsl(var(--link))",
|
|
},
|
|
borderRadius: {
|
|
lg: "var(--radius)",
|
|
md: "calc(var(--radius) - 2px)",
|
|
sm: "calc(var(--radius) - 4px)",
|
|
},
|
|
fontFamily: {
|
|
sans: ["var(--font-sans)", ...fontFamily.sans],
|
|
mono: ["var(--font-mono)", ...fontFamily.mono],
|
|
},
|
|
keyframes: {
|
|
"accordion-down": {
|
|
from: { height: 0 },
|
|
to: { height: "var(--radix-accordion-content-height)" },
|
|
},
|
|
"accordion-up": {
|
|
from: { height: "var(--radix-accordion-content-height)" },
|
|
to: { height: 0 },
|
|
},
|
|
},
|
|
animation: {
|
|
"accordion-down": "accordion-down 0.2s ease-out",
|
|
"accordion-up": "accordion-up 0.2s ease-out",
|
|
},
|
|
},
|
|
},
|
|
plugins: [require("tailwindcss-animate")],
|
|
};
|