mirror of
https://github.com/wintercms/winter.git
synced 2024-06-28 05:33:29 +02:00
Revision to UI docs, minor pixel adjustment to fixed dd
This commit is contained in:
Samuel Georges
parent
252a34dc08
commit
387f14ce17
@ -11,8 +11,17 @@
|
||||
<div class="layout control-toolbar editor-toolbar">
|
||||
<div class="layout-cell toolbar-item">
|
||||
<div data-control="toolbar">
|
||||
|
||||
<!-- Dropdown item -->
|
||||
<div class="dropdown dropdown-fixed">
|
||||
<button data-toggle="dropdown" class="btn tb-icon tb-formatting"></button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn tb-icon tb-formatting"
|
||||
title="Formatting"
|
||||
data-toggle="dropdown"
|
||||
data-control="tooltip"
|
||||
data-placement="bottom"
|
||||
data-container="body"></button>
|
||||
<ul class="dropdown-menu" data-dropdown-title="Formatting">
|
||||
<li><a href="#" rel="quote" tabindex="-1" class="oc-icon-quote-right">Quote</a></li>
|
||||
<li><a href="#" rel="code" tabindex="-1" class="oc-icon-code">Code</a></li>
|
||||
@ -24,12 +33,21 @@
|
||||
<li><a href="#" rel="header6" tabindex="-1" class="oc-icon-header">Header 6</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<button type="button" disabled class="btn tb-icon tb-bold"></button>
|
||||
<button type="button" class="btn tb-icon tb-italic"></button>
|
||||
|
||||
<!-- Item with tooltip -->
|
||||
<button
|
||||
type="button"
|
||||
class="btn tb-icon tb-bold"
|
||||
title="Bold"
|
||||
data-control="tooltip"
|
||||
data-placement="bottom"
|
||||
data-container="body"></button>
|
||||
|
||||
<!-- Disabled item -->
|
||||
<button type="button" disabled class="btn tb-icon tb-italic"></button>
|
||||
|
||||
<button type="button" class="btn tb-icon tb-unorderedlist"></button>
|
||||
<button type="button" class="btn tb-icon tb-orderedlist"></button>
|
||||
|
||||
<button type="button" class="btn tb-icon tb-link"></button>
|
||||
<button type="button" class="btn tb-icon tb-horizontalrule"></button>
|
||||
</div>
|
||||
|
||||
@ -2,240 +2,240 @@ Provides flags of various descriptions
|
||||
|
||||
# Example
|
||||
|
||||
<i class="flag-eu"></i>
|
||||
<i class="flag-ad"></i>
|
||||
<i class="flag-ae"></i>
|
||||
<i class="flag-af"></i>
|
||||
<i class="flag-ag"></i>
|
||||
<i class="flag-ai"></i>
|
||||
<i class="flag-al"></i>
|
||||
<i class="flag-am"></i>
|
||||
<i class="flag-ao"></i>
|
||||
<i class="flag-aq"></i>
|
||||
<i class="flag-ar"></i>
|
||||
<i class="flag-as"></i>
|
||||
<i class="flag-at"></i>
|
||||
<i class="flag-au"></i>
|
||||
<i class="flag-aw"></i>
|
||||
<i class="flag-ax"></i>
|
||||
<i class="flag-az"></i>
|
||||
<i class="flag-ba"></i>
|
||||
<i class="flag-bb"></i>
|
||||
<i class="flag-bd"></i>
|
||||
<i class="flag-be"></i>
|
||||
<i class="flag-bf"></i>
|
||||
<i class="flag-bg"></i>
|
||||
<i class="flag-bh"></i>
|
||||
<i class="flag-bi"></i>
|
||||
<i class="flag-bj"></i>
|
||||
<i class="flag-bm"></i>
|
||||
<i class="flag-bn"></i>
|
||||
<i class="flag-bo"></i>
|
||||
<i class="flag-br"></i>
|
||||
<i class="flag-bs"></i>
|
||||
<i class="flag-bt"></i>
|
||||
<i class="flag-bw"></i>
|
||||
<i class="flag-by"></i>
|
||||
<i class="flag-bz"></i>
|
||||
<i class="flag-ca"></i>
|
||||
<i class="flag-cg"></i>
|
||||
<i class="flag-cf"></i>
|
||||
<i class="flag-cd"></i>
|
||||
<i class="flag-ch"></i>
|
||||
<i class="flag-ci"></i>
|
||||
<i class="flag-ck"></i>
|
||||
<i class="flag-cl"></i>
|
||||
<i class="flag-cm"></i>
|
||||
<i class="flag-cn"></i>
|
||||
<i class="flag-co"></i>
|
||||
<i class="flag-cr"></i>
|
||||
<i class="flag-cu"></i>
|
||||
<i class="flag-cv"></i>
|
||||
<i class="flag-cy"></i>
|
||||
<i class="flag-cz"></i>
|
||||
<i class="flag-de"></i>
|
||||
<i class="flag-dj"></i>
|
||||
<i class="flag-dk"></i>
|
||||
<i class="flag-dm"></i>
|
||||
<i class="flag-do"></i>
|
||||
<i class="flag-dz"></i>
|
||||
<i class="flag-ec"></i>
|
||||
<i class="flag-ee"></i>
|
||||
<i class="flag-eg"></i>
|
||||
<i class="flag-eh"></i>
|
||||
<i class="flag-er"></i>
|
||||
<i class="flag-es"></i>
|
||||
<i class="flag-et"></i>
|
||||
<i class="flag-fi"></i>
|
||||
<i class="flag-fj"></i>
|
||||
<i class="flag-fm"></i>
|
||||
<i class="flag-fo"></i>
|
||||
<i class="flag-fr"></i>
|
||||
<i class="flag-bl"></i>
|
||||
<i class="flag-cp"></i>
|
||||
<i class="flag-mf"></i>
|
||||
<i class="flag-yt"></i>
|
||||
<i class="flag-ga"></i>
|
||||
<i class="flag-gb"></i>
|
||||
<i class="flag-sh"></i>
|
||||
<i class="flag-gd"></i>
|
||||
<i class="flag-ge"></i>
|
||||
<i class="flag-gg"></i>
|
||||
<i class="flag-gh"></i>
|
||||
<i class="flag-gi"></i>
|
||||
<i class="flag-gl"></i>
|
||||
<i class="flag-gm"></i>
|
||||
<i class="flag-gn"></i>
|
||||
<i class="flag-gp"></i>
|
||||
<i class="flag-gq"></i>
|
||||
<i class="flag-gr"></i>
|
||||
<i class="flag-gt"></i>
|
||||
<i class="flag-gu"></i>
|
||||
<i class="flag-gw"></i>
|
||||
<i class="flag-gy"></i>
|
||||
<i class="flag-hk"></i>
|
||||
<i class="flag-hn"></i>
|
||||
<i class="flag-hr"></i>
|
||||
<i class="flag-ht"></i>
|
||||
<i class="flag-hu"></i>
|
||||
<i class="flag-id"></i>
|
||||
<i class="flag-mc"></i>
|
||||
<i class="flag-ie"></i>
|
||||
<i class="flag-il"></i>
|
||||
<i class="flag-im"></i>
|
||||
<i class="flag-in"></i>
|
||||
<i class="flag-iq"></i>
|
||||
<i class="flag-ir"></i>
|
||||
<i class="flag-is"></i>
|
||||
<i class="flag-it"></i>
|
||||
<i class="flag-je"></i>
|
||||
<i class="flag-jm"></i>
|
||||
<i class="flag-jo"></i>
|
||||
<i class="flag-jp"></i>
|
||||
<i class="flag-ke"></i>
|
||||
<i class="flag-kg"></i>
|
||||
<i class="flag-kh"></i>
|
||||
<i class="flag-ki"></i>
|
||||
<i class="flag-km"></i>
|
||||
<i class="flag-kn"></i>
|
||||
<i class="flag-kp"></i>
|
||||
<i class="flag-kr"></i>
|
||||
<i class="flag-kw"></i>
|
||||
<i class="flag-ky"></i>
|
||||
<i class="flag-kz"></i>
|
||||
<i class="flag-la"></i>
|
||||
<i class="flag-lb"></i>
|
||||
<i class="flag-lc"></i>
|
||||
<i class="flag-li"></i>
|
||||
<i class="flag-lk"></i>
|
||||
<i class="flag-lr"></i>
|
||||
<i class="flag-ls"></i>
|
||||
<i class="flag-lt"></i>
|
||||
<i class="flag-lu"></i>
|
||||
<i class="flag-lv"></i>
|
||||
<i class="flag-ly"></i>
|
||||
<i class="flag-ma"></i>
|
||||
<i class="flag-md"></i>
|
||||
<i class="flag-me"></i>
|
||||
<i class="flag-mg"></i>
|
||||
<i class="flag-mh"></i>
|
||||
<i class="flag-mk"></i>
|
||||
<i class="flag-ml"></i>
|
||||
<i class="flag-mm"></i>
|
||||
<i class="flag-mn"></i>
|
||||
<i class="flag-mo"></i>
|
||||
<i class="flag-mq"></i>
|
||||
<i class="flag-mr"></i>
|
||||
<i class="flag-ms"></i>
|
||||
<i class="flag-mt"></i>
|
||||
<i class="flag-mu"></i>
|
||||
<i class="flag-mv"></i>
|
||||
<i class="flag-mw"></i>
|
||||
<i class="flag-mx"></i>
|
||||
<i class="flag-my"></i>
|
||||
<i class="flag-mz"></i>
|
||||
<i class="flag-na"></i>
|
||||
<i class="flag-nc"></i>
|
||||
<i class="flag-ne"></i>
|
||||
<i class="flag-ng"></i>
|
||||
<i class="flag-ni"></i>
|
||||
<i class="flag-nl"></i>
|
||||
<i class="flag-bq"></i>
|
||||
<i class="flag-no"></i>
|
||||
<i class="flag-bv"></i>
|
||||
<i class="flag-nq"></i>
|
||||
<i class="flag-sj"></i>
|
||||
<i class="flag-np"></i>
|
||||
<i class="flag-nr"></i>
|
||||
<i class="flag-nz"></i>
|
||||
<i class="flag-om"></i>
|
||||
<i class="flag-pa"></i>
|
||||
<i class="flag-pe"></i>
|
||||
<i class="flag-pf"></i>
|
||||
<i class="flag-pg"></i>
|
||||
<i class="flag-ph"></i>
|
||||
<i class="flag-pk"></i>
|
||||
<i class="flag-pl"></i>
|
||||
<i class="flag-pr"></i>
|
||||
<i class="flag-ps"></i>
|
||||
<i class="flag-pt"></i>
|
||||
<i class="flag-pw"></i>
|
||||
<i class="flag-py"></i>
|
||||
<i class="flag-qa"></i>
|
||||
<i class="flag-re"></i>
|
||||
<i class="flag-ro"></i>
|
||||
<i class="flag-rs"></i>
|
||||
<i class="flag-ru"></i>
|
||||
<i class="flag-rw"></i>
|
||||
<i class="flag-sa"></i>
|
||||
<i class="flag-sb"></i>
|
||||
<i class="flag-sc"></i>
|
||||
<i class="flag-sd"></i>
|
||||
<i class="flag-se"></i>
|
||||
<i class="flag-sg"></i>
|
||||
<i class="flag-si"></i>
|
||||
<i class="flag-sk"></i>
|
||||
<i class="flag-sl"></i>
|
||||
<i class="flag-sm"></i>
|
||||
<i class="flag-sn"></i>
|
||||
<i class="flag-so"></i>
|
||||
<i class="flag-sr"></i>
|
||||
<i class="flag-st"></i>
|
||||
<i class="flag-sv"></i>
|
||||
<i class="flag-sy"></i>
|
||||
<i class="flag-sz"></i>
|
||||
<i class="flag-tc"></i>
|
||||
<i class="flag-td"></i>
|
||||
<i class="flag-tg"></i>
|
||||
<i class="flag-th"></i>
|
||||
<i class="flag-tj"></i>
|
||||
<i class="flag-tl"></i>
|
||||
<i class="flag-tm"></i>
|
||||
<i class="flag-tn"></i>
|
||||
<i class="flag-to"></i>
|
||||
<i class="flag-tr"></i>
|
||||
<i class="flag-tt"></i>
|
||||
<i class="flag-tv"></i>
|
||||
<i class="flag-tw"></i>
|
||||
<i class="flag-tz"></i>
|
||||
<i class="flag-ua"></i>
|
||||
<i class="flag-ug"></i>
|
||||
<i class="flag-us"></i>
|
||||
<i class="flag-uy"></i>
|
||||
<i class="flag-uz"></i>
|
||||
<i class="flag-va"></i>
|
||||
<i class="flag-vc"></i>
|
||||
<i class="flag-ve"></i>
|
||||
<i class="flag-vg"></i>
|
||||
<i class="flag-vi"></i>
|
||||
<i class="flag-vn"></i>
|
||||
<i class="flag-vu"></i>
|
||||
<i class="flag-ws"></i>
|
||||
<i class="flag-ye"></i>
|
||||
<i class="flag-za"></i>
|
||||
<i class="flag-zm"></i>
|
||||
<i class="flag-zw"></i>
|
||||
<i class="flag-sx"></i>
|
||||
<i class="flag-cw"></i>
|
||||
<i class="flag-ss"></i>
|
||||
<i class="flag-eu"></i>
|
||||
<i class="flag-ad"></i>
|
||||
<i class="flag-ae"></i>
|
||||
<i class="flag-af"></i>
|
||||
<i class="flag-ag"></i>
|
||||
<i class="flag-ai"></i>
|
||||
<i class="flag-al"></i>
|
||||
<i class="flag-am"></i>
|
||||
<i class="flag-ao"></i>
|
||||
<i class="flag-aq"></i>
|
||||
<i class="flag-ar"></i>
|
||||
<i class="flag-as"></i>
|
||||
<i class="flag-at"></i>
|
||||
<i class="flag-au"></i>
|
||||
<i class="flag-aw"></i>
|
||||
<i class="flag-ax"></i>
|
||||
<i class="flag-az"></i>
|
||||
<i class="flag-ba"></i>
|
||||
<i class="flag-bb"></i>
|
||||
<i class="flag-bd"></i>
|
||||
<i class="flag-be"></i>
|
||||
<i class="flag-bf"></i>
|
||||
<i class="flag-bg"></i>
|
||||
<i class="flag-bh"></i>
|
||||
<i class="flag-bi"></i>
|
||||
<i class="flag-bj"></i>
|
||||
<i class="flag-bm"></i>
|
||||
<i class="flag-bn"></i>
|
||||
<i class="flag-bo"></i>
|
||||
<i class="flag-br"></i>
|
||||
<i class="flag-bs"></i>
|
||||
<i class="flag-bt"></i>
|
||||
<i class="flag-bw"></i>
|
||||
<i class="flag-by"></i>
|
||||
<i class="flag-bz"></i>
|
||||
<i class="flag-ca"></i>
|
||||
<i class="flag-cg"></i>
|
||||
<i class="flag-cf"></i>
|
||||
<i class="flag-cd"></i>
|
||||
<i class="flag-ch"></i>
|
||||
<i class="flag-ci"></i>
|
||||
<i class="flag-ck"></i>
|
||||
<i class="flag-cl"></i>
|
||||
<i class="flag-cm"></i>
|
||||
<i class="flag-cn"></i>
|
||||
<i class="flag-co"></i>
|
||||
<i class="flag-cr"></i>
|
||||
<i class="flag-cu"></i>
|
||||
<i class="flag-cv"></i>
|
||||
<i class="flag-cy"></i>
|
||||
<i class="flag-cz"></i>
|
||||
<i class="flag-de"></i>
|
||||
<i class="flag-dj"></i>
|
||||
<i class="flag-dk"></i>
|
||||
<i class="flag-dm"></i>
|
||||
<i class="flag-do"></i>
|
||||
<i class="flag-dz"></i>
|
||||
<i class="flag-ec"></i>
|
||||
<i class="flag-ee"></i>
|
||||
<i class="flag-eg"></i>
|
||||
<i class="flag-eh"></i>
|
||||
<i class="flag-er"></i>
|
||||
<i class="flag-es"></i>
|
||||
<i class="flag-et"></i>
|
||||
<i class="flag-fi"></i>
|
||||
<i class="flag-fj"></i>
|
||||
<i class="flag-fm"></i>
|
||||
<i class="flag-fo"></i>
|
||||
<i class="flag-fr"></i>
|
||||
<i class="flag-bl"></i>
|
||||
<i class="flag-cp"></i>
|
||||
<i class="flag-mf"></i>
|
||||
<i class="flag-yt"></i>
|
||||
<i class="flag-ga"></i>
|
||||
<i class="flag-gb"></i>
|
||||
<i class="flag-sh"></i>
|
||||
<i class="flag-gd"></i>
|
||||
<i class="flag-ge"></i>
|
||||
<i class="flag-gg"></i>
|
||||
<i class="flag-gh"></i>
|
||||
<i class="flag-gi"></i>
|
||||
<i class="flag-gl"></i>
|
||||
<i class="flag-gm"></i>
|
||||
<i class="flag-gn"></i>
|
||||
<i class="flag-gp"></i>
|
||||
<i class="flag-gq"></i>
|
||||
<i class="flag-gr"></i>
|
||||
<i class="flag-gt"></i>
|
||||
<i class="flag-gu"></i>
|
||||
<i class="flag-gw"></i>
|
||||
<i class="flag-gy"></i>
|
||||
<i class="flag-hk"></i>
|
||||
<i class="flag-hn"></i>
|
||||
<i class="flag-hr"></i>
|
||||
<i class="flag-ht"></i>
|
||||
<i class="flag-hu"></i>
|
||||
<i class="flag-id"></i>
|
||||
<i class="flag-mc"></i>
|
||||
<i class="flag-ie"></i>
|
||||
<i class="flag-il"></i>
|
||||
<i class="flag-im"></i>
|
||||
<i class="flag-in"></i>
|
||||
<i class="flag-iq"></i>
|
||||
<i class="flag-ir"></i>
|
||||
<i class="flag-is"></i>
|
||||
<i class="flag-it"></i>
|
||||
<i class="flag-je"></i>
|
||||
<i class="flag-jm"></i>
|
||||
<i class="flag-jo"></i>
|
||||
<i class="flag-jp"></i>
|
||||
<i class="flag-ke"></i>
|
||||
<i class="flag-kg"></i>
|
||||
<i class="flag-kh"></i>
|
||||
<i class="flag-ki"></i>
|
||||
<i class="flag-km"></i>
|
||||
<i class="flag-kn"></i>
|
||||
<i class="flag-kp"></i>
|
||||
<i class="flag-kr"></i>
|
||||
<i class="flag-kw"></i>
|
||||
<i class="flag-ky"></i>
|
||||
<i class="flag-kz"></i>
|
||||
<i class="flag-la"></i>
|
||||
<i class="flag-lb"></i>
|
||||
<i class="flag-lc"></i>
|
||||
<i class="flag-li"></i>
|
||||
<i class="flag-lk"></i>
|
||||
<i class="flag-lr"></i>
|
||||
<i class="flag-ls"></i>
|
||||
<i class="flag-lt"></i>
|
||||
<i class="flag-lu"></i>
|
||||
<i class="flag-lv"></i>
|
||||
<i class="flag-ly"></i>
|
||||
<i class="flag-ma"></i>
|
||||
<i class="flag-md"></i>
|
||||
<i class="flag-me"></i>
|
||||
<i class="flag-mg"></i>
|
||||
<i class="flag-mh"></i>
|
||||
<i class="flag-mk"></i>
|
||||
<i class="flag-ml"></i>
|
||||
<i class="flag-mm"></i>
|
||||
<i class="flag-mn"></i>
|
||||
<i class="flag-mo"></i>
|
||||
<i class="flag-mq"></i>
|
||||
<i class="flag-mr"></i>
|
||||
<i class="flag-ms"></i>
|
||||
<i class="flag-mt"></i>
|
||||
<i class="flag-mu"></i>
|
||||
<i class="flag-mv"></i>
|
||||
<i class="flag-mw"></i>
|
||||
<i class="flag-mx"></i>
|
||||
<i class="flag-my"></i>
|
||||
<i class="flag-mz"></i>
|
||||
<i class="flag-na"></i>
|
||||
<i class="flag-nc"></i>
|
||||
<i class="flag-ne"></i>
|
||||
<i class="flag-ng"></i>
|
||||
<i class="flag-ni"></i>
|
||||
<i class="flag-nl"></i>
|
||||
<i class="flag-bq"></i>
|
||||
<i class="flag-no"></i>
|
||||
<i class="flag-bv"></i>
|
||||
<i class="flag-nq"></i>
|
||||
<i class="flag-sj"></i>
|
||||
<i class="flag-np"></i>
|
||||
<i class="flag-nr"></i>
|
||||
<i class="flag-nz"></i>
|
||||
<i class="flag-om"></i>
|
||||
<i class="flag-pa"></i>
|
||||
<i class="flag-pe"></i>
|
||||
<i class="flag-pf"></i>
|
||||
<i class="flag-pg"></i>
|
||||
<i class="flag-ph"></i>
|
||||
<i class="flag-pk"></i>
|
||||
<i class="flag-pl"></i>
|
||||
<i class="flag-pr"></i>
|
||||
<i class="flag-ps"></i>
|
||||
<i class="flag-pt"></i>
|
||||
<i class="flag-pw"></i>
|
||||
<i class="flag-py"></i>
|
||||
<i class="flag-qa"></i>
|
||||
<i class="flag-re"></i>
|
||||
<i class="flag-ro"></i>
|
||||
<i class="flag-rs"></i>
|
||||
<i class="flag-ru"></i>
|
||||
<i class="flag-rw"></i>
|
||||
<i class="flag-sa"></i>
|
||||
<i class="flag-sb"></i>
|
||||
<i class="flag-sc"></i>
|
||||
<i class="flag-sd"></i>
|
||||
<i class="flag-se"></i>
|
||||
<i class="flag-sg"></i>
|
||||
<i class="flag-si"></i>
|
||||
<i class="flag-sk"></i>
|
||||
<i class="flag-sl"></i>
|
||||
<i class="flag-sm"></i>
|
||||
<i class="flag-sn"></i>
|
||||
<i class="flag-so"></i>
|
||||
<i class="flag-sr"></i>
|
||||
<i class="flag-st"></i>
|
||||
<i class="flag-sv"></i>
|
||||
<i class="flag-sy"></i>
|
||||
<i class="flag-sz"></i>
|
||||
<i class="flag-tc"></i>
|
||||
<i class="flag-td"></i>
|
||||
<i class="flag-tg"></i>
|
||||
<i class="flag-th"></i>
|
||||
<i class="flag-tj"></i>
|
||||
<i class="flag-tl"></i>
|
||||
<i class="flag-tm"></i>
|
||||
<i class="flag-tn"></i>
|
||||
<i class="flag-to"></i>
|
||||
<i class="flag-tr"></i>
|
||||
<i class="flag-tt"></i>
|
||||
<i class="flag-tv"></i>
|
||||
<i class="flag-tw"></i>
|
||||
<i class="flag-tz"></i>
|
||||
<i class="flag-ua"></i>
|
||||
<i class="flag-ug"></i>
|
||||
<i class="flag-us"></i>
|
||||
<i class="flag-uy"></i>
|
||||
<i class="flag-uz"></i>
|
||||
<i class="flag-va"></i>
|
||||
<i class="flag-vc"></i>
|
||||
<i class="flag-ve"></i>
|
||||
<i class="flag-vg"></i>
|
||||
<i class="flag-vi"></i>
|
||||
<i class="flag-vn"></i>
|
||||
<i class="flag-vu"></i>
|
||||
<i class="flag-ws"></i>
|
||||
<i class="flag-ye"></i>
|
||||
<i class="flag-za"></i>
|
||||
<i class="flag-zm"></i>
|
||||
<i class="flag-zw"></i>
|
||||
<i class="flag-sx"></i>
|
||||
<i class="flag-cw"></i>
|
||||
<i class="flag-ss"></i>
|
||||
|
||||
|
||||
@ -1,6 +1,25 @@
|
||||
Renders a form
|
||||
# Form
|
||||
|
||||
# Example
|
||||
## Types
|
||||
|
||||
<form class="form-elements" role="form">
|
||||
<div class="form-group span-left">
|
||||
<label>First name</label>
|
||||
<input type="text" name="" value="" class="form-control" />
|
||||
</div>
|
||||
|
||||
<div class="form-group span-right">
|
||||
<label>Last name</label>
|
||||
<input type="text" name="" value="" class="form-control" />
|
||||
</div>
|
||||
|
||||
<div class="form-group span-full">
|
||||
<label>Address</label>
|
||||
<input type="text" name="" value="" class="form-control" />
|
||||
</div>
|
||||
</form>
|
||||
|
||||
### Complete example
|
||||
|
||||
<!-- Form Elements -->
|
||||
<form class="form-elements" role="form">
|
||||
@ -8,14 +27,14 @@ Renders a form
|
||||
<!-- Text Input (Left) -->
|
||||
<div class="form-group text-field span-left is-required">
|
||||
<label>Input Left</label>
|
||||
<input type="text" name="" value="" class="form-control" autocomplete="off" maxlength="255" />
|
||||
<input type="text" name="" value="" class="form-control" />
|
||||
<p class="help-block">Example below help text here.</p>
|
||||
</div>
|
||||
|
||||
<!-- Text Input (Right) -->
|
||||
<div class="form-group text-field span-right is-required">
|
||||
<label>Input Right</label>
|
||||
<input type="text" name="" value="" class="form-control" autocomplete="off" maxlength="255" />
|
||||
<input type="text" name="" value="" class="form-control" />
|
||||
<p class="help-block">Example below help text here.</p>
|
||||
</div>
|
||||
|
||||
@ -23,7 +42,7 @@ Renders a form
|
||||
<div class="form-group text-field span-full is-required">
|
||||
<label>Input Full</label>
|
||||
<p class="help-block before-field">Example above help text here.</p>
|
||||
<input type="text" name="" value="" class="form-control" autocomplete="off" maxlength="255" />
|
||||
<input type="text" name="" value="" class="form-control" />
|
||||
</div>
|
||||
|
||||
<!-- Drop down -->
|
||||
@ -40,7 +59,6 @@ Renders a form
|
||||
<div class="form-group dropdown-field span-right">
|
||||
<label>Grouped Drop Down</label>
|
||||
<select class="form-control custom-select">
|
||||
<option value=""></option>
|
||||
<optgroup label="NFC EAST">
|
||||
<option>Dallas Cowboys</option>
|
||||
<option>New York Giants</option>
|
||||
@ -158,11 +176,5 @@ Renders a form
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Textarea -->
|
||||
<div class="form-group textarea-field span-right is-required">
|
||||
<label>Textarea</label>
|
||||
<p class="help-block before-field">Plain as Jane multi line text input</p>
|
||||
<textarea autocomplete="off" class="form-control field-textarea size-large" name="comment" placeholder=""></textarea>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
|
||||
|
||||
@ -4,6 +4,8 @@ Toolbar
|
||||
|
||||
# Example
|
||||
|
||||
<h4>Basic toolbar</h4>
|
||||
|
||||
<div class="layout control-toolbar">
|
||||
<div class="layout-cell toolbar-item">
|
||||
<div data-control="toolbar">
|
||||
@ -29,4 +31,56 @@ Toolbar
|
||||
<div class="layout-cell toolbar-item width-fix">
|
||||
<input placeholder="search..." type="text" name="" value="" class="form-control icon search growable" autocomplete="off"/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h4>Editor toolbar</h4>
|
||||
|
||||
<div class="layout control-toolbar editor-toolbar">
|
||||
<div class="layout-cell toolbar-item">
|
||||
<div data-control="toolbar">
|
||||
|
||||
<!-- Dropdown item -->
|
||||
<div class="dropdown dropdown-fixed">
|
||||
<button
|
||||
type="button"
|
||||
class="btn tb-icon tb-formatting"
|
||||
title="Formatting"
|
||||
data-toggle="dropdown"
|
||||
data-control="tooltip"
|
||||
data-placement="bottom"
|
||||
data-container="body"></button>
|
||||
<ul class="dropdown-menu" data-dropdown-title="Formatting">
|
||||
<li><a href="#" rel="quote" tabindex="-1" class="oc-icon-quote-right">Quote</a></li>
|
||||
<li><a href="#" rel="code" tabindex="-1" class="oc-icon-code">Code</a></li>
|
||||
<li><a href="#" rel="header1" tabindex="-1" class="oc-icon-header">Header 1</a></li>
|
||||
<li><a href="#" rel="header2" tabindex="-1" class="oc-icon-header">Header 2</a></li>
|
||||
<li><a href="#" rel="header3" tabindex="-1" class="oc-icon-header">Header 3</a></li>
|
||||
<li><a href="#" rel="header4" tabindex="-1" class="oc-icon-header">Header 4</a></li>
|
||||
<li><a href="#" rel="header5" tabindex="-1" class="oc-icon-header">Header 5</a></li>
|
||||
<li><a href="#" rel="header6" tabindex="-1" class="oc-icon-header">Header 6</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- Item with tooltip -->
|
||||
<button
|
||||
type="button"
|
||||
class="btn tb-icon tb-bold"
|
||||
title="Bold"
|
||||
data-control="tooltip"
|
||||
data-placement="bottom"
|
||||
data-container="body"></button>
|
||||
|
||||
<!-- Disabled item -->
|
||||
<button type="button" disabled class="btn tb-icon tb-italic"></button>
|
||||
|
||||
<button type="button" class="btn tb-icon tb-unorderedlist"></button>
|
||||
<button type="button" class="btn tb-icon tb-orderedlist"></button>
|
||||
<button type="button" class="btn tb-icon tb-link"></button>
|
||||
<button type="button" class="btn tb-icon tb-horizontalrule"></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layout-cell toolbar-item width-fix">
|
||||
<button type="button" class="btn oc-icon-eye"></button>
|
||||
<button type="button" class="btn oc-icon-expand"></button>
|
||||
</div>
|
||||
</div>
|
||||
@ -116,9 +116,9 @@
|
||||
|
||||
$dropdown.css({
|
||||
position: 'fixed',
|
||||
top: position.top - $(window).scrollTop() + $target.outerHeight(),
|
||||
top: position.top - 1 - $(window).scrollTop() + $target.outerHeight(),
|
||||
left: position.left
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
$(document).on('shown.bs.dropdown', '.dropdown.dropdown-fixed', function(event, eventData) {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user