130 |
140 |
143 |
144 |
145 |
147 |
2 |
4 |
5 |
10 |
15 |
16 | ##
17 |
18 | ## 桌面版预览
19 |
20 | 
21 |
22 | ## 网页版预览
23 |
24 | 
25 |
26 | ## 网页端和桌面端的一些区别
27 |
28 | - 网页端使用的FileSystemHandle的move api，兼容性较差，推荐使用最新版本的chrome浏览器。客户端是原生API，兼容性没问题。
29 | - 网页端会有额外的操作权限确认，这是浏览器本身的安全处理。客户端没有。
30 | - 配置数据网页端是存储在indexedDB，桌面端是存储在文件
31 |
32 | ## 功能
33 |
34 | - 支持拖拽添加文件和文件夹
35 | - 支持创建多个配置
36 | - 单个配置内支持多个规则
37 | - 支持js脚本，内置Monaco Editor。
38 | - 跨平台，支持windows,macos,linux
--------------------------------------------------------------------------------
/biome.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "https://biomejs.dev/schemas/1.7.3/schema.json",
3 | "organizeImports": {
4 | "enabled": true
5 | },
6 | "linter": {
7 | "enabled": true,
8 | "rules": {
9 | "recommended": true,
10 | "nursery": {
11 | "useSortedClasses": "warn"
12 | },
13 | "a11y": {
14 | "useButtonType": "off",
15 | "useKeyWithClickEvents": "off"
16 | },
17 | "style": {
18 | "noNonNullAssertion": "off"
19 | },
20 | "correctness": {
21 | "noUnusedImports": "error"
22 | }
23 | }
24 | },
25 | "formatter": {
26 | "indentWidth": 2,
27 | "indentStyle": "space"
28 | },
29 | "javascript": {
30 | "formatter": {
31 | "quoteStyle": "single"
32 | }
33 | }
34 | }
35 |
--------------------------------------------------------------------------------
/components.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "https://ui.shadcn.com/schema.json",
3 | "style": "new-york",
4 | "rsc": false,
5 | "tsx": true,
6 | "tailwind": {
7 | "config": "tailwind.config.js",
8 | "css": "src/styles.css",
9 | "baseColor": "slate",
10 | "cssVariables": true,
11 | "prefix": ""
12 | },
13 | "aliases": {
14 | "components": "@/components",
15 | "utils": "@/lib/utils"
16 | }
17 | }
--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 | 3 |
4 |
5 | 
6 |
7 |
8 | FreeReNamer
9 |
10 | 功能强大又易用的文件批量重命名软件
11 |网页版在线体验：https://renamer.cyhuajuan.site
12 |客户端下载：release
13 | 14 |App
;
5 | };
6 |
--------------------------------------------------------------------------------
/src/components/file/file-item.tsx:
--------------------------------------------------------------------------------
1 | import { useQuery } from '@tanstack/react-query';
2 | import { useMemo, type FC } from 'react';
3 | import { fileItemInfoQueryOptions } from '@/lib/queries/file';
4 | import { atomStore, selectedFilesAtom } from '@/lib/atoms';
5 | import { Checkbox } from '../ui/checkbox';
6 | import { useAtomValue } from 'jotai';
7 |
8 | export interface FileItemProps {
9 | file: string;
10 | profileId: string;
11 | index: number;
12 | }
13 |
14 | export const FileItem: FC
40 |
44 | );
45 | }
46 |
47 | if (!fileItemInfo) {
48 | return null;
49 | }
50 |
51 | return (
52 |
41 | {error as unknown as string}
42 |
43 |
53 |
66 | );
67 | };
68 |
--------------------------------------------------------------------------------
/src/components/file/files-panel.tauri.tsx:
--------------------------------------------------------------------------------
1 | import {
2 | atomStore,
3 | filesAtom,
4 | selectedFilesAtom,
5 | type FilesAtomTauri,
6 | } from '@/lib/atoms';
7 | import { listen } from '@tauri-apps/api/event';
8 | import { useAtomValue } from 'jotai';
9 | import { useEffect, useMemo, type FC } from 'react';
10 | import { FileItem } from './file-item';
11 | import { Button } from '../ui/button';
12 | import { ScrollArea } from '../ui/scroll-area';
13 | import { open } from '@tauri-apps/api/dialog';
14 | import { invoke } from '@tauri-apps/api';
15 | import { Checkbox } from '../ui/checkbox';
16 |
17 | export interface FilesPanelProps {
18 | profileId: string;
19 | }
20 |
21 | const FilesPanel: FC
54 |
56 |
57 | {index + 1}
58 |
59 |
60 | {fileItemInfo.fileInfo.fullName}
61 |
62 |
63 | {fileItemInfo.preview}
64 |
65 |
111 |
139 |
152 |
153 | );
154 | };
155 |
156 | export default FilesPanel;
157 |
--------------------------------------------------------------------------------
/src/components/file/files-panel.tsx:
--------------------------------------------------------------------------------
1 | import { lazy, type FC } from 'react';
2 |
3 | const FilesPanelTauri = lazy(() => import('./files-panel.tauri'));
4 | const FilesPanelWeb = lazy(() => import('./files-panel.web'));
5 |
6 | export interface FilesPanelProps {
7 | profileId: string;
8 | }
9 |
10 | export const FilesPanel: FC
112 |
128 |
113 |
116 |
119 |
120 |
121 | {selectedFiles.length > 0 && (
122 |
125 | )}
126 |
127 |
129 |
138 |
130 |
132 |
133 | 序号
134 |
135 | 文件名
136 | 预览
137 |
140 | {files.map((file, i) => {
141 | return (
142 |
151 |
123 |
151 |
164 |
165 | );
166 | };
167 |
168 | export default FilesPanel;
169 |
--------------------------------------------------------------------------------
/src/components/global/global-alert.tsx:
--------------------------------------------------------------------------------
1 | import { globalAlertInfoAtom } from '@/lib/atoms';
2 | import { useAtom } from 'jotai';
3 | import type { FC } from 'react';
4 | import {
5 | AlertDialog,
6 | AlertDialogContent,
7 | AlertDialogDescription,
8 | AlertDialogFooter,
9 | AlertDialogHeader,
10 | AlertDialogTitle,
11 | } from '../ui/alert-dialog';
12 |
13 | export const GlobalAlert: FC = () => {
14 | const [alertInfo, setAlertInfo] = useAtom(globalAlertInfoAtom);
15 |
16 | function onOpenChange(opened: boolean) {
17 | setAlertInfo((prev) => ({ ...prev, opened }));
18 | }
19 |
20 | return (
21 |
124 |
140 |
125 |
128 |
131 |
132 |
133 | {selectedFiles.length > 0 && (
134 |
137 | )}
138 |
139 |
141 |
150 |
142 |
144 |
145 | 序号
146 |
147 | 文件名
148 | 预览
149 |
152 | {files.map((file, i) => {
153 | return (
154 |
163 |
11 | {profileIds.map((profileId) => {
12 | return (
13 |
21 | );
22 | };
23 |
--------------------------------------------------------------------------------
/src/components/profile/profile-nav.tsx:
--------------------------------------------------------------------------------
1 | import { profileQueryOptions } from '@/lib/queries/profile';
2 | import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
3 | import { Link, useNavigate, useParams } from '@tanstack/react-router';
4 | import type { FC } from 'react';
5 | import {
6 | ContextMenu,
7 | ContextMenuContent,
8 | ContextMenuItem,
9 | ContextMenuTrigger,
10 | } from '../ui/context-menu';
11 | import { showConfirm, showRenameDialog } from '@/lib/ui';
12 | import { delProfile, updateProfile } from '@/lib/profile';
13 | import { QueryType } from '@/lib/query';
14 |
15 | export interface ProfileNavProps {
16 | id: string;
17 | disableDel?: boolean;
18 | }
19 |
20 | export const ProfileNav: FC
30 | {allowChangeType && (
31 |
32 |
47 | )}
48 |
86 | );
87 | };
88 |
--------------------------------------------------------------------------------
/src/components/rule/rule-form-render.tsx:
--------------------------------------------------------------------------------
1 | import { Suspense, lazy, type FC } from 'react';
2 | import { RuleReplaceForm } from './rule-type-froms/rule-replace-form';
3 | import { RuleDeleteForm } from './rule-type-froms/rule-delete-form';
4 | import { IconLoader2 } from '@tabler/icons-react';
5 | import { RuleFormatForm } from './rule-type-froms/rule-format-form';
6 | import { RuleTemplateForm } from './rule-type-froms/rule-template-form';
7 | import {
8 | RULE_DELETE_TYPE,
9 | RULE_FORMAT_TYPE,
10 | RULE_INSERT_TYPE,
11 | RULE_REPLACE_TYPE,
12 | RULE_SCRIPT_TYPE,
13 | RULE_TEMPLATE_TYPE,
14 | } from '@/lib/rules';
15 | import { RuleInsertForm } from './rule-type-froms/rule-insert-form';
16 |
17 | const RuleScriptForm = lazy(() => import('./rule-type-froms/rule-script-form'));
18 |
19 | export interface RuleFormRenderProps {
20 | type: string;
21 | }
22 |
23 | export const RuleFormRender: FC
33 | {ruleDefines.map((ruleDefine) => (
34 |
46 |
37 | form.reset(getRuleTypeDefaultValue(ruleDefine.type))
38 | }
39 | data-active={typeValue === ruleDefine.type || null}
40 | className="flex h-8 w-full cursor-default items-center justify-center rounded text-sm transition-colors data-[active]:bg-primary hover:bg-accent data-[active]:text-primary-foreground hover:text-accent-foreground"
41 | >
42 | {ruleDefine.label}
43 |
44 | ))}
45 |
49 |
65 |
84 |
85 |
40 |
41 | {rule.name}
42 |
43 |
44 | {label}
45 |
46 |
47 | {description}
48 |
49 |
53 |
50 |
52 |
18 |
95 | );
96 | };
97 |
--------------------------------------------------------------------------------
/src/components/rule/rule-type-froms/rule-format-form.tsx:
--------------------------------------------------------------------------------
1 | import {
2 | FormControl,
3 | FormField,
4 | FormItem,
5 | FormLabel,
6 | } from '@/components/ui/form';
7 | import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';
8 | import {
9 | type RULE_FORMAT_TYPE,
10 | RULE_FORMAT_TYPES,
11 | RULE_FORMAT_TYPE_LABELS,
12 | type Rule,
13 | type RuleFormatInfo,
14 | } from '@/lib/rule';
15 | import type { FC } from 'react';
16 | import { useFormContext } from 'react-hook-form';
17 |
18 | export const RuleFormatForm: FC = () => {
19 | const form = useFormContext
19 | (
23 |
24 | 查找
25 |
26 |
27 |
28 |
29 | )}
30 | />
31 |
32 |
33 | (
37 |
38 |
39 |
44 | 使用正则表达式
45 |
46 | )}
47 | />
48 | (
52 |
53 |
54 |
59 | 区分大小写
60 |
61 | )}
62 | />
63 | (
67 |
68 |
69 |
74 | 匹配所有符合项
75 |
76 | )}
77 | />
78 | (
82 |
83 |
84 |
89 | 包含扩展名
90 |
91 | )}
92 | />
93 |
94 |
23 | (
27 |
28 | 格式化类型
29 |
30 |
34 | {RULE_FORMAT_TYPES.map((formatType) => (
35 |
39 |
40 |
42 | {RULE_FORMAT_TYPE_LABELS[formatType]}
43 |
44 | ))}
45 |
46 |
47 |
48 | )}
49 | />
50 |
51 | );
52 | };
53 |
--------------------------------------------------------------------------------
/src/components/rule/rule-type-froms/rule-insert-form.tsx:
--------------------------------------------------------------------------------
1 | import { Checkbox } from '@/components/ui/checkbox';
2 | import {
3 | FormField,
4 | FormItem,
5 | FormLabel,
6 | FormControl,
7 | } from '@/components/ui/form';
8 | import { Input } from '@/components/ui/input';
9 | import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';
10 | import {
11 | RULE_INSERT_TYPES,
12 | RULE_INSET_TYPE_LABELS,
13 | type RULE_INSERT_TYPE,
14 | type Rule,
15 | type RuleInsertInfo,
16 | } from '@/lib/rules';
17 | import type { FC } from 'react';
18 | import { useFormContext } from 'react-hook-form';
19 |
20 | export const RuleInsertForm: FC = () => {
21 | const form = useFormContext
25 | (
29 |
30 | 内容
31 |
32 |
37 |
38 |
39 | )}
40 | />
41 | (
45 |
46 | 插入类型
47 |
48 |
52 | {RULE_INSERT_TYPES.map((insertType) => (
53 |
57 |
58 |
60 | {RULE_INSET_TYPE_LABELS[insertType]}
61 |
62 | ))}
63 |
64 |
65 |
66 | )}
67 | />
68 | (
72 |
73 |
74 |
79 | 包含扩展名
80 |
81 | )}
82 | />
83 |
84 | );
85 | };
86 |
--------------------------------------------------------------------------------
/src/components/rule/rule-type-froms/rule-replace-form.tsx:
--------------------------------------------------------------------------------
1 | import { Checkbox } from '@/components/ui/checkbox';
2 | import {
3 | FormControl,
4 | FormField,
5 | FormItem,
6 | FormLabel,
7 | } from '@/components/ui/form';
8 | import { Input } from '@/components/ui/input';
9 | import type { RULE_REPLACE_TYPE, Rule, RuleReplaceInfo } from '@/lib/rule';
10 | import type { FC } from 'react';
11 | import { useFormContext } from 'react-hook-form';
12 |
13 | export const RuleReplaceForm: FC = () => {
14 | const form =
15 | useFormContext
19 |
108 | );
109 | };
110 |
--------------------------------------------------------------------------------
/src/components/rule/rule-type-froms/rule-script-form-worker.ts:
--------------------------------------------------------------------------------
1 | import * as monaco from 'monaco-editor';
2 | import editorWorker from 'monaco-editor/esm/vs/editor/editor.worker?worker';
3 | import tsWorker from 'monaco-editor/esm/vs/language/typescript/ts.worker?worker';
4 |
5 | // @ts-ignore
6 | self.MonacoEnvironment = {
7 | getWorker(_: unknown, label: string) {
8 | if (label === 'typescript' || label === 'javascript') {
9 | return new tsWorker();
10 | }
11 | return new editorWorker();
12 | },
13 | };
14 |
15 | monaco.languages.typescript.javascriptDefaults.addExtraLib(
16 | `
17 | var args: { fileInfo: { name: string; ext: string; fullName: string; }, index: number };
18 | `,
19 | );
20 | monaco.languages.typescript.typescriptDefaults.setEagerModelSync(true);
21 |
--------------------------------------------------------------------------------
/src/components/rule/rule-type-froms/rule-script-form.module.css:
--------------------------------------------------------------------------------
1 | .editor {
2 | width: 100%;
3 | height: 100%;
4 |
5 | &> div {
6 | outline: none !important;
7 | }
8 | }
--------------------------------------------------------------------------------
/src/components/rule/rule-type-froms/rule-script-form.tsx:
--------------------------------------------------------------------------------
1 | import type { RULE_SCRIPT_TYPE, Rule, RuleScriptInfo } from '@/lib/rule';
2 | import * as monaco from 'monaco-editor/esm/vs/editor/editor.api';
3 | import { useEffect, useRef, type FC } from 'react';
4 | import { useFormContext } from 'react-hook-form';
5 | import './rule-script-form-worker';
6 | import classes from './rule-script-form.module.css';
7 |
8 | const RuleScriptForm: FC = () => {
9 | const form = useFormContext
20 | (
24 |
25 | 查找
26 |
27 |
28 |
29 |
30 | )}
31 | />
32 | (
36 |
37 | 替换
38 |
39 |
40 |
41 |
42 | )}
43 | />
44 |
45 |
46 | (
50 |
51 |
52 |
57 | 使用正则表达式
58 |
59 | )}
60 | />
61 | (
65 |
66 |
67 |
72 | 区分大小写
73 |
74 | )}
75 | />
76 | (
80 |
81 |
82 |
87 | 匹配所有符合项
88 |
89 | )}
90 | />
91 | (
95 |
96 |
97 |
102 | 包含扩展名
103 |
104 | )}
105 | />
106 |
107 |
42 |
43 |
44 | );
45 | };
46 |
47 | export default RuleScriptForm;
48 |
--------------------------------------------------------------------------------
/src/components/rule/rule-type-froms/rule-template-form.tsx:
--------------------------------------------------------------------------------
1 | import { Checkbox } from '@/components/ui/checkbox';
2 | import {
3 | FormField,
4 | FormItem,
5 | FormLabel,
6 | FormControl,
7 | } from '@/components/ui/form';
8 | import { Input } from '@/components/ui/input';
9 | import type { RULE_TEMPLATE_TYPE, Rule, RuleTemplateInfo } from '@/lib/rules';
10 | import type { FC } from 'react';
11 | import { useFormContext } from 'react-hook-form';
12 |
13 | export const RuleTemplateForm: FC = () => {
14 | const form =
15 | useFormContext
19 | (
23 |
24 | 模板
25 |
26 |
27 |
28 |
39 | )}
40 | />
41 | (
45 |
46 |
47 |
52 | 包含扩展名
53 |
54 | )}
55 | />
56 |
57 | );
58 | };
59 |
--------------------------------------------------------------------------------
/src/components/rule/rules-panel.tsx:
--------------------------------------------------------------------------------
1 | import { useEffect, useState, type FC } from 'react';
2 | import { Button } from '../ui/button';
3 | import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
4 | import { profileQueryOptions } from '@/lib/queries/profile';
5 | import { RuleItem } from './rule-item';
6 | import {
7 | Dialog,
8 | DialogClose,
9 | DialogContent,
10 | DialogHeader,
11 | DialogTitle,
12 | } from '../ui/dialog';
13 | import { RuleEditPanel } from './rule-edit-panel';
14 | import { useForm } from 'react-hook-form';
15 | import { Form } from '../ui/form';
16 | import {
17 | getRuleTypeDefaultValue,
18 | type Rule,
19 | RULE_REPLACE_TYPE,
20 | } from '@/lib/rule';
21 | import { updateProfile } from '@/lib/profile';
22 | import { QueryType } from '@/lib/query';
23 | import { ScrollArea } from '../ui/scroll-area';
24 | import { RuleEditDialog } from './rule-edit-dialog';
25 |
26 | export interface RulesPanelProps {
27 | profileId: string;
28 | }
29 |
30 | export const RulesPanel: FC29 | 示例：文件：[xxx.mp4] 模板： 30 | {'[File-${fileInfo.name}] 输出：File-xxx.mp4'} 31 |
32 |33 | 支持的变量：fileInfo.name、fileInfo.fullName、fileInfo.ext、index 34 |
35 |36 | 支持js逻辑运算，比如：{'${index + 1}'} 37 |
38 |
175 |
189 |
205 |
206 |
231 |
176 |
179 |
180 |
181 | 名称
182 |
183 | 规则
184 |
185 | 说明
186 |
187 |
188 |
190 | {profile?.rules?.map((rule) => {
191 | return (
192 | deleteRule(rule.id)}
196 | onSwitch={(checked) =>
197 | updateRuleChecked({ ruleId: rule.id, checked })
198 | }
199 | onEdit={() => setTargetEditRule(rule)}
200 | />
201 | );
202 | })}
203 |
204 | 162 | {body} 163 |
164 | ); 165 | }); 166 | FormMessage.displayName = 'FormMessage'; 167 | 168 | export { 169 | useFormField, 170 | Form, 171 | FormItem, 172 | FormLabel, 173 | FormControl, 174 | FormDescription, 175 | FormMessage, 176 | FormField, 177 | }; 178 | -------------------------------------------------------------------------------- /src/components/ui/input.tsx: -------------------------------------------------------------------------------- 1 | import * as React from "react" 2 | 3 | import { cn } from "@/lib/utils" 4 | 5 | export interface InputProps 6 | extends React.InputHTMLAttributes
10 |
14 | ),
15 | },
16 | );
17 |
--------------------------------------------------------------------------------
/src/routes/index.tsx:
--------------------------------------------------------------------------------
1 | import { DEFAULT_PROFILE, addProfile } from '@/lib/profile';
2 | import { profileIdsQueryOptions } from '@/lib/queries/profile';
3 | import { createFileRoute, redirect } from '@tanstack/react-router';
4 |
5 | export const Route = createFileRoute('/')({
6 | beforeLoad: async ({ context: { queryClient } }) => {
7 | const profileIds = await queryClient.fetchQuery(profileIdsQueryOptions);
8 |
9 | if (profileIds.length > 0) {
10 | throw redirect({
11 | to: '/profile/$profileId',
12 | params: {
13 | profileId: profileIds[0],
14 | },
15 | });
16 | }
17 |
18 | const newProfileId = await addProfile(DEFAULT_PROFILE);
19 |
20 | throw redirect({
21 | to: '/profile/$profileId',
22 | params: {
23 | profileId: newProfileId,
24 | },
25 | });
26 | },
27 | });
28 |
--------------------------------------------------------------------------------
/src/routes/profile/$profileId.tsx:
--------------------------------------------------------------------------------
1 | import { FilesPanel } from '@/components/file/files-panel';
2 | import { RulesPanel } from '@/components/rule/rules-panel';
3 | import { createFileRoute } from '@tanstack/react-router';
4 | import { Suspense } from 'react';
5 |
6 | export const Route = createFileRoute('/profile/$profileId')({
7 | component: Component,
8 | });
9 |
10 | function Component() {
11 | const { profileId } = Route.useParams();
12 |
13 | return (
14 |
15 |
21 |
25 |
26 | );
27 | }
28 |
--------------------------------------------------------------------------------
/src/routes/profile/route.tsx:
--------------------------------------------------------------------------------
1 | import { ProfileNavList } from '@/components/profile/profile-nav-list';
2 | import { createFileRoute, Outlet, useParams } from '@tanstack/react-router';
3 | import { useState } from 'react';
4 | import { useSpring, animated } from '@react-spring/web';
5 | import { Button } from '@/components/ui/button';
6 | import { useMutation, useQueryClient } from '@tanstack/react-query';
7 | import { addProfile, getProfile, type Profile } from '@/lib/profile';
8 | import { QueryType } from '@/lib/query';
9 | import { IconLayoutSidebarLeftCollapse } from '@tabler/icons-react';
10 | import { atomStore, filesAtom } from '@/lib/atoms';
11 | import { execRules } from '@/lib/rule';
12 | import { getFileInfo } from '@/lib/file';
13 | import { ScrollArea } from '@/components/ui/scroll-area';
14 | import { showConfirm } from '@/lib/ui';
15 |
16 | export const Route = createFileRoute('/profile')({
17 | component: Component,
18 | });
19 |
20 | function Component() {
21 | const queryClient = useQueryClient();
22 | const params = useParams({ from: '/profile/$profileId' });
23 | const [sidePanelOpened, setSidePanelOpened] = useState(false);
24 |
25 | const navStyle = useSpring({
26 | width: sidePanelOpened ? 240 : 0,
27 | opacity: sidePanelOpened ? 1 : 0,
28 | });
29 |
30 | const addProfileButtonStyle = useSpring({
31 | transform: sidePanelOpened ? 'rotate(0deg)' : 'rotate(180deg)',
32 | });
33 |
34 | const { mutate: execAddProfile } = useMutation({
35 | mutationFn: async (info: Omit
103 |
107 |
128 |
129 |
148 |
149 | );
150 | }
151 |
--------------------------------------------------------------------------------
/src/styles.css:
--------------------------------------------------------------------------------
1 | @tailwind base;
2 | @tailwind components;
3 | @tailwind utilities;
4 |
5 |
6 | @layer base {
7 | :root {
8 | --background: 0 0% 100%;
9 | --foreground: 240 10% 3.9%;
10 | --card: 0 0% 100%;
11 | --card-foreground: 240 10% 3.9%;
12 | --popover: 0 0% 100%;
13 | --popover-foreground: 240 10% 3.9%;
14 | --primary: 240 5.9% 10%;
15 | --primary-foreground: 0 0% 98%;
16 | --secondary: 240 4.8% 95.9%;
17 | --secondary-foreground: 240 5.9% 10%;
18 | --muted: 240 4.8% 95.9%;
19 | --muted-foreground: 240 3.8% 46.1%;
20 | --accent: 240 4.8% 95.9%;
21 | --accent-foreground: 240 5.9% 10%;
22 | --destructive: 0 84.2% 60.2%;
23 | --destructive-foreground: 0 0% 98%;
24 | --border: 240 5.9% 90%;
25 | --input: 240 5.9% 90%;
26 | --ring: 240 5.9% 10%;
27 | --radius: 0.5rem;
28 | }
29 |
30 | .dark {
31 | --background: 240 10% 3.9%;
32 | --foreground: 0 0% 98%;
33 | --card: 240 10% 3.9%;
34 | --card-foreground: 0 0% 98%;
35 | --popover: 240 10% 3.9%;
36 | --popover-foreground: 0 0% 98%;
37 | --primary: 0 0% 98%;
38 | --primary-foreground: 240 5.9% 10%;
39 | --secondary: 240 3.7% 15.9%;
40 | --secondary-foreground: 0 0% 98%;
41 | --muted: 240 3.7% 15.9%;
42 | --muted-foreground: 240 5% 64.9%;
43 | --accent: 240 3.7% 15.9%;
44 | --accent-foreground: 0 0% 98%;
45 | --destructive: 0 62.8% 30.6%;
46 | --destructive-foreground: 0 0% 98%;
47 | --border: 240 3.7% 15.9%;
48 | --input: 240 3.7% 15.9%;
49 | --ring: 240 4.9% 83.9%;
50 | }
51 | }
52 |
53 |
54 | @layer base {
55 | * {
56 | @apply border-border;
57 | }
58 | body {
59 | @apply bg-background text-foreground;
60 | }
61 | }
--------------------------------------------------------------------------------
/src/vite-env.d.ts:
--------------------------------------------------------------------------------
1 | ///
108 |
109 |
111 |
112 |
113 |
126 |
127 |