aboutsummaryrefslogtreecommitdiffstats
path: root/webui
diff options
context:
space:
mode:
Diffstat (limited to 'webui')
-rw-r--r--webui/src/pages/bug/labels/LabelMenu.tsx9
-rw-r--r--webui/src/pages/list/Filter.tsx23
2 files changed, 21 insertions, 11 deletions
diff --git a/webui/src/pages/bug/labels/LabelMenu.tsx b/webui/src/pages/bug/labels/LabelMenu.tsx
index 01be11d8..88347316 100644
--- a/webui/src/pages/bug/labels/LabelMenu.tsx
+++ b/webui/src/pages/bug/labels/LabelMenu.tsx
@@ -67,10 +67,8 @@ const useStyles = makeStyles((theme) => ({
},
},
labelcolor: {
- minWidth: '1rem',
- minHeight: '1rem',
+ minWidth: '0.5rem',
display: 'flex',
- backgroundColor: 'blue',
borderRadius: '0.25rem',
marginRight: '5px',
marginLeft: '3px',
@@ -81,8 +79,7 @@ const useStyles = makeStyles((theme) => ({
},
menuRow: {
display: 'flex',
- alignItems: 'center',
- flexWrap: 'wrap',
+ alignItems: 'initial',
},
}));
@@ -194,7 +191,7 @@ function FilterDropdown({
selected={itemActive(key)}
>
<div className={classes.menuRow}>
- {itemActive(key) && <CheckIcon fontSize={'small'} />}
+ {itemActive(key) && <CheckIcon />}
<div
className={classes.labelcolor}
style={createStyle(color)}
diff --git a/webui/src/pages/list/Filter.tsx b/webui/src/pages/list/Filter.tsx
index 119480e7..3559b3ce 100644
--- a/webui/src/pages/list/Filter.tsx
+++ b/webui/src/pages/list/Filter.tsx
@@ -10,6 +10,7 @@ import TextField from '@material-ui/core/TextField';
import { makeStyles, withStyles } from '@material-ui/core/styles';
import { darken } from '@material-ui/core/styles/colorManipulator';
import ArrowDropDown from '@material-ui/icons/ArrowDropDown';
+import CheckIcon from '@material-ui/icons/Check';
import { Color } from '../../gqlTypes';
@@ -102,11 +103,21 @@ const useStyles = makeStyles((theme) => ({
icon: {
paddingRight: theme.spacing(0.5),
},
+ labelMenu: {
+ '& .MuiMenu-paper': {
+ //somehow using "width" won't override the default width...
+ minWidth: '35ch',
+ },
+ },
+ labelMenuItem: {
+ whiteSpace: 'normal',
+ wordBreak: 'break-word',
+ display: 'flex',
+ alignItems: 'initial',
+ },
labelcolor: {
- minWidth: '15px',
- minHeight: '15px',
+ minWidth: '0.5rem',
display: 'flex',
- backgroundColor: 'blue',
borderRadius: '0.25rem',
marginRight: '5px',
marginLeft: '3px',
@@ -170,6 +181,7 @@ function FilterDropdown({
<ArrowDropDown fontSize="small" />
</button>
<Menu
+ className={classes.labelMenu}
getContentAnchorEl={null}
ref={searchRef}
anchorOrigin={{
@@ -205,13 +217,14 @@ function FilterDropdown({
.filter((d) => d[1].toLowerCase().includes(filter.toLowerCase()))
.map(([key, value, color]) => (
<MenuItem
- style={{ whiteSpace: 'normal', wordBreak: 'break-all' }}
component={Link}
to={to(key)}
- className={itemActive(key) ? classes.itemActive : undefined}
+ className={classes.labelMenuItem}
+ selected={itemActive(key)}
onClick={() => setOpen(false)}
key={key}
>
+ {itemActive(key) && <CheckIcon />}
{color && (
<div
className={classes.labelcolor}