mirror of
https://github.com/luxfi/explore.git
synced 2026-09-24 00:28:18 +00:00
* UI customizations: new features Fixes #2905 * colors for graphs * introduce env variable * colors for topbar, stats, selected state and tabs * fix build * fix validator * refactor link.primary.hover color token * refactor selected colors * update styles for switch and fix some color tokens * change color for selectable controls * icon color tokens refactoring * UI customizations: new features Fixes #2905 * test for common components * tweaks * migrate from color-mode-hex cookie to color-theme cookie * clean up * update screenshots * more screenshot updates * update default color of chart line * update envs for mega eth
32 lines
882 B
TypeScript
32 lines
882 B
TypeScript
import { defineRecipe } from '@chakra-ui/react';
|
|
|
|
export const recipe = defineRecipe({
|
|
base: {
|
|
display: 'inline-block',
|
|
borderColor: 'selected.option.bg',
|
|
borderStyle: 'solid',
|
|
borderWidth: '2px',
|
|
borderRadius: 'full',
|
|
width: 'var(--spinner-size)',
|
|
height: 'var(--spinner-size)',
|
|
animation: 'spin',
|
|
animationDuration: 'slowest',
|
|
'--spinner-track-color': '{colors.spinner.track}',
|
|
borderBottomColor: 'var(--spinner-track-color)',
|
|
borderInlineStartColor: 'var(--spinner-track-color)',
|
|
},
|
|
variants: {
|
|
size: {
|
|
inherit: { '--spinner-size': '1em' },
|
|
xs: { '--spinner-size': 'sizes.3' },
|
|
sm: { '--spinner-size': 'sizes.4' },
|
|
md: { '--spinner-size': 'sizes.5' },
|
|
lg: { '--spinner-size': 'sizes.8' },
|
|
xl: { '--spinner-size': 'sizes.10' },
|
|
},
|
|
},
|
|
defaultVariants: {
|
|
size: 'md',
|
|
},
|
|
});
|