From d94b62be5d36acecbd9f8e50ba4a8011856b28cd Mon Sep 17 00:00:00 2001 From: Volpeon Date: Mon, 24 Jun 2024 22:05:17 +0200 Subject: Add static divider styles --- tpl/views/divider.pug | 59 +++++++++++++++++---------------------------------- 1 file changed, 20 insertions(+), 39 deletions(-) (limited to 'tpl/views/divider.pug') 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 +divider('medium') +divider('faint') - .c-box - +divider('strong')(color='blue')= 'Strong' - +divider('medium')(color='blue')= 'Medium' - +divider('faint')(color='blue')= 'Faint' - +divider('strong')(color='blue') - +divider('medium')(color='blue') - +divider('faint')(color='blue') - - .c-box - +divider('strong')(color='purple')= 'Strong' - +divider('medium')(color='purple')= 'Medium' - +divider('faint')(color='purple')= 'Faint' - +divider('strong')(color='purple') - +divider('medium')(color='purple') - +divider('faint')(color='purple') - - .c-box - +divider('strong')(color='red')= 'Strong' - +divider('medium')(color='red')= 'Medium' - +divider('faint')(color='red')= 'Faint' - +divider('strong')(color='red') - +divider('medium')(color='red') - +divider('faint')(color='red') - - .c-box - +divider('strong')(color='green')= 'Strong' - +divider('medium')(color='green')= 'Medium' - +divider('faint')(color='green')= 'Faint' - +divider('strong')(color='green') - +divider('medium')(color='green') - +divider('faint')(color='green') - - .c-box - +divider('strong')(color='yellow')= 'Strong' - +divider('medium')(color='yellow')= 'Medium' - +divider('faint')(color='yellow')= 'Faint' - +divider('strong')(color='yellow') - +divider('medium')(color='yellow') - +divider('faint')(color='yellow') + each theme in ['blue', 'purple', 'red', 'green', 'yellow'] + .c-box + +divider('strong')(color=theme)= 'Strong' + +divider('medium')(color=theme)= 'Medium' + +divider('faint')(color=theme)= 'Faint' + +divider('strong')(color=theme) + +divider('medium')(color=theme) + +divider('faint')(color=theme) + + each theme in ['static-black', 'static-white'] + - + const bg = theme.startsWith('static-black') ? 500 : 1000; + + .c-box(style=`background-color: var(--colors--blue-static--${bg});`) + +divider('strong')(color=theme)= 'Strong' + +divider('medium')(color=theme)= 'Medium' + +divider('faint')(color=theme)= 'Faint' + +divider('strong')(color=theme) + +divider('medium')(color=theme) + +divider('faint')(color=theme) -- cgit v1.2.3-70-g09d2