Improve flex-wrap
Signed-off-by: Charles de Dreuille <charles.dedreuille@gmail.com>
This commit is contained in:
Charles de Dreuille
@@ -205,7 +205,7 @@ export const AlignItems: Story = {
|
||||
),
|
||||
};
|
||||
|
||||
const stylePaddingBox = {
|
||||
const styleInsideBox = {
|
||||
background: 'rgb(196, 202, 251)',
|
||||
color: 'white',
|
||||
borderRadius: '4px',
|
||||
@@ -223,27 +223,27 @@ export const Padding: Story = {
|
||||
render: args => (
|
||||
<Stack align="center" gap="md">
|
||||
<Inline alignY="center" gap="md">
|
||||
<Box padding="md" style={stylePaddingBox}>
|
||||
<Box padding="md" style={styleInsideBox}>
|
||||
<Box {...args}>Padding</Box>
|
||||
</Box>
|
||||
<Box paddingX="md" style={stylePaddingBox}>
|
||||
<Box paddingX="md" style={styleInsideBox}>
|
||||
<Box {...args}>Padding X</Box>
|
||||
</Box>
|
||||
<Box paddingY="md" style={stylePaddingBox}>
|
||||
<Box paddingY="md" style={styleInsideBox}>
|
||||
<Box {...args}>Padding Y</Box>
|
||||
</Box>
|
||||
</Inline>
|
||||
<Inline alignY="center" gap="md">
|
||||
<Box paddingTop="md" style={stylePaddingBox}>
|
||||
<Box paddingTop="md" style={styleInsideBox}>
|
||||
<Box {...args}>Padding Top</Box>
|
||||
</Box>
|
||||
<Box paddingRight="md" style={stylePaddingBox}>
|
||||
<Box paddingRight="md" style={styleInsideBox}>
|
||||
<Box {...args}>Padding Right</Box>
|
||||
</Box>
|
||||
<Box paddingBottom="md" style={stylePaddingBox}>
|
||||
<Box paddingBottom="md" style={styleInsideBox}>
|
||||
<Box {...args}>Padding Bottom</Box>
|
||||
</Box>
|
||||
<Box paddingLeft="md" style={stylePaddingBox}>
|
||||
<Box paddingLeft="md" style={styleInsideBox}>
|
||||
<Box {...args}>Padding Left</Box>
|
||||
</Box>
|
||||
</Inline>
|
||||
@@ -251,19 +251,95 @@ export const Padding: Story = {
|
||||
),
|
||||
};
|
||||
|
||||
// Example showing different display values
|
||||
export const DisplayVariants: Story = {
|
||||
render: () => (
|
||||
<Box display="flex" flexDirection="column" gap="md">
|
||||
<Box padding="md" background="background" display="block">
|
||||
Display Block
|
||||
</Box>
|
||||
<Box padding="md" background="background" display="flex">
|
||||
Display Flex
|
||||
</Box>
|
||||
<Box padding="md" background="background" display="inline">
|
||||
Display Inline
|
||||
</Box>
|
||||
</Box>
|
||||
export const Margin: Story = {
|
||||
args: {
|
||||
style: {
|
||||
background: '#1f47ff',
|
||||
color: 'white',
|
||||
borderRadius: '4px',
|
||||
padding: '12px 12px',
|
||||
},
|
||||
},
|
||||
render: args => (
|
||||
<Stack align="center" gap="md">
|
||||
<Inline alignY="center" gap="md">
|
||||
<Box style={styleInsideBox}>
|
||||
<Box margin="md" {...args}>
|
||||
Margin
|
||||
</Box>
|
||||
</Box>
|
||||
<Box style={styleInsideBox}>
|
||||
<Box marginX="md" {...args}>
|
||||
Margin X
|
||||
</Box>
|
||||
</Box>
|
||||
<Box style={styleInsideBox}>
|
||||
<Box marginY="md" {...args}>
|
||||
Margin Y
|
||||
</Box>
|
||||
</Box>
|
||||
</Inline>
|
||||
<Inline alignY="center" gap="md">
|
||||
<Box style={styleInsideBox}>
|
||||
<Box marginTop="md" {...args}>
|
||||
Margin Top
|
||||
</Box>
|
||||
</Box>
|
||||
<Box style={styleInsideBox}>
|
||||
<Box marginRight="md" {...args}>
|
||||
Margin Right
|
||||
</Box>
|
||||
</Box>
|
||||
<Box style={styleInsideBox}>
|
||||
<Box marginBottom="md" {...args}>
|
||||
Margin Bottom
|
||||
</Box>
|
||||
</Box>
|
||||
<Box style={styleInsideBox}>
|
||||
<Box marginLeft="md" {...args}>
|
||||
Margin Left
|
||||
</Box>
|
||||
</Box>
|
||||
</Inline>
|
||||
</Stack>
|
||||
),
|
||||
};
|
||||
|
||||
export const FlexWrap: Story = {
|
||||
args: {
|
||||
style: {
|
||||
...Basic.args?.style,
|
||||
width: '200px',
|
||||
},
|
||||
display: 'flex',
|
||||
gap: 'xs',
|
||||
},
|
||||
render: args => (
|
||||
<Stack align="center">
|
||||
<Box flexWrap="wrap" {...args}>
|
||||
<span>One</span>
|
||||
<span>Two</span>
|
||||
<span>Three</span>
|
||||
<span>Four</span>
|
||||
<span>Five</span>
|
||||
<span>Six</span>
|
||||
</Box>
|
||||
<Box flexWrap="nowrap" {...args}>
|
||||
<span>One</span>
|
||||
<span>Two</span>
|
||||
<span>Three</span>
|
||||
<span>Four</span>
|
||||
<span>Five</span>
|
||||
<span>Six</span>
|
||||
</Box>
|
||||
<Box flexWrap="wrap-reverse" {...args}>
|
||||
<span>One</span>
|
||||
<span>Two</span>
|
||||
<span>Three</span>
|
||||
<span>Four</span>
|
||||
<span>Five</span>
|
||||
<span>Six</span>
|
||||
</Box>
|
||||
</Stack>
|
||||
),
|
||||
};
|
||||
|
||||
@@ -14,69 +14,12 @@
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { Breakpoint, SpaceProps, ColorProps } from '../../layout/types';
|
||||
import type { UtilityProps } from '../../types';
|
||||
|
||||
/** @public */
|
||||
export type DisplayProps =
|
||||
| 'flex'
|
||||
| 'none'
|
||||
| 'inline'
|
||||
| 'block'
|
||||
| Partial<Record<Breakpoint, 'flex' | 'none' | 'inline' | 'block'>>;
|
||||
|
||||
/** @public */
|
||||
export type FlexDirectionProps =
|
||||
| 'row'
|
||||
| 'column'
|
||||
| Partial<Record<Breakpoint, 'row' | 'column'>>;
|
||||
|
||||
/** @public */
|
||||
export type FlexWrapProps =
|
||||
| 'wrap'
|
||||
| 'nowrap'
|
||||
| Partial<Record<Breakpoint, 'wrap' | 'nowrap'>>;
|
||||
|
||||
/** @public */
|
||||
export type JustifyContentProps =
|
||||
| 'stretch'
|
||||
| 'start'
|
||||
| 'center'
|
||||
| 'end'
|
||||
| 'around'
|
||||
| 'between'
|
||||
| Partial<
|
||||
Record<
|
||||
Breakpoint,
|
||||
'stretch' | 'start' | 'center' | 'end' | 'around' | 'between'
|
||||
>
|
||||
>;
|
||||
|
||||
/** @public */
|
||||
export type AlignItemsProps =
|
||||
| 'stretch'
|
||||
| 'start'
|
||||
| 'center'
|
||||
| 'end'
|
||||
| Partial<Record<Breakpoint, 'stretch' | 'start' | 'center' | 'end'>>;
|
||||
|
||||
/** @public */
|
||||
export type BorderRadiusProps =
|
||||
| 'none'
|
||||
| 'small'
|
||||
| 'medium'
|
||||
| 'full'
|
||||
| Partial<Record<Breakpoint, 'none' | 'small' | 'medium' | 'full'>>;
|
||||
|
||||
/** @public */
|
||||
export interface BoxProps extends SpaceProps, ColorProps {
|
||||
export interface BoxProps extends UtilityProps {
|
||||
as?: keyof JSX.IntrinsicElements;
|
||||
children?: React.ReactNode;
|
||||
display?: DisplayProps;
|
||||
flexDirection?: FlexDirectionProps;
|
||||
flexWrap?: FlexWrapProps;
|
||||
justifyContent?: JustifyContentProps;
|
||||
alignItems?: AlignItemsProps;
|
||||
borderRadius?: BorderRadiusProps;
|
||||
className?: string;
|
||||
style?: React.CSSProperties;
|
||||
}
|
||||
|
||||
@@ -20,6 +20,62 @@
|
||||
display: block;
|
||||
}
|
||||
|
||||
.cu-2xl-flex {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.cu-2xl-flex-col {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.cu-2xl-flex-nowrap {
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
|
||||
.cu-2xl-flex-row {
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.cu-2xl-flex-wrap {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.cu-2xl-flex-wrap-reverse {
|
||||
flex-wrap: wrap-reverse;
|
||||
}
|
||||
|
||||
.cu-2xl-gap-2xl {
|
||||
gap: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-2xl-gap-lg {
|
||||
gap: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-2xl-gap-md {
|
||||
gap: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-2xl-gap-none {
|
||||
gap: 0;
|
||||
}
|
||||
|
||||
.cu-2xl-gap-sm {
|
||||
gap: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-2xl-gap-xl {
|
||||
gap: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-2xl-gap-xs {
|
||||
gap: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-2xl-grid {
|
||||
display: grid;
|
||||
}
|
||||
|
||||
.cu-2xl-hidden {
|
||||
display: none;
|
||||
}
|
||||
@@ -32,36 +88,20 @@
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.cu-2xl-flex {
|
||||
display: flex;
|
||||
.cu-2xl-items-center {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.cu-2xl-grid {
|
||||
display: grid;
|
||||
.cu-2xl-items-end {
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.cu-2xl-flex-row {
|
||||
flex-direction: row;
|
||||
.cu-2xl-items-start {
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.cu-2xl-flex-col {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.cu-2xl-justify-stretch {
|
||||
justify-content: stretch;
|
||||
}
|
||||
|
||||
.cu-2xl-justify-start {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.cu-2xl-justify-center {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.cu-2xl-justify-end {
|
||||
justify-content: flex-end;
|
||||
.cu-2xl-items-stretch {
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.cu-2xl-justify-around {
|
||||
@@ -72,303 +112,195 @@
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.cu-2xl-items-stretch {
|
||||
align-items: stretch;
|
||||
.cu-2xl-justify-center {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.cu-2xl-items-center {
|
||||
align-items: center;
|
||||
.cu-2xl-justify-end {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.cu-2xl-items-start {
|
||||
align-items: flex-start;
|
||||
.cu-2xl-justify-start {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.cu-2xl-items-end {
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.cu-2xl-p-none {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.cu-2xl-p-2xs {
|
||||
padding: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-2xl-p-xs {
|
||||
padding: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-2xl-p-sm {
|
||||
padding: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-2xl-p-md {
|
||||
padding: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-2xl-p-lg {
|
||||
padding: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-2xl-p-xl {
|
||||
padding: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-2xl-p-2xl {
|
||||
padding: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-2xl-px-none {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.cu-2xl-px-2xs {
|
||||
padding-left: var(--canon-spacing-2xs);
|
||||
padding-right: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-2xl-px-xs {
|
||||
padding-left: var(--canon-spacing-xs);
|
||||
padding-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-2xl-px-sm {
|
||||
padding-left: var(--canon-spacing-sm);
|
||||
padding-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-2xl-px-md {
|
||||
padding-left: var(--canon-spacing-md);
|
||||
padding-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-2xl-px-lg {
|
||||
padding-left: var(--canon-spacing-lg);
|
||||
padding-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-2xl-px-xl {
|
||||
padding-left: var(--canon-spacing-xl);
|
||||
padding-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-2xl-px-2xl {
|
||||
padding-left: var(--canon-spacing-2xl);
|
||||
padding-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-2xl-py-none {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-2xl-py-2xs {
|
||||
padding-top: var(--canon-spacing-2xs);
|
||||
padding-bottom: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-2xl-py-xs {
|
||||
padding-top: var(--canon-spacing-xs);
|
||||
padding-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-2xl-py-sm {
|
||||
padding-top: var(--canon-spacing-sm);
|
||||
padding-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-2xl-py-md {
|
||||
padding-top: var(--canon-spacing-md);
|
||||
padding-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-2xl-py-lg {
|
||||
padding-top: var(--canon-spacing-lg);
|
||||
padding-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-2xl-py-xl {
|
||||
padding-top: var(--canon-spacing-xl);
|
||||
padding-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-2xl-py-2xl {
|
||||
padding-top: var(--canon-spacing-2xl);
|
||||
padding-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-2xl-pl-none {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.cu-2xl-pl-2xs {
|
||||
padding-left: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-2xl-pl-xs {
|
||||
padding-left: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-2xl-pl-sm {
|
||||
padding-left: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-2xl-pl-md {
|
||||
padding-left: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-2xl-pl-lg {
|
||||
padding-left: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-2xl-pl-xl {
|
||||
padding-left: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-2xl-pl-2xl {
|
||||
padding-left: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-2xl-pr-none {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.cu-2xl-pr-2xs {
|
||||
padding-right: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-2xl-pr-xs {
|
||||
padding-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-2xl-pr-sm {
|
||||
padding-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-2xl-pr-md {
|
||||
padding-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-2xl-pr-lg {
|
||||
padding-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-2xl-pr-xl {
|
||||
padding-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-2xl-pr-2xl {
|
||||
padding-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-2xl-m-none {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.cu-2xl-m-2xs {
|
||||
margin: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-2xl-m-xs {
|
||||
margin: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-2xl-m-sm {
|
||||
margin: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-2xl-m-md {
|
||||
margin: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-2xl-m-lg {
|
||||
margin: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-2xl-m-xl {
|
||||
margin: var(--canon-spacing-xl);
|
||||
.cu-2xl-justify-stretch {
|
||||
justify-content: stretch;
|
||||
}
|
||||
|
||||
.cu-2xl-m-2xl {
|
||||
margin: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-2xl-mx-none {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
.cu-2xl-m-lg {
|
||||
margin: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-2xl-mx-2xs {
|
||||
margin-left: var(--canon-spacing-2xs);
|
||||
margin-right: var(--canon-spacing-2xs);
|
||||
.cu-2xl-m-md {
|
||||
margin: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-2xl-mx-xs {
|
||||
margin-left: var(--canon-spacing-xs);
|
||||
margin-right: var(--canon-spacing-xs);
|
||||
.cu-2xl-m-none {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.cu-2xl-mx-sm {
|
||||
margin-left: var(--canon-spacing-sm);
|
||||
margin-right: var(--canon-spacing-sm);
|
||||
.cu-2xl-m-sm {
|
||||
margin: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-2xl-mx-md {
|
||||
margin-left: var(--canon-spacing-md);
|
||||
margin-right: var(--canon-spacing-md);
|
||||
.cu-2xl-m-xl {
|
||||
margin: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-2xl-mx-lg {
|
||||
.cu-2xl-m-xs {
|
||||
margin: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-2xl-mb-2xl {
|
||||
margin-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-2xl-mb-lg {
|
||||
margin-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-2xl-mb-md {
|
||||
margin-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-2xl-mb-none {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-2xl-mb-sm {
|
||||
margin-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-2xl-mb-xl {
|
||||
margin-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-2xl-mb-xs {
|
||||
margin-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-2xl-ml-2xl {
|
||||
margin-left: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-2xl-ml-lg {
|
||||
margin-left: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-2xl-ml-md {
|
||||
margin-left: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-2xl-ml-none {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.cu-2xl-ml-sm {
|
||||
margin-left: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-2xl-ml-xl {
|
||||
margin-left: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-2xl-ml-xs {
|
||||
margin-left: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-2xl-mr-2xl {
|
||||
margin-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-2xl-mr-lg {
|
||||
margin-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-2xl-mx-xl {
|
||||
margin-left: var(--canon-spacing-xl);
|
||||
.cu-2xl-mr-md {
|
||||
margin-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-2xl-mr-none {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.cu-2xl-mr-sm {
|
||||
margin-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-2xl-mr-xl {
|
||||
margin-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-2xl-mr-xs {
|
||||
margin-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-2xl-mt-2xl {
|
||||
margin-top: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-2xl-mt-lg {
|
||||
margin-top: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-2xl-mt-md {
|
||||
margin-top: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-2xl-mt-none {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.cu-2xl-mt-sm {
|
||||
margin-top: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-2xl-mt-xl {
|
||||
margin-top: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-2xl-mt-xs {
|
||||
margin-top: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-2xl-mx-2xl {
|
||||
margin-left: var(--canon-spacing-2xl);
|
||||
margin-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-2xl-my-none {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
.cu-2xl-mx-lg {
|
||||
margin-left: var(--canon-spacing-lg);
|
||||
margin-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-2xl-my-2xs {
|
||||
margin-top: var(--canon-spacing-2xs);
|
||||
margin-bottom: var(--canon-spacing-2xs);
|
||||
.cu-2xl-mx-md {
|
||||
margin-left: var(--canon-spacing-md);
|
||||
margin-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-2xl-my-xs {
|
||||
margin-top: var(--canon-spacing-xs);
|
||||
margin-bottom: var(--canon-spacing-xs);
|
||||
.cu-2xl-mx-none {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.cu-2xl-my-sm {
|
||||
margin-top: var(--canon-spacing-sm);
|
||||
margin-bottom: var(--canon-spacing-sm);
|
||||
.cu-2xl-mx-sm {
|
||||
margin-left: var(--canon-spacing-sm);
|
||||
margin-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-2xl-my-md {
|
||||
margin-top: var(--canon-spacing-md);
|
||||
margin-bottom: var(--canon-spacing-md);
|
||||
.cu-2xl-mx-xl {
|
||||
margin-left: var(--canon-spacing-xl);
|
||||
margin-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-2xl-my-lg {
|
||||
margin-top: var(--canon-spacing-lg);
|
||||
margin-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-2xl-my-xl {
|
||||
margin-top: var(--canon-spacing-xl);
|
||||
margin-bottom: var(--canon-spacing-xl);
|
||||
.cu-2xl-mx-xs {
|
||||
margin-left: var(--canon-spacing-xs);
|
||||
margin-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-2xl-my-2xl {
|
||||
@@ -376,228 +308,248 @@
|
||||
margin-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-2xl-ml-none {
|
||||
margin-left: 0;
|
||||
.cu-2xl-my-lg {
|
||||
margin-top: var(--canon-spacing-lg);
|
||||
margin-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-2xl-ml-2xs {
|
||||
margin-left: var(--canon-spacing-2xs);
|
||||
.cu-2xl-my-md {
|
||||
margin-top: var(--canon-spacing-md);
|
||||
margin-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-2xl-ml-xs {
|
||||
margin-left: var(--canon-spacing-xs);
|
||||
.cu-2xl-my-none {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-2xl-ml-sm {
|
||||
margin-left: var(--canon-spacing-sm);
|
||||
.cu-2xl-my-sm {
|
||||
margin-top: var(--canon-spacing-sm);
|
||||
margin-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-2xl-ml-md {
|
||||
margin-left: var(--canon-spacing-md);
|
||||
.cu-2xl-my-xl {
|
||||
margin-top: var(--canon-spacing-xl);
|
||||
margin-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-2xl-ml-lg {
|
||||
margin-left: var(--canon-spacing-lg);
|
||||
.cu-2xl-my-xs {
|
||||
margin-top: var(--canon-spacing-xs);
|
||||
margin-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-2xl-ml-xl {
|
||||
margin-left: var(--canon-spacing-xl);
|
||||
.cu-2xl-p-2xl {
|
||||
padding: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-2xl-ml-2xl {
|
||||
margin-left: var(--canon-spacing-2xl);
|
||||
.cu-2xl-p-lg {
|
||||
padding: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-2xl-mr-none {
|
||||
margin-right: 0;
|
||||
.cu-2xl-p-md {
|
||||
padding: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-2xl-mr-2xs {
|
||||
margin-right: var(--canon-spacing-2xs);
|
||||
.cu-2xl-p-none {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.cu-2xl-mr-xs {
|
||||
margin-right: var(--canon-spacing-xs);
|
||||
.cu-2xl-p-sm {
|
||||
padding: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-2xl-mr-sm {
|
||||
margin-right: var(--canon-spacing-sm);
|
||||
.cu-2xl-p-xl {
|
||||
padding: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-2xl-mr-md {
|
||||
margin-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-2xl-mr-lg {
|
||||
margin-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-2xl-mr-xl {
|
||||
margin-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-2xl-mr-2xl {
|
||||
margin-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-2xl-gap-none {
|
||||
gap: 0;
|
||||
}
|
||||
|
||||
.cu-2xl-gap-2xs {
|
||||
gap: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-2xl-gap-xs {
|
||||
gap: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-2xl-gap-sm {
|
||||
gap: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-2xl-gap-md {
|
||||
gap: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-2xl-gap-lg {
|
||||
gap: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-2xl-gap-xl {
|
||||
gap: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-2xl-gap-2xl {
|
||||
gap: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-2xl-pt-none {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.cu-2xl-pt-2xs {
|
||||
padding-top: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-2xl-pt-xs {
|
||||
padding-top: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-2xl-pt-sm {
|
||||
padding-top: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-2xl-pt-md {
|
||||
padding-top: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-2xl-pt-lg {
|
||||
padding-top: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-2xl-pt-xl {
|
||||
padding-top: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-2xl-pt-2xl {
|
||||
padding-top: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-2xl-pb-none {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-2xl-pb-2xs {
|
||||
padding-bottom: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-2xl-pb-xs {
|
||||
padding-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-2xl-pb-sm {
|
||||
padding-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-2xl-pb-md {
|
||||
padding-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-2xl-pb-lg {
|
||||
padding-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-2xl-pb-xl {
|
||||
padding-bottom: var(--canon-spacing-xl);
|
||||
.cu-2xl-p-xs {
|
||||
padding: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-2xl-pb-2xl {
|
||||
padding-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-2xl-mt-none {
|
||||
margin-top: 0;
|
||||
.cu-2xl-pb-lg {
|
||||
padding-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-2xl-mt-2xs {
|
||||
margin-top: var(--canon-spacing-2xs);
|
||||
.cu-2xl-pb-md {
|
||||
padding-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-2xl-mt-xs {
|
||||
margin-top: var(--canon-spacing-xs);
|
||||
.cu-2xl-pb-none {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-2xl-mt-sm {
|
||||
margin-top: var(--canon-spacing-sm);
|
||||
.cu-2xl-pb-sm {
|
||||
padding-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-2xl-mt-md {
|
||||
margin-top: var(--canon-spacing-md);
|
||||
.cu-2xl-pb-xl {
|
||||
padding-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-2xl-mt-lg {
|
||||
margin-top: var(--canon-spacing-lg);
|
||||
.cu-2xl-pb-xs {
|
||||
padding-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-2xl-mt-xl {
|
||||
margin-top: var(--canon-spacing-xl);
|
||||
.cu-2xl-pl-2xl {
|
||||
padding-left: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-2xl-mt-2xl {
|
||||
margin-top: var(--canon-spacing-2xl);
|
||||
.cu-2xl-pl-lg {
|
||||
padding-left: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-2xl-mb-none {
|
||||
margin-bottom: 0;
|
||||
.cu-2xl-pl-md {
|
||||
padding-left: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-2xl-mb-2xs {
|
||||
margin-bottom: var(--canon-spacing-2xs);
|
||||
.cu-2xl-pl-none {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.cu-2xl-mb-xs {
|
||||
margin-bottom: var(--canon-spacing-xs);
|
||||
.cu-2xl-pl-sm {
|
||||
padding-left: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-2xl-mb-sm {
|
||||
margin-bottom: var(--canon-spacing-sm);
|
||||
.cu-2xl-pl-xl {
|
||||
padding-left: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-2xl-mb-md {
|
||||
margin-bottom: var(--canon-spacing-md);
|
||||
.cu-2xl-pl-xs {
|
||||
padding-left: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-2xl-mb-lg {
|
||||
margin-bottom: var(--canon-spacing-lg);
|
||||
.cu-2xl-pr-2xl {
|
||||
padding-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-2xl-mb-xl {
|
||||
margin-bottom: var(--canon-spacing-xl);
|
||||
.cu-2xl-pr-lg {
|
||||
padding-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-2xl-mb-2xl {
|
||||
margin-bottom: var(--canon-spacing-2xl);
|
||||
.cu-2xl-pr-md {
|
||||
padding-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-2xl-pr-none {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.cu-2xl-pr-sm {
|
||||
padding-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-2xl-pr-xl {
|
||||
padding-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-2xl-pr-xs {
|
||||
padding-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-2xl-pt-2xl {
|
||||
padding-top: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-2xl-pt-lg {
|
||||
padding-top: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-2xl-pt-md {
|
||||
padding-top: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-2xl-pt-none {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.cu-2xl-pt-sm {
|
||||
padding-top: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-2xl-pt-xl {
|
||||
padding-top: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-2xl-pt-xs {
|
||||
padding-top: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-2xl-px-2xl {
|
||||
padding-left: var(--canon-spacing-2xl);
|
||||
padding-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-2xl-px-lg {
|
||||
padding-left: var(--canon-spacing-lg);
|
||||
padding-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-2xl-px-md {
|
||||
padding-left: var(--canon-spacing-md);
|
||||
padding-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-2xl-px-none {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.cu-2xl-px-sm {
|
||||
padding-left: var(--canon-spacing-sm);
|
||||
padding-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-2xl-px-xl {
|
||||
padding-left: var(--canon-spacing-xl);
|
||||
padding-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-2xl-px-xs {
|
||||
padding-left: var(--canon-spacing-xs);
|
||||
padding-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-2xl-py-2xl {
|
||||
padding-top: var(--canon-spacing-2xl);
|
||||
padding-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-2xl-py-lg {
|
||||
padding-top: var(--canon-spacing-lg);
|
||||
padding-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-2xl-py-md {
|
||||
padding-top: var(--canon-spacing-md);
|
||||
padding-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-2xl-py-none {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-2xl-py-sm {
|
||||
padding-top: var(--canon-spacing-sm);
|
||||
padding-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-2xl-py-xl {
|
||||
padding-top: var(--canon-spacing-xl);
|
||||
padding-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-2xl-py-xs {
|
||||
padding-top: var(--canon-spacing-xs);
|
||||
padding-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-2xl-wrap-reverse {
|
||||
flex-wrap: wrap-reverse;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -20,6 +20,62 @@
|
||||
display: block;
|
||||
}
|
||||
|
||||
.cu-lg-flex {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.cu-lg-flex-col {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.cu-lg-flex-nowrap {
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
|
||||
.cu-lg-flex-row {
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.cu-lg-flex-wrap {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.cu-lg-flex-wrap-reverse {
|
||||
flex-wrap: wrap-reverse;
|
||||
}
|
||||
|
||||
.cu-lg-gap-2xl {
|
||||
gap: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-lg-gap-lg {
|
||||
gap: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-lg-gap-md {
|
||||
gap: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-lg-gap-none {
|
||||
gap: 0;
|
||||
}
|
||||
|
||||
.cu-lg-gap-sm {
|
||||
gap: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-lg-gap-xl {
|
||||
gap: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-lg-gap-xs {
|
||||
gap: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-lg-grid {
|
||||
display: grid;
|
||||
}
|
||||
|
||||
.cu-lg-hidden {
|
||||
display: none;
|
||||
}
|
||||
@@ -32,36 +88,20 @@
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.cu-lg-flex {
|
||||
display: flex;
|
||||
.cu-lg-items-center {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.cu-lg-grid {
|
||||
display: grid;
|
||||
.cu-lg-items-end {
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.cu-lg-flex-row {
|
||||
flex-direction: row;
|
||||
.cu-lg-items-start {
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.cu-lg-flex-col {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.cu-lg-justify-stretch {
|
||||
justify-content: stretch;
|
||||
}
|
||||
|
||||
.cu-lg-justify-start {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.cu-lg-justify-center {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.cu-lg-justify-end {
|
||||
justify-content: flex-end;
|
||||
.cu-lg-items-stretch {
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.cu-lg-justify-around {
|
||||
@@ -72,303 +112,195 @@
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.cu-lg-items-stretch {
|
||||
align-items: stretch;
|
||||
.cu-lg-justify-center {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.cu-lg-items-center {
|
||||
align-items: center;
|
||||
.cu-lg-justify-end {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.cu-lg-items-start {
|
||||
align-items: flex-start;
|
||||
.cu-lg-justify-start {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.cu-lg-items-end {
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.cu-lg-p-none {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.cu-lg-p-2xs {
|
||||
padding: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-lg-p-xs {
|
||||
padding: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-lg-p-sm {
|
||||
padding: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-lg-p-md {
|
||||
padding: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-lg-p-lg {
|
||||
padding: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-lg-p-xl {
|
||||
padding: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-lg-p-2xl {
|
||||
padding: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-lg-px-none {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.cu-lg-px-2xs {
|
||||
padding-left: var(--canon-spacing-2xs);
|
||||
padding-right: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-lg-px-xs {
|
||||
padding-left: var(--canon-spacing-xs);
|
||||
padding-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-lg-px-sm {
|
||||
padding-left: var(--canon-spacing-sm);
|
||||
padding-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-lg-px-md {
|
||||
padding-left: var(--canon-spacing-md);
|
||||
padding-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-lg-px-lg {
|
||||
padding-left: var(--canon-spacing-lg);
|
||||
padding-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-lg-px-xl {
|
||||
padding-left: var(--canon-spacing-xl);
|
||||
padding-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-lg-px-2xl {
|
||||
padding-left: var(--canon-spacing-2xl);
|
||||
padding-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-lg-py-none {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-lg-py-2xs {
|
||||
padding-top: var(--canon-spacing-2xs);
|
||||
padding-bottom: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-lg-py-xs {
|
||||
padding-top: var(--canon-spacing-xs);
|
||||
padding-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-lg-py-sm {
|
||||
padding-top: var(--canon-spacing-sm);
|
||||
padding-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-lg-py-md {
|
||||
padding-top: var(--canon-spacing-md);
|
||||
padding-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-lg-py-lg {
|
||||
padding-top: var(--canon-spacing-lg);
|
||||
padding-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-lg-py-xl {
|
||||
padding-top: var(--canon-spacing-xl);
|
||||
padding-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-lg-py-2xl {
|
||||
padding-top: var(--canon-spacing-2xl);
|
||||
padding-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-lg-pl-none {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.cu-lg-pl-2xs {
|
||||
padding-left: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-lg-pl-xs {
|
||||
padding-left: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-lg-pl-sm {
|
||||
padding-left: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-lg-pl-md {
|
||||
padding-left: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-lg-pl-lg {
|
||||
padding-left: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-lg-pl-xl {
|
||||
padding-left: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-lg-pl-2xl {
|
||||
padding-left: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-lg-pr-none {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.cu-lg-pr-2xs {
|
||||
padding-right: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-lg-pr-xs {
|
||||
padding-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-lg-pr-sm {
|
||||
padding-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-lg-pr-md {
|
||||
padding-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-lg-pr-lg {
|
||||
padding-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-lg-pr-xl {
|
||||
padding-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-lg-pr-2xl {
|
||||
padding-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-lg-m-none {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.cu-lg-m-2xs {
|
||||
margin: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-lg-m-xs {
|
||||
margin: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-lg-m-sm {
|
||||
margin: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-lg-m-md {
|
||||
margin: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-lg-m-lg {
|
||||
margin: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-lg-m-xl {
|
||||
margin: var(--canon-spacing-xl);
|
||||
.cu-lg-justify-stretch {
|
||||
justify-content: stretch;
|
||||
}
|
||||
|
||||
.cu-lg-m-2xl {
|
||||
margin: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-lg-mx-none {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
.cu-lg-m-lg {
|
||||
margin: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-lg-mx-2xs {
|
||||
margin-left: var(--canon-spacing-2xs);
|
||||
margin-right: var(--canon-spacing-2xs);
|
||||
.cu-lg-m-md {
|
||||
margin: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-lg-mx-xs {
|
||||
margin-left: var(--canon-spacing-xs);
|
||||
margin-right: var(--canon-spacing-xs);
|
||||
.cu-lg-m-none {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.cu-lg-mx-sm {
|
||||
margin-left: var(--canon-spacing-sm);
|
||||
margin-right: var(--canon-spacing-sm);
|
||||
.cu-lg-m-sm {
|
||||
margin: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-lg-mx-md {
|
||||
margin-left: var(--canon-spacing-md);
|
||||
margin-right: var(--canon-spacing-md);
|
||||
.cu-lg-m-xl {
|
||||
margin: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-lg-mx-lg {
|
||||
.cu-lg-m-xs {
|
||||
margin: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-lg-mb-2xl {
|
||||
margin-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-lg-mb-lg {
|
||||
margin-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-lg-mb-md {
|
||||
margin-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-lg-mb-none {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-lg-mb-sm {
|
||||
margin-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-lg-mb-xl {
|
||||
margin-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-lg-mb-xs {
|
||||
margin-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-lg-ml-2xl {
|
||||
margin-left: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-lg-ml-lg {
|
||||
margin-left: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-lg-ml-md {
|
||||
margin-left: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-lg-ml-none {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.cu-lg-ml-sm {
|
||||
margin-left: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-lg-ml-xl {
|
||||
margin-left: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-lg-ml-xs {
|
||||
margin-left: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-lg-mr-2xl {
|
||||
margin-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-lg-mr-lg {
|
||||
margin-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-lg-mx-xl {
|
||||
margin-left: var(--canon-spacing-xl);
|
||||
.cu-lg-mr-md {
|
||||
margin-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-lg-mr-none {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.cu-lg-mr-sm {
|
||||
margin-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-lg-mr-xl {
|
||||
margin-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-lg-mr-xs {
|
||||
margin-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-lg-mt-2xl {
|
||||
margin-top: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-lg-mt-lg {
|
||||
margin-top: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-lg-mt-md {
|
||||
margin-top: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-lg-mt-none {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.cu-lg-mt-sm {
|
||||
margin-top: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-lg-mt-xl {
|
||||
margin-top: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-lg-mt-xs {
|
||||
margin-top: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-lg-mx-2xl {
|
||||
margin-left: var(--canon-spacing-2xl);
|
||||
margin-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-lg-my-none {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
.cu-lg-mx-lg {
|
||||
margin-left: var(--canon-spacing-lg);
|
||||
margin-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-lg-my-2xs {
|
||||
margin-top: var(--canon-spacing-2xs);
|
||||
margin-bottom: var(--canon-spacing-2xs);
|
||||
.cu-lg-mx-md {
|
||||
margin-left: var(--canon-spacing-md);
|
||||
margin-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-lg-my-xs {
|
||||
margin-top: var(--canon-spacing-xs);
|
||||
margin-bottom: var(--canon-spacing-xs);
|
||||
.cu-lg-mx-none {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.cu-lg-my-sm {
|
||||
margin-top: var(--canon-spacing-sm);
|
||||
margin-bottom: var(--canon-spacing-sm);
|
||||
.cu-lg-mx-sm {
|
||||
margin-left: var(--canon-spacing-sm);
|
||||
margin-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-lg-my-md {
|
||||
margin-top: var(--canon-spacing-md);
|
||||
margin-bottom: var(--canon-spacing-md);
|
||||
.cu-lg-mx-xl {
|
||||
margin-left: var(--canon-spacing-xl);
|
||||
margin-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-lg-my-lg {
|
||||
margin-top: var(--canon-spacing-lg);
|
||||
margin-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-lg-my-xl {
|
||||
margin-top: var(--canon-spacing-xl);
|
||||
margin-bottom: var(--canon-spacing-xl);
|
||||
.cu-lg-mx-xs {
|
||||
margin-left: var(--canon-spacing-xs);
|
||||
margin-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-lg-my-2xl {
|
||||
@@ -376,228 +308,248 @@
|
||||
margin-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-lg-ml-none {
|
||||
margin-left: 0;
|
||||
.cu-lg-my-lg {
|
||||
margin-top: var(--canon-spacing-lg);
|
||||
margin-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-lg-ml-2xs {
|
||||
margin-left: var(--canon-spacing-2xs);
|
||||
.cu-lg-my-md {
|
||||
margin-top: var(--canon-spacing-md);
|
||||
margin-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-lg-ml-xs {
|
||||
margin-left: var(--canon-spacing-xs);
|
||||
.cu-lg-my-none {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-lg-ml-sm {
|
||||
margin-left: var(--canon-spacing-sm);
|
||||
.cu-lg-my-sm {
|
||||
margin-top: var(--canon-spacing-sm);
|
||||
margin-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-lg-ml-md {
|
||||
margin-left: var(--canon-spacing-md);
|
||||
.cu-lg-my-xl {
|
||||
margin-top: var(--canon-spacing-xl);
|
||||
margin-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-lg-ml-lg {
|
||||
margin-left: var(--canon-spacing-lg);
|
||||
.cu-lg-my-xs {
|
||||
margin-top: var(--canon-spacing-xs);
|
||||
margin-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-lg-ml-xl {
|
||||
margin-left: var(--canon-spacing-xl);
|
||||
.cu-lg-p-2xl {
|
||||
padding: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-lg-ml-2xl {
|
||||
margin-left: var(--canon-spacing-2xl);
|
||||
.cu-lg-p-lg {
|
||||
padding: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-lg-mr-none {
|
||||
margin-right: 0;
|
||||
.cu-lg-p-md {
|
||||
padding: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-lg-mr-2xs {
|
||||
margin-right: var(--canon-spacing-2xs);
|
||||
.cu-lg-p-none {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.cu-lg-mr-xs {
|
||||
margin-right: var(--canon-spacing-xs);
|
||||
.cu-lg-p-sm {
|
||||
padding: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-lg-mr-sm {
|
||||
margin-right: var(--canon-spacing-sm);
|
||||
.cu-lg-p-xl {
|
||||
padding: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-lg-mr-md {
|
||||
margin-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-lg-mr-lg {
|
||||
margin-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-lg-mr-xl {
|
||||
margin-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-lg-mr-2xl {
|
||||
margin-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-lg-gap-none {
|
||||
gap: 0;
|
||||
}
|
||||
|
||||
.cu-lg-gap-2xs {
|
||||
gap: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-lg-gap-xs {
|
||||
gap: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-lg-gap-sm {
|
||||
gap: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-lg-gap-md {
|
||||
gap: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-lg-gap-lg {
|
||||
gap: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-lg-gap-xl {
|
||||
gap: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-lg-gap-2xl {
|
||||
gap: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-lg-pt-none {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.cu-lg-pt-2xs {
|
||||
padding-top: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-lg-pt-xs {
|
||||
padding-top: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-lg-pt-sm {
|
||||
padding-top: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-lg-pt-md {
|
||||
padding-top: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-lg-pt-lg {
|
||||
padding-top: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-lg-pt-xl {
|
||||
padding-top: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-lg-pt-2xl {
|
||||
padding-top: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-lg-pb-none {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-lg-pb-2xs {
|
||||
padding-bottom: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-lg-pb-xs {
|
||||
padding-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-lg-pb-sm {
|
||||
padding-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-lg-pb-md {
|
||||
padding-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-lg-pb-lg {
|
||||
padding-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-lg-pb-xl {
|
||||
padding-bottom: var(--canon-spacing-xl);
|
||||
.cu-lg-p-xs {
|
||||
padding: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-lg-pb-2xl {
|
||||
padding-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-lg-mt-none {
|
||||
margin-top: 0;
|
||||
.cu-lg-pb-lg {
|
||||
padding-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-lg-mt-2xs {
|
||||
margin-top: var(--canon-spacing-2xs);
|
||||
.cu-lg-pb-md {
|
||||
padding-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-lg-mt-xs {
|
||||
margin-top: var(--canon-spacing-xs);
|
||||
.cu-lg-pb-none {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-lg-mt-sm {
|
||||
margin-top: var(--canon-spacing-sm);
|
||||
.cu-lg-pb-sm {
|
||||
padding-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-lg-mt-md {
|
||||
margin-top: var(--canon-spacing-md);
|
||||
.cu-lg-pb-xl {
|
||||
padding-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-lg-mt-lg {
|
||||
margin-top: var(--canon-spacing-lg);
|
||||
.cu-lg-pb-xs {
|
||||
padding-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-lg-mt-xl {
|
||||
margin-top: var(--canon-spacing-xl);
|
||||
.cu-lg-pl-2xl {
|
||||
padding-left: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-lg-mt-2xl {
|
||||
margin-top: var(--canon-spacing-2xl);
|
||||
.cu-lg-pl-lg {
|
||||
padding-left: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-lg-mb-none {
|
||||
margin-bottom: 0;
|
||||
.cu-lg-pl-md {
|
||||
padding-left: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-lg-mb-2xs {
|
||||
margin-bottom: var(--canon-spacing-2xs);
|
||||
.cu-lg-pl-none {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.cu-lg-mb-xs {
|
||||
margin-bottom: var(--canon-spacing-xs);
|
||||
.cu-lg-pl-sm {
|
||||
padding-left: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-lg-mb-sm {
|
||||
margin-bottom: var(--canon-spacing-sm);
|
||||
.cu-lg-pl-xl {
|
||||
padding-left: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-lg-mb-md {
|
||||
margin-bottom: var(--canon-spacing-md);
|
||||
.cu-lg-pl-xs {
|
||||
padding-left: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-lg-mb-lg {
|
||||
margin-bottom: var(--canon-spacing-lg);
|
||||
.cu-lg-pr-2xl {
|
||||
padding-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-lg-mb-xl {
|
||||
margin-bottom: var(--canon-spacing-xl);
|
||||
.cu-lg-pr-lg {
|
||||
padding-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-lg-mb-2xl {
|
||||
margin-bottom: var(--canon-spacing-2xl);
|
||||
.cu-lg-pr-md {
|
||||
padding-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-lg-pr-none {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.cu-lg-pr-sm {
|
||||
padding-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-lg-pr-xl {
|
||||
padding-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-lg-pr-xs {
|
||||
padding-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-lg-pt-2xl {
|
||||
padding-top: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-lg-pt-lg {
|
||||
padding-top: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-lg-pt-md {
|
||||
padding-top: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-lg-pt-none {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.cu-lg-pt-sm {
|
||||
padding-top: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-lg-pt-xl {
|
||||
padding-top: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-lg-pt-xs {
|
||||
padding-top: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-lg-px-2xl {
|
||||
padding-left: var(--canon-spacing-2xl);
|
||||
padding-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-lg-px-lg {
|
||||
padding-left: var(--canon-spacing-lg);
|
||||
padding-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-lg-px-md {
|
||||
padding-left: var(--canon-spacing-md);
|
||||
padding-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-lg-px-none {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.cu-lg-px-sm {
|
||||
padding-left: var(--canon-spacing-sm);
|
||||
padding-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-lg-px-xl {
|
||||
padding-left: var(--canon-spacing-xl);
|
||||
padding-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-lg-px-xs {
|
||||
padding-left: var(--canon-spacing-xs);
|
||||
padding-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-lg-py-2xl {
|
||||
padding-top: var(--canon-spacing-2xl);
|
||||
padding-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-lg-py-lg {
|
||||
padding-top: var(--canon-spacing-lg);
|
||||
padding-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-lg-py-md {
|
||||
padding-top: var(--canon-spacing-md);
|
||||
padding-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-lg-py-none {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-lg-py-sm {
|
||||
padding-top: var(--canon-spacing-sm);
|
||||
padding-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-lg-py-xl {
|
||||
padding-top: var(--canon-spacing-xl);
|
||||
padding-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-lg-py-xs {
|
||||
padding-top: var(--canon-spacing-xs);
|
||||
padding-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-lg-wrap-reverse {
|
||||
flex-wrap: wrap-reverse;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -20,6 +20,62 @@
|
||||
display: block;
|
||||
}
|
||||
|
||||
.cu-md-flex {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.cu-md-flex-col {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.cu-md-flex-nowrap {
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
|
||||
.cu-md-flex-row {
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.cu-md-flex-wrap {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.cu-md-flex-wrap-reverse {
|
||||
flex-wrap: wrap-reverse;
|
||||
}
|
||||
|
||||
.cu-md-gap-2xl {
|
||||
gap: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-md-gap-lg {
|
||||
gap: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-md-gap-md {
|
||||
gap: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-md-gap-none {
|
||||
gap: 0;
|
||||
}
|
||||
|
||||
.cu-md-gap-sm {
|
||||
gap: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-md-gap-xl {
|
||||
gap: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-md-gap-xs {
|
||||
gap: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-md-grid {
|
||||
display: grid;
|
||||
}
|
||||
|
||||
.cu-md-hidden {
|
||||
display: none;
|
||||
}
|
||||
@@ -32,36 +88,20 @@
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.cu-md-flex {
|
||||
display: flex;
|
||||
.cu-md-items-center {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.cu-md-grid {
|
||||
display: grid;
|
||||
.cu-md-items-end {
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.cu-md-flex-row {
|
||||
flex-direction: row;
|
||||
.cu-md-items-start {
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.cu-md-flex-col {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.cu-md-justify-stretch {
|
||||
justify-content: stretch;
|
||||
}
|
||||
|
||||
.cu-md-justify-start {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.cu-md-justify-center {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.cu-md-justify-end {
|
||||
justify-content: flex-end;
|
||||
.cu-md-items-stretch {
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.cu-md-justify-around {
|
||||
@@ -72,303 +112,195 @@
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.cu-md-items-stretch {
|
||||
align-items: stretch;
|
||||
.cu-md-justify-center {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.cu-md-items-center {
|
||||
align-items: center;
|
||||
.cu-md-justify-end {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.cu-md-items-start {
|
||||
align-items: flex-start;
|
||||
.cu-md-justify-start {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.cu-md-items-end {
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.cu-md-p-none {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.cu-md-p-2xs {
|
||||
padding: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-md-p-xs {
|
||||
padding: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-md-p-sm {
|
||||
padding: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-md-p-md {
|
||||
padding: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-md-p-lg {
|
||||
padding: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-md-p-xl {
|
||||
padding: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-md-p-2xl {
|
||||
padding: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-md-px-none {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.cu-md-px-2xs {
|
||||
padding-left: var(--canon-spacing-2xs);
|
||||
padding-right: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-md-px-xs {
|
||||
padding-left: var(--canon-spacing-xs);
|
||||
padding-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-md-px-sm {
|
||||
padding-left: var(--canon-spacing-sm);
|
||||
padding-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-md-px-md {
|
||||
padding-left: var(--canon-spacing-md);
|
||||
padding-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-md-px-lg {
|
||||
padding-left: var(--canon-spacing-lg);
|
||||
padding-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-md-px-xl {
|
||||
padding-left: var(--canon-spacing-xl);
|
||||
padding-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-md-px-2xl {
|
||||
padding-left: var(--canon-spacing-2xl);
|
||||
padding-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-md-py-none {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-md-py-2xs {
|
||||
padding-top: var(--canon-spacing-2xs);
|
||||
padding-bottom: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-md-py-xs {
|
||||
padding-top: var(--canon-spacing-xs);
|
||||
padding-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-md-py-sm {
|
||||
padding-top: var(--canon-spacing-sm);
|
||||
padding-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-md-py-md {
|
||||
padding-top: var(--canon-spacing-md);
|
||||
padding-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-md-py-lg {
|
||||
padding-top: var(--canon-spacing-lg);
|
||||
padding-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-md-py-xl {
|
||||
padding-top: var(--canon-spacing-xl);
|
||||
padding-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-md-py-2xl {
|
||||
padding-top: var(--canon-spacing-2xl);
|
||||
padding-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-md-pl-none {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.cu-md-pl-2xs {
|
||||
padding-left: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-md-pl-xs {
|
||||
padding-left: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-md-pl-sm {
|
||||
padding-left: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-md-pl-md {
|
||||
padding-left: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-md-pl-lg {
|
||||
padding-left: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-md-pl-xl {
|
||||
padding-left: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-md-pl-2xl {
|
||||
padding-left: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-md-pr-none {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.cu-md-pr-2xs {
|
||||
padding-right: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-md-pr-xs {
|
||||
padding-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-md-pr-sm {
|
||||
padding-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-md-pr-md {
|
||||
padding-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-md-pr-lg {
|
||||
padding-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-md-pr-xl {
|
||||
padding-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-md-pr-2xl {
|
||||
padding-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-md-m-none {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.cu-md-m-2xs {
|
||||
margin: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-md-m-xs {
|
||||
margin: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-md-m-sm {
|
||||
margin: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-md-m-md {
|
||||
margin: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-md-m-lg {
|
||||
margin: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-md-m-xl {
|
||||
margin: var(--canon-spacing-xl);
|
||||
.cu-md-justify-stretch {
|
||||
justify-content: stretch;
|
||||
}
|
||||
|
||||
.cu-md-m-2xl {
|
||||
margin: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-md-mx-none {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
.cu-md-m-lg {
|
||||
margin: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-md-mx-2xs {
|
||||
margin-left: var(--canon-spacing-2xs);
|
||||
margin-right: var(--canon-spacing-2xs);
|
||||
.cu-md-m-md {
|
||||
margin: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-md-mx-xs {
|
||||
margin-left: var(--canon-spacing-xs);
|
||||
margin-right: var(--canon-spacing-xs);
|
||||
.cu-md-m-none {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.cu-md-mx-sm {
|
||||
margin-left: var(--canon-spacing-sm);
|
||||
margin-right: var(--canon-spacing-sm);
|
||||
.cu-md-m-sm {
|
||||
margin: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-md-mx-md {
|
||||
margin-left: var(--canon-spacing-md);
|
||||
margin-right: var(--canon-spacing-md);
|
||||
.cu-md-m-xl {
|
||||
margin: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-md-mx-lg {
|
||||
.cu-md-m-xs {
|
||||
margin: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-md-mb-2xl {
|
||||
margin-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-md-mb-lg {
|
||||
margin-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-md-mb-md {
|
||||
margin-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-md-mb-none {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-md-mb-sm {
|
||||
margin-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-md-mb-xl {
|
||||
margin-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-md-mb-xs {
|
||||
margin-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-md-ml-2xl {
|
||||
margin-left: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-md-ml-lg {
|
||||
margin-left: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-md-ml-md {
|
||||
margin-left: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-md-ml-none {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.cu-md-ml-sm {
|
||||
margin-left: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-md-ml-xl {
|
||||
margin-left: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-md-ml-xs {
|
||||
margin-left: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-md-mr-2xl {
|
||||
margin-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-md-mr-lg {
|
||||
margin-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-md-mx-xl {
|
||||
margin-left: var(--canon-spacing-xl);
|
||||
.cu-md-mr-md {
|
||||
margin-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-md-mr-none {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.cu-md-mr-sm {
|
||||
margin-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-md-mr-xl {
|
||||
margin-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-md-mr-xs {
|
||||
margin-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-md-mt-2xl {
|
||||
margin-top: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-md-mt-lg {
|
||||
margin-top: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-md-mt-md {
|
||||
margin-top: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-md-mt-none {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.cu-md-mt-sm {
|
||||
margin-top: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-md-mt-xl {
|
||||
margin-top: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-md-mt-xs {
|
||||
margin-top: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-md-mx-2xl {
|
||||
margin-left: var(--canon-spacing-2xl);
|
||||
margin-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-md-my-none {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
.cu-md-mx-lg {
|
||||
margin-left: var(--canon-spacing-lg);
|
||||
margin-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-md-my-2xs {
|
||||
margin-top: var(--canon-spacing-2xs);
|
||||
margin-bottom: var(--canon-spacing-2xs);
|
||||
.cu-md-mx-md {
|
||||
margin-left: var(--canon-spacing-md);
|
||||
margin-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-md-my-xs {
|
||||
margin-top: var(--canon-spacing-xs);
|
||||
margin-bottom: var(--canon-spacing-xs);
|
||||
.cu-md-mx-none {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.cu-md-my-sm {
|
||||
margin-top: var(--canon-spacing-sm);
|
||||
margin-bottom: var(--canon-spacing-sm);
|
||||
.cu-md-mx-sm {
|
||||
margin-left: var(--canon-spacing-sm);
|
||||
margin-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-md-my-md {
|
||||
margin-top: var(--canon-spacing-md);
|
||||
margin-bottom: var(--canon-spacing-md);
|
||||
.cu-md-mx-xl {
|
||||
margin-left: var(--canon-spacing-xl);
|
||||
margin-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-md-my-lg {
|
||||
margin-top: var(--canon-spacing-lg);
|
||||
margin-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-md-my-xl {
|
||||
margin-top: var(--canon-spacing-xl);
|
||||
margin-bottom: var(--canon-spacing-xl);
|
||||
.cu-md-mx-xs {
|
||||
margin-left: var(--canon-spacing-xs);
|
||||
margin-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-md-my-2xl {
|
||||
@@ -376,228 +308,248 @@
|
||||
margin-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-md-ml-none {
|
||||
margin-left: 0;
|
||||
.cu-md-my-lg {
|
||||
margin-top: var(--canon-spacing-lg);
|
||||
margin-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-md-ml-2xs {
|
||||
margin-left: var(--canon-spacing-2xs);
|
||||
.cu-md-my-md {
|
||||
margin-top: var(--canon-spacing-md);
|
||||
margin-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-md-ml-xs {
|
||||
margin-left: var(--canon-spacing-xs);
|
||||
.cu-md-my-none {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-md-ml-sm {
|
||||
margin-left: var(--canon-spacing-sm);
|
||||
.cu-md-my-sm {
|
||||
margin-top: var(--canon-spacing-sm);
|
||||
margin-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-md-ml-md {
|
||||
margin-left: var(--canon-spacing-md);
|
||||
.cu-md-my-xl {
|
||||
margin-top: var(--canon-spacing-xl);
|
||||
margin-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-md-ml-lg {
|
||||
margin-left: var(--canon-spacing-lg);
|
||||
.cu-md-my-xs {
|
||||
margin-top: var(--canon-spacing-xs);
|
||||
margin-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-md-ml-xl {
|
||||
margin-left: var(--canon-spacing-xl);
|
||||
.cu-md-p-2xl {
|
||||
padding: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-md-ml-2xl {
|
||||
margin-left: var(--canon-spacing-2xl);
|
||||
.cu-md-p-lg {
|
||||
padding: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-md-mr-none {
|
||||
margin-right: 0;
|
||||
.cu-md-p-md {
|
||||
padding: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-md-mr-2xs {
|
||||
margin-right: var(--canon-spacing-2xs);
|
||||
.cu-md-p-none {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.cu-md-mr-xs {
|
||||
margin-right: var(--canon-spacing-xs);
|
||||
.cu-md-p-sm {
|
||||
padding: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-md-mr-sm {
|
||||
margin-right: var(--canon-spacing-sm);
|
||||
.cu-md-p-xl {
|
||||
padding: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-md-mr-md {
|
||||
margin-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-md-mr-lg {
|
||||
margin-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-md-mr-xl {
|
||||
margin-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-md-mr-2xl {
|
||||
margin-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-md-gap-none {
|
||||
gap: 0;
|
||||
}
|
||||
|
||||
.cu-md-gap-2xs {
|
||||
gap: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-md-gap-xs {
|
||||
gap: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-md-gap-sm {
|
||||
gap: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-md-gap-md {
|
||||
gap: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-md-gap-lg {
|
||||
gap: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-md-gap-xl {
|
||||
gap: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-md-gap-2xl {
|
||||
gap: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-md-pt-none {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.cu-md-pt-2xs {
|
||||
padding-top: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-md-pt-xs {
|
||||
padding-top: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-md-pt-sm {
|
||||
padding-top: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-md-pt-md {
|
||||
padding-top: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-md-pt-lg {
|
||||
padding-top: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-md-pt-xl {
|
||||
padding-top: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-md-pt-2xl {
|
||||
padding-top: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-md-pb-none {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-md-pb-2xs {
|
||||
padding-bottom: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-md-pb-xs {
|
||||
padding-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-md-pb-sm {
|
||||
padding-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-md-pb-md {
|
||||
padding-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-md-pb-lg {
|
||||
padding-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-md-pb-xl {
|
||||
padding-bottom: var(--canon-spacing-xl);
|
||||
.cu-md-p-xs {
|
||||
padding: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-md-pb-2xl {
|
||||
padding-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-md-mt-none {
|
||||
margin-top: 0;
|
||||
.cu-md-pb-lg {
|
||||
padding-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-md-mt-2xs {
|
||||
margin-top: var(--canon-spacing-2xs);
|
||||
.cu-md-pb-md {
|
||||
padding-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-md-mt-xs {
|
||||
margin-top: var(--canon-spacing-xs);
|
||||
.cu-md-pb-none {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-md-mt-sm {
|
||||
margin-top: var(--canon-spacing-sm);
|
||||
.cu-md-pb-sm {
|
||||
padding-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-md-mt-md {
|
||||
margin-top: var(--canon-spacing-md);
|
||||
.cu-md-pb-xl {
|
||||
padding-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-md-mt-lg {
|
||||
margin-top: var(--canon-spacing-lg);
|
||||
.cu-md-pb-xs {
|
||||
padding-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-md-mt-xl {
|
||||
margin-top: var(--canon-spacing-xl);
|
||||
.cu-md-pl-2xl {
|
||||
padding-left: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-md-mt-2xl {
|
||||
margin-top: var(--canon-spacing-2xl);
|
||||
.cu-md-pl-lg {
|
||||
padding-left: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-md-mb-none {
|
||||
margin-bottom: 0;
|
||||
.cu-md-pl-md {
|
||||
padding-left: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-md-mb-2xs {
|
||||
margin-bottom: var(--canon-spacing-2xs);
|
||||
.cu-md-pl-none {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.cu-md-mb-xs {
|
||||
margin-bottom: var(--canon-spacing-xs);
|
||||
.cu-md-pl-sm {
|
||||
padding-left: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-md-mb-sm {
|
||||
margin-bottom: var(--canon-spacing-sm);
|
||||
.cu-md-pl-xl {
|
||||
padding-left: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-md-mb-md {
|
||||
margin-bottom: var(--canon-spacing-md);
|
||||
.cu-md-pl-xs {
|
||||
padding-left: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-md-mb-lg {
|
||||
margin-bottom: var(--canon-spacing-lg);
|
||||
.cu-md-pr-2xl {
|
||||
padding-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-md-mb-xl {
|
||||
margin-bottom: var(--canon-spacing-xl);
|
||||
.cu-md-pr-lg {
|
||||
padding-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-md-mb-2xl {
|
||||
margin-bottom: var(--canon-spacing-2xl);
|
||||
.cu-md-pr-md {
|
||||
padding-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-md-pr-none {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.cu-md-pr-sm {
|
||||
padding-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-md-pr-xl {
|
||||
padding-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-md-pr-xs {
|
||||
padding-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-md-pt-2xl {
|
||||
padding-top: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-md-pt-lg {
|
||||
padding-top: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-md-pt-md {
|
||||
padding-top: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-md-pt-none {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.cu-md-pt-sm {
|
||||
padding-top: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-md-pt-xl {
|
||||
padding-top: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-md-pt-xs {
|
||||
padding-top: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-md-px-2xl {
|
||||
padding-left: var(--canon-spacing-2xl);
|
||||
padding-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-md-px-lg {
|
||||
padding-left: var(--canon-spacing-lg);
|
||||
padding-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-md-px-md {
|
||||
padding-left: var(--canon-spacing-md);
|
||||
padding-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-md-px-none {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.cu-md-px-sm {
|
||||
padding-left: var(--canon-spacing-sm);
|
||||
padding-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-md-px-xl {
|
||||
padding-left: var(--canon-spacing-xl);
|
||||
padding-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-md-px-xs {
|
||||
padding-left: var(--canon-spacing-xs);
|
||||
padding-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-md-py-2xl {
|
||||
padding-top: var(--canon-spacing-2xl);
|
||||
padding-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-md-py-lg {
|
||||
padding-top: var(--canon-spacing-lg);
|
||||
padding-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-md-py-md {
|
||||
padding-top: var(--canon-spacing-md);
|
||||
padding-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-md-py-none {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-md-py-sm {
|
||||
padding-top: var(--canon-spacing-sm);
|
||||
padding-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-md-py-xl {
|
||||
padding-top: var(--canon-spacing-xl);
|
||||
padding-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-md-py-xs {
|
||||
padding-top: var(--canon-spacing-xs);
|
||||
padding-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-md-wrap-reverse {
|
||||
flex-wrap: wrap-reverse;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -20,6 +20,62 @@
|
||||
display: block;
|
||||
}
|
||||
|
||||
.cu-sm-flex {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.cu-sm-flex-col {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.cu-sm-flex-nowrap {
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
|
||||
.cu-sm-flex-row {
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.cu-sm-flex-wrap {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.cu-sm-flex-wrap-reverse {
|
||||
flex-wrap: wrap-reverse;
|
||||
}
|
||||
|
||||
.cu-sm-gap-2xl {
|
||||
gap: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-sm-gap-lg {
|
||||
gap: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-sm-gap-md {
|
||||
gap: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-sm-gap-none {
|
||||
gap: 0;
|
||||
}
|
||||
|
||||
.cu-sm-gap-sm {
|
||||
gap: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-sm-gap-xl {
|
||||
gap: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-sm-gap-xs {
|
||||
gap: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-sm-grid {
|
||||
display: grid;
|
||||
}
|
||||
|
||||
.cu-sm-hidden {
|
||||
display: none;
|
||||
}
|
||||
@@ -32,36 +88,20 @@
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.cu-sm-flex {
|
||||
display: flex;
|
||||
.cu-sm-items-center {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.cu-sm-grid {
|
||||
display: grid;
|
||||
.cu-sm-items-end {
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.cu-sm-flex-row {
|
||||
flex-direction: row;
|
||||
.cu-sm-items-start {
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.cu-sm-flex-col {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.cu-sm-justify-stretch {
|
||||
justify-content: stretch;
|
||||
}
|
||||
|
||||
.cu-sm-justify-start {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.cu-sm-justify-center {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.cu-sm-justify-end {
|
||||
justify-content: flex-end;
|
||||
.cu-sm-items-stretch {
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.cu-sm-justify-around {
|
||||
@@ -72,303 +112,195 @@
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.cu-sm-items-stretch {
|
||||
align-items: stretch;
|
||||
.cu-sm-justify-center {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.cu-sm-items-center {
|
||||
align-items: center;
|
||||
.cu-sm-justify-end {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.cu-sm-items-start {
|
||||
align-items: flex-start;
|
||||
.cu-sm-justify-start {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.cu-sm-items-end {
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.cu-sm-p-none {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.cu-sm-p-2xs {
|
||||
padding: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-sm-p-xs {
|
||||
padding: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-sm-p-sm {
|
||||
padding: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-sm-p-md {
|
||||
padding: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-sm-p-lg {
|
||||
padding: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-sm-p-xl {
|
||||
padding: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-sm-p-2xl {
|
||||
padding: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-sm-px-none {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.cu-sm-px-2xs {
|
||||
padding-left: var(--canon-spacing-2xs);
|
||||
padding-right: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-sm-px-xs {
|
||||
padding-left: var(--canon-spacing-xs);
|
||||
padding-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-sm-px-sm {
|
||||
padding-left: var(--canon-spacing-sm);
|
||||
padding-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-sm-px-md {
|
||||
padding-left: var(--canon-spacing-md);
|
||||
padding-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-sm-px-lg {
|
||||
padding-left: var(--canon-spacing-lg);
|
||||
padding-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-sm-px-xl {
|
||||
padding-left: var(--canon-spacing-xl);
|
||||
padding-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-sm-px-2xl {
|
||||
padding-left: var(--canon-spacing-2xl);
|
||||
padding-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-sm-py-none {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-sm-py-2xs {
|
||||
padding-top: var(--canon-spacing-2xs);
|
||||
padding-bottom: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-sm-py-xs {
|
||||
padding-top: var(--canon-spacing-xs);
|
||||
padding-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-sm-py-sm {
|
||||
padding-top: var(--canon-spacing-sm);
|
||||
padding-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-sm-py-md {
|
||||
padding-top: var(--canon-spacing-md);
|
||||
padding-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-sm-py-lg {
|
||||
padding-top: var(--canon-spacing-lg);
|
||||
padding-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-sm-py-xl {
|
||||
padding-top: var(--canon-spacing-xl);
|
||||
padding-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-sm-py-2xl {
|
||||
padding-top: var(--canon-spacing-2xl);
|
||||
padding-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-sm-pl-none {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.cu-sm-pl-2xs {
|
||||
padding-left: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-sm-pl-xs {
|
||||
padding-left: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-sm-pl-sm {
|
||||
padding-left: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-sm-pl-md {
|
||||
padding-left: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-sm-pl-lg {
|
||||
padding-left: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-sm-pl-xl {
|
||||
padding-left: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-sm-pl-2xl {
|
||||
padding-left: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-sm-pr-none {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.cu-sm-pr-2xs {
|
||||
padding-right: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-sm-pr-xs {
|
||||
padding-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-sm-pr-sm {
|
||||
padding-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-sm-pr-md {
|
||||
padding-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-sm-pr-lg {
|
||||
padding-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-sm-pr-xl {
|
||||
padding-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-sm-pr-2xl {
|
||||
padding-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-sm-m-none {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.cu-sm-m-2xs {
|
||||
margin: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-sm-m-xs {
|
||||
margin: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-sm-m-sm {
|
||||
margin: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-sm-m-md {
|
||||
margin: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-sm-m-lg {
|
||||
margin: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-sm-m-xl {
|
||||
margin: var(--canon-spacing-xl);
|
||||
.cu-sm-justify-stretch {
|
||||
justify-content: stretch;
|
||||
}
|
||||
|
||||
.cu-sm-m-2xl {
|
||||
margin: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-sm-mx-none {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
.cu-sm-m-lg {
|
||||
margin: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-sm-mx-2xs {
|
||||
margin-left: var(--canon-spacing-2xs);
|
||||
margin-right: var(--canon-spacing-2xs);
|
||||
.cu-sm-m-md {
|
||||
margin: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-sm-mx-xs {
|
||||
margin-left: var(--canon-spacing-xs);
|
||||
margin-right: var(--canon-spacing-xs);
|
||||
.cu-sm-m-none {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.cu-sm-mx-sm {
|
||||
margin-left: var(--canon-spacing-sm);
|
||||
margin-right: var(--canon-spacing-sm);
|
||||
.cu-sm-m-sm {
|
||||
margin: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-sm-mx-md {
|
||||
margin-left: var(--canon-spacing-md);
|
||||
margin-right: var(--canon-spacing-md);
|
||||
.cu-sm-m-xl {
|
||||
margin: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-sm-mx-lg {
|
||||
.cu-sm-m-xs {
|
||||
margin: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-sm-mb-2xl {
|
||||
margin-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-sm-mb-lg {
|
||||
margin-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-sm-mb-md {
|
||||
margin-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-sm-mb-none {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-sm-mb-sm {
|
||||
margin-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-sm-mb-xl {
|
||||
margin-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-sm-mb-xs {
|
||||
margin-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-sm-ml-2xl {
|
||||
margin-left: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-sm-ml-lg {
|
||||
margin-left: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-sm-ml-md {
|
||||
margin-left: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-sm-ml-none {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.cu-sm-ml-sm {
|
||||
margin-left: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-sm-ml-xl {
|
||||
margin-left: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-sm-ml-xs {
|
||||
margin-left: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-sm-mr-2xl {
|
||||
margin-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-sm-mr-lg {
|
||||
margin-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-sm-mx-xl {
|
||||
margin-left: var(--canon-spacing-xl);
|
||||
.cu-sm-mr-md {
|
||||
margin-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-sm-mr-none {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.cu-sm-mr-sm {
|
||||
margin-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-sm-mr-xl {
|
||||
margin-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-sm-mr-xs {
|
||||
margin-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-sm-mt-2xl {
|
||||
margin-top: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-sm-mt-lg {
|
||||
margin-top: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-sm-mt-md {
|
||||
margin-top: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-sm-mt-none {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.cu-sm-mt-sm {
|
||||
margin-top: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-sm-mt-xl {
|
||||
margin-top: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-sm-mt-xs {
|
||||
margin-top: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-sm-mx-2xl {
|
||||
margin-left: var(--canon-spacing-2xl);
|
||||
margin-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-sm-my-none {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
.cu-sm-mx-lg {
|
||||
margin-left: var(--canon-spacing-lg);
|
||||
margin-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-sm-my-2xs {
|
||||
margin-top: var(--canon-spacing-2xs);
|
||||
margin-bottom: var(--canon-spacing-2xs);
|
||||
.cu-sm-mx-md {
|
||||
margin-left: var(--canon-spacing-md);
|
||||
margin-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-sm-my-xs {
|
||||
margin-top: var(--canon-spacing-xs);
|
||||
margin-bottom: var(--canon-spacing-xs);
|
||||
.cu-sm-mx-none {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.cu-sm-my-sm {
|
||||
margin-top: var(--canon-spacing-sm);
|
||||
margin-bottom: var(--canon-spacing-sm);
|
||||
.cu-sm-mx-sm {
|
||||
margin-left: var(--canon-spacing-sm);
|
||||
margin-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-sm-my-md {
|
||||
margin-top: var(--canon-spacing-md);
|
||||
margin-bottom: var(--canon-spacing-md);
|
||||
.cu-sm-mx-xl {
|
||||
margin-left: var(--canon-spacing-xl);
|
||||
margin-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-sm-my-lg {
|
||||
margin-top: var(--canon-spacing-lg);
|
||||
margin-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-sm-my-xl {
|
||||
margin-top: var(--canon-spacing-xl);
|
||||
margin-bottom: var(--canon-spacing-xl);
|
||||
.cu-sm-mx-xs {
|
||||
margin-left: var(--canon-spacing-xs);
|
||||
margin-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-sm-my-2xl {
|
||||
@@ -376,228 +308,248 @@
|
||||
margin-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-sm-ml-none {
|
||||
margin-left: 0;
|
||||
.cu-sm-my-lg {
|
||||
margin-top: var(--canon-spacing-lg);
|
||||
margin-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-sm-ml-2xs {
|
||||
margin-left: var(--canon-spacing-2xs);
|
||||
.cu-sm-my-md {
|
||||
margin-top: var(--canon-spacing-md);
|
||||
margin-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-sm-ml-xs {
|
||||
margin-left: var(--canon-spacing-xs);
|
||||
.cu-sm-my-none {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-sm-ml-sm {
|
||||
margin-left: var(--canon-spacing-sm);
|
||||
.cu-sm-my-sm {
|
||||
margin-top: var(--canon-spacing-sm);
|
||||
margin-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-sm-ml-md {
|
||||
margin-left: var(--canon-spacing-md);
|
||||
.cu-sm-my-xl {
|
||||
margin-top: var(--canon-spacing-xl);
|
||||
margin-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-sm-ml-lg {
|
||||
margin-left: var(--canon-spacing-lg);
|
||||
.cu-sm-my-xs {
|
||||
margin-top: var(--canon-spacing-xs);
|
||||
margin-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-sm-ml-xl {
|
||||
margin-left: var(--canon-spacing-xl);
|
||||
.cu-sm-p-2xl {
|
||||
padding: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-sm-ml-2xl {
|
||||
margin-left: var(--canon-spacing-2xl);
|
||||
.cu-sm-p-lg {
|
||||
padding: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-sm-mr-none {
|
||||
margin-right: 0;
|
||||
.cu-sm-p-md {
|
||||
padding: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-sm-mr-2xs {
|
||||
margin-right: var(--canon-spacing-2xs);
|
||||
.cu-sm-p-none {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.cu-sm-mr-xs {
|
||||
margin-right: var(--canon-spacing-xs);
|
||||
.cu-sm-p-sm {
|
||||
padding: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-sm-mr-sm {
|
||||
margin-right: var(--canon-spacing-sm);
|
||||
.cu-sm-p-xl {
|
||||
padding: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-sm-mr-md {
|
||||
margin-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-sm-mr-lg {
|
||||
margin-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-sm-mr-xl {
|
||||
margin-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-sm-mr-2xl {
|
||||
margin-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-sm-gap-none {
|
||||
gap: 0;
|
||||
}
|
||||
|
||||
.cu-sm-gap-2xs {
|
||||
gap: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-sm-gap-xs {
|
||||
gap: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-sm-gap-sm {
|
||||
gap: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-sm-gap-md {
|
||||
gap: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-sm-gap-lg {
|
||||
gap: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-sm-gap-xl {
|
||||
gap: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-sm-gap-2xl {
|
||||
gap: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-sm-pt-none {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.cu-sm-pt-2xs {
|
||||
padding-top: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-sm-pt-xs {
|
||||
padding-top: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-sm-pt-sm {
|
||||
padding-top: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-sm-pt-md {
|
||||
padding-top: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-sm-pt-lg {
|
||||
padding-top: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-sm-pt-xl {
|
||||
padding-top: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-sm-pt-2xl {
|
||||
padding-top: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-sm-pb-none {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-sm-pb-2xs {
|
||||
padding-bottom: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-sm-pb-xs {
|
||||
padding-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-sm-pb-sm {
|
||||
padding-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-sm-pb-md {
|
||||
padding-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-sm-pb-lg {
|
||||
padding-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-sm-pb-xl {
|
||||
padding-bottom: var(--canon-spacing-xl);
|
||||
.cu-sm-p-xs {
|
||||
padding: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-sm-pb-2xl {
|
||||
padding-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-sm-mt-none {
|
||||
margin-top: 0;
|
||||
.cu-sm-pb-lg {
|
||||
padding-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-sm-mt-2xs {
|
||||
margin-top: var(--canon-spacing-2xs);
|
||||
.cu-sm-pb-md {
|
||||
padding-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-sm-mt-xs {
|
||||
margin-top: var(--canon-spacing-xs);
|
||||
.cu-sm-pb-none {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-sm-mt-sm {
|
||||
margin-top: var(--canon-spacing-sm);
|
||||
.cu-sm-pb-sm {
|
||||
padding-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-sm-mt-md {
|
||||
margin-top: var(--canon-spacing-md);
|
||||
.cu-sm-pb-xl {
|
||||
padding-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-sm-mt-lg {
|
||||
margin-top: var(--canon-spacing-lg);
|
||||
.cu-sm-pb-xs {
|
||||
padding-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-sm-mt-xl {
|
||||
margin-top: var(--canon-spacing-xl);
|
||||
.cu-sm-pl-2xl {
|
||||
padding-left: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-sm-mt-2xl {
|
||||
margin-top: var(--canon-spacing-2xl);
|
||||
.cu-sm-pl-lg {
|
||||
padding-left: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-sm-mb-none {
|
||||
margin-bottom: 0;
|
||||
.cu-sm-pl-md {
|
||||
padding-left: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-sm-mb-2xs {
|
||||
margin-bottom: var(--canon-spacing-2xs);
|
||||
.cu-sm-pl-none {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.cu-sm-mb-xs {
|
||||
margin-bottom: var(--canon-spacing-xs);
|
||||
.cu-sm-pl-sm {
|
||||
padding-left: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-sm-mb-sm {
|
||||
margin-bottom: var(--canon-spacing-sm);
|
||||
.cu-sm-pl-xl {
|
||||
padding-left: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-sm-mb-md {
|
||||
margin-bottom: var(--canon-spacing-md);
|
||||
.cu-sm-pl-xs {
|
||||
padding-left: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-sm-mb-lg {
|
||||
margin-bottom: var(--canon-spacing-lg);
|
||||
.cu-sm-pr-2xl {
|
||||
padding-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-sm-mb-xl {
|
||||
margin-bottom: var(--canon-spacing-xl);
|
||||
.cu-sm-pr-lg {
|
||||
padding-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-sm-mb-2xl {
|
||||
margin-bottom: var(--canon-spacing-2xl);
|
||||
.cu-sm-pr-md {
|
||||
padding-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-sm-pr-none {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.cu-sm-pr-sm {
|
||||
padding-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-sm-pr-xl {
|
||||
padding-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-sm-pr-xs {
|
||||
padding-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-sm-pt-2xl {
|
||||
padding-top: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-sm-pt-lg {
|
||||
padding-top: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-sm-pt-md {
|
||||
padding-top: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-sm-pt-none {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.cu-sm-pt-sm {
|
||||
padding-top: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-sm-pt-xl {
|
||||
padding-top: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-sm-pt-xs {
|
||||
padding-top: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-sm-px-2xl {
|
||||
padding-left: var(--canon-spacing-2xl);
|
||||
padding-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-sm-px-lg {
|
||||
padding-left: var(--canon-spacing-lg);
|
||||
padding-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-sm-px-md {
|
||||
padding-left: var(--canon-spacing-md);
|
||||
padding-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-sm-px-none {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.cu-sm-px-sm {
|
||||
padding-left: var(--canon-spacing-sm);
|
||||
padding-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-sm-px-xl {
|
||||
padding-left: var(--canon-spacing-xl);
|
||||
padding-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-sm-px-xs {
|
||||
padding-left: var(--canon-spacing-xs);
|
||||
padding-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-sm-py-2xl {
|
||||
padding-top: var(--canon-spacing-2xl);
|
||||
padding-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-sm-py-lg {
|
||||
padding-top: var(--canon-spacing-lg);
|
||||
padding-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-sm-py-md {
|
||||
padding-top: var(--canon-spacing-md);
|
||||
padding-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-sm-py-none {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-sm-py-sm {
|
||||
padding-top: var(--canon-spacing-sm);
|
||||
padding-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-sm-py-xl {
|
||||
padding-top: var(--canon-spacing-xl);
|
||||
padding-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-sm-py-xs {
|
||||
padding-top: var(--canon-spacing-xs);
|
||||
padding-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-sm-wrap-reverse {
|
||||
flex-wrap: wrap-reverse;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -20,6 +20,62 @@
|
||||
display: block;
|
||||
}
|
||||
|
||||
.cu-xl-flex {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.cu-xl-flex-col {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.cu-xl-flex-nowrap {
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
|
||||
.cu-xl-flex-row {
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.cu-xl-flex-wrap {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.cu-xl-flex-wrap-reverse {
|
||||
flex-wrap: wrap-reverse;
|
||||
}
|
||||
|
||||
.cu-xl-gap-2xl {
|
||||
gap: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-xl-gap-lg {
|
||||
gap: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-xl-gap-md {
|
||||
gap: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-xl-gap-none {
|
||||
gap: 0;
|
||||
}
|
||||
|
||||
.cu-xl-gap-sm {
|
||||
gap: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-xl-gap-xl {
|
||||
gap: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-xl-gap-xs {
|
||||
gap: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-xl-grid {
|
||||
display: grid;
|
||||
}
|
||||
|
||||
.cu-xl-hidden {
|
||||
display: none;
|
||||
}
|
||||
@@ -32,36 +88,20 @@
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.cu-xl-flex {
|
||||
display: flex;
|
||||
.cu-xl-items-center {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.cu-xl-grid {
|
||||
display: grid;
|
||||
.cu-xl-items-end {
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.cu-xl-flex-row {
|
||||
flex-direction: row;
|
||||
.cu-xl-items-start {
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.cu-xl-flex-col {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.cu-xl-justify-stretch {
|
||||
justify-content: stretch;
|
||||
}
|
||||
|
||||
.cu-xl-justify-start {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.cu-xl-justify-center {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.cu-xl-justify-end {
|
||||
justify-content: flex-end;
|
||||
.cu-xl-items-stretch {
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.cu-xl-justify-around {
|
||||
@@ -72,303 +112,195 @@
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.cu-xl-items-stretch {
|
||||
align-items: stretch;
|
||||
.cu-xl-justify-center {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.cu-xl-items-center {
|
||||
align-items: center;
|
||||
.cu-xl-justify-end {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.cu-xl-items-start {
|
||||
align-items: flex-start;
|
||||
.cu-xl-justify-start {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.cu-xl-items-end {
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.cu-xl-p-none {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.cu-xl-p-2xs {
|
||||
padding: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-xl-p-xs {
|
||||
padding: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-xl-p-sm {
|
||||
padding: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-xl-p-md {
|
||||
padding: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-xl-p-lg {
|
||||
padding: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-xl-p-xl {
|
||||
padding: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-xl-p-2xl {
|
||||
padding: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-xl-px-none {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.cu-xl-px-2xs {
|
||||
padding-left: var(--canon-spacing-2xs);
|
||||
padding-right: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-xl-px-xs {
|
||||
padding-left: var(--canon-spacing-xs);
|
||||
padding-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-xl-px-sm {
|
||||
padding-left: var(--canon-spacing-sm);
|
||||
padding-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-xl-px-md {
|
||||
padding-left: var(--canon-spacing-md);
|
||||
padding-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-xl-px-lg {
|
||||
padding-left: var(--canon-spacing-lg);
|
||||
padding-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-xl-px-xl {
|
||||
padding-left: var(--canon-spacing-xl);
|
||||
padding-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-xl-px-2xl {
|
||||
padding-left: var(--canon-spacing-2xl);
|
||||
padding-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-xl-py-none {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-xl-py-2xs {
|
||||
padding-top: var(--canon-spacing-2xs);
|
||||
padding-bottom: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-xl-py-xs {
|
||||
padding-top: var(--canon-spacing-xs);
|
||||
padding-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-xl-py-sm {
|
||||
padding-top: var(--canon-spacing-sm);
|
||||
padding-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-xl-py-md {
|
||||
padding-top: var(--canon-spacing-md);
|
||||
padding-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-xl-py-lg {
|
||||
padding-top: var(--canon-spacing-lg);
|
||||
padding-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-xl-py-xl {
|
||||
padding-top: var(--canon-spacing-xl);
|
||||
padding-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-xl-py-2xl {
|
||||
padding-top: var(--canon-spacing-2xl);
|
||||
padding-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-xl-pl-none {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.cu-xl-pl-2xs {
|
||||
padding-left: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-xl-pl-xs {
|
||||
padding-left: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-xl-pl-sm {
|
||||
padding-left: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-xl-pl-md {
|
||||
padding-left: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-xl-pl-lg {
|
||||
padding-left: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-xl-pl-xl {
|
||||
padding-left: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-xl-pl-2xl {
|
||||
padding-left: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-xl-pr-none {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.cu-xl-pr-2xs {
|
||||
padding-right: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-xl-pr-xs {
|
||||
padding-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-xl-pr-sm {
|
||||
padding-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-xl-pr-md {
|
||||
padding-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-xl-pr-lg {
|
||||
padding-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-xl-pr-xl {
|
||||
padding-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-xl-pr-2xl {
|
||||
padding-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-xl-m-none {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.cu-xl-m-2xs {
|
||||
margin: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-xl-m-xs {
|
||||
margin: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-xl-m-sm {
|
||||
margin: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-xl-m-md {
|
||||
margin: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-xl-m-lg {
|
||||
margin: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-xl-m-xl {
|
||||
margin: var(--canon-spacing-xl);
|
||||
.cu-xl-justify-stretch {
|
||||
justify-content: stretch;
|
||||
}
|
||||
|
||||
.cu-xl-m-2xl {
|
||||
margin: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-xl-mx-none {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
.cu-xl-m-lg {
|
||||
margin: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-xl-mx-2xs {
|
||||
margin-left: var(--canon-spacing-2xs);
|
||||
margin-right: var(--canon-spacing-2xs);
|
||||
.cu-xl-m-md {
|
||||
margin: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-xl-mx-xs {
|
||||
margin-left: var(--canon-spacing-xs);
|
||||
margin-right: var(--canon-spacing-xs);
|
||||
.cu-xl-m-none {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.cu-xl-mx-sm {
|
||||
margin-left: var(--canon-spacing-sm);
|
||||
margin-right: var(--canon-spacing-sm);
|
||||
.cu-xl-m-sm {
|
||||
margin: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-xl-mx-md {
|
||||
margin-left: var(--canon-spacing-md);
|
||||
margin-right: var(--canon-spacing-md);
|
||||
.cu-xl-m-xl {
|
||||
margin: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-xl-mx-lg {
|
||||
.cu-xl-m-xs {
|
||||
margin: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-xl-mb-2xl {
|
||||
margin-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-xl-mb-lg {
|
||||
margin-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-xl-mb-md {
|
||||
margin-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-xl-mb-none {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-xl-mb-sm {
|
||||
margin-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-xl-mb-xl {
|
||||
margin-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-xl-mb-xs {
|
||||
margin-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-xl-ml-2xl {
|
||||
margin-left: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-xl-ml-lg {
|
||||
margin-left: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-xl-ml-md {
|
||||
margin-left: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-xl-ml-none {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.cu-xl-ml-sm {
|
||||
margin-left: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-xl-ml-xl {
|
||||
margin-left: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-xl-ml-xs {
|
||||
margin-left: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-xl-mr-2xl {
|
||||
margin-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-xl-mr-lg {
|
||||
margin-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-xl-mx-xl {
|
||||
margin-left: var(--canon-spacing-xl);
|
||||
.cu-xl-mr-md {
|
||||
margin-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-xl-mr-none {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.cu-xl-mr-sm {
|
||||
margin-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-xl-mr-xl {
|
||||
margin-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-xl-mr-xs {
|
||||
margin-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-xl-mt-2xl {
|
||||
margin-top: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-xl-mt-lg {
|
||||
margin-top: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-xl-mt-md {
|
||||
margin-top: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-xl-mt-none {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.cu-xl-mt-sm {
|
||||
margin-top: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-xl-mt-xl {
|
||||
margin-top: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-xl-mt-xs {
|
||||
margin-top: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-xl-mx-2xl {
|
||||
margin-left: var(--canon-spacing-2xl);
|
||||
margin-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-xl-my-none {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
.cu-xl-mx-lg {
|
||||
margin-left: var(--canon-spacing-lg);
|
||||
margin-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-xl-my-2xs {
|
||||
margin-top: var(--canon-spacing-2xs);
|
||||
margin-bottom: var(--canon-spacing-2xs);
|
||||
.cu-xl-mx-md {
|
||||
margin-left: var(--canon-spacing-md);
|
||||
margin-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-xl-my-xs {
|
||||
margin-top: var(--canon-spacing-xs);
|
||||
margin-bottom: var(--canon-spacing-xs);
|
||||
.cu-xl-mx-none {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.cu-xl-my-sm {
|
||||
margin-top: var(--canon-spacing-sm);
|
||||
margin-bottom: var(--canon-spacing-sm);
|
||||
.cu-xl-mx-sm {
|
||||
margin-left: var(--canon-spacing-sm);
|
||||
margin-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-xl-my-md {
|
||||
margin-top: var(--canon-spacing-md);
|
||||
margin-bottom: var(--canon-spacing-md);
|
||||
.cu-xl-mx-xl {
|
||||
margin-left: var(--canon-spacing-xl);
|
||||
margin-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-xl-my-lg {
|
||||
margin-top: var(--canon-spacing-lg);
|
||||
margin-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-xl-my-xl {
|
||||
margin-top: var(--canon-spacing-xl);
|
||||
margin-bottom: var(--canon-spacing-xl);
|
||||
.cu-xl-mx-xs {
|
||||
margin-left: var(--canon-spacing-xs);
|
||||
margin-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-xl-my-2xl {
|
||||
@@ -376,228 +308,248 @@
|
||||
margin-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-xl-ml-none {
|
||||
margin-left: 0;
|
||||
.cu-xl-my-lg {
|
||||
margin-top: var(--canon-spacing-lg);
|
||||
margin-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-xl-ml-2xs {
|
||||
margin-left: var(--canon-spacing-2xs);
|
||||
.cu-xl-my-md {
|
||||
margin-top: var(--canon-spacing-md);
|
||||
margin-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-xl-ml-xs {
|
||||
margin-left: var(--canon-spacing-xs);
|
||||
.cu-xl-my-none {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-xl-ml-sm {
|
||||
margin-left: var(--canon-spacing-sm);
|
||||
.cu-xl-my-sm {
|
||||
margin-top: var(--canon-spacing-sm);
|
||||
margin-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-xl-ml-md {
|
||||
margin-left: var(--canon-spacing-md);
|
||||
.cu-xl-my-xl {
|
||||
margin-top: var(--canon-spacing-xl);
|
||||
margin-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-xl-ml-lg {
|
||||
margin-left: var(--canon-spacing-lg);
|
||||
.cu-xl-my-xs {
|
||||
margin-top: var(--canon-spacing-xs);
|
||||
margin-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-xl-ml-xl {
|
||||
margin-left: var(--canon-spacing-xl);
|
||||
.cu-xl-p-2xl {
|
||||
padding: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-xl-ml-2xl {
|
||||
margin-left: var(--canon-spacing-2xl);
|
||||
.cu-xl-p-lg {
|
||||
padding: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-xl-mr-none {
|
||||
margin-right: 0;
|
||||
.cu-xl-p-md {
|
||||
padding: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-xl-mr-2xs {
|
||||
margin-right: var(--canon-spacing-2xs);
|
||||
.cu-xl-p-none {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.cu-xl-mr-xs {
|
||||
margin-right: var(--canon-spacing-xs);
|
||||
.cu-xl-p-sm {
|
||||
padding: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-xl-mr-sm {
|
||||
margin-right: var(--canon-spacing-sm);
|
||||
.cu-xl-p-xl {
|
||||
padding: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-xl-mr-md {
|
||||
margin-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-xl-mr-lg {
|
||||
margin-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-xl-mr-xl {
|
||||
margin-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-xl-mr-2xl {
|
||||
margin-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-xl-gap-none {
|
||||
gap: 0;
|
||||
}
|
||||
|
||||
.cu-xl-gap-2xs {
|
||||
gap: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-xl-gap-xs {
|
||||
gap: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-xl-gap-sm {
|
||||
gap: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-xl-gap-md {
|
||||
gap: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-xl-gap-lg {
|
||||
gap: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-xl-gap-xl {
|
||||
gap: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-xl-gap-2xl {
|
||||
gap: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-xl-pt-none {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.cu-xl-pt-2xs {
|
||||
padding-top: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-xl-pt-xs {
|
||||
padding-top: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-xl-pt-sm {
|
||||
padding-top: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-xl-pt-md {
|
||||
padding-top: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-xl-pt-lg {
|
||||
padding-top: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-xl-pt-xl {
|
||||
padding-top: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-xl-pt-2xl {
|
||||
padding-top: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-xl-pb-none {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-xl-pb-2xs {
|
||||
padding-bottom: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-xl-pb-xs {
|
||||
padding-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-xl-pb-sm {
|
||||
padding-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-xl-pb-md {
|
||||
padding-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-xl-pb-lg {
|
||||
padding-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-xl-pb-xl {
|
||||
padding-bottom: var(--canon-spacing-xl);
|
||||
.cu-xl-p-xs {
|
||||
padding: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-xl-pb-2xl {
|
||||
padding-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-xl-mt-none {
|
||||
margin-top: 0;
|
||||
.cu-xl-pb-lg {
|
||||
padding-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-xl-mt-2xs {
|
||||
margin-top: var(--canon-spacing-2xs);
|
||||
.cu-xl-pb-md {
|
||||
padding-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-xl-mt-xs {
|
||||
margin-top: var(--canon-spacing-xs);
|
||||
.cu-xl-pb-none {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-xl-mt-sm {
|
||||
margin-top: var(--canon-spacing-sm);
|
||||
.cu-xl-pb-sm {
|
||||
padding-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-xl-mt-md {
|
||||
margin-top: var(--canon-spacing-md);
|
||||
.cu-xl-pb-xl {
|
||||
padding-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-xl-mt-lg {
|
||||
margin-top: var(--canon-spacing-lg);
|
||||
.cu-xl-pb-xs {
|
||||
padding-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-xl-mt-xl {
|
||||
margin-top: var(--canon-spacing-xl);
|
||||
.cu-xl-pl-2xl {
|
||||
padding-left: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-xl-mt-2xl {
|
||||
margin-top: var(--canon-spacing-2xl);
|
||||
.cu-xl-pl-lg {
|
||||
padding-left: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-xl-mb-none {
|
||||
margin-bottom: 0;
|
||||
.cu-xl-pl-md {
|
||||
padding-left: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-xl-mb-2xs {
|
||||
margin-bottom: var(--canon-spacing-2xs);
|
||||
.cu-xl-pl-none {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.cu-xl-mb-xs {
|
||||
margin-bottom: var(--canon-spacing-xs);
|
||||
.cu-xl-pl-sm {
|
||||
padding-left: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-xl-mb-sm {
|
||||
margin-bottom: var(--canon-spacing-sm);
|
||||
.cu-xl-pl-xl {
|
||||
padding-left: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-xl-mb-md {
|
||||
margin-bottom: var(--canon-spacing-md);
|
||||
.cu-xl-pl-xs {
|
||||
padding-left: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-xl-mb-lg {
|
||||
margin-bottom: var(--canon-spacing-lg);
|
||||
.cu-xl-pr-2xl {
|
||||
padding-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-xl-mb-xl {
|
||||
margin-bottom: var(--canon-spacing-xl);
|
||||
.cu-xl-pr-lg {
|
||||
padding-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-xl-mb-2xl {
|
||||
margin-bottom: var(--canon-spacing-2xl);
|
||||
.cu-xl-pr-md {
|
||||
padding-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-xl-pr-none {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.cu-xl-pr-sm {
|
||||
padding-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-xl-pr-xl {
|
||||
padding-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-xl-pr-xs {
|
||||
padding-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-xl-pt-2xl {
|
||||
padding-top: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-xl-pt-lg {
|
||||
padding-top: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-xl-pt-md {
|
||||
padding-top: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-xl-pt-none {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.cu-xl-pt-sm {
|
||||
padding-top: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-xl-pt-xl {
|
||||
padding-top: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-xl-pt-xs {
|
||||
padding-top: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-xl-px-2xl {
|
||||
padding-left: var(--canon-spacing-2xl);
|
||||
padding-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-xl-px-lg {
|
||||
padding-left: var(--canon-spacing-lg);
|
||||
padding-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-xl-px-md {
|
||||
padding-left: var(--canon-spacing-md);
|
||||
padding-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-xl-px-none {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.cu-xl-px-sm {
|
||||
padding-left: var(--canon-spacing-sm);
|
||||
padding-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-xl-px-xl {
|
||||
padding-left: var(--canon-spacing-xl);
|
||||
padding-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-xl-px-xs {
|
||||
padding-left: var(--canon-spacing-xs);
|
||||
padding-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-xl-py-2xl {
|
||||
padding-top: var(--canon-spacing-2xl);
|
||||
padding-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-xl-py-lg {
|
||||
padding-top: var(--canon-spacing-lg);
|
||||
padding-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-xl-py-md {
|
||||
padding-top: var(--canon-spacing-md);
|
||||
padding-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-xl-py-none {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-xl-py-sm {
|
||||
padding-top: var(--canon-spacing-sm);
|
||||
padding-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-xl-py-xl {
|
||||
padding-top: var(--canon-spacing-xl);
|
||||
padding-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-xl-py-xs {
|
||||
padding-top: var(--canon-spacing-xs);
|
||||
padding-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-xl-wrap-reverse {
|
||||
flex-wrap: wrap-reverse;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -19,6 +19,62 @@
|
||||
display: block;
|
||||
}
|
||||
|
||||
.cu-flex {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.cu-flex-col {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.cu-flex-nowrap {
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
|
||||
.cu-flex-row {
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.cu-flex-wrap {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.cu-flex-wrap-reverse {
|
||||
flex-wrap: wrap-reverse;
|
||||
}
|
||||
|
||||
.cu-gap-2xl {
|
||||
gap: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-gap-lg {
|
||||
gap: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-gap-md {
|
||||
gap: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-gap-none {
|
||||
gap: 0;
|
||||
}
|
||||
|
||||
.cu-gap-sm {
|
||||
gap: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-gap-xl {
|
||||
gap: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-gap-xs {
|
||||
gap: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-grid {
|
||||
display: grid;
|
||||
}
|
||||
|
||||
.cu-hidden {
|
||||
display: none;
|
||||
}
|
||||
@@ -31,36 +87,20 @@
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.cu-flex {
|
||||
display: flex;
|
||||
.cu-items-center {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.cu-grid {
|
||||
display: grid;
|
||||
.cu-items-end {
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.cu-flex-row {
|
||||
flex-direction: row;
|
||||
.cu-items-start {
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.cu-flex-col {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.cu-justify-stretch {
|
||||
justify-content: stretch;
|
||||
}
|
||||
|
||||
.cu-justify-start {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.cu-justify-center {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.cu-justify-end {
|
||||
justify-content: flex-end;
|
||||
.cu-items-stretch {
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.cu-justify-around {
|
||||
@@ -71,303 +111,195 @@
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.cu-items-stretch {
|
||||
align-items: stretch;
|
||||
.cu-justify-center {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.cu-items-center {
|
||||
align-items: center;
|
||||
.cu-justify-end {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.cu-items-start {
|
||||
align-items: flex-start;
|
||||
.cu-justify-start {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.cu-items-end {
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.cu-p-none {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.cu-p-2xs {
|
||||
padding: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-p-xs {
|
||||
padding: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-p-sm {
|
||||
padding: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-p-md {
|
||||
padding: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-p-lg {
|
||||
padding: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-p-xl {
|
||||
padding: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-p-2xl {
|
||||
padding: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-px-none {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.cu-px-2xs {
|
||||
padding-left: var(--canon-spacing-2xs);
|
||||
padding-right: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-px-xs {
|
||||
padding-left: var(--canon-spacing-xs);
|
||||
padding-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-px-sm {
|
||||
padding-left: var(--canon-spacing-sm);
|
||||
padding-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-px-md {
|
||||
padding-left: var(--canon-spacing-md);
|
||||
padding-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-px-lg {
|
||||
padding-left: var(--canon-spacing-lg);
|
||||
padding-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-px-xl {
|
||||
padding-left: var(--canon-spacing-xl);
|
||||
padding-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-px-2xl {
|
||||
padding-left: var(--canon-spacing-2xl);
|
||||
padding-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-py-none {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-py-2xs {
|
||||
padding-top: var(--canon-spacing-2xs);
|
||||
padding-bottom: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-py-xs {
|
||||
padding-top: var(--canon-spacing-xs);
|
||||
padding-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-py-sm {
|
||||
padding-top: var(--canon-spacing-sm);
|
||||
padding-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-py-md {
|
||||
padding-top: var(--canon-spacing-md);
|
||||
padding-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-py-lg {
|
||||
padding-top: var(--canon-spacing-lg);
|
||||
padding-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-py-xl {
|
||||
padding-top: var(--canon-spacing-xl);
|
||||
padding-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-py-2xl {
|
||||
padding-top: var(--canon-spacing-2xl);
|
||||
padding-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-pl-none {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.cu-pl-2xs {
|
||||
padding-left: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-pl-xs {
|
||||
padding-left: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-pl-sm {
|
||||
padding-left: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-pl-md {
|
||||
padding-left: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-pl-lg {
|
||||
padding-left: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-pl-xl {
|
||||
padding-left: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-pl-2xl {
|
||||
padding-left: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-pr-none {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.cu-pr-2xs {
|
||||
padding-right: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-pr-xs {
|
||||
padding-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-pr-sm {
|
||||
padding-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-pr-md {
|
||||
padding-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-pr-lg {
|
||||
padding-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-pr-xl {
|
||||
padding-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-pr-2xl {
|
||||
padding-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-m-none {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.cu-m-2xs {
|
||||
margin: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-m-xs {
|
||||
margin: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-m-sm {
|
||||
margin: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-m-md {
|
||||
margin: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-m-lg {
|
||||
margin: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-m-xl {
|
||||
margin: var(--canon-spacing-xl);
|
||||
.cu-justify-stretch {
|
||||
justify-content: stretch;
|
||||
}
|
||||
|
||||
.cu-m-2xl {
|
||||
margin: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-mx-none {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
.cu-m-lg {
|
||||
margin: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-mx-2xs {
|
||||
margin-left: var(--canon-spacing-2xs);
|
||||
margin-right: var(--canon-spacing-2xs);
|
||||
.cu-m-md {
|
||||
margin: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-mx-xs {
|
||||
margin-left: var(--canon-spacing-xs);
|
||||
margin-right: var(--canon-spacing-xs);
|
||||
.cu-m-none {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.cu-mx-sm {
|
||||
margin-left: var(--canon-spacing-sm);
|
||||
margin-right: var(--canon-spacing-sm);
|
||||
.cu-m-sm {
|
||||
margin: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-mx-md {
|
||||
margin-left: var(--canon-spacing-md);
|
||||
margin-right: var(--canon-spacing-md);
|
||||
.cu-m-xl {
|
||||
margin: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-mx-lg {
|
||||
.cu-m-xs {
|
||||
margin: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-mb-2xl {
|
||||
margin-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-mb-lg {
|
||||
margin-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-mb-md {
|
||||
margin-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-mb-none {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-mb-sm {
|
||||
margin-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-mb-xl {
|
||||
margin-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-mb-xs {
|
||||
margin-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-ml-2xl {
|
||||
margin-left: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-ml-lg {
|
||||
margin-left: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-ml-md {
|
||||
margin-left: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-ml-none {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.cu-ml-sm {
|
||||
margin-left: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-ml-xl {
|
||||
margin-left: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-ml-xs {
|
||||
margin-left: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-mr-2xl {
|
||||
margin-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-mr-lg {
|
||||
margin-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-mx-xl {
|
||||
margin-left: var(--canon-spacing-xl);
|
||||
.cu-mr-md {
|
||||
margin-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-mr-none {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.cu-mr-sm {
|
||||
margin-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-mr-xl {
|
||||
margin-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-mr-xs {
|
||||
margin-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-mt-2xl {
|
||||
margin-top: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-mt-lg {
|
||||
margin-top: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-mt-md {
|
||||
margin-top: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-mt-none {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.cu-mt-sm {
|
||||
margin-top: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-mt-xl {
|
||||
margin-top: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-mt-xs {
|
||||
margin-top: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-mx-2xl {
|
||||
margin-left: var(--canon-spacing-2xl);
|
||||
margin-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-my-none {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
.cu-mx-lg {
|
||||
margin-left: var(--canon-spacing-lg);
|
||||
margin-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-my-2xs {
|
||||
margin-top: var(--canon-spacing-2xs);
|
||||
margin-bottom: var(--canon-spacing-2xs);
|
||||
.cu-mx-md {
|
||||
margin-left: var(--canon-spacing-md);
|
||||
margin-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-my-xs {
|
||||
margin-top: var(--canon-spacing-xs);
|
||||
margin-bottom: var(--canon-spacing-xs);
|
||||
.cu-mx-none {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.cu-my-sm {
|
||||
margin-top: var(--canon-spacing-sm);
|
||||
margin-bottom: var(--canon-spacing-sm);
|
||||
.cu-mx-sm {
|
||||
margin-left: var(--canon-spacing-sm);
|
||||
margin-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-my-md {
|
||||
margin-top: var(--canon-spacing-md);
|
||||
margin-bottom: var(--canon-spacing-md);
|
||||
.cu-mx-xl {
|
||||
margin-left: var(--canon-spacing-xl);
|
||||
margin-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-my-lg {
|
||||
margin-top: var(--canon-spacing-lg);
|
||||
margin-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-my-xl {
|
||||
margin-top: var(--canon-spacing-xl);
|
||||
margin-bottom: var(--canon-spacing-xl);
|
||||
.cu-mx-xs {
|
||||
margin-left: var(--canon-spacing-xs);
|
||||
margin-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-my-2xl {
|
||||
@@ -375,227 +307,247 @@
|
||||
margin-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-ml-none {
|
||||
margin-left: 0;
|
||||
.cu-my-lg {
|
||||
margin-top: var(--canon-spacing-lg);
|
||||
margin-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-ml-2xs {
|
||||
margin-left: var(--canon-spacing-2xs);
|
||||
.cu-my-md {
|
||||
margin-top: var(--canon-spacing-md);
|
||||
margin-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-ml-xs {
|
||||
margin-left: var(--canon-spacing-xs);
|
||||
.cu-my-none {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-ml-sm {
|
||||
margin-left: var(--canon-spacing-sm);
|
||||
.cu-my-sm {
|
||||
margin-top: var(--canon-spacing-sm);
|
||||
margin-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-ml-md {
|
||||
margin-left: var(--canon-spacing-md);
|
||||
.cu-my-xl {
|
||||
margin-top: var(--canon-spacing-xl);
|
||||
margin-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-ml-lg {
|
||||
margin-left: var(--canon-spacing-lg);
|
||||
.cu-my-xs {
|
||||
margin-top: var(--canon-spacing-xs);
|
||||
margin-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-ml-xl {
|
||||
margin-left: var(--canon-spacing-xl);
|
||||
.cu-p-2xl {
|
||||
padding: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-ml-2xl {
|
||||
margin-left: var(--canon-spacing-2xl);
|
||||
.cu-p-lg {
|
||||
padding: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-mr-none {
|
||||
margin-right: 0;
|
||||
.cu-p-md {
|
||||
padding: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-mr-2xs {
|
||||
margin-right: var(--canon-spacing-2xs);
|
||||
.cu-p-none {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.cu-mr-xs {
|
||||
margin-right: var(--canon-spacing-xs);
|
||||
.cu-p-sm {
|
||||
padding: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-mr-sm {
|
||||
margin-right: var(--canon-spacing-sm);
|
||||
.cu-p-xl {
|
||||
padding: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-mr-md {
|
||||
margin-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-mr-lg {
|
||||
margin-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-mr-xl {
|
||||
margin-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-mr-2xl {
|
||||
margin-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-gap-none {
|
||||
gap: 0;
|
||||
}
|
||||
|
||||
.cu-gap-2xs {
|
||||
gap: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-gap-xs {
|
||||
gap: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-gap-sm {
|
||||
gap: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-gap-md {
|
||||
gap: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-gap-lg {
|
||||
gap: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-gap-xl {
|
||||
gap: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-gap-2xl {
|
||||
gap: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-pt-none {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.cu-pt-2xs {
|
||||
padding-top: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-pt-xs {
|
||||
padding-top: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-pt-sm {
|
||||
padding-top: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-pt-md {
|
||||
padding-top: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-pt-lg {
|
||||
padding-top: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-pt-xl {
|
||||
padding-top: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-pt-2xl {
|
||||
padding-top: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-pb-none {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-pb-2xs {
|
||||
padding-bottom: var(--canon-spacing-2xs);
|
||||
}
|
||||
|
||||
.cu-pb-xs {
|
||||
padding-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-pb-sm {
|
||||
padding-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-pb-md {
|
||||
padding-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-pb-lg {
|
||||
padding-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-pb-xl {
|
||||
padding-bottom: var(--canon-spacing-xl);
|
||||
.cu-p-xs {
|
||||
padding: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-pb-2xl {
|
||||
padding-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-mt-none {
|
||||
margin-top: 0;
|
||||
.cu-pb-lg {
|
||||
padding-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-mt-2xs {
|
||||
margin-top: var(--canon-spacing-2xs);
|
||||
.cu-pb-md {
|
||||
padding-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-mt-xs {
|
||||
margin-top: var(--canon-spacing-xs);
|
||||
.cu-pb-none {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-mt-sm {
|
||||
margin-top: var(--canon-spacing-sm);
|
||||
.cu-pb-sm {
|
||||
padding-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-mt-md {
|
||||
margin-top: var(--canon-spacing-md);
|
||||
.cu-pb-xl {
|
||||
padding-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-mt-lg {
|
||||
margin-top: var(--canon-spacing-lg);
|
||||
.cu-pb-xs {
|
||||
padding-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-mt-xl {
|
||||
margin-top: var(--canon-spacing-xl);
|
||||
.cu-pl-2xl {
|
||||
padding-left: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-mt-2xl {
|
||||
margin-top: var(--canon-spacing-2xl);
|
||||
.cu-pl-lg {
|
||||
padding-left: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-mb-none {
|
||||
margin-bottom: 0;
|
||||
.cu-pl-md {
|
||||
padding-left: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-mb-2xs {
|
||||
margin-bottom: var(--canon-spacing-2xs);
|
||||
.cu-pl-none {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.cu-mb-xs {
|
||||
margin-bottom: var(--canon-spacing-xs);
|
||||
.cu-pl-sm {
|
||||
padding-left: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-mb-sm {
|
||||
margin-bottom: var(--canon-spacing-sm);
|
||||
.cu-pl-xl {
|
||||
padding-left: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-mb-md {
|
||||
margin-bottom: var(--canon-spacing-md);
|
||||
.cu-pl-xs {
|
||||
padding-left: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-mb-lg {
|
||||
margin-bottom: var(--canon-spacing-lg);
|
||||
.cu-pr-2xl {
|
||||
padding-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-mb-xl {
|
||||
margin-bottom: var(--canon-spacing-xl);
|
||||
.cu-pr-lg {
|
||||
padding-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-mb-2xl {
|
||||
margin-bottom: var(--canon-spacing-2xl);
|
||||
.cu-pr-md {
|
||||
padding-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-pr-none {
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.cu-pr-sm {
|
||||
padding-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-pr-xl {
|
||||
padding-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-pr-xs {
|
||||
padding-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-pt-2xl {
|
||||
padding-top: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-pt-lg {
|
||||
padding-top: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-pt-md {
|
||||
padding-top: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-pt-none {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.cu-pt-sm {
|
||||
padding-top: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-pt-xl {
|
||||
padding-top: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-pt-xs {
|
||||
padding-top: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-px-2xl {
|
||||
padding-left: var(--canon-spacing-2xl);
|
||||
padding-right: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-px-lg {
|
||||
padding-left: var(--canon-spacing-lg);
|
||||
padding-right: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-px-md {
|
||||
padding-left: var(--canon-spacing-md);
|
||||
padding-right: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-px-none {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.cu-px-sm {
|
||||
padding-left: var(--canon-spacing-sm);
|
||||
padding-right: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-px-xl {
|
||||
padding-left: var(--canon-spacing-xl);
|
||||
padding-right: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-px-xs {
|
||||
padding-left: var(--canon-spacing-xs);
|
||||
padding-right: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-py-2xl {
|
||||
padding-top: var(--canon-spacing-2xl);
|
||||
padding-bottom: var(--canon-spacing-2xl);
|
||||
}
|
||||
|
||||
.cu-py-lg {
|
||||
padding-top: var(--canon-spacing-lg);
|
||||
padding-bottom: var(--canon-spacing-lg);
|
||||
}
|
||||
|
||||
.cu-py-md {
|
||||
padding-top: var(--canon-spacing-md);
|
||||
padding-bottom: var(--canon-spacing-md);
|
||||
}
|
||||
|
||||
.cu-py-none {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.cu-py-sm {
|
||||
padding-top: var(--canon-spacing-sm);
|
||||
padding-bottom: var(--canon-spacing-sm);
|
||||
}
|
||||
|
||||
.cu-py-xl {
|
||||
padding-top: var(--canon-spacing-xl);
|
||||
padding-bottom: var(--canon-spacing-xl);
|
||||
}
|
||||
|
||||
.cu-py-xs {
|
||||
padding-top: var(--canon-spacing-xs);
|
||||
padding-bottom: var(--canon-spacing-xs);
|
||||
}
|
||||
|
||||
.cu-wrap-reverse {
|
||||
flex-wrap: wrap-reverse;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -25,15 +25,15 @@ export interface Breakpoints {
|
||||
export type Space = 'none' | '2xs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
|
||||
export type Display = 'none' | 'flex' | 'block' | 'inline';
|
||||
export type FlexDirection = 'row' | 'column';
|
||||
export type FlexWrap = 'wrap' | 'nowrap';
|
||||
export type FlexWrap = 'wrap' | 'nowrap' | 'wrap-reverse';
|
||||
export type JustifyContent =
|
||||
| 'stretch'
|
||||
| 'flex-start'
|
||||
| 'start'
|
||||
| 'center'
|
||||
| 'flex-end'
|
||||
| 'space-around'
|
||||
| 'space-between';
|
||||
export type AlignItems = 'stretch' | 'flex-start' | 'center' | 'flex-end';
|
||||
| 'end'
|
||||
| 'around'
|
||||
| 'between';
|
||||
export type AlignItems = 'stretch' | 'start' | 'center' | 'end';
|
||||
export type BorderRadius = 'none' | 'small' | 'medium' | 'full';
|
||||
export type BoxShadow = 'small' | 'medium' | 'large';
|
||||
|
||||
|
||||
@@ -40,6 +40,7 @@ const valueMap: Record<string, Record<string, string>> = {
|
||||
flexWrap: {
|
||||
wrap: 'flex-wrap',
|
||||
nowrap: 'flex-nowrap',
|
||||
'wrap-reverse': 'flex-wrap-reverse',
|
||||
},
|
||||
justifyContent: {
|
||||
stretch: 'justify-stretch',
|
||||
|
||||
Reference in New Issue
Block a user