Base

Use Input component to make the most forms. Included are styles for general appearance, focus state, sizing, and more.


Readonly

Add the readOnly boolean property on an input to prevent modification of the input’s value. Read-only inputs appear darker (just like disabled inputs), but retain the standard cursor.


Readonly plain text

If you want to have <Input readOnly> elements in your form styled as plain text, add the plainText property to remove the default form field styling and preserve the correct margin and padding.


Disabled state

Add the disabled boolean property on an input to prevent user interactions and make it appear darker.


Sizing

Set heights using size property with sm|lg values.


Checkbox and Radio

Default

By default, any number of checkboxes and radios that are immediate sibling will be vertically stacked and appropriately spaced with <Form.Group check>.


Without labels

Add .position-static to inputs within <Form.Group check> that don’t have any label text. Remember to still provide some form of label for assistive technologies.


Inline

Group checkboxes or radios on the same horizontal row by adding inline property to any <Form.Group check>.


Settings

Performance

CPU Load
60%
CPU Temparature
42°
RAM Usage
6,532 MB

Customer care

Reports

Projects

May 14, 2020