diff options
| author | Volpeon <git@volpeon.ink> | 2024-06-24 22:05:17 +0200 |
|---|---|---|
| committer | Volpeon <git@volpeon.ink> | 2024-06-24 22:05:17 +0200 |
| commit | d94b62be5d36acecbd9f8e50ba4a8011856b28cd (patch) | |
| tree | 4b7ae45d7aa25f331c4e3c664ac6c6a8ae0de8dd /tpl | |
| parent | Add static button themes (diff) | |
| download | iro-design-d94b62be5d36acecbd9f8e50ba4a8011856b28cd.tar.gz iro-design-d94b62be5d36acecbd9f8e50ba4a8011856b28cd.tar.bz2 iro-design-d94b62be5d36acecbd9f8e50ba4a8011856b28cd.zip | |
Add static divider styles
Diffstat (limited to 'tpl')
| -rw-r--r-- | tpl/views/divider.pug | 59 |
1 files changed, 20 insertions, 39 deletions
diff --git a/tpl/views/divider.pug b/tpl/views/divider.pug index 43a538c..ee7b372 100644 --- a/tpl/views/divider.pug +++ b/tpl/views/divider.pug | |||
| @@ -23,42 +23,23 @@ mixin view-divider | |||
| 23 | +divider('medium') | 23 | +divider('medium') |
| 24 | +divider('faint') | 24 | +divider('faint') |
| 25 | 25 | ||
| 26 | .c-box | 26 | each theme in ['blue', 'purple', 'red', 'green', 'yellow'] |
| 27 | +divider('strong')(color='blue')= 'Strong' | 27 | .c-box |
| 28 | +divider('medium')(color='blue')= 'Medium' | 28 | +divider('strong')(color=theme)= 'Strong' |
| 29 | +divider('faint')(color='blue')= 'Faint' | 29 | +divider('medium')(color=theme)= 'Medium' |
| 30 | +divider('strong')(color='blue') | 30 | +divider('faint')(color=theme)= 'Faint' |
| 31 | +divider('medium')(color='blue') | 31 | +divider('strong')(color=theme) |
| 32 | +divider('faint')(color='blue') | 32 | +divider('medium')(color=theme) |
| 33 | 33 | +divider('faint')(color=theme) | |
| 34 | .c-box | 34 | |
| 35 | +divider('strong')(color='purple')= 'Strong' | 35 | each theme in ['static-black', 'static-white'] |
| 36 | +divider('medium')(color='purple')= 'Medium' | 36 | - |
| 37 | +divider('faint')(color='purple')= 'Faint' | 37 | const bg = theme.startsWith('static-black') ? 500 : 1000; |
| 38 | +divider('strong')(color='purple') | 38 | |
| 39 | +divider('medium')(color='purple') | 39 | .c-box(style=`background-color: var(--colors--blue-static--${bg});`) |
| 40 | +divider('faint')(color='purple') | 40 | +divider('strong')(color=theme)= 'Strong' |
| 41 | 41 | +divider('medium')(color=theme)= 'Medium' | |
| 42 | .c-box | 42 | +divider('faint')(color=theme)= 'Faint' |
| 43 | +divider('strong')(color='red')= 'Strong' | 43 | +divider('strong')(color=theme) |
| 44 | +divider('medium')(color='red')= 'Medium' | 44 | +divider('medium')(color=theme) |
| 45 | +divider('faint')(color='red')= 'Faint' | 45 | +divider('faint')(color=theme) |
| 46 | +divider('strong')(color='red') | ||
| 47 | +divider('medium')(color='red') | ||
| 48 | +divider('faint')(color='red') | ||
| 49 | |||
| 50 | .c-box | ||
| 51 | +divider('strong')(color='green')= 'Strong' | ||
| 52 | +divider('medium')(color='green')= 'Medium' | ||
| 53 | +divider('faint')(color='green')= 'Faint' | ||
| 54 | +divider('strong')(color='green') | ||
| 55 | +divider('medium')(color='green') | ||
| 56 | +divider('faint')(color='green') | ||
| 57 | |||
| 58 | .c-box | ||
| 59 | +divider('strong')(color='yellow')= 'Strong' | ||
| 60 | +divider('medium')(color='yellow')= 'Medium' | ||
| 61 | +divider('faint')(color='yellow')= 'Faint' | ||
| 62 | +divider('strong')(color='yellow') | ||
| 63 | +divider('medium')(color='yellow') | ||
| 64 | +divider('faint')(color='yellow') | ||