Use inherited types

Using inherited types for colors and roles allows for greater flexibility in using different color schemes and typography.
inherited-colors: Prefer using inherited.colors to give colors
inherited.colors are part of fastn design system. If you use custom / hardcoded colors then switching color schemes will not affect your component, and website maintainers using your component will have a great experience.
Not recommended
-- ftd.column:
background.solid: white

-- colms:
$color-value: #b4ccba

-- ftd.text: Campaign Summary
color: #7D8180
Lang:
ftd
Recommended
-- ftd.column:
background.solid: $inherited.colors.background.base

-- colms:
$color-value: $inherited.colors.custom.one

-- ftd.text: Campaign Summary
color: $inherited.colors.text
Lang:
ftd
role-inheritance: Prefer using inherited.types to give a role

Specific values for typography requires additional code for responsive design.

Meanwhile,role-inheritance allows for flexibility in using different typography, while maintaining consistency across the design system.
Not recommended
-- ftd.type dtype:
size.px: 40
weight: 900
font-family: cursive
line-height.px: 65
letter-spacing.px: 5

-- ftd.type mtype:
size.px: 20
weight: 100
font-family: fantasy
line-height.px: 35
letter-spacing.px: 3

-- ftd.responsive-type rtype:
desktop: $dtype
mobile: $mtype

-- ftd.text: Hello World
role: $rtype
Lang:
ftd
Recommended
-- ftd.text: Hello World
role: $inherited.types.copy-regular
Lang:
ftd

Support fastn!

Enjoying fastn? Please consider giving us a star ⭐️ on GitHub to show your support!

Getting Help

Have a question or need help?

Visit our GitHub Q&A discussion to get answers and subscribe to it to stay tuned.

Join our Discord channel and share your thoughts, suggestion, question etc.

Connect with our community!

Found an issue?

If you find some issue, please visit our GitHub issues to tell us about it.

Join us

We welcome you to join our Discord community today.

We are trying to create the language for human beings and we do not believe it would be possible without your support. We would love to hear from you.
Copyright © 2023 - FifthTry.com