mirror of
https://github.com/kemko/nomad.git
synced 2026-01-04 17:35:43 +03:00
Add breadcrumbs to the styleguide
This commit is contained in:
33
ui/app/templates/components/freestyle/sg-breadcrumbs.hbs
Normal file
33
ui/app/templates/components/freestyle/sg-breadcrumbs.hbs
Normal file
@@ -0,0 +1,33 @@
|
||||
{{#freestyle-usage 'breadcrumbs-standard' title='Standard Breadcrumbs'}}
|
||||
<div class="navbar is-secondary">
|
||||
<div class="navbar-item"></div>
|
||||
<nav class="breadcrumb is-large">
|
||||
<li>
|
||||
<a href="#">Topic</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">Sub-topic</a>
|
||||
</li>
|
||||
<li class="is-active">
|
||||
<a href="#">Active Topic</a>
|
||||
</li>
|
||||
</nav>
|
||||
</div>
|
||||
{{/freestyle-usage}}
|
||||
{{#freestyle-annotation}}
|
||||
Breadcrumbs are only ever used in the secondary nav of the primary header.
|
||||
{{/freestyle-annotation}}
|
||||
|
||||
{{#freestyle-usage 'breadcrumbs-single' title='Single Breadcrumb'}}
|
||||
<div class="navbar is-secondary">
|
||||
<div class="navbar-item"></div>
|
||||
<nav class="breadcrumb is-large">
|
||||
<li>
|
||||
<a href="#">Topic</a>
|
||||
</li>
|
||||
</nav>
|
||||
</div>
|
||||
{{/freestyle-usage}}
|
||||
{{#freestyle-annotation}}
|
||||
Breadcrumbs are given a lot of emphasis and often double as a page title. Since they are also global state, they are important for helping a user keep their bearings.
|
||||
{{/freestyle-annotation}}
|
||||
@@ -18,11 +18,15 @@
|
||||
{{#section.subsection name="Boxed section"}}
|
||||
{{freestyle/sg-boxed-section}}
|
||||
{{/section.subsection}}
|
||||
|
||||
{{#section.subsection name="Breadcrumbs"}}
|
||||
{{freestyle/sg-breadcrumbs}}
|
||||
{{/section.subsection}}
|
||||
|
||||
{{#section.subsection name="Buttons"}}
|
||||
{{freestyle/sg-buttons}}
|
||||
{{/section.subsection}}
|
||||
|
||||
{{#section.subsection name="Diff Viewer"}}
|
||||
{{/section.subsection}}
|
||||
{{#section.subsection name="Dropdown"}}
|
||||
|
||||
Reference in New Issue
Block a user