seb/dashfront
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Enlarge article tab icons and widen handle spacing.

Browse Source 
Makes the icon-only tabs easier to hit and visually clearer.
This commit is contained in:
seb
2026-08-01 03:58:58 +02:00
parent 6141e71e2f
commit 701487f525
1 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/components/article/ArticleTileTab.jsx
View File

@@ -205,7 +205,7 @@ class ArticleTileTab extends Component {
sx={{ sx={{
position: 'relative', position: 'relative',
zIndex: 1, zIndex: 1,
minHeight: 36, minHeight: 56,
px: 0, px: 0,
mb: 0, mb: 0,
borderBottom: 'none', borderBottom: 'none',
@@ -217,7 +217,7 @@ class ArticleTileTab extends Component {
}, },
'& .MuiTabs-list, & .MuiTabs-flexContainer': { '& .MuiTabs-list, & .MuiTabs-flexContainer': {
flexWrap: 'wrap-reverse', flexWrap: 'wrap-reverse',
columnGap: 0.75, columnGap: 3,
rowGap: 0, rowGap: 0,
alignItems: 'stretch', alignItems: 'stretch',
alignContent: 'flex-end', alignContent: 'flex-end',
@@ -226,7 +226,7 @@ class ArticleTileTab extends Component {
'& .MuiTab-root': { '& .MuiTab-root': {
flexShrink: 0, flexShrink: 0,
maxWidth: 'none', maxWidth: 'none',
minHeight: 40, minHeight: 56,
marginBottom: 0, marginBottom: 0,
}, },
}} }}
@@ -240,10 +240,10 @@ class ArticleTileTab extends Component {
value={row.id} value={row.id}
aria-label={row.label} aria-label={row.label}
title={row.label} title={row.label}
icon={<Icon fontSize="small" />} icon={<Icon sx={{ fontSize: 40 }} />}
sx={{ sx={{
minHeight: 40, minHeight: 56,
minWidth: 48, minWidth: 64,
py: 0.5, py: 0.5,
px: 1.25, px: 1.25,
border: 'none', border: 'none',