1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-01-31 00:16:47 +01:00

refactor: unify header icons (#897)

* refactor: unify header icon colors

* refactor: add a chevron for the settings menu
This commit is contained in:
olav 2022-04-22 12:12:06 +02:00 committed by GitHub
parent 96d2c924b4
commit 03e04e7c31
4 changed files with 19 additions and 6 deletions

View File

@ -13,7 +13,7 @@ export const useStyles = makeStyles(theme => ({
display: 'flex',
justifyContent: 'center',
marginLeft: '1.5rem',
['& a']: {
'& a': {
textDecoration: 'none',
color: 'inherit',
marginRight: '1.5rem',
@ -81,4 +81,10 @@ export const useStyles = makeStyles(theme => ({
display: 'flex',
color: '#000',
},
icon: {
color: theme.palette.grey[600],
},
wideButton: {
borderRadius: 100,
},
}));

View File

@ -109,7 +109,7 @@ const Header = () => {
onClick={e => setAnchorElAdvanced(e.currentTarget)}
>
Configure
<KeyboardArrowDown />
<KeyboardArrowDown className={styles.icon} />
</button>
<NavigationMenu
id="settings-navigation"
@ -126,7 +126,7 @@ const Header = () => {
target="_blank"
rel="noopener noreferrer"
>
<MenuBookIcon />
<MenuBookIcon className={styles.icon} />
</IconButton>
</Tooltip>
<ConditionallyRender
@ -137,8 +137,12 @@ const Header = () => {
onClick={e =>
setAnchorEl(e.currentTarget)
}
className={styles.wideButton}
>
<SettingsIcon />
<KeyboardArrowDown
className={styles.icon}
/>
</IconButton>
</Tooltip>
}

View File

@ -1,6 +1,6 @@
import { makeStyles } from '@material-ui/core/styles';
export const useStyles = makeStyles({
export const useStyles = makeStyles(theme => ({
userProfileMenu: {
display: 'flex',
},
@ -11,4 +11,7 @@ export const useStyles = makeStyles({
color: 'inherit',
padding: '0.2rem 1rem',
},
});
icon: {
color: theme.palette.grey[600],
},
}));

View File

@ -74,7 +74,7 @@ const UserProfile = ({
src={imageUrl}
data-testid={HEADER_USER_AVATAR}
/>
<KeyboardArrowDownIcon />
<KeyboardArrowDownIcon className={styles.icon} />
</Button>
<UserProfileContent
showProfile={showProfile}