mirror of
https://github.com/hanzonet/explore.git
synced 2026-10-30 18:16:57 +00:00
32 lines
872 B
TypeScript
32 lines
872 B
TypeScript
import { defineRecipe } from '@chakra-ui/react';
|
|
|
|
export const recipe = defineRecipe({
|
|
base: {
|
|
display: 'inline-block',
|
|
borderColor: 'blue.500',
|
|
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',
|
|
},
|
|
});
|