kemko/nomad
1
0
Fork 0
mirror of https://github.com/kemko/nomad.git synced 2026-01-06 18:35:44 +03:00
Code Issues Packages Projects Releases Wiki Activity

Styleguide entries for accordion

Browse Source
This commit is contained in:
Michael Lange
2018-07-03 14:30:40 -07:00
parent ae4a319fc3
commit 2c10e8ad2e
5 changed files with 105 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
ui/app/components/freestyle/sg-accordion.js Normal file
View File

@@ -0,0 +1,6 @@
import Component from '@ember/component';
import productMetadata from 'nomad-ui/utils/styleguide/product-metadata';
export default Component.extend({
products: productMetadata,
});

45
ui/app/components/freestyle/sg-table.js
View File

@@ -1,5 +1,6 @@
import Component from '@ember/component';
import { computed } from '@ember/object';
import productMetadata from 'nomad-ui/utils/styleguide/product-metadata';
export default Component.extend({
searchTerm: '',
@@ -8,49 +9,7 @@ export default Component.extend({
sortProperty: 'name',
sortDescending: false,
shortList: [
{
name: 'Nomad',
lang: 'golang',
desc:
'Nomad is a flexible, enterprise-grade cluster scheduler designed to easily integrate into existing workflows. Nomad can run a diverse workload of micro-service, batch, containerized and non-containerized applications.',
link: 'https://www.nomadproject.io/',
},
{
name: 'Terraform',
lang: 'golang',
desc:
'Terraform is a tool for building, changing, and combining infrastructure safely and efficiently.',
link: 'https://www.terraform.io/',
},
{
name: 'Vault',
lang: 'golang',
desc:
'A tool for secrets management, encryption as a service, and privileged access management',
link: 'https://www.vaultproject.io/',
},
{
name: 'Consul',
lang: 'golang',
desc:
'Consul is a distributed, highly available, and data center aware solution to connect and configure applications across dynamic, distributed infrastructure.',
link: 'https://www.consul.io/',
},
{
name: 'Vagrant',
lang: 'ruby',
desc: 'Vagrant is a tool for building and distributing development environments.',
link: 'https://www.vagrantup.com/',
},
{
name: 'Packer',
lang: 'golang',
desc:
'Packer is a tool for creating identical machine images for multiple platforms from a single source configuration.',
link: 'https://www.packer.io/',
},
],
shortList: productMetadata,
longList: [
{ city: 'New York', growth: 0.048, population: '8405837', rank: '1', state: 'New York' },

53
ui/app/templates/components/freestyle/sg-accordion.hbs Normal file
View File

@@ -0,0 +1,53 @@
{{#freestyle-usage "accordion" title="Accordion"}}
{{#list-accordion source=products key="name" as |a|}}
{{#a.head buttonLabel="details"}}
<div class="columns inline-definitions">
<div class="column is-1">{{a.item.name}}</div>
<div class="column is-1">
<span class="bumper-left badge is-light">{{a.item.lang}}</span>
</div>
</div>
{{/a.head}}
{{#a.body}}
<h1 class="title is-4">{{a.item.name}}</h1>
<p>{{a.item.desc}}</p>
<p><a href="{{a.item.link}}">Learn more...</a></p>
{{/a.body}}
{{/list-accordion}}
{{/freestyle-usage}}
{{#freestyle-usage "accordion-single" title="Accordion, One Item"}}
{{#list-accordion source=(take 1 products) key="name" as |a|}}
{{#a.head buttonLabel="details"}}
<div class="columns inline-definitions">
<div class="column is-1">{{a.item.name}}</div>
<div class="column is-1">
<span class="bumper-left badge is-light">{{a.item.lang}}</span>
</div>
</div>
{{/a.head}}
{{#a.body}}
<h1 class="title is-4">{{a.item.name}}</h1>
<p>{{a.item.desc}}</p>
<p><a href="{{a.item.link}}">Learn more...</a></p>
{{/a.body}}
{{/list-accordion}}
{{/freestyle-usage}}
{{#freestyle-usage "accordion-not-expandable" title="Accordion, Not Expandable"}}
{{#list-accordion source=products key="name" as |a|}}
{{#a.head buttonLabel="details" isExpandable=(eq a.item.lang "golang")}}
<div class="columns inline-definitions">
<div class="column is-1">{{a.item.name}}</div>
<div class="column is-1">
<span class="bumper-left badge is-light">{{a.item.lang}}</span>
</div>
</div>
{{/a.head}}
{{#a.body}}
<h1 class="title is-4">{{a.item.name}}</h1>
<p>{{a.item.desc}}</p>
<p><a href="{{a.item.link}}">Learn more...</a></p>
{{/a.body}}
{{/list-accordion}}
{{/freestyle-usage}}

1
ui/app/templates/freestyle.hbs
View File

@@ -16,6 +16,7 @@
{{#freestyle-section name="Components" as |section|}}
{{#section.subsection name="Accordion"}}
{{freestyle/sg-accordion}}
{{/section.subsection}}
{{#section.subsection name="Alert"}}

43
ui/app/utils/styleguide/product-metadata.js Normal file
View File

@@ -0,0 +1,43 @@
export default [
{
name: 'Nomad',
lang: 'golang',
desc:
'Nomad is a flexible, enterprise-grade cluster scheduler designed to easily integrate into existing workflows. Nomad can run a diverse workload of micro-service, batch, containerized and non-containerized applications.',
link: 'https://www.nomadproject.io/',
},
{
name: 'Terraform',
lang: 'golang',
desc:
'Terraform is a tool for building, changing, and combining infrastructure safely and efficiently.',
link: 'https://www.terraform.io/',
},
{
name: 'Vault',
lang: 'golang',
desc:
'A tool for secrets management, encryption as a service, and privileged access management',
link: 'https://www.vaultproject.io/',
},
{
name: 'Consul',
lang: 'golang',
desc:
'Consul is a distributed, highly available, and data center aware solution to connect and configure applications across dynamic, distributed infrastructure.',
link: 'https://www.consul.io/',
},
{
name: 'Vagrant',
lang: 'ruby',
desc: 'Vagrant is a tool for building and distributing development environments.',
link: 'https://www.vagrantup.com/',
},
{
name: 'Packer',
lang: 'golang',
desc:
'Packer is a tool for creating identical machine images for multiple platforms from a single source configuration.',
link: 'https://www.packer.io/',
},
];