// Accordion (title and content need to be in a div to style the whole element)
:root {
–accordion-background-color: var(–gray-1);
–accordion-radius: 0px;
–accordion-title-padding: 10px 15px;
–accordion-title-font-size: 16px;
–accordion-title-font-weight: 700;
–accordion-title-background: var(–gray-1);
–accordion-content-padding: 10px 15px;
}
// Button
:root {
–button-font-size: 1rem;
–button-font-weight: 400;
–button-radius: .25rem;
–button-border-width: 1px;
–button-padding: .375rem .75rem;
–button-padding-sm: .25rem .5rem;
–button-padding-lg: .5rem 1rem;
–border-radius-sm: 3px;
–border-radius-md: 4px;
–border-radius-lg: 8px;
–border-radius-xl: 16px;
}
// Column Spacings
:root {
–spacing-none: 0;
–spacing-xs: 8px;
–spacing-sm: 12px;
–spacing-md: 16px;
–spacing-lg: 32px;
–spacing-xl: 64px;
–spacing-xl: 96px;
}
// Container
:root {
–grid-gutter-width: 32px;
–grid-breakpoint-xs: 0;
–grid-breakpoint-sm: 576px;
–grid-breakpoint-md: 768px;
–grid-breakpoint-lg: 992px;
–grid-breakpoint-xl: 1200px;
–container-max-width-sm: 960px;
–container-max-width-md: 1140px;
–container-max-width-lg: 1320px;
–container-max-width-xl: 1500px;
}
// Container
:root {
–grid-gutter-width: 32px;
–grid-breakpoint-xs: 0;
–grid-breakpoint-sm: 576px;
–grid-breakpoint-md: 768px;
–grid-breakpoint-lg: 992px;
–grid-breakpoint-xl: 1200px;
–container-max-width-sm: 960px;
–container-max-width-md: 1140px;
–container-max-width-lg: 1320px;
–container-max-width-xl: 1500px;
}