diff options
Diffstat (limited to 'tpl/views/action-button.pug')
| -rw-r--r-- | tpl/views/action-button.pug | 109 |
1 files changed, 0 insertions, 109 deletions
diff --git a/tpl/views/action-button.pug b/tpl/views/action-button.pug deleted file mode 100644 index 8fbf9ea..0000000 --- a/tpl/views/action-button.pug +++ /dev/null | |||
| @@ -1,109 +0,0 @@ | |||
| 1 | mixin view-action-button | ||
| 2 | +view('action-button', 'Action button') | ||
| 3 | .c-box | ||
| 4 | +action-button(size='sm')= 'Idle' | ||
| 5 | = ' ' | ||
| 6 | +action-button= 'Idle' | ||
| 7 | = ' ' | ||
| 8 | +action-button(size='lg')= 'Idle' | ||
| 9 | = ' ' | ||
| 10 | +action-button(size='xl')= 'Idle' | ||
| 11 | |||
| 12 | .c-box | ||
| 13 | +action-button(icon='trash' size='sm') | ||
| 14 | = ' ' | ||
| 15 | +action-button(icon='trash') | ||
| 16 | = ' ' | ||
| 17 | +action-button(icon='trash' size='lg') | ||
| 18 | = ' ' | ||
| 19 | +action-button(icon='trash' size='xl') | ||
| 20 | |||
| 21 | .c-box | ||
| 22 | +action-button(pill=true size='sm')= 'Idle' | ||
| 23 | = ' ' | ||
| 24 | +action-button(pill=true)= 'Idle' | ||
| 25 | = ' ' | ||
| 26 | +action-button(pill=true size='lg')= 'Idle' | ||
| 27 | = ' ' | ||
| 28 | +action-button(pill=true size='xl')= 'Idle' | ||
| 29 | |||
| 30 | .c-box | ||
| 31 | +action-button(pill=true icon='trash' size='sm') | ||
| 32 | = ' ' | ||
| 33 | +action-button(pill=true icon='trash') | ||
| 34 | = ' ' | ||
| 35 | +action-button(pill=true icon='trash' size='lg') | ||
| 36 | = ' ' | ||
| 37 | +action-button(pill=true icon='trash' size='xl') | ||
| 38 | |||
| 39 | .c-box | ||
| 40 | +action-button= 'Label' | ||
| 41 | = ' ' | ||
| 42 | +action-button(icon='trash')= 'Label' | ||
| 43 | = ' ' | ||
| 44 | +action-button(icon='trash') | ||
| 45 | |||
| 46 | .c-box | ||
| 47 | +action-button(quiet=true)= 'Label' | ||
| 48 | = ' ' | ||
| 49 | +action-button(quiet=true icon='trash')= 'Label' | ||
| 50 | = ' ' | ||
| 51 | +action-button(quiet=true icon='trash') | ||
| 52 | |||
| 53 | .c-box | ||
| 54 | +action-button= 'Idle' | ||
| 55 | = ' ' | ||
| 56 | +action-button(selected=true)= 'Selected' | ||
| 57 | = ' ' | ||
| 58 | +action-button(disabled=true)= 'Disabled' | ||
| 59 | = ' ' | ||
| 60 | +action-button(selected=true disabled=true)= 'Selected + disabled' | ||
| 61 | |||
| 62 | .c-box | ||
| 63 | +action-button(quiet=true )= 'Idle' | ||
| 64 | = ' ' | ||
| 65 | +action-button(quiet=true selected=true)= 'Selected' | ||
| 66 | = ' ' | ||
| 67 | +action-button(quiet=true disabled=true)= 'Disabled' | ||
| 68 | = ' ' | ||
| 69 | +action-button(quiet=true selected=true disabled=true)= 'Selected + disabled' | ||
| 70 | |||
| 71 | .c-box | ||
| 72 | +action-button(pill=true)= 'Idle' | ||
| 73 | = ' ' | ||
| 74 | +action-button(pill=true selected=true)= 'Selected' | ||
| 75 | = ' ' | ||
| 76 | +action-button(pill=true disabled=true)= 'Disabled' | ||
| 77 | = ' ' | ||
| 78 | +action-button(pill=true selected=true disabled=true)= 'Selected + disabled' | ||
| 79 | |||
| 80 | .c-box | ||
| 81 | +action-button(pill=true quiet=true)= 'Idle' | ||
| 82 | = ' ' | ||
| 83 | +action-button(pill=true quiet=true selected=true)= 'Selected' | ||
| 84 | = ' ' | ||
| 85 | +action-button(pill=true quiet=true disabled=true)= 'Disabled' | ||
| 86 | = ' ' | ||
| 87 | +action-button(pill=true quiet=true selected=true disabled=true)= 'Selected + disabled' | ||
| 88 | |||
| 89 | each theme in ['static-black', 'static-white'] | ||
| 90 | - | ||
| 91 | const bg = theme.startsWith('static-black') ? 500 : 1000; | ||
| 92 | |||
| 93 | .c-box(style=`background-color: var(--colors--blue-static--${bg});`) | ||
| 94 | +action-button(theme=theme)= 'Idle' | ||
| 95 | = ' ' | ||
| 96 | +action-button(theme=theme selected=true)= 'Selected' | ||
| 97 | = ' ' | ||
| 98 | +action-button(theme=theme disabled=true)= 'Disabled' | ||
| 99 | = ' ' | ||
| 100 | +action-button(theme=theme selected=true disabled=true)= 'Selected + disabled' | ||
| 101 | |||
| 102 | .c-box(style=`background-color: var(--colors--blue-static--${bg});`) | ||
| 103 | +action-button(theme=theme quiet=true)= 'Idle' | ||
| 104 | = ' ' | ||
| 105 | +action-button(theme=theme quiet=true selected=true)= 'Selected' | ||
| 106 | = ' ' | ||
| 107 | +action-button(theme=theme quiet=true disabled=true)= 'Disabled' | ||
| 108 | = ' ' | ||
| 109 | +action-button(theme=theme quiet=true selected=true disabled=true)= 'Selected + disabled' | ||