fix(levels): reduce operator box sizes and remove divider line
- Reduced box dimensions from 200x180px to 170x150px for better fit - Reduced grid gap from '3' to '2' for tighter layout - Reduced box padding from '4' to '3' and gap from '2' to '1.5' - Reduced maxW from 480px to 400px - Changed my (margins) to py (padding) for more control - Removed borderRight divider line between operator boxes and abacus 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
parent
be2c3f63b0
commit
29d20a6c07
|
|
@ -688,14 +688,12 @@ export default function LevelsPage() {
|
||||||
flex: '0 0 auto',
|
flex: '0 0 auto',
|
||||||
display: 'grid',
|
display: 'grid',
|
||||||
gridTemplateColumns: 'repeat(2, 1fr)',
|
gridTemplateColumns: 'repeat(2, 1fr)',
|
||||||
gap: sizing.gap,
|
gap: '2',
|
||||||
pr: '4',
|
pr: '3',
|
||||||
pl: '2',
|
pl: '2',
|
||||||
borderRight: '1px solid',
|
py: '2',
|
||||||
borderColor: 'gray.600',
|
maxW: '400px',
|
||||||
maxW: '480px',
|
|
||||||
alignContent: 'center',
|
alignContent: 'center',
|
||||||
my: '2',
|
|
||||||
})}
|
})}
|
||||||
>
|
>
|
||||||
{sections.map((section, idx) => {
|
{sections.map((section, idx) => {
|
||||||
|
|
@ -715,16 +713,16 @@ export default function LevelsPage() {
|
||||||
border: '1px solid',
|
border: '1px solid',
|
||||||
borderColor: hasData ? 'gray.700' : 'gray.800',
|
borderColor: hasData ? 'gray.700' : 'gray.800',
|
||||||
rounded: 'md',
|
rounded: 'md',
|
||||||
p: '4',
|
p: '3',
|
||||||
transition: 'all 0.2s',
|
transition: 'all 0.2s',
|
||||||
display: 'flex',
|
display: 'flex',
|
||||||
flexDirection: 'column',
|
flexDirection: 'column',
|
||||||
alignItems: 'center',
|
alignItems: 'center',
|
||||||
justifyContent: 'center',
|
justifyContent: 'center',
|
||||||
gap: '2',
|
gap: '1.5',
|
||||||
opacity: hasData ? 1 : 0.3,
|
opacity: hasData ? 1 : 0.3,
|
||||||
width: '200px',
|
width: '170px',
|
||||||
height: '180px',
|
height: '150px',
|
||||||
_hover: hasData
|
_hover: hasData
|
||||||
? {
|
? {
|
||||||
borderColor: 'gray.500',
|
borderColor: 'gray.500',
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue