feat: 修改select下拉图标
parent
8b1faf408d
commit
d79e186bb8
10
src/App.js
10
src/App.js
|
@ -30,6 +30,15 @@ import i18n from "i18next";
|
|||
import languageImg from "./images/language.png";
|
||||
import Arrow from './images/arrow.svg'
|
||||
|
||||
import SvgIcon from '@mui/material/SvgIcon';
|
||||
|
||||
function CustomIcon(props) {
|
||||
return (
|
||||
<SvgIcon viewBox="0 0 24 24" {...props}>
|
||||
<path d="M7.41 7.84L12 12.42l4.59-4.58L18 9.25l-6 6-6-6z" fill="white" />
|
||||
</SvgIcon>
|
||||
);
|
||||
}
|
||||
|
||||
class App extends React.Component {
|
||||
constructor(props) {
|
||||
|
@ -287,6 +296,7 @@ class App extends React.Component {
|
|||
className="language-select"
|
||||
value={language}
|
||||
label={t("language")}
|
||||
IconComponent={CustomIcon}
|
||||
onChange={(e) => {
|
||||
let lang = e.target.value;
|
||||
this.setState({
|
||||
|
|
|
@ -16,6 +16,15 @@ import verticalChecked from "../../images/vertical-button-checked.png";
|
|||
import verticalButton from "../../images/vertical-button.png";
|
||||
import modeSelectPng from "../../images/mode-select.png";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import SvgIcon from '@mui/material/SvgIcon';
|
||||
|
||||
function CustomIcon(props) {
|
||||
return (
|
||||
<SvgIcon viewBox="0 0 24 24" {...props}>
|
||||
<path d="M7.41 7.84L12 12.42l4.59-4.58L18 9.25l-6 6-6-6z" fill="white" />
|
||||
</SvgIcon>
|
||||
);
|
||||
}
|
||||
|
||||
var deviceConfigs = [
|
||||
{
|
||||
|
@ -74,6 +83,7 @@ function Pane(props) {
|
|||
id="mode-select"
|
||||
value={mode}
|
||||
onChange={(e) => modeChange(e)}
|
||||
IconComponent={CustomIcon}
|
||||
sx={{
|
||||
width: "100%",
|
||||
height: '42px',
|
||||
|
@ -88,7 +98,7 @@ function Pane(props) {
|
|||
'&.Mui-focused': {
|
||||
borderColor: '#757575',
|
||||
'&.MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: '#757575',
|
||||
borderColor: '#757575 !important',
|
||||
},
|
||||
},
|
||||
}}
|
||||
|
|
|
@ -0,0 +1,10 @@
|
|||
import SvgIcon from '@mui/material/SvgIcon';
|
||||
import React from "react";
|
||||
|
||||
export function ArrowIcon(props) {
|
||||
return (
|
||||
<SvgIcon viewBox="0 0 24 24" {...props}>
|
||||
<path d="M7.41 7.84L12 12.42l4.59-4.58L18 9.25l-6 6-6-6z" fill="white" />
|
||||
</SvgIcon>
|
||||
);
|
||||
}
|
Loading…
Reference in New Issue