Skip to content

Commit f0decb4

Browse files
committed
chore: remove border
1 parent ffac81b commit f0decb4

File tree

4 files changed

+10
-102
lines changed

4 files changed

+10
-102
lines changed

src/components/ThemeConfigForm.tsx

Lines changed: 7 additions & 88 deletions
Original file line numberDiff line numberDiff line change
@@ -79,84 +79,6 @@ const MarginFields = ({ control, name, label }: MarginFieldsProps) => (
7979
</div>
8080
);
8181

82-
interface BackgroundFieldsProps {
83-
control: any;
84-
name: string;
85-
label: string;
86-
}
87-
88-
const BackgroundFields = ({ control, name, label }: BackgroundFieldsProps) => (
89-
<Card>
90-
<CardHeader>
91-
<CardTitle>{ label }</CardTitle>
92-
</CardHeader>
93-
<CardContent className="space-y-4 flex items-baseline gap-12">
94-
<FormField
95-
control={ control }
96-
name={ `${ name }.color` }
97-
render={ ({ field }) => (
98-
<FormItem>
99-
<FormLabel>背景颜色</FormLabel>
100-
<FormControl>
101-
<Input type="color" { ...field } className="h-10 w-20" />
102-
</FormControl>
103-
</FormItem>
104-
) }
105-
/>
106-
<FormField
107-
control={ control }
108-
name={ `${ name }.borderColor` }
109-
render={ ({ field }) => (
110-
<FormItem>
111-
<FormLabel>边框颜色</FormLabel>
112-
<FormControl>
113-
<Input type="color" { ...field } className="h-10 w-20" />
114-
</FormControl>
115-
</FormItem>
116-
) }
117-
/>
118-
<FormField
119-
control={ control }
120-
name={ `${ name }.borderWidth` }
121-
render={ ({ field }) => (
122-
<FormItem>
123-
<FormLabel>边框宽度 ({ field.value }px)</FormLabel>
124-
<FormControl>
125-
<Slider
126-
min={ 0 }
127-
max={ 10 }
128-
step={ 1 }
129-
value={ [field.value] }
130-
onValueChange={ (value) => field.onChange(value[0]) }
131-
/>
132-
</FormControl>
133-
</FormItem>
134-
) }
135-
/>
136-
{/* <FormField
137-
control={control}
138-
name={`${name}.gravity`}
139-
render={({ field }) => (
140-
<FormItem>
141-
<FormLabel>叠加层位置</FormLabel>
142-
<Select onValueChange={field.onChange} value={field.value}>
143-
<SelectTrigger>
144-
<SelectValue placeholder="选择位置" />
145-
</SelectTrigger>
146-
<SelectContent>
147-
<SelectItem value="Top Left">左上</SelectItem>
148-
<SelectItem value="Top Right">右上</SelectItem>
149-
<SelectItem value="Bottom Left">左下</SelectItem>
150-
<SelectItem value="Bottom Right">右下</SelectItem>
151-
</SelectContent>
152-
</Select>
153-
</FormItem>
154-
)}
155-
/> */}
156-
{/* <MarginFields control={control} name={`${name}.margin`} label="边距设置" /> */ }
157-
</CardContent>
158-
</Card>
159-
);
16082

16183
interface ThemeConfigFormProps {
16284
initialConfig: ThemeConfig;
@@ -248,10 +170,10 @@ export function ThemeConfigForm({ initialConfig, onConfigChange, onConfigExport
248170
/>
249171
<FormField
250172
control={ form.control }
251-
name="highlightColor"
173+
name={ `background.color` }
252174
render={ ({ field }) => (
253175
<FormItem>
254-
<FormLabel>高亮文字颜色</FormLabel>
176+
<FormLabel>背景颜色</FormLabel>
255177
<FormControl>
256178
<Input type="color" { ...field } className="h-10 w-20" />
257179
</FormControl>
@@ -260,22 +182,23 @@ export function ThemeConfigForm({ initialConfig, onConfigChange, onConfigExport
260182
/>
261183
<FormField
262184
control={ form.control }
263-
name="highlightBackgroundColor"
185+
name="highlightColor"
264186
render={ ({ field }) => (
265187
<FormItem>
266-
<FormLabel>高亮背景颜色</FormLabel>
188+
<FormLabel>高亮文字颜色</FormLabel>
267189
<FormControl>
268190
<Input type="color" { ...field } className="h-10 w-20" />
269191
</FormControl>
270192
</FormItem>
271193
) }
272194
/>
195+
273196
<FormField
274197
control={ form.control }
275-
name="highlightCandidateColor"
198+
name={ `highlight.color` }
276199
render={ ({ field }) => (
277200
<FormItem>
278-
<FormLabel>候选词高亮颜色</FormLabel>
201+
<FormLabel>高亮背景颜色</FormLabel>
279202
<FormControl>
280203
<Input type="color" { ...field } className="h-10 w-20" />
281204
</FormControl>
@@ -355,10 +278,6 @@ export function ThemeConfigForm({ initialConfig, onConfigChange, onConfigExport
355278
</CardContent>
356279
</Card> */}
357280

358-
{/* Background and Highlight */ }
359-
<BackgroundFields control={ form.control } name="background" label="背景设置" />
360-
<BackgroundFields control={ form.control } name="highlight" label="高亮设置" />
361-
362281
<div className="flex justify-end">
363282
<Button onClick={ exportTheme }>导出主题</Button>
364283
</div>

src/components/ThemePreview.tsx

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,7 @@ interface ThemePreviewProps {
88
export function ThemePreview({ config, direction = 'vertical' }: ThemePreviewProps) {
99
const inputPanelStyle = {
1010
backgroundColor: config.background.color,
11-
border: `${ config.background.borderWidth }px solid ${ config.background.borderColor }`,
12-
margin: '20px',
11+
marginBottom: '20px',
1312
width: direction === 'vertical' ? '300px' : 'fit-content',
1413
position: 'relative' as const,
1514
};
@@ -33,8 +32,8 @@ export function ThemePreview({ config, direction = 'vertical' }: ThemePreviewPro
3332
const highlightStyle = {
3433
backgroundColor: config.highlight.color,
3534
whiteSpace: "nowrap",
36-
border: `${ config.highlight.borderWidth }px solid ${ config.highlight.borderColor }`,
37-
padding: `${ config.highlight.margin.top }px ${ config.highlight.margin.right }px ${ config.highlight.margin.bottom }px ${ config.highlight.margin.left }px`,
35+
// padding: `${ config.highlight.margin.top }px ${ config.highlight.margin.right }px ${ config.highlight.margin.bottom }px ${ config.highlight.margin.left }px`,
36+
padding: `${ config.textMargin.top }px ${ config.textMargin.right }px ${ config.textMargin.bottom }px ${ config.textMargin.left }px`,
3837
};
3938

4039
const candidatesContainerStyle = {

src/lib/theme.ts

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -111,17 +111,13 @@ export function parseThemeFile(content: string): ThemeConfig {
111111
// Background
112112
background: {
113113
color: sections['InputPanel/Background']?.['Color'] || '#ffffff',
114-
borderColor: '#000000',
115-
borderWidth: 0,
116114
gravity: 'Center',
117115
margin: parseMargin(sections['InputPanel/Background/Margin'] || {}),
118116
},
119117

120118
// Highlight
121119
highlight: {
122120
color: sections['InputPanel/Highlight']?.['Color'] || '#ffffff',
123-
borderColor: '#000000',
124-
borderWidth: 0,
125121
gravity: 'Center',
126122
margin: parseMargin(sections['InputPanel/Highlight/Margin'] || {}),
127123
},

src/types/theme.ts

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,6 @@ export interface Margin {
88
export interface Background {
99
image?: string;
1010
color: string;
11-
borderColor: string;
12-
borderWidth: number;
1311
overlay?: string;
1412
gravity: string;
1513
overlayOffsetX?: number;
@@ -94,8 +92,6 @@ export const defaultConfig: ThemeConfig = {
9492

9593
background: {
9694
color: '#e5e9f0',
97-
borderColor: '',
98-
borderWidth: 0,
9995
gravity: '',
10096
margin: {
10197
left: 2,
@@ -107,8 +103,6 @@ export const defaultConfig: ThemeConfig = {
107103

108104
highlight: {
109105
color: '#d8dee9',
110-
borderColor: '',
111-
borderWidth: 0,
112106
gravity: '',
113107
margin: {
114108
left: 10,

0 commit comments

Comments
 (0)