diff options
Diffstat (limited to 'tpl')
| -rw-r--r-- | tpl/objects/button.pug | 6 | ||||
| -rw-r--r-- | tpl/views/button.pug | 18 | 
2 files changed, 23 insertions, 1 deletions
| diff --git a/tpl/objects/button.pug b/tpl/objects/button.pug index 8cae2f1..e99e5ab 100644 --- a/tpl/objects/button.pug +++ b/tpl/objects/button.pug | |||
| @@ -3,7 +3,8 @@ mixin a-button | |||
| 3 | let classes = { | 3 | let classes = { | 
| 4 | 'o-button': true, | 4 | 'o-button': true, | 
| 5 | 'o-button--block': attributes.block, | 5 | 'o-button--block': attributes.block, | 
| 6 | 'o-button--outline': attributes.outline | 6 | 'o-button--outline': attributes.outline, | 
| 7 | 'o-button--round': !!attributes.icon | ||
| 7 | } | 8 | } | 
| 8 | if (attributes.variant) { | 9 | if (attributes.variant) { | 
| 9 | classes['o-button--' + attributes.variant] = true | 10 | classes['o-button--' + attributes.variant] = true | 
| @@ -12,4 +13,7 @@ mixin a-button | |||
| 12 | let href = attributes.disabled ? null : '#'; | 13 | let href = attributes.disabled ? null : '#'; | 
| 13 | 14 | ||
| 14 | a(class=classes href=href aria-disabled=attributes.disabled && String(attributes.disabled)) | 15 | a(class=classes href=href aria-disabled=attributes.disabled && String(attributes.disabled)) | 
| 16 | if attributes.icon | ||
| 17 | +icon(attributes.icon)(block=!block) | ||
| 18 | = ' ' | ||
| 15 | block | 19 | block | 
| diff --git a/tpl/views/button.pug b/tpl/views/button.pug index 9deba01..2a1bd57 100644 --- a/tpl/views/button.pug +++ b/tpl/views/button.pug | |||
| @@ -8,13 +8,31 @@ mixin view-button | |||
| 8 | +a-button(variant='accent' outline=true disabled=true)= 'Button' | 8 | +a-button(variant='accent' outline=true disabled=true)= 'Button' | 
| 9 | br | 9 | br | 
| 10 | .l-button-group | 10 | .l-button-group | 
| 11 | +a-button(variant='accent' icon='trash') | ||
| 12 | +a-button(variant='accent' disabled=true icon='trash') | ||
| 13 | +a-button(variant='accent' outline=true icon='trash') | ||
| 14 | +a-button(variant='accent' outline=true disabled=true icon='trash') | ||
| 15 | br | ||
| 16 | .l-button-group | ||
| 11 | +a-button(variant='primary')= 'Button' | 17 | +a-button(variant='primary')= 'Button' | 
| 12 | +a-button(variant='primary' disabled=true)= 'Button' | 18 | +a-button(variant='primary' disabled=true)= 'Button' | 
| 13 | +a-button(variant='primary' outline=true)= 'Button' | 19 | +a-button(variant='primary' outline=true)= 'Button' | 
| 14 | +a-button(variant='primary' outline=true disabled=true)= 'Button' | 20 | +a-button(variant='primary' outline=true disabled=true)= 'Button' | 
| 15 | br | 21 | br | 
| 16 | .l-button-group | 22 | .l-button-group | 
| 23 | +a-button(variant='primary' icon='trash') | ||
| 24 | +a-button(variant='primary' disabled=true icon='trash') | ||
| 25 | +a-button(variant='primary' outline=true icon='trash') | ||
| 26 | +a-button(variant='primary' outline=true disabled=true icon='trash') | ||
| 27 | br | ||
| 28 | .l-button-group | ||
| 17 | +a-button(variant='secondary')= 'Button' | 29 | +a-button(variant='secondary')= 'Button' | 
| 18 | +a-button(variant='secondary' disabled=true)= 'Button' | 30 | +a-button(variant='secondary' disabled=true)= 'Button' | 
| 19 | +a-button(variant='secondary' outline=true)= 'Button' | 31 | +a-button(variant='secondary' outline=true)= 'Button' | 
| 20 | +a-button(variant='secondary' outline=true disabled=true)= 'Button' | 32 | +a-button(variant='secondary' outline=true disabled=true)= 'Button' | 
| 33 | br | ||
| 34 | .l-button-group | ||
| 35 | +a-button(variant='secondary' icon='trash') | ||
| 36 | +a-button(variant='secondary' disabled=true icon='trash') | ||
| 37 | +a-button(variant='secondary' outline=true icon='trash') | ||
| 38 | +a-button(variant='secondary' outline=true disabled=true icon='trash') | ||
