diff options
Diffstat (limited to 'views/css/wpsg-theme.css')
| -rw-r--r-- | views/css/wpsg-theme.css | 7 |
1 files changed, 7 insertions, 0 deletions
diff --git a/views/css/wpsg-theme.css b/views/css/wpsg-theme.css index c930e37..bc9a310 100644 --- a/views/css/wpsg-theme.css +++ b/views/css/wpsg-theme.css @@ -33,6 +33,8 @@ --wpsg-color-notice: #a66709; --wpsg-muted-opacity: 0.7; --wpsg-radius: 3px; + --wpsg-label-background: var(--wpsg-color-accent); + --wpsg-label-color: var(--wpsg-color-background); --wpsg-gap: 1rem; --wpsg-font-size-small: var(--wp--preset--font-size--small, 0.875em); --wpsg-field-border: 1px solid var(--wpsg-color-line); @@ -321,6 +323,11 @@ .wpsg-product :where(.wpsg-product__breadcrumbs ol) { display:flex; flex-wrap:wrap; gap:0.25em 0.5em; margin:0; padding:0; list-style:none; } .wpsg-product :where(.wpsg-product__breadcrumbs li + li)::before { content:"/" / ""; margin-right:0.5em; opacity:var(--wpsg-muted-opacity); } .wpsg-product :where(.wpsg-product__breadcrumbs a, .wpsg-product__breadcrumbs [aria-current]) { color:inherit; opacity:var(--wpsg-muted-opacity); } +.wpsg-labels { display:flex; flex-wrap:wrap; gap:0.4em; } +:where(.wpsg-label) { display:inline-block; width:fit-content; padding:0.125rem 0.625rem; border-radius:999px; background:var(--wpsg-label-background); color:var(--wpsg-label-color); font-size:var(--wpsg-font-size-small); font-weight:700; line-height:1.6; } +.wpsg-product :where(.wpsg-product__details > .wpsg-labels) { margin-bottom:0.75em; } +.wpsg-block-product-list :where(.wpsg-product-list__item) { position:relative; } +.wpsg-block-product-list :where(.wpsg-product-list__image + .wpsg-labels) { position:absolute; top:0.5em; left:0.5em; } .wpsg-product :where(.wpsg-product__main) { display:flex; flex-wrap:wrap; align-items:flex-start; gap:calc(var(--wpsg-gap) * 2.5); } .wpsg-product :where(.wpsg-product__media) { flex:1 1 22rem; min-width:0; float:none; margin:0; } .wpsg-product :where(.wpsg-product__media .wpsg_produkt_produktbilder) { max-width:none; } |