From 36750a6a4a05a28980d46cf895faf50ef35fb5dc Mon Sep 17 00:00:00 2001 From: Volpeon Date: Mon, 30 Oct 2023 17:01:45 +0100 Subject: Fix badge + action button combo --- src/objects/_badge.scss | 2 ++ tpl/objects/badge.pug | 8 ++++++-- tpl/views/action-button.pug | 9 +++++++++ tpl/views/badge.pug | 8 ++++---- 4 files changed, 21 insertions(+), 6 deletions(-) diff --git a/src/objects/_badge.scss b/src/objects/_badge.scss index bb23f7e..eebf136 100644 --- a/src/objects/_badge.scss +++ b/src/objects/_badge.scss @@ -77,6 +77,8 @@ @include iro.bem-object(iro.props-namespace()) { display: inline-block; + margin-top: -.5em; + margin-bottom: -.5em; padding: fn.dim(--pad-y) fn.dim(--pad-x); border-radius: fn.dim(--rounding); background-color: fn.color(--bg); diff --git a/tpl/objects/badge.pug b/tpl/objects/badge.pug index 53e972c..04fd8eb 100644 --- a/tpl/objects/badge.pug +++ b/tpl/objects/badge.pug @@ -12,5 +12,9 @@ mixin badge(variant) classes['o-badge--' + variant] = true } - a(href="#", class=classes) - block + if attributes.href + a(href=attributes.href class=classes) + block + else + span(class=classes) + block diff --git a/tpl/views/action-button.pug b/tpl/views/action-button.pug index 7bffe72..faa53bc 100644 --- a/tpl/views/action-button.pug +++ b/tpl/views/action-button.pug @@ -53,3 +53,12 @@ mixin view-action-button +action-button(quiet=true icon='trash' disabled=true) = ' ' +action-button(quiet=true icon='trash' selected=true disabled=true) + + .c-box + +action-button= 'Idle' + = ' ' + +action-button(icon='trash') + = ' ' + +action-button + = 'Idle' + +badge('primary')= '12' diff --git a/tpl/views/badge.pug b/tpl/views/badge.pug index 4c44af2..d4ca4b0 100644 --- a/tpl/views/badge.pug +++ b/tpl/views/badge.pug @@ -9,13 +9,13 @@ mixin view-badge = ' ' +badge('accent-quiet')= 'new' = ' ' - +badge(size=200)= '100' + +badge(size=200 href='#')= '100' = ' ' - +badge('primary')(size=200)= 'new' + +badge('primary')(size=200 href='#')= 'new' = ' ' - +badge('accent')(size=200)= 'new' + +badge('accent')(size=200 href='#')= 'new' = ' ' - +badge('accent-quiet')(size=200)= 'new' + +badge('accent-quiet')(size=200 href='#')= 'new' .c-box +badge(pill=true)= '100' -- cgit v1.2.3-70-g09d2