@tapie-kr/inspire-react
Version:
React Component Collection for INSPIRE
49 lines • 1.38 kB
CSS
@layer component;
@layer component {
:root {
--isp_radius-none: 0px;
--isp_radius-sharp: 4px;
--isp_radius-subtle: 6px;
--isp_radius-default: 8px;
--isp_radius-smooth: 12px;
--isp_radius-rounded: 16px;
--isp_radius-pill: 24px;
--isp_radius-full: 9999px;
--isp_spacing-none: 0px;
--isp_spacing-optical: 2px;
--isp_spacing-mini: 4px;
--isp_spacing-tiny: 6px;
--isp_spacing-micro: 8px;
--isp_spacing-petite: 12px;
--isp_spacing-base: 16px;
--isp_spacing-moderate: 24px;
--isp_spacing-medium: 32px;
--isp_spacing-large: 40px;
--isp_spacing-jumbo: 48px;
--isp_spacing-giant: 64px;
}
@media screen and (max-width: 768px) {
:root {
--isp_radius-none: 0px;
--isp_radius-sharp: 4px;
--isp_radius-subtle: 6px;
--isp_radius-default: 8px;
--isp_radius-smooth: 10px;
--isp_radius-rounded: 12px;
--isp_radius-pill: 20px;
--isp_radius-full: 9999px;
--isp_spacing-none: 0px;
--isp_spacing-optical: 2px;
--isp_spacing-mini: 4px;
--isp_spacing-tiny: 6px;
--isp_spacing-micro: 8px;
--isp_spacing-petite: 10px;
--isp_spacing-base: 14px;
--isp_spacing-moderate: 18px;
--isp_spacing-medium: 24px;
--isp_spacing-large: 32px;
--isp_spacing-jumbo: 36px;
--isp_spacing-giant: 48px;
}
}
}