Skip to content

Commit e601f6c

Browse files
cyfung1031cyfung1031
committed
[v1.3] UnoCSS 加 prefix 解决 CSS冲突
1 parent d37a832 commit e601f6c

29 files changed

Lines changed: 230 additions & 226 deletions

File tree

‎src/pages/batchupdate/App.tsx‎

Lines changed: 19 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -256,7 +256,7 @@ function App() {
256256
title={
257257
<span
258258
onClick={() => openUpdatePage(item.uuid)}
259-
className="text-clickable text-gray-900 dark:text-gray-100 !hover:text-blue-600 dark:hover:text-blue-400"
259+
className="uno-text-clickable uno-text-gray-900 dark:uno-text-gray-100 !hover:uno-text-blue-600 dark:hover:uno-text-blue-400"
260260
>
261261
<Typography.Ellipsis rows={1} expandable={false} showTooltip={{ mini: true }}>
262262
{item.script?.name}
@@ -285,7 +285,7 @@ function App() {
285285
</>
286286
}
287287
>
288-
<Space className="pb-2">
288+
<Space className="uno-pb-2">
289289
<Space direction="vertical">
290290
<Text>{t("updatepage.old_version_")}</Text>
291291
<Text>{t("updatepage.new_version_")}</Text>
@@ -377,31 +377,31 @@ function App() {
377377
return (
378378
<>
379379
{
380-
<div className="mb-2 text-gray-800 dark:text-gray-200">
381-
<div className="flex flex-row items-center gap-2">
382-
<Typography.Title heading={6} className="!m-0 text-gray-900 dark:text-gray-100">
380+
<div className="uno-mb-2 uno-text-gray-800 dark:uno-text-gray-200">
381+
<div className="uno-flex uno-flex-row uno-items-center uno-gap-2">
382+
<Typography.Title heading={6} className="!uno-m-0 uno-text-gray-900 dark:uno-text-gray-100">
383383
{t("updatepage.main_header")}
384384
</Typography.Title>
385385
<IconSync
386386
spin={checkUpdateSpin}
387387
onClick={() => onCheckUpdateClick()}
388-
className="cursor-pointer text-gray-700 dark:text-gray-300"
388+
className="uno-cursor-pointer uno-text-gray-700 dark:uno-text-gray-300"
389389
/>
390390
</div>
391-
<div className="flex flex-row indent-4">
392-
<Typography.Text className="text-gray-700 dark:text-gray-300">{mStatusText}</Typography.Text>
391+
<div className="uno-flex uno-flex-row uno-indent-4">
392+
<Typography.Text className="uno-text-gray-700 dark:uno-text-gray-300">{mStatusText}</Typography.Text>
393393
</div>
394394
{mRecords === null ? (
395395
<></>
396396
) : (
397397
<>
398398
{mRecords.site.length === 0 && mRecords.other.length === 0 ? (
399-
<div className="flex flex-row indent-4">
400-
<Text className="text-gray-700 dark:text-gray-300">{t("updatepage.status_no_update")}</Text>
399+
<div className="uno-flex uno-flex-row uno-indent-4">
400+
<Text className="uno-text-gray-700 dark:uno-text-gray-300">{t("updatepage.status_no_update")}</Text>
401401
</div>
402402
) : (
403-
<div className="flex flex-row indent-4">
404-
<Text className="text-gray-700 dark:text-gray-300">
403+
<div className="uno-flex uno-flex-row uno-indent-4">
404+
<Text className="uno-text-gray-700 dark:uno-text-gray-300">
405405
{t("updatepage.status_n_update").replace("$0", `${mRecords.site.length + mRecords.other.length}`)}
406406
</Text>
407407
</div>
@@ -410,15 +410,15 @@ function App() {
410410
// <div><Text>{"没有已忽略的更新"}</Text></div>
411411
<></>
412412
) : (
413-
<div className="flex flex-row indent-4">
414-
<Text className="text-gray-700 dark:text-gray-300">
413+
<div className="uno-flex uno-flex-row uno-indent-4">
414+
<Text className="uno-text-gray-700 dark:uno-text-gray-300">
415415
{t("updatepage.status_n_ignored").replace("$0", `${mRecords.ignored.length}`)}
416416
</Text>
417417
</div>
418418
)}
419419
{mTimeClose >= 0 ? (
420-
<div className="flex flex-row indent-4">
421-
<Text className="text-gray-700 dark:text-gray-300">
420+
<div className="uno-flex uno-flex-row uno-indent-4">
421+
<Text className="uno-text-gray-700 dark:uno-text-gray-300">
422422
{t("updatepage.status_autoclose").replace("$0", `${mTimeClose}`)}
423423
</Text>
424424
</div>
@@ -439,9 +439,9 @@ function App() {
439439
<Collapse
440440
defaultActiveKey={[]}
441441
className={[
442-
"justify-self-center",
442+
"uno-justify-self-center",
443443
mRecords.site.length === 0 && mRecords.other.length === 0 && mRecords.ignored.length === 0
444-
? "hidden"
444+
? "uno-hidden"
445445
: "",
446446
]}
447447
style={{ width: "calc(100vw - 64px)" }}
@@ -481,7 +481,7 @@ function App() {
481481
<CollapseItem
482482
header={`${t("updatepage.header_other_update")}`}
483483
name="list-other"
484-
className={[paramSite ? "" : "hidden"]}
484+
className={[paramSite ? "" : "uno-hidden"]}
485485
disabled={!mRecords?.other?.length || isDoingTask}
486486
extra={
487487
mRecords?.other?.length ? (

‎src/pages/batchupdate/main.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ loggerCore.logger().debug("batchupdate page start");
2121

2222
const Root = (
2323
<AppProvider>
24-
<MainLayout className="!flex-col !px-4 box-border batchupdate-mainlayout">
24+
<MainLayout className="!uno-flex-col !uno-px-4 uno-box-border batchupdate-mainlayout">
2525
<App />
2626
</MainLayout>
2727
</AppProvider>

‎src/pages/components/ScriptMenuList/index.tsx‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -89,7 +89,7 @@ const MenuItem = React.memo(({ menuItems, uuid }: MenuItemProps) => {
8989
}}
9090
>
9191
<Button
92-
className="text-left"
92+
className="uno-text-left"
9393
type="secondary"
9494
htmlType="submit"
9595
icon={<IconMenu />}
@@ -219,10 +219,10 @@ const ListMenuItem = React.memo(
219219
name={item.uuid}
220220
contentStyle={{ padding: "0 0 0 40px" }}
221221
>
222-
<div className="flex flex-col">
222+
<div className="uno-flex uno-flex-col">
223223
{isBackscript && (
224224
<Button
225-
className="text-left"
225+
className="uno-text-left"
226226
type="secondary"
227227
icon={item.runStatus !== SCRIPT_RUN_STATUS_RUNNING ? <RiPlayFill /> : <RiStopFill />}
228228
onClick={() => {
@@ -238,7 +238,7 @@ const ListMenuItem = React.memo(
238238
</Button>
239239
)}
240240
<Button
241-
className="text-left"
241+
className="uno-text-left"
242242
type="secondary"
243243
icon={<IconEdit />}
244244
onClick={() => {
@@ -250,7 +250,7 @@ const ListMenuItem = React.memo(
250250
</Button>
251251
{url && isEffective !== null && (
252252
<Button
253-
className="text-left"
253+
className="uno-text-left"
254254
status="warning"
255255
type="secondary"
256256
icon={!isEffective ? <IconPlus /> : <IconMinus />}
@@ -264,21 +264,21 @@ const ListMenuItem = React.memo(
264264
icon={<IconDelete />}
265265
onOk={() => handleDeleteScript(item.uuid)}
266266
>
267-
<Button className="text-left" status="danger" type="secondary" icon={<IconDelete />}>
267+
<Button className="uno-text-left" status="danger" type="secondary" icon={<IconDelete />}>
268268
{t("delete")}
269269
</Button>
270270
</Popconfirm>
271271
</div>
272272
</CollapseItem>
273-
<div className="arco-collapse-item-content-box flex flex-col" style={{ padding: "0 0 0 40px" }}>
273+
<div className="arco-collapse-item-content-box uno-flex uno-flex-col" style={{ padding: "0 0 0 40px" }}>
274274
{/* 依数量与展开状态决定要显示的分组项（收合时只显示前 menuExpandNum 笔） */}
275275
{visibleMenus.map(({ uuid, groupKey, menus }) => {
276276
// 不同脚本之间可能出现相同的 groupKey；为避免 React key 冲突，需加上 uuid 做区分。
277277
return <MenuItem key={`${uuid}:${groupKey}`} menuItems={menus} uuid={uuid} />;
278278
})}
279279
{shouldShowMore && (
280280
<Button
281-
className="text-left"
281+
className="uno-text-left"
282282
key="expand"
283283
type="secondary"
284284
icon={isExpand ? <IconCaretUp /> : <IconCaretDown />}
@@ -289,7 +289,7 @@ const ListMenuItem = React.memo(
289289
)}
290290
{item.hasUserConfig && (
291291
<Button
292-
className="text-left"
292+
className="uno-text-left"
293293
key="config"
294294
type="secondary"
295295
icon={<IconSettings />}

‎src/pages/components/ScriptResource/index.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -143,8 +143,8 @@ const ScriptResource: React.FC<{
143143
onOk={onOk}
144144
onCancel={onCancel}
145145
>
146-
<Space className="w-full" direction="vertical">
147-
<Space className="!flex justify-end">
146+
<Space className="uno-w-full" direction="vertical">
147+
<Space className="!uno-flex uno-justify-end">
148148
<Popconfirm
149149
focusLock
150150
title={t("confirm_clear_resource")}

‎src/pages/components/ScriptSetting/Match.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -248,7 +248,7 @@ const Match: React.FC<{
248248
}}
249249
/>
250250
</Modal>
251-
<div className="flex flex-row justify-between pb-2">
251+
<div className="uno-flex uno-flex-row uno-justify-between uno-pb-2">
252252
<Typography.Title heading={6}>{t("website_match")}</Typography.Title>
253253
<Space>
254254
<Button
@@ -277,7 +277,7 @@ const Match: React.FC<{
277277
</div>
278278
<Table columns={columns} data={match} rowKey="id" pagination={false} />
279279
<Divider />
280-
<div className="flex flex-row justify-between pb-2">
280+
<div className="uno-flex uno-flex-row uno-justify-between uno-pb-2">
281281
<Typography.Title heading={6}>{t("website_exclude")}</Typography.Title>
282282
<Space>
283283
<Button

‎src/pages/components/ScriptSetting/Permission.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -130,7 +130,7 @@ const PermissionManager: React.FC<{
130130
}
131131
}}
132132
>
133-
<Space className="w-full" direction="vertical">
133+
<Space className="uno-w-full" direction="vertical">
134134
<Select
135135
value={permissionValue?.permission}
136136
onChange={(e) => {
@@ -156,7 +156,7 @@ const PermissionManager: React.FC<{
156156
</Checkbox>
157157
</Space>
158158
</Modal>
159-
<div className="flex flex-row justify-between pb-2">
159+
<div className="uno-flex uno-flex-row uno-justify-between uno-pb-2">
160160
<Typography.Title heading={6}>{t("permission_management")}</Typography.Title>
161161
<Space>
162162
<Button

‎src/pages/components/ScriptStorage/index.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -248,8 +248,8 @@ const ScriptStorage: React.FC<{
248248
</Form>
249249
)}
250250
</Modal>
251-
<Space className="w-full" direction="vertical">
252-
<Space className="!flex justify-end">
251+
<Space className="uno-w-full" direction="vertical">
252+
<Space className="!uno-flex uno-justify-end">
253253
{isEdit ? (
254254
<>
255255
<Button

‎src/pages/components/layout/MainLayout.tsx‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -207,7 +207,7 @@ const MainLayout: React.FC<{
207207
height: "50px",
208208
borderBottom: "1px solid var(--color-neutral-3)",
209209
}}
210-
className="flex items-center justify-between px-4"
210+
className="uno-flex uno-items-center uno-justify-between uno-px-4"
211211
>
212212
<Modal
213213
title={t("import_link")}
@@ -230,9 +230,9 @@ const MainLayout: React.FC<{
230230
}}
231231
/>
232232
</Modal>
233-
<div className="flex row items-center">
233+
<div className="uno-flex uno-flex-row uno-items-center">
234234
<img style={{ height: "40px" }} src="/assets/logo.png" alt="ScriptCat" />
235-
<Typography.Title heading={4} className="!m-0">
235+
<Typography.Title heading={4} className="!uno-m-0">
236236
{"ScriptCat"}
237237
</Typography.Title>
238238
</div>
@@ -301,7 +301,7 @@ const MainLayout: React.FC<{
301301
style={{
302302
color: "var(--color-text-1)",
303303
}}
304-
className="!text-size-sm"
304+
className="!uno-text-size-sm"
305305
>
306306
<RiPlayListAddLine /> {t("create_script")} <IconDown />
307307
</Button>
@@ -342,7 +342,7 @@ const MainLayout: React.FC<{
342342
style={{
343343
color: "var(--color-text-1)",
344344
}}
345-
className="!text-lg"
345+
className="!uno-text-lg"
346346
/>
347347
</Dropdown>
348348
{showLanguage && (
@@ -375,14 +375,14 @@ const MainLayout: React.FC<{
375375
style={{
376376
color: "var(--color-text-1)",
377377
}}
378-
className="!text-lg"
378+
className="!uno-text-lg"
379379
></Button>
380380
</Dropdown>
381381
)}
382382
</Space>
383383
</Layout.Header>
384384
<Layout
385-
className={`absolute top-50px bottom-0 w-full ${className}`}
385+
className={`uno-absolute uno-top-50px uno-bottom-0 uno-w-full ${className}`}
386386
style={{
387387
background: "var(--color-fill-2)",
388388
}}

‎src/pages/components/layout/Sider.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -49,8 +49,8 @@ const Sider: React.FC = () => {
4949
return (
5050
<HashRouter>
5151
<SiderGuide ref={guideRef} />
52-
<Layout.Sider className="h-full" collapsed={collapsed} width={170}>
53-
<div className="flex flex-col justify-between h-full">
52+
<Layout.Sider className="uno-h-full" collapsed={collapsed} width={170}>
53+
<div className="uno-flex uno-flex-col uno-justify-between uno-h-full">
5454
<Menu style={{ width: "100%" }} selectedKeys={[menuSelect]} selectable onClickMenuItem={handleMenuClick}>
5555
<CustomLink to="/">
5656
<MenuItem key="/" className="menu-script">
@@ -100,7 +100,7 @@ const Sider: React.FC = () => {
100100
key="/external_links"
101101
title={
102102
<>
103-
<RiLinkM /> <span className="grow">{t("external_links")}</span>
103+
<RiLinkM /> <span className="uno-grow">{t("external_links")}</span>
104104
</>
105105
}
106106
>

‎src/pages/confirm/App.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -62,15 +62,15 @@ function App() {
6262
const metadata = useMemo(() => (confirm && confirm.metadata && Object.keys(confirm.metadata)) || [], [confirm]);
6363

6464
return (
65-
<div className="h-full">
65+
<div className="uno-h-full">
6666
<Space direction="vertical">
67-
<span className="text-2xl font-500">{confirm?.title}</span>
67+
<span className="uno-text-2xl uno-font-500">{confirm?.title}</span>
6868
{metadata.map((key) => (
69-
<span className="text-base" key={key}>
69+
<span className="uno-text-base" key={key}>
7070
{`${key}: ${confirm!.metadata![key]}`}
7171
</span>
7272
))}
73-
<span className="text-xl font-500">{confirm?.describe}</span>
73+
<span className="uno-text-xl uno-font-500">{confirm?.describe}</span>
7474
<div>
7575
<Button type="primary" onClick={handleConfirm(false, 1)}>
7676
{`${t("ignore")} (${second})`}

0 commit comments

Comments
 (0)