Typography
Package Name
fifthtry.github.io/typography
This component can be used to add heading. It has various heading namely h0, h1,
h2, h3 and h4. Somewhat similar to heading tag in html. The variation of the
numbers (0, 1 and 2) directly relates to the relevance that the content has in
the interface. The lower the number, more prominence, and the importance it will
have. So it helps creating the hierarchy of information.
Add this to your FASTN.ftd
-- fastn.dependency: fifthtry.github.io/typography as tf
-- fastn.auto-import: tf
h0
Component Name
-- tf.h0:This is used to add the most prominent heading i.e. the Heading Hero.
It expects a title in caption, optional string type data in body and
afterwards add any number of components.
How to use
Show code
h1
Component Name
-- tf.h1:This is used to add the most prominent heading i.e. the Heading level 1.
It expects a title in caption, optional string type data in body and
afterwards add any number of components.
How to use
Show code
h2
Component Name
-- tf.h2:This is used to add the most prominent heading i.e. the Heading level 2.
It expects a title in caption, optional string type data in body and
afterwards add any number of components.
How to use
Show code
h3
Component Name
-- tf.h3:This is used to add the most prominent heading i.e. the Heading level 3.
It expects a title in caption, optional string type data in body and
afterwards add any number of components.
How to use
Show code
h4
Component Name
-- tf.h4:This is used to add the most prominent heading i.e. the Heading level 4.
It expects a title in caption, optional string type data in body and
afterwards add any number of components.
How to use
Show code
markdown
Component Name
-- tf.markdown:This is used to add string type data in body text, you can add as many paragraphs
using this component.
How to use
Show code
Output of all above components:
Below are examples of above components, how they will be rendered on your browser.
Title of the Heading Hero
<Body text here> // This is optionalTitle of the Heading Level 1
<Body text here> // This is optionalTitle of the Heading Level 2
<Body text here> // This is optionalTitle of the Heading Level 3
<Body text here> // This is optionalTitle of the Heading Level 4
<Body text here> // This is optional<Body text here> // This is a `markdown component body area.
Copyright © 2023 - FifthTry
