अनुक्रमणिका

Mikio Syntax

Text

<text color="#e59c09" size=24px weight=bold line-height=2 background-color="FFFFee" text-decoration="underline red double 2px" > \\ color=(color name or hex), size:=(px, em, rem or %), weight=(normal, bold, bolder or number thickness), background-color=(color name or hex), line-height=(Positive integer), text-decoration=(underline, overline, line-through, "underline red double 5px"</text>
RESULT

color=(color name or hex), size:=(px, em, rem or %), weight=(normal, bold, bolder or number thickness), background-color=(color name or hex), line-height=(Positive integer), text-decoration=(underline, overline, line-through, “underline red double 5px”


Tab Group

<tab-group pills> <tab title="A tab" pills> Tab Group can have pills or without it. You can have anything in a tab. Tabs can have title & can be disabled. </tab> <tab title="Second tab"> Contains of Second Tab. Third Tab is disabled. </tab> <tab disabled title="The third tab"> Third Tab is disabled. </tab> </tab-group>
RESULT

  Tab Group can have pills or without it. You can have anything in a tab. Tabs can have title & can be disabled.

Contains of Second Tab. Third Tab is disabled.

  Third Tab is disabled.


Small Text

This is normal Text <small>and this is small</small>Understood?
Result
This is normal Text and this is small Understood?


Placeholder Text

<placeholder text="some text" color=gray text-color=red height=4em width=15em>
Result

some text

Pagenation

<pagenation> <pagenation-item url="wiki:B"> <pagenation-item url="wiki:A"> </pagenation>
Result


List Group

this list works even under cards & Boxes <listgroup width=50%> <listgroup-item active> <listgroup flush> removes borders.</listgroup-item> <listgroup-item disabled><listgroup horizontal> lists items in a row</listgroup-item> <listgroup-item>Morbi leo risus</listgroup-item> </listgroup>
Result


Button

Remember that the colors of the Button as well as Alert are based on same name to color relation.
<button primary width=10%>Primary</button> <button secondary shadow-large>Secondary</button> <button success shadow-small>Success</button> <button danger shadow>Danger</button> <button warning>Warning</button> <button info>Info</button> <button light>Light</button> <button dark>Dark</button> <button link>Link</button>
RESULT
Primary Secondary Success Danger Warning Info Light Dark Link


ALERT

Same color & Shadow style as per Button

<alert danger shadow-large width=50em dismissible >A simple secondary alert - check it out!</alert>
Result


BADGE

Every config option similar to Button <button large>Notifications <badge light>4</badge></button>
Result
Notifications 4