Turnkey Styling
Denis Pupin (talk | contribs) |
Denis Pupin (talk | contribs) |
||
Line 33: | Line 33: | ||
<body> | <body> | ||
<p>Default buttons in MDriven Turnkey</p> | <p><b>Default</b> buttons in MDriven Turnkey</p> | ||
<div class="examples"> | <div class="examples"> | ||
Line 65: | Line 65: | ||
</div> | </div> | ||
<p | <p><b>Oulined</b> buttons in MDriven Turnkey</p> | ||
<div class="examples"> | <div class="examples"> | ||
Line 97: | Line 97: | ||
</div> | </div> | ||
<p | <p><b>Flat</b> buttons in MDriven Turnkey</p> | ||
<div class="examples"> | <div class="examples"> | ||
Line 129: | Line 129: | ||
</div> | </div> | ||
<p | <p><b>Shaped</b> buttons in MDriven Turnkey</p> | ||
<div class="examples"> | <div class="examples"> |
Revision as of 08:24, 31 July 2019
Getting started
MDriven Turnkey Style system based on the BEM methodology. BEM stands for Block, Element, Modifier and it is a convention on how to structure CSS rules. Read more here.
Out of the box you will receive the following UI elements:
- Static text
- Image
- Text field
- Checkbox
- Select (Combobox)
- Date picker
- Data-table
- Button
- File upload
- Link
- Textarea
- Number field
- Float field
Layout
MDriven Turnkey uses CSS Grid to create the application layout.
Components
Buttons
Out of the box in MDriven Turnkey you have the default button styles, but you can modify it with the predefined Modifier-classes. Find out all predefined modifier classes for the buttons, below.
Default buttons in MDriven Turnkey
Oulined buttons in MDriven Turnkey
Flat buttons in MDriven Turnkey
Shaped buttons in MDriven Turnkey
This page was edited more than 9 months ago on 03/26/2024. What links here