mirror of
https://github.com/kemko/nomad.git
synced 2026-01-05 01:45:44 +03:00
List all available icons in a story.
This is like the same as using svg-jar, right?
This commit is contained in:
@@ -142,4 +142,24 @@
|
||||
width: 300px;
|
||||
}
|
||||
}
|
||||
|
||||
.tile-list {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.icon-tile {
|
||||
width: 240px;
|
||||
padding: 10px;
|
||||
margin: 10px;
|
||||
border: 1px solid $grey-lighter;
|
||||
border-radius: $radius;
|
||||
svg {
|
||||
margin: auto;
|
||||
width: 30px;
|
||||
height: 30;
|
||||
fill: $grey;
|
||||
color: $grey;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
18
ui/stories/theme/icons.stories.js
Normal file
18
ui/stories/theme/icons.stories.js
Normal file
@@ -0,0 +1,18 @@
|
||||
import hbs from 'htmlbars-inline-precompile';
|
||||
|
||||
export default {
|
||||
title: 'Theme|Icons',
|
||||
};
|
||||
|
||||
export let Icons = () => ({
|
||||
template: hbs`
|
||||
<ul class="tile-list">
|
||||
{{#each (all-icons) as |icon|}}
|
||||
<li class="icon-tile">
|
||||
{{x-icon icon}}
|
||||
<code>{{icon}}</code>
|
||||
</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
`,
|
||||
});
|
||||
Reference in New Issue
Block a user