diff --git a/app/page.tsx b/app/page.tsx index f172209..755d183 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -5,13 +5,11 @@ import { CardBody } from '../src/primitive-components/card/card-body'; import { CardMedia } from '../src/primitive-components/card/card-media'; import { CardFooter } from '../src/primitive-components/card/card-footer'; import { CardHeader } from '../src/primitive-components/card/card-header'; +import { SegmentedButtons } from '../src/primitive-components/components'; +import { Typography } from '../src/primitive-components/typography/typography'; import { CardActionArea } from '../src/primitive-components/card/card-action-area'; import { Button } from '../src/primitive-components/button-components/button/button'; -import { Typography } from '../src/primitive-components/typography/typography'; -import { - ButtonLayout, - SegmentedButtons, -} from '../src/primitive-components/components'; +import { SegmentButton } from '../src/primitive-components/button-components/segmented-buttons/segmented-buttons'; export default function Page() { return ( @@ -50,11 +48,21 @@ export default function Page() {
- + + - Label 1 - Label 2 - Label 3 + + Label 1 + + + Label 2 + + Label 3
diff --git a/src/primitive-components/button-components/button-layout/button-layout.tsx b/src/primitive-components/button-components/button-layout/button-layout.tsx index 5d976df..19a28fa 100644 --- a/src/primitive-components/button-components/button-layout/button-layout.tsx +++ b/src/primitive-components/button-components/button-layout/button-layout.tsx @@ -1,6 +1,6 @@ 'use client'; -import { bool, string } from 'prop-types'; +import { bool } from 'prop-types'; import { RippleEffect } from '../../ripple/ripple-effect'; import { ButtonLayoutProps } from './button-layout.types'; import useRippleEffect from '../../ripple/hooks/useRippleEffect'; @@ -37,6 +37,5 @@ export const ButtonLayout = forwardRef( ); ButtonLayout.propTypes = { - children: string, centralRipple: bool, }; diff --git a/src/primitive-components/button-components/button/button.tsx b/src/primitive-components/button-components/button/button.tsx index f2949cb..6bd73d6 100644 --- a/src/primitive-components/button-components/button/button.tsx +++ b/src/primitive-components/button-components/button/button.tsx @@ -1,10 +1,10 @@ 'use client'; import { forwardRef } from 'react'; -import { Icon } from '../../components'; import { ButtonProps } from './button.types'; import { bool, oneOf, string } from 'prop-types'; import { ButtonLayout } from '../button-layout/button-layout'; +import { IconWrapper } from '../../icon/icon-wrapper'; /** * Button component @@ -14,10 +14,11 @@ import { ButtonLayout } from '../button-layout/button-layout'; export const Button = forwardRef( ( { - icon, + icon = undefined, className = '', disabled = false, variant = 'filled', + iconPlace = 'left', centralRipple = false, ...props }, @@ -30,8 +31,9 @@ export const Button = forwardRef( disabled={disabled} ref={ref} > - {icon ? {icon} : <>} - {props.children} + + {props.children} + ), ); diff --git a/src/primitive-components/button-components/button/button.types.ts b/src/primitive-components/button-components/button/button.types.ts index e764a3e..14b992e 100644 --- a/src/primitive-components/button-components/button/button.types.ts +++ b/src/primitive-components/button-components/button/button.types.ts @@ -6,6 +6,7 @@ export interface ButtonMainProps { children?: string; disabled?: boolean; variant?: 'filled' | 'outlined' | 'elevated' | 'tonal' | 'text'; + iconPlace?: 'left' | 'right'; } export type ButtonProps = RipplePropsForComponents & diff --git a/src/primitive-components/button-components/segmented-buttons/segmented-buttons.tsx b/src/primitive-components/button-components/segmented-buttons/segmented-buttons.tsx index afb8bae..479e6ef 100644 --- a/src/primitive-components/button-components/segmented-buttons/segmented-buttons.tsx +++ b/src/primitive-components/button-components/segmented-buttons/segmented-buttons.tsx @@ -1,29 +1,51 @@ -import React, { cloneElement, forwardRef, ReactElement } from 'react'; -import { SegmentedButtonProps } from './segmented-buttons.types'; +import React, { forwardRef } from 'react'; +import { + SegmentedButton, + SegmentedButtonsProps, +} from './segmented-buttons.types'; +import { string } from 'prop-types'; +import { ButtonLayout } from '../../components'; +import { ButtonLayoutProps } from '../button-layout/button-layout.types'; +import { IconWrapper } from '../../icon/icon-wrapper'; + +export const SegmentButton = forwardRef< + HTMLButtonElement, + ButtonLayoutProps & SegmentedButton +>(({ centralRipple = false, iconPlace = 'left', icon, ...props }, ref) => { + const classes = `m3-button-segment ${props.className ?? ''}`.trimEnd(); + return ( + + + {props.children} + + + + ); +}); + +SegmentButton.propTypes = { + children: string, +}; export const SegmentedButtons = forwardRef< HTMLDivElement, - SegmentedButtonProps + SegmentedButtonsProps >(({ children, ...props }, ref) => { if (children.length <= 1) { throw 'You must build segmented button with 2 or more buttton'; } - const buttons = children.map((button: ReactElement, index) => { - const classes = - `m3-button-segment ${button.props.className ?? ''}`.trimEnd(); - return cloneElement(button, { - className: classes, - key: index, - }); - }); - return (
- {buttons} + {children}
); }); diff --git a/src/primitive-components/button-components/segmented-buttons/segmented-buttons.types.ts b/src/primitive-components/button-components/segmented-buttons/segmented-buttons.types.ts index 8912c4a..87447cf 100644 --- a/src/primitive-components/button-components/segmented-buttons/segmented-buttons.types.ts +++ b/src/primitive-components/button-components/segmented-buttons/segmented-buttons.types.ts @@ -1,8 +1,14 @@ import { HTMLAttributes, ReactElement } from 'react'; +import { IconWrapperProps } from '../../icon/icon.types'; -export interface SegmentedButton { +export type SegmentedButton = IconWrapperProps & { + icon?: string; + centralRipple?: boolean; +}; + +export interface SegmentedButtons { children?: ReactElement[]; } -export type SegmentedButtonProps = SegmentedButton & +export type SegmentedButtonsProps = SegmentedButtons & HTMLAttributes; diff --git a/src/primitive-components/components.tsx b/src/primitive-components/components.tsx index a34cdeb..16062c7 100644 --- a/src/primitive-components/components.tsx +++ b/src/primitive-components/components.tsx @@ -3,9 +3,9 @@ export { Icon } from './icon/icon'; export { Badge } from './badge/badge'; export { Ripple } from './ripple/ripple'; export { Divider } from './divider/divider'; +export { FAB } from './button-components/fab/fab'; export { Container } from './container/container'; export { RippleEffect } from './ripple/ripple-effect'; -export { FAB } from './button-components/fab/fab'; export { Radio } from './input-components/radio/radio'; export { Switch } from './input-components/switch/switch'; export { Button } from './button-components/button/button'; diff --git a/src/primitive-components/icon/icon-wrapper.tsx b/src/primitive-components/icon/icon-wrapper.tsx new file mode 100644 index 0000000..f17af13 --- /dev/null +++ b/src/primitive-components/icon/icon-wrapper.tsx @@ -0,0 +1,18 @@ +import React from 'react'; +import { Icon } from './icon'; +import { IconWrapperProps } from './icon.types'; + +export function IconWrapper({ + children, + icon, + iconPlace, + ...props +}: IconWrapperProps) { + return ( + <> + {icon && iconPlace === 'left' && {icon}} + {children} + {icon && iconPlace === 'right' && {icon}} + + ); +} diff --git a/src/primitive-components/icon/icon.types.ts b/src/primitive-components/icon/icon.types.ts index 4121579..9f26de1 100644 --- a/src/primitive-components/icon/icon.types.ts +++ b/src/primitive-components/icon/icon.types.ts @@ -1,12 +1,26 @@ -import { SVGProps } from 'react'; +import { PropsWithChildren, SVGProps } from 'react'; -export interface IconProps extends SVGProps { +export interface IconPlacement { + iconPlace?: 'left' | 'right'; +} + +export interface GeneralIconProps { grade?: number; svgSize?: number; fillIcon?: 0 | 1; iconSize?: number; opticalSize?: number; - children?: string | undefined; type?: 'outlined' | 'rounded' | 'sharp'; weight?: 100 | 200 | 300 | 400 | 500 | 600 | 700; } + +export type IconWrapperProps = IconPlacement & + GeneralIconProps & + PropsWithChildren & { + icon?: string; + }; + +export type IconProps = SVGProps & + GeneralIconProps & { + children?: string | undefined; + }; diff --git a/src/primitive-components/ripple/ripple.types.ts b/src/primitive-components/ripple/ripple.types.ts index c27d50d..e4c40b6 100644 --- a/src/primitive-components/ripple/ripple.types.ts +++ b/src/primitive-components/ripple/ripple.types.ts @@ -30,7 +30,7 @@ export interface RipplePropsForComponents extends HTMLAttributes { } export interface RippleAreaProps extends HTMLAttributes { - callback: Dispatch>; + callback?: Dispatch>; central?: boolean; } diff --git a/src/styles/button-styles/button.sass b/src/styles/button-styles/button.sass index b1a6a99..68c872a 100644 --- a/src/styles/button-styles/button.sass +++ b/src/styles/button-styles/button.sass @@ -1,7 +1,9 @@ button:not(.m3-fab, .m3-icon-button) width: min-content height: min-content + max-height: 40px box-sizing: border-box + white-space: nowrap font-size: var(--md-sys-typescale-label-large-font-size) font-weight: var(--md-sys-typescale-label-large-font-weight) line-height: var(--md-sys-typescale-label-large-line-height) diff --git a/src/styles/button-styles/segmented-button.sass b/src/styles/button-styles/segmented-button.sass index 2a042dc..3e57a59 100644 --- a/src/styles/button-styles/segmented-button.sass +++ b/src/styles/button-styles/segmented-button.sass @@ -1,7 +1,6 @@ div.m3.m3-segmented-buttons display: flex flex-direction: row - outline-offset: -1px width: min-content border-radius: 20px @@ -20,4 +19,24 @@ div.m3.m3-segmented-buttons border-radius: 20px 0 0 20px &:last-child - border-radius: 0 20px 20px 0 \ No newline at end of file + border-radius: 0 20px 20px 0 + + & > span.m3.m3-button-segment-state-layer + position: absolute + width: 100% + height: 100% + + & > span.m3.m3-button-segment-state-layer, span.m3.m3-ripple-domain + transition: .2s cubic-bezier(0.2, 0, 0, 1) + + &:hover + & > span.m3.m3-button-segment-state-layer + background-color: color-mix(in srgb, var(--md-sys-color-on-secondary-container) 8%, transparent) + + &:is(&:active, &:focus-visible) + & > span.m3.m3-button-segment-state-layer + background-color: color-mix(in srgb, var(--md-sys-color-on-secondary-container) 12%, transparent) + + &:active + & > span.m3.m3-ripple-domain > span.m3.ripple + background-color: color-mix(in srgb, var(--md-sys-color-on-secondary-container) 12%, transparent) diff --git a/src/styles/card.sass b/src/styles/card.sass index 834c730..1d55299 100644 --- a/src/styles/card.sass +++ b/src/styles/card.sass @@ -80,8 +80,5 @@ div.m3.m3-card-action-area & > span.m3.m3-card-state-layer background-color: color-mix(in srgb, var(--md-sys-color-on-surface) 12%, transparent) - & > span.m3.m3-card-state-layer - background-color: transparent - & > span.m3.m3-ripple-domain > .m3.ripple background-color: color-mix(in srgb, var(--md-sys-color-on-surface) 12%, transparent) diff --git a/src/styles/generics.css b/src/styles/generics.css index f5dc8d3..1f05e19 100644 --- a/src/styles/generics.css +++ b/src/styles/generics.css @@ -71,9 +71,6 @@ div.m3.m3-card-action-area:active.m3-card-elevated { div.m3.m3-card-action-area:active:not(div.m3.m3-card-action-area:active:has(span.m3.m3-ripple-domain)) > span.m3.m3-card-state-layer { background-color: color-mix(in srgb, var(--md-sys-color-on-surface) 12%, transparent); } -div.m3.m3-card-action-area:active > span.m3.m3-card-state-layer { - background-color: transparent; -} div.m3.m3-card-action-area:active > span.m3.m3-ripple-domain > .m3.ripple { background-color: color-mix(in srgb, var(--md-sys-color-on-surface) 12%, transparent); } @@ -449,7 +446,9 @@ button.m3.m3-fab:focus-visible.tertiary::before { button:not(.m3-fab, .m3-icon-button) { width: min-content; height: min-content; + max-height: 40px; box-sizing: border-box; + white-space: nowrap; font-size: var(--md-sys-typescale-label-large-font-size); font-weight: var(--md-sys-typescale-label-large-font-weight); line-height: var(--md-sys-typescale-label-large-line-height); @@ -715,7 +714,6 @@ button.m3.m3-icon-button:focus-visible:not(:disabled).tonal.toggled::before { div.m3.m3-segmented-buttons { display: flex; flex-direction: row; - outline-offset: -1px; width: min-content; border-radius: 20px; } @@ -736,6 +734,23 @@ div.m3.m3-segmented-buttons > button.m3.m3-button-segment:first-child { div.m3.m3-segmented-buttons > button.m3.m3-button-segment:last-child { border-radius: 0 20px 20px 0; } +div.m3.m3-segmented-buttons > button.m3.m3-button-segment > span.m3.m3-button-segment-state-layer { + position: absolute; + width: 100%; + height: 100%; +} +div.m3.m3-segmented-buttons > button.m3.m3-button-segment > span.m3.m3-button-segment-state-layer, div.m3.m3-segmented-buttons > button.m3.m3-button-segment span.m3.m3-ripple-domain { + transition: 0.2s cubic-bezier(0.2, 0, 0, 1); +} +div.m3.m3-segmented-buttons > button.m3.m3-button-segment:hover > span.m3.m3-button-segment-state-layer { + background-color: color-mix(in srgb, var(--md-sys-color-on-secondary-container) 8%, transparent); +} +div.m3.m3-segmented-buttons > button.m3.m3-button-segment:is(div.m3.m3-segmented-buttons > button.m3.m3-button-segment:active, div.m3.m3-segmented-buttons > button.m3.m3-button-segment:focus-visible) > span.m3.m3-button-segment-state-layer { + background-color: color-mix(in srgb, var(--md-sys-color-on-secondary-container) 12%, transparent); +} +div.m3.m3-segmented-buttons > button.m3.m3-button-segment:active > span.m3.m3-ripple-domain > span.m3.ripple { + background-color: color-mix(in srgb, var(--md-sys-color-on-secondary-container) 12%, transparent); +} div.m3.m3-radio { width: 20px; diff --git a/src/styles/generics.css.map b/src/styles/generics.css.map index a5b84fd..8654814 100644 --- a/src/styles/generics.css.map +++ b/src/styles/generics.css.map @@ -1 +1 @@ -{"version":3,"sourceRoot":"","sources":["generics.sass","card.sass","mixins/m3-mixins.sass","icon.sass","badge.sass","fonts.sass","ripple.sass","divider.sass","container.sass","button-styles/fabs.sass","button-styles/button.sass","button-styles/icon-button.sass","button-styles/segmented-button.sass","input-styles/radio.sass","input-styles/swtich.sass","input-styles/checkbox.sass","input-styles/text-field.sass"],"names":[],"mappings":"AAoBQ;AACA;AACA;AACA;AACA;ACbJ;EAGI;EACA;;;AAER;EACI;EACA;;;AAEJ;EACI;EACA;EACA;;;AAEJ;EAII;EACA;EACA;EACA;EACA;;AAPA;EACI;;;AAQR;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;;AAGA;EACI;;AAGJ;EACI;;AAGJ;ECzBA;;AD4BA;ECtBA;;AD0BA;ECxCA;;AD2CA;ECrCA;;ADyCI;EACI;;AAER;EACI;;AAEJ;EACI;;;AElFR;EACI;EACA;;AAGA;EACI,OATA;EAUA;EACA,aAXA;EAYA,WAZA;;AAQJ;EACI,OATA;EAUA;EACA,aAXA;EAYA,WAZA;;AAQJ;EACI,OATA;EAUA;EACA,aAXA;EAYA,WAZA;;AAQJ;EACI,OATA;EAUA;EACA,aAXA;EAYA,WAZA;;AAQJ;EACI,OATA;EAUA;EACA,aAXA;EAYA,WAZA;;AAQJ;EACI,OATA;EAUA;EACA,aAXA;EAYA,WAZA;;AAQJ;EACI,OATA;EAUA;EACA,aAXA;EAYA,WAZA;;AAQJ;EACI,OATA;EAUA;EACA,aAXA;EAYA,WAZA;;AAQJ;EACI,OATA;EAUA;EACA,aAXA;EAYA,WAZA;;AAeJ;EACI;;AADJ;EACI;;AADJ;EACI;;;ACjBZ;EACI;EACA;;AACA;EACI;EACA;EACA;EACA;;AACA;EACI;;AACR;EACI;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;ACrBJ;EACI;EACA;EACA;;AAHJ;EACI;EACA;EACA;;AAHJ;EACI;EACA;EACA;;AAKJ;EACI;EACA;EACA;EACA;;AAJJ;EACI;EACA;EACA;EACA;;AAJJ;EACI;EACA;EACA;EACA;;AAJJ;EACI;EACA;EACA;EACA;;AAJJ;EACI;EACA;EACA;EACA;;AAJJ;EACI;EACA;EACA;EACA;;ACfR;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;;AA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ACI;;AAEA;EACI;EACA;EACA;EACA;EACA;;AAEJ;EACI;;;AC1FhB;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;;AACA;EACI;EACA;;AAER;EACI;EACA;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;;AAER;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGA;EACI;;AAGJ;EACI;;AAEJ;EACI;;AAGJ;EACI;;AAEJ;EACI;;AAER;EACI;;AAEJ;EAEI;;AAGA;EACI;;AAEJ;EACI;;AAGJ;EACI;;AAER;EACI;;AAEJ;EACI;EACA;;AAII;EACI;;AAEJ;EACI;EACA;;AAGJ;EACI;;AAEJ;EACI;EACA;;AAGR;EACI;EACA;;AAEJ;EACI;EACA;;AAER;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAGA;EACI;;AAEJ;EACI;EACA;;AAGJ;EACI;EACA;;AAEJ;EACI;EACA;;;AC7JhB;EbCI;EACA;EACA;EACA;EACA;EaHA;EACA;;AACA;EbIA;EACA;EACA;EACA;EACA;;;AaLJ;EACI;EACA;EACA;EACA;EACA;EACA;;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAEJ;EAGI;;AAFA;EACI;;AAIJ;EACI;;AAER;EAGI;;AAFA;EACI;;AAGR;EACI;;AAGA;EACI;;AAER;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEJ;EACI;;AAEJ;EACI;;AAEJ;EACI;;AAII;EACI;;AAER;EACI;;AACA;EACI;;AAER;EACI;;AAEJ;EACI;;AACA;EACI;;AAGJ;EACI;;AAER;EACI;;AACA;EACI;;;ACpGhB;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;;AAEJ;EACI;;AAEJ;EACI;EACA;;AAGA;EACI;;AAER;EACI;EACA;;AAEA;EAgBI;EACA;EACA;EACA;EACA;EACA;;AApBA;EACI;;AAEJ;EACI;;AAEJ;EACI;;AAEJ;EACI;;AAEJ;EACI;;AASR;EACI;EACA;EACA;;AAEJ;EACI;;AAEA;EACI;;AACJ;EACI;;AAER;EAEI;;AAEJ;EACI;EACA;;AAEJ;EACI;;AAGA;EACI;EACA;;AAGR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;;AAER;EAgBI;EACA;;AAhBA;EACI;;AAEJ;EACI;;AAEJ;EACI;;AAEJ;EACI;;AAEJ;EACI;;AAKR;EACI;;AAEJ;EACI;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;;AAEJ;EACI;;AAEJ;EACI;EACA;;AAEJ;EACI;;AAEJ;EACI;;AAEJ;EAEI;;AAEJ;EACI;;AAEJ;EACI;;AAGA;EACI;EACA;;;AhB7LhB;EACI;EACA;EACA;;;AAEJ;EACI;;;AAEJ;EACI;EACA;EACA;EACA","file":"generics.css"} \ No newline at end of file +{"version":3,"sourceRoot":"","sources":["generics.sass","card.sass","mixins/m3-mixins.sass","icon.sass","badge.sass","fonts.sass","ripple.sass","divider.sass","container.sass","button-styles/fabs.sass","button-styles/button.sass","button-styles/icon-button.sass","button-styles/segmented-button.sass","input-styles/radio.sass","input-styles/swtich.sass","input-styles/checkbox.sass","input-styles/text-field.sass"],"names":[],"mappings":"AAoBQ;AACA;AACA;AACA;AACA;ACbJ;EAGI;EACA;;;AAER;EACI;EACA;;;AAEJ;EACI;EACA;EACA;;;AAEJ;EAII;EACA;EACA;EACA;EACA;;AAPA;EACI;;;AAQR;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;;AAGA;EACI;;AAGJ;EACI;;AAGJ;ECzBA;;AD4BA;ECtBA;;AD0BA;ECxCA;;AD2CA;ECrCA;;ADyCI;EACI;;AAER;EACI;;;AE/ER;EACI;EACA;;AAGA;EACI,OATA;EAUA;EACA,aAXA;EAYA,WAZA;;AAQJ;EACI,OATA;EAUA;EACA,aAXA;EAYA,WAZA;;AAQJ;EACI,OATA;EAUA;EACA,aAXA;EAYA,WAZA;;AAQJ;EACI,OATA;EAUA;EACA,aAXA;EAYA,WAZA;;AAQJ;EACI,OATA;EAUA;EACA,aAXA;EAYA,WAZA;;AAQJ;EACI,OATA;EAUA;EACA,aAXA;EAYA,WAZA;;AAQJ;EACI,OATA;EAUA;EACA,aAXA;EAYA,WAZA;;AAQJ;EACI,OATA;EAUA;EACA,aAXA;EAYA,WAZA;;AAQJ;EACI,OATA;EAUA;EACA,aAXA;EAYA,WAZA;;AAeJ;EACI;;AADJ;EACI;;AADJ;EACI;;;ACjBZ;EACI;EACA;;AACA;EACI;EACA;EACA;EACA;;AACA;EACI;;AACR;EACI;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;ACrBJ;EACI;EACA;EACA;;AAHJ;EACI;EACA;EACA;;AAHJ;EACI;EACA;EACA;;AAKJ;EACI;EACA;EACA;EACA;;AAJJ;EACI;EACA;EACA;EACA;;AAJJ;EACI;EACA;EACA;EACA;;AAJJ;EACI;EACA;EACA;EACA;;AAJJ;EACI;EACA;EACA;EACA;;AAJJ;EACI;EACA;EACA;EACA;;ACfR;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;;AAEJ;EACE;IAC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;;AAEJ;EACI;EACA;;AAEZ;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAEA;EACI;EACA;EACA;EACA;EACA;;AAEJ;EACI;;;AC1FhB;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;;AACA;EACI;EACA;;AAER;EACI;EACA;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;;AAER;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGA;EACI;;AAGJ;EACI;;AAEJ;EACI;;AAGJ;EACI;;AAEJ;EACI;;AAER;EACI;;AAEJ;EAEI;;AAGA;EACI;;AAEJ;EACI;;AAGJ;EACI;;AAER;EACI;;AAEJ;EACI;EACA;;AAII;EACI;;AAEJ;EACI;EACA;;AAGJ;EACI;;AAEJ;EACI;EACA;;AAGR;EACI;EACA;;AAEJ;EACI;EACA;;AAER;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAGA;EACI;;AAEJ;EACI;EACA;;AAGJ;EACI;EACA;;AAEJ;EACI;EACA;;;AC7JhB;EbCI;EACA;EACA;EACA;EACA;EaHA;EACA;;AACA;EbIA;EACA;EACA;EACA;EACA;;;AaLJ;EACI;EACA;EACA;EACA;EACA;EACA;;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAEJ;EAGI;;AAFA;EACI;;AAIJ;EACI;;AAER;EAGI;;AAFA;EACI;;AAGR;EACI;;AAGA;EACI;;AAER;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEJ;EACI;;AAEJ;EACI;;AAEJ;EACI;;AAII;EACI;;AAER;EACI;;AACA;EACI;;AAER;EACI;;AAEJ;EACI;;AACA;EACI;;AAGJ;EACI;;AAER;EACI;;AACA;EACI;;;ACpGhB;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;;AAEJ;EACI;;AAEJ;EACI;EACA;;AAGA;EACI;;AAER;EACI;EACA;;AAEA;EAgBI;EACA;EACA;EACA;EACA;EACA;;AApBA;EACI;;AAEJ;EACI;;AAEJ;EACI;;AAEJ;EACI;;AAEJ;EACI;;AASR;EACI;EACA;EACA;;AAEJ;EACI;;AAEA;EACI;;AACJ;EACI;;AAER;EAEI;;AAEJ;EACI;EACA;;AAEJ;EACI;;AAGA;EACI;EACA;;AAGR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;;AAER;EAgBI;EACA;;AAhBA;EACI;;AAEJ;EACI;;AAEJ;EACI;;AAEJ;EACI;;AAEJ;EACI;;AAKR;EACI;;AAEJ;EACI;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;;AAEJ;EACI;;AAEJ;EACI;EACA;;AAEJ;EACI;;AAEJ;EACI;;AAEJ;EAEI;;AAEJ;EACI;;AAEJ;EACI;;AAGA;EACI;EACA;;;AhB7LhB;EACI;EACA;EACA;;;AAEJ;EACI;;;AAEJ;EACI;EACA;EACA;EACA","file":"generics.css"} \ No newline at end of file