import hbs from 'htmlbars-inline-precompile';
export default {
title: 'Components/Inline Definitions',
};
export let Standard = () => {
return {
template: hbs`
Inline definitions
Some Label
Term Name
Term Value
Running?
Yes
Last Updated
{{format-ts (now)}}
A way to tightly display key/value information. Typically seen at the top of pages.
`,
};
};
export let Variants = () => {
return {
template: hbs`
Inline definitions variants
Success Label
Term Name
Term Value
Last Updated
{{format-ts (now)}}
Warning Label
Term Name
Term Value
Last Updated
{{format-ts (now)}}
Danger Label
Term Name
Term Value
Last Updated
{{format-ts (now)}}
Info Label
Term Name
Term Value
Last Updated
{{format-ts (now)}}
Inline definitions are meant to pair well with emotive color variations.
`,
};
};