diff options
| author | Volpeon <git@volpeon.ink> | 2025-07-27 13:21:57 +0200 |
|---|---|---|
| committer | Volpeon <git@volpeon.ink> | 2025-07-27 13:21:57 +0200 |
| commit | 3c59a39f5b6eb15b368bea1ad74e3222858c35ef (patch) | |
| tree | 8cec0e01a56d7c7388d4a2e990c9b4a866705df1 /tpl/views | |
| parent | Add option for explicit dark theme (diff) | |
| download | iro-design-3c59a39f5b6eb15b368bea1ad74e3222858c35ef.tar.gz iro-design-3c59a39f5b6eb15b368bea1ad74e3222858c35ef.tar.bz2 iro-design-3c59a39f5b6eb15b368bea1ad74e3222858c35ef.zip | |
Add highlighted state to button
Diffstat (limited to 'tpl/views')
| -rw-r--r-- | tpl/views/button.pug | 24 |
1 files changed, 24 insertions, 0 deletions
diff --git a/tpl/views/button.pug b/tpl/views/button.pug index 2e54458..4b8c59f 100644 --- a/tpl/views/button.pug +++ b/tpl/views/button.pug | |||
| @@ -71,6 +71,8 @@ mixin view-button | |||
| 71 | .c-box | 71 | .c-box |
| 72 | +button= 'Idle' | 72 | +button= 'Idle' |
| 73 | = ' ' | 73 | = ' ' |
| 74 | +button(highlighted=true)= 'Highlighted' | ||
| 75 | = ' ' | ||
| 74 | +button(selected=true)= 'Selected' | 76 | +button(selected=true)= 'Selected' |
| 75 | = ' ' | 77 | = ' ' |
| 76 | +button(disabled=true)= 'Disabled' | 78 | +button(disabled=true)= 'Disabled' |
| @@ -80,6 +82,8 @@ mixin view-button | |||
| 80 | br | 82 | br |
| 81 | +button(badge=true)= 'Idle' | 83 | +button(badge=true)= 'Idle' |
| 82 | = ' ' | 84 | = ' ' |
| 85 | +button(badge=true highlighted=true)= 'Highlighted' | ||
| 86 | = ' ' | ||
| 83 | +button(badge=true selected=true)= 'Selected' | 87 | +button(badge=true selected=true)= 'Selected' |
| 84 | = ' ' | 88 | = ' ' |
| 85 | +button(badge=true disabled=true)= 'Disabled' | 89 | +button(badge=true disabled=true)= 'Disabled' |
| @@ -89,6 +93,8 @@ mixin view-button | |||
| 89 | br | 93 | br |
| 90 | +button(quiet=true)= 'Idle' | 94 | +button(quiet=true)= 'Idle' |
| 91 | = ' ' | 95 | = ' ' |
| 96 | +button(quiet=true highlighted=true)= 'Highlighted' | ||
| 97 | = ' ' | ||
| 92 | +button(quiet=true selected=true)= 'Selected' | 98 | +button(quiet=true selected=true)= 'Selected' |
| 93 | = ' ' | 99 | = ' ' |
| 94 | +button(quiet=true disabled=true)= 'Disabled' | 100 | +button(quiet=true disabled=true)= 'Disabled' |
| @@ -98,6 +104,8 @@ mixin view-button | |||
| 98 | .c-box | 104 | .c-box |
| 99 | +button(pill=true)= 'Idle' | 105 | +button(pill=true)= 'Idle' |
| 100 | = ' ' | 106 | = ' ' |
| 107 | +button(pill=true highlighted=true)= 'Highlighted' | ||
| 108 | = ' ' | ||
| 101 | +button(pill=true selected=true)= 'Selected' | 109 | +button(pill=true selected=true)= 'Selected' |
| 102 | = ' ' | 110 | = ' ' |
| 103 | +button(pill=true disabled=true)= 'Disabled' | 111 | +button(pill=true disabled=true)= 'Disabled' |
| @@ -107,6 +115,8 @@ mixin view-button | |||
| 107 | br | 115 | br |
| 108 | +button(pill=true badge=true)= 'Idle' | 116 | +button(pill=true badge=true)= 'Idle' |
| 109 | = ' ' | 117 | = ' ' |
| 118 | +button(pill=true badge=true highlighted=true)= 'Highlighted' | ||
| 119 | = ' ' | ||
| 110 | +button(pill=true badge=true selected=true)= 'Selected' | 120 | +button(pill=true badge=true selected=true)= 'Selected' |
| 111 | = ' ' | 121 | = ' ' |
| 112 | +button(pill=true badge=true disabled=true)= 'Disabled' | 122 | +button(pill=true badge=true disabled=true)= 'Disabled' |
| @@ -116,6 +126,8 @@ mixin view-button | |||
| 116 | br | 126 | br |
| 117 | +button(pill=true quiet=true)= 'Idle' | 127 | +button(pill=true quiet=true)= 'Idle' |
| 118 | = ' ' | 128 | = ' ' |
| 129 | +button(pill=true quiet=true highlighted=true)= 'Highlighted' | ||
| 130 | = ' ' | ||
| 119 | +button(pill=true quiet=true selected=true)= 'Selected' | 131 | +button(pill=true quiet=true selected=true)= 'Selected' |
| 120 | = ' ' | 132 | = ' ' |
| 121 | +button(pill=true quiet=true disabled=true)= 'Disabled' | 133 | +button(pill=true quiet=true disabled=true)= 'Disabled' |
| @@ -126,6 +138,8 @@ mixin view-button | |||
| 126 | .c-box | 138 | .c-box |
| 127 | +button(theme=theme)= 'Idle' | 139 | +button(theme=theme)= 'Idle' |
| 128 | = ' ' | 140 | = ' ' |
| 141 | +button(theme=theme highlighted=true)= 'Highlighted' | ||
| 142 | = ' ' | ||
| 129 | +button(theme=theme selected=true)= 'Selected' | 143 | +button(theme=theme selected=true)= 'Selected' |
| 130 | = ' ' | 144 | = ' ' |
| 131 | +button(theme=theme disabled=true)= 'Disabled' | 145 | +button(theme=theme disabled=true)= 'Disabled' |
| @@ -135,6 +149,8 @@ mixin view-button | |||
| 135 | br | 149 | br |
| 136 | +button(theme=theme badge=true)= 'Idle' | 150 | +button(theme=theme badge=true)= 'Idle' |
| 137 | = ' ' | 151 | = ' ' |
| 152 | +button(theme=theme badge=true highlighted=true)= 'Highlighted' | ||
| 153 | = ' ' | ||
| 138 | +button(theme=theme badge=true selected=true)= 'Selected' | 154 | +button(theme=theme badge=true selected=true)= 'Selected' |
| 139 | = ' ' | 155 | = ' ' |
| 140 | +button(theme=theme badge=true disabled=true)= 'Disabled' | 156 | +button(theme=theme badge=true disabled=true)= 'Disabled' |
| @@ -144,6 +160,8 @@ mixin view-button | |||
| 144 | br | 160 | br |
| 145 | +button(theme=theme quiet=true)= 'Idle' | 161 | +button(theme=theme quiet=true)= 'Idle' |
| 146 | = ' ' | 162 | = ' ' |
| 163 | +button(theme=theme quiet=true highlighted=true)= 'Highlighted' | ||
| 164 | = ' ' | ||
| 147 | +button(theme=theme quiet=true selected=true)= 'Selected' | 165 | +button(theme=theme quiet=true selected=true)= 'Selected' |
| 148 | = ' ' | 166 | = ' ' |
| 149 | +button(theme=theme quiet=true disabled=true)= 'Disabled' | 167 | +button(theme=theme quiet=true disabled=true)= 'Disabled' |
| @@ -157,6 +175,8 @@ mixin view-button | |||
| 157 | .c-box(style=`background-color: var(--colors--blue-static--${bg});`) | 175 | .c-box(style=`background-color: var(--colors--blue-static--${bg});`) |
| 158 | +button(theme=theme)= 'Idle' | 176 | +button(theme=theme)= 'Idle' |
| 159 | = ' ' | 177 | = ' ' |
| 178 | +button(theme=theme highlighted=true)= 'Highlighted' | ||
| 179 | = ' ' | ||
| 160 | +button(theme=theme selected=true)= 'Selected' | 180 | +button(theme=theme selected=true)= 'Selected' |
| 161 | = ' ' | 181 | = ' ' |
| 162 | +button(theme=theme disabled=true)= 'Disabled' | 182 | +button(theme=theme disabled=true)= 'Disabled' |
| @@ -166,6 +186,8 @@ mixin view-button | |||
| 166 | br | 186 | br |
| 167 | +button(theme=theme badge=true)= 'Idle' | 187 | +button(theme=theme badge=true)= 'Idle' |
| 168 | = ' ' | 188 | = ' ' |
| 189 | +button(theme=theme badge=true highlighted=true)= 'Highlighted' | ||
| 190 | = ' ' | ||
| 169 | +button(theme=theme badge=true selected=true)= 'Selected' | 191 | +button(theme=theme badge=true selected=true)= 'Selected' |
| 170 | = ' ' | 192 | = ' ' |
| 171 | +button(theme=theme badge=true disabled=true)= 'Disabled' | 193 | +button(theme=theme badge=true disabled=true)= 'Disabled' |
| @@ -175,6 +197,8 @@ mixin view-button | |||
| 175 | br | 197 | br |
| 176 | +button(theme=theme quiet=true)= 'Idle' | 198 | +button(theme=theme quiet=true)= 'Idle' |
| 177 | = ' ' | 199 | = ' ' |
| 200 | +button(theme=theme quiet=true highlighted=true)= 'Highlighted' | ||
| 201 | = ' ' | ||
| 178 | +button(theme=theme quiet=true selected=true)= 'Selected' | 202 | +button(theme=theme quiet=true selected=true)= 'Selected' |
| 179 | = ' ' | 203 | = ' ' |
| 180 | +button(theme=theme quiet=true disabled=true)= 'Disabled' | 204 | +button(theme=theme quiet=true disabled=true)= 'Disabled' |