projects
/
arvados-workbench2.git
/ blobdiff
summary
|
shortlog
|
log
|
commit
|
commitdiff
|
tree
raw
|
inline
| side by side
Merge branch 'main' into 19462-colorscheme refs #19462
[arvados-workbench2.git]
/
src
/
components
/
column-selector
/
column-selector.tsx
diff --git
a/src/components/column-selector/column-selector.tsx
b/src/components/column-selector/column-selector.tsx
index 317e6bc0c40f8148e4ef009281aa3317eb2656f3..2323987b7d51f38f52e16e41038e10ec6805d140 100644
(file)
--- a/
src/components/column-selector/column-selector.tsx
+++ b/
src/components/column-selector/column-selector.tsx
@@
-14,14
+14,21
@@
import { ArvadosTheme } from "common/custom-theme";
interface ColumnSelectorDataProps {
columns: DataColumns<any>;
onColumnToggle: (column: DataColumn<any>) => void;
interface ColumnSelectorDataProps {
columns: DataColumns<any>;
onColumnToggle: (column: DataColumn<any>) => void;
+ className?: string;
}
}
-type CssRules = "checkbox";
+type CssRules = "checkbox"
| "listItem" | "listItemText"
;
const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
checkbox: {
width: 24,
height: 24
const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
checkbox: {
width: 24,
height: 24
+ },
+ listItem: {
+ padding: 0
+ },
+ listItemText: {
+ paddingTop: '0.2rem'
}
});
}
});
@@
-38,13
+45,15
@@
export const ColumnSelector = withStyles(styles)(
<ListItem
button
key={index}
<ListItem
button
key={index}
+ className={classes.listItem}
onClick={() => onColumnToggle(column)}>
<Checkbox
disableRipple
color="primary"
checked={column.selected}
className={classes.checkbox} />
onClick={() => onColumnToggle(column)}>
<Checkbox
disableRipple
color="primary"
checked={column.selected}
className={classes.checkbox} />
- <ListItemText>
+ <ListItemText
+ className={classes.listItemText}>
{column.name}
</ListItemText>
</ListItem>
{column.name}
</ListItemText>
</ListItem>
@@
-60,3
+69,5
@@
export const ColumnSelectorTrigger = (props: IconButtonProps) =>
<MenuIcon aria-label="Select columns" />
</IconButton>
</Tooltip>;
<MenuIcon aria-label="Select columns" />
</IconButton>
</Tooltip>;
+
+