summaryrefslogtreecommitdiff
path: root/views/css/frontend.css
diff options
context:
space:
mode:
authordaniel <noreply@maennchen1.de>2026-09-18 08:48:54 +0200
committerdaniel <noreply@maennchen1.de>2026-09-18 08:48:54 +0200
commitacae386f25f9d27a6b7576a019197e7e0b320dc7 (patch)
tree4bd7ea10aa5788b0b4b9374770da0cbeb4b5ffa0 /views/css/frontend.css
parentdcfb01e514b41f8b09d0a994b3ee9297b0474ecd (diff)
- Feature: GARAN Label im Produkt/Produkttemplate eingeführt
Diffstat (limited to 'views/css/frontend.css')
-rw-r--r--views/css/frontend.css37
1 files changed, 37 insertions, 0 deletions
diff --git a/views/css/frontend.css b/views/css/frontend.css
index e5f9f3b..49ae1d0 100644
--- a/views/css/frontend.css
+++ b/views/css/frontend.css
@@ -30,6 +30,43 @@ input.wpsg_error { border-color:red !important; border:1px solid red; }
textarea#wpsg_checkout_comment { padding:0.75em 1em; font-family:inherit; }
}
+/* GARAN Label */
+.wpsg_product_garan_wrap { padding:5px 0; margin-bottom:1rem; font-family:'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
+ .wpsg_product_garan { border:1px solid black; display:inline-block; padding:5px 50px 5px 5px; position:relative; height:30px; white-space:nowrap; cursor:pointer; text-decoration:none;
+ & > .years { font-size:30px; height:30px; line-height:30px; font-weight:bold; padding-right:35px; position:relative; border-right:1px solid black;
+ &:after { position:absolute; right:10px; bottom:8px; content:' '; width:16px; height:16px; background-image:url('/wp-content/plugins/wpshopgermany-free/views/gfx/garan/garan_year.svg'); background-size:contain; background-repeat:no-repeat; }
+ }
+ & > .title { padding-left:5px; font-size:22px; font-weight:bold; padding-right:20px; position:relative;
+ &:after { position:absolute; right:0; bottom:2px; content:' '; width:16px; height:16px; background-image:url('/wp-content/plugins/wpshopgermany-free/views/gfx/garan/garan_checkmark.svg'); background-size:contain; background-repeat:no-repeat; }
+ }
+ &:after { position:absolute; right:5px; top:0; content:' '; width:28px; height:40px; background-image:url('/wp-content/plugins/wpshopgermany-free/views/gfx/garan/garan_eu.svg'); background-size:contain; background-repeat:no-repeat; }
+ & > .tooltip { position:absolute; opacity:0; pointer-events:none; top:40px; left:-1px; padding:5px 5px 5px 0; transition:all 0.5s;
+ & > .inner { width:300px; min-height:300px; display:flex; flex-direction:column; gap:5px; background-color:white; padding:5px; border:1px solid black;
+ & > .border { border:1px solid black; display:flex; flex-direction:column; padding:5px;
+ .top { width:100%; border-bottom:2px solid black; padding-bottom:5px; position:relative;
+ & > .title { font-size:50px; font-weight:bold; padding-right:40px; position:relative; display:inline-block; line-height:50px; letter-spacing:1px;
+ &:after { position:absolute; right:0; bottom:5px; content:' '; width:32px; height:32px; background-image:url('/wp-content/plugins/wpshopgermany-free/views/gfx/garan/garan_checkmark.svg'); background-size:contain; background-position:right bottom; background-repeat:no-repeat; }
+ }
+ &:after { position:absolute; right:0; top:-11px; content:' '; width:36px; height:51px; background-image:url('/wp-content/plugins/wpshopgermany-free/views/gfx/garan/garan_eu.svg'); background-size:contain; background-repeat:no-repeat; }
+ }
+ & > .flexline { display:flex; justify-content:space-between; gap:5px; align-items:flex-start; padding:5px 0; font-size:16px; }
+ & > .line { display:flex; justify-content:space-between; gap:5px; align-items:flex-end; padding:5px 0;
+ & > .years { font-size:85px; height:85px; line-height:85px; font-weight:bold; padding-right:60px; position:relative;
+ &:after { position:absolute; right:10px; bottom:8px; content:' '; width:35px; height:35px; background-image:url('/wp-content/plugins/wpshopgermany-free/views/gfx/garan/garan_year.svg'); background-size:contain; background-repeat:no-repeat; }
+ }
+ & > img { transform:translateY(-8px); }
+ }
+ & > .trans_wrap { display:block; white-space:normal; text-align:justify; hyphens:auto; font-size:8px; line-height:1.4;
+ & > span + span:before { content:'|'; padding-right:1px; }
+ strong { font-weight:bold; }
+ }
+ }
+ }
+ }
+ &:hover > .tooltip { opacity:1; pointer-events:all; z-index:1; }
+ }
+}
+
/* Basket Widget */
.wpsg_basket_widget .wpshopgermany_linktokasse { float:right; margin-top:1rem; }