@wonderflow/react-components
Version:
UI components from Wonderflow's Wanda design system
1 lines • 6.75 kB
CSS
@layer components{.Text{font-size:var(--fs-extra-small);font-weight:var(--fw-extra-small);letter-spacing:0;line-height:var(--lh-extra-small);max-width:var(--max-width);min-block-size:.01vh;text-align:var(--t-align);word-break:break-word}@media (min-width:48em){.Text{font-size:var(--fs-small);font-weight:var(--fw-small);line-height:var(--lh-small)}}@media (min-width:60em){.Text{font-size:var(--fs-medium);font-weight:var(--fw-medium);line-height:var(--lh-medium)}}@media (min-width:80em){.Text{font-size:var(--fs-large);font-weight:var(--fw-large);line-height:var(--lh-large)}}.Text[data-text-decorator=true]{align-items:center;display:inline-flex;flex-flow:row wrap;gap:.5rem}.Text[data-text-prevent-break-word=true]{word-break:unset}.Text[data-text-prevent-responsive=true]{font-size:var(--fs-large);font-weight:var(--fw-large);line-height:var(--lh-large)}.Text[data-text-variant=display-1]{--fs-large:6rem;--fw-large:800;--lh-large:6.75rem;--fs-medium:4rem;--fw-medium:800;--lh-medium:5rem;--fs-small:3.5rem;--fw-small:800;--lh-small:4rem;--fs-extra-small:2.5rem;--fw-extra-small:800;--lh-extra-small:3rem;color:var(--dimmed-9)}.Text[data-text-variant=display-2]{--fs-large:5rem;--fw-large:800;--lh-large:6rem;--fs-medium:4rem;--fw-medium:800;--lh-medium:5rem;--fs-small:3.5rem;--fw-small:800;--lh-small:4rem;--fs-extra-small:2.5rem;--fw-extra-small:800;--lh-extra-small:3rem;color:var(--dimmed-9)}.Text[data-text-variant=display-3]{--fs-large:4rem;--fw-large:800;--lh-large:5rem;--fs-medium:3.5rem;--fw-medium:800;--lh-medium:4rem;--fs-small:3rem;--fw-small:800;--lh-small:3.5rem;--fs-extra-small:2.5rem;--fw-extra-small:800;--lh-extra-small:3rem;color:var(--dimmed-9)}.Text[data-text-variant=display-4]{--fs-large:3.5rem;--fw-large:800;--lh-large:4rem;--fs-medium:3.5rem;--fw-medium:800;--lh-medium:4rem;--fs-small:3rem;--fw-small:800;--lh-small:3.5rem;--fs-extra-small:2.5rem;--fw-extra-small:800;--lh-extra-small:3rem;color:var(--dimmed-9)}.Text[data-text-variant=heading-1]{--fs-large:3rem;--fw-large:800;--lh-large:3.5rem;--fs-medium:3rem;--fw-medium:800;--lh-medium:3.5rem;--fs-small:3rem;--fw-small:800;--lh-small:3.5rem;--fs-extra-small:2.5rem;--fw-extra-small:800;--lh-extra-small:3rem;color:var(--dimmed-9)}.Text[data-text-variant=heading-2]{--fs-large:2.5rem;--fw-large:800;--lh-large:3rem;--fs-medium:2.5rem;--fw-medium:800;--lh-medium:3rem;--fs-small:2rem;--fw-small:700;--lh-small:2.5rem;--fs-extra-small:2rem;--fw-extra-small:700;--lh-extra-small:2.5rem;color:var(--dimmed-9)}.Text[data-text-variant=heading-3]{--fs-large:2rem;--fw-large:700;--lh-large:2.5rem;--fs-medium:2rem;--fw-medium:700;--lh-medium:2.5rem;--fs-small:2rem;--fw-small:700;--lh-small:2.5rem;--fs-extra-small:1.75rem;--fw-extra-small:700;--lh-extra-small:2.25rem;color:var(--dimmed-9)}.Text[data-text-variant=heading-4]{--fs-large:1.75rem;--fw-large:700;--lh-large:2.25rem;--fs-medium:1.75rem;--fw-medium:700;--lh-medium:2.25rem;--fs-small:1.75rem;--fw-small:700;--lh-small:2.25rem;--fs-extra-small:1.5rem;--fw-extra-small:600;--lh-extra-small:2rem;color:var(--dimmed-9)}.Text[data-text-variant=heading-5]{--fs-large:1.5rem;--fw-large:600;--lh-large:2rem;--fs-medium:1.5rem;--fw-medium:600;--lh-medium:2rem;--fs-small:1.25rem;--fw-small:600;--lh-small:1.75rem;--fs-extra-small:1.25rem;--fw-extra-small:600;--lh-extra-small:1.75rem;color:var(--dimmed-9)}.Text[data-text-variant=heading-6]{--fs-large:1.25rem;--fw-large:600;--lh-large:1.75rem;--fs-medium:1.25rem;--fw-medium:600;--lh-medium:1.75rem;--fs-small:1.25rem;--fw-small:600;--lh-small:1.75rem;--fs-extra-small:1.25rem;--fw-extra-small:600;--lh-extra-small:1.75rem;color:var(--dimmed-9)}.Text[data-text-variant=tagline-1]{--fs-large:1.75rem;--fw-large:300;--lh-large:2.25rem;--fs-medium:1.75rem;--fw-medium:300;--lh-medium:2.25rem;--fs-small:1.75rem;--fw-small:300;--lh-small:2.25rem;--fs-extra-small:1.5rem;--fw-extra-small:300;--lh-extra-small:2rem;color:var(--dimmed-7)}.Text[data-text-variant=tagline-2]{--fs-large:1.5rem;--fw-large:300;--lh-large:2rem;--fs-medium:1.5rem;--fw-medium:300;--lh-medium:2rem;--fs-small:1.25rem;--fw-small:300;--lh-small:1.75rem;--fs-extra-small:1.25rem;--fw-extra-small:300;--lh-extra-small:1.75rem;color:var(--dimmed-7)}.Text[data-text-variant=tagline-3]{--fs-large:1.25rem;--fw-large:300;--lh-large:1.75rem;--fs-medium:1.25rem;--fw-medium:300;--lh-medium:1.75rem;--fs-small:1.25rem;--fw-small:300;--lh-small:1.75rem;--fs-extra-small:1.25rem;--fw-extra-small:300;--lh-extra-small:1.75rem;color:var(--dimmed-7)}.Text[data-text-variant=subtitle-1]{--fs-large:1rem;--fw-large:600;--lh-large:1.5rem;--fs-medium:1rem;--fw-medium:600;--lh-medium:1.5rem;--fs-small:1rem;--fw-small:600;--lh-small:1.5rem;--fs-extra-small:1rem;--fw-extra-small:600;--lh-extra-small:1.5rem;color:var(--dimmed-7);letter-spacing:.01rem}.Text[data-text-variant=subtitle-2]{--fs-large:0.875rem;--fw-large:600;--lh-large:1.25rem;--fs-medium:0.875rem;--fw-medium:600;--lh-medium:1.25rem;--fs-small:0.875rem;--fw-small:600;--lh-small:1.25rem;--fs-extra-small:0.875rem;--fw-extra-small:600;--lh-extra-small:1.25rem;color:var(--dimmed-7);letter-spacing:.015rem}.Text[data-text-variant=body-1]{--fs-large:1rem;--fw-large:400;--lh-large:1.5rem;--fs-medium:1rem;--fw-medium:400;--lh-medium:1.5rem;--fs-small:1rem;--fw-small:400;--lh-small:1.5rem;--fs-extra-small:1rem;--fw-extra-small:400;--lh-extra-small:1.5rem;color:var(--dimmed-7);letter-spacing:.01rem}.Text[data-text-variant=body-2]{--fs-large:0.875rem;--fw-large:400;--lh-large:1.25rem;--fs-medium:0.875rem;--fw-medium:400;--lh-medium:1.25rem;--fs-small:0.875rem;--fw-small:400;--lh-small:1.25rem;--fs-extra-small:0.875rem;--fw-extra-small:400;--lh-extra-small:1.25rem;color:var(--dimmed-7);letter-spacing:token(--wds-letter-spacing-14)}.Text[data-text-variant=body-3]{--fs-large:0.75rem;--fw-large:400;--lh-large:1rem;--fs-medium:0.75rem;--fw-medium:400;--lh-medium:1rem;--fs-small:0.75rem;--fw-small:400;--lh-small:1rem;--fs-extra-small:0.75rem;--fw-extra-small:400;--lh-extra-small:1rem;color:var(--dimmed-7);letter-spacing:.02rem}.Text[data-text-color=positive]{color:var(--highlight-green-foreground)}.Text[data-text-color=informative]{color:var(--highlight-blue-foreground)}.Text[data-text-color=danger]{color:var(--highlight-red-foreground)}.Text[data-text-color=warning]{color:var(--highlight-yellow-foreground)}.Text[data-text-color=neutral]{color:var(--dimmed-7)}.Text[data-text-color=dark]{color:var(--dimmed-9)}.Text[data-text-truncate=true]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:inherit}}@layer overrides{.Anchor{align-items:center;background-image:none;color:inherit;display:inline-flex;justify-content:center;margin-left:1rem;visibility:hidden}.Text:focus-within .Anchor,.Text:hover .Anchor{visibility:visible}}