Container Component guidelines
conditional-attributes-removes-component-duplication: Using conditional attributes to avoid duplicating similar componentsIt’s a good practice to avoid duplicating similar components with minor variations. Instead, you can use conditional attributes to modify the behavior or appearance of a component based on certain conditions.
Not recommended
-- ftd.decimal: $rent1 if: { !is-price } -- ftd.decimal: $rent2 if: { is-price }
Lang:
ftd
Recommended
-- ftd.decimal: value if { is-price }: $rent2 value: $rent1
Lang:
ftd
minimize-container-components: Avoid using container components with single or no childThis guideline advises against using container components when there is only one or no child, as it can lead to unnecessary abstraction and complexity in the code. Instead, it’s recommended to remove the parent container which results in simpler and more readable code.
Not recommended
;; -------- Example 1 -------- -- ftd.column: -- ftd.text: Hello World -- end: ftd.column ;; -------- Example 2 -------- -- ftd.column: color: $inherited.colors.text margin.px: 10 -- ftd.text: Hello World -- end: ftd.column
Lang:
ftd
Recommended
;; -------- Example 1 -------- -- ftd.text: Hello World ;; -------- Example 2 -------- -- ftd.text: Hello World color: $inherited.colors.text margin.px: 10
Lang:
ftd
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.
Quick links:
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
