Kernel Components

`ftd.decimal`

Docs

Book 🚧

Learn

Why Use `fastn` for Your Next Frontend?

Container Root Attributes

`import`

Using export/exposing

Functions

Built-in Functions

Built-in Rive Functions

Built-in Variables

`ftd` Events

Rive Events

Use color scheme package

How to make page responsive

Using JS

JS in function

Web Component

Create `fastn` package

Same argument & attribute types

`ftd.decimal`

`ftd.decimal` is a component used to render a decimal value in an `ftd` document.

Usage

To use `ftd.decimal`, simply add it to your `ftd` document with your desired decimal value to display.

Sample Usage

Input

-- ftd.decimal: 10.01
color: $inherited.colors.text

Lang:

ftd

Output

10.01

Attributes

`ftd.decimal` accepts the below attributes as well all the [common](ftd/common/) and [text](ftd/text-attributes/) attributes.

`value: caption or body decimal`

This is the value to show. It is a required field. There are three ways to pass integer to `ftd.decimal`: as `caption`, as a `value` `header`, or as `body`.

value as `caption`

Input

-- ftd.decimal: 10000.9999

Lang:

ftd

Output

10000.9999

value as `header`

Input

-- ftd.decimal:
value: 1234.9999

Lang:

ftd

Output

1234.9999

value as `body`

Input

-- ftd.decimal:

3.142

Lang:

ftd

Output

3.142

`format: optional string`

This attribute can be used to pass a format string to render decimal values in different formats. You can find documentation of formatting strings [here](https://docs.rs/format_num/0.1.0/format_num/).

Sample code using `format` to render decimal as percent

Input

-- ftd.decimal:
value: 0.94623
format: .0%
color: $inherited.colors.text-strong

Lang:

ftd

Output

0.94623

Support `fastn`!

Enjoying `fastn`? Please consider giving us a star ⭐️ on [GitHub](https://github.com/fastn-stack/fastn) to show your support!

[⭐️](https://github.com/fastn-stack/fastn)

Getting Help

Have a question or need help? Visit our [GitHub Q&A discussion](https://github.com/fastn-stack/fastn/discussions/categories/q-a) to get answers and subscribe to it to stay tuned. Join our [Discord](https://discord.gg/a7eBUeutWD) channel and share your thoughts, suggestion, question etc. Connect with our [community](/community/)!

[💻️](/community/)

Found an issue?

If you find some issue, please visit our [GitHub issues](https://github.com/fastn-stack/fastn/issues) to tell us about it.

Quick links:

- [Install `fastn`](install/) - [Create `fastn` package](create-fastn-package/) - [Expander Crash Course](expander/) - [Syntax Highlighting in Sublime Text](/sublime/)

Join us

We welcome you to join our [Discord](https://discord.gg/a7eBUeutWD) 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.