Austin/clash-verge-rev
1
0
Fork 0
mirror of https://github.com/clash-verge-rev/clash-verge-rev.git synced 2024-11-16 03:32:36 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

chore: fix search-box bg

Browse Source
This commit is contained in:
dongchengjie 2024-05-18 18:20:05 +08:00
parent da98097394
commit ae6f42a7fb
1 changed files with 11 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/components/base/base-search-box.tsx
View File

@ -35,7 +35,6 @@ export const BaseSearchBox = styled((props: SearchProps) => {
} as React.CSSProperties, } as React.CSSProperties,
inheritViewBox: true, inheritViewBox: true,
}; };
const active = "var(--primary-main)";
const onChange = (e: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => { const onChange = (e: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {
props.onSearch( props.onSearch(
@ -99,7 +98,7 @@ export const BaseSearchBox = styled((props: SearchProps) => {
<SvgIcon <SvgIcon
component={matchCaseIcon} component={matchCaseIcon}
{...iconStyle} {...iconStyle}
sx={{ fill: matchCase ? active : undefined }} aria-label={matchCase ? "active" : "inactive"}
onClick={() => { onClick={() => {
setMatchCase(!matchCase); setMatchCase(!matchCase);
}} }}
@ -111,7 +110,7 @@ export const BaseSearchBox = styled((props: SearchProps) => {
<SvgIcon <SvgIcon
component={matchWholeWordIcon} component={matchWholeWordIcon}
{...iconStyle} {...iconStyle}
sx={{ fill: matchWholeWord ? active : undefined }} aria-label={matchWholeWord ? "active" : "inactive"}
onClick={() => { onClick={() => {
setMatchWholeWord(!matchWholeWord); setMatchWholeWord(!matchWholeWord);
}} }}
@ -122,7 +121,7 @@ export const BaseSearchBox = styled((props: SearchProps) => {
<div> <div>
<SvgIcon <SvgIcon
component={useRegularExpressionIcon} component={useRegularExpressionIcon}
sx={{ fill: useRegularExpression ? active : undefined }} aria-label={useRegularExpression ? "active" : "inactive"}
{...iconStyle} {...iconStyle}
onClick={() => { onClick={() => {
setUseRegularExpression(!useRegularExpression); setUseRegularExpression(!useRegularExpression);
@ -133,11 +132,19 @@ export const BaseSearchBox = styled((props: SearchProps) => {
</Box> </Box>
), ),
}} }}
{...props}
/> />
</Tooltip> </Tooltip>
); );
})(({ theme }) => ({ })(({ theme }) => ({
"& .MuiInputBase-root": { "& .MuiInputBase-root": {
background: theme.palette.mode === "light" ? "#fff" : undefined, background: theme.palette.mode === "light" ? "#fff" : undefined,
"padding-right": "4px",
},
"& .MuiInputBase-root svg[aria-label='active'] path": {
fill: theme.palette.primary.light,
},
"& .MuiInputBase-root svg[aria-label='inactive'] path": {
fill: "#A7A7A7",
}, },
})); }));