summaryrefslogtreecommitdiff
path: root/views/css
diff options
context:
space:
mode:
Diffstat (limited to 'views/css')
-rw-r--r--views/css/frontend.css21
-rw-r--r--views/css/gutenberg.css4
-rw-r--r--views/css/wpsg-theme.css16
3 files changed, 36 insertions, 5 deletions
diff --git a/views/css/frontend.css b/views/css/frontend.css
index 0d7d4ff..c2354f3 100644
--- a/views/css/frontend.css
+++ b/views/css/frontend.css
@@ -704,4 +704,23 @@ html body .wpsg_product_garan_wrap a.wpsg_product_garan img { display:block; max
.wpsg_mod_prepayment_qrrechnung_left_qrcodeimg { width:240px; height:240px; }
.wpsg_mod_prepayment_qrrechnung_left_wrap { display:flex; gap:25%; }
.wpsg_mod_prepayment_qrrechnung_left_currency { display:flex; flex-direction:column; }
-.wpsg_mod_prepayment_qrrechnung_left_amount { display:flex; flex-direction:column; } \ No newline at end of file
+.wpsg_mod_prepayment_qrrechnung_left_amount { display:flex; flex-direction:column; }
+
+/* Blöcke: Produktliste, Mini-Warenkorb, Kundenkonto (seit 4.6.1, nur neue Klassen) */
+.wpsg-block-product-list .wpsg-product-list__items { display:grid; grid-template-columns:repeat(var(--wpsg-columns, 3), minmax(0, 1fr)); gap:2rem 1rem; list-style:none; margin:0; padding:0; }
+.wpsg-block-product-list .wpsg-product-list__item { display:flex; flex-direction:column; gap:0.5em; min-width:0; margin:0; padding:0; }
+.wpsg-block-product-list .wpsg-product-list__image img { display:block; width:100%; height:auto; }
+.wpsg-block-product-list .wpsg-product-list__title { margin:0; font-size:1em; line-height:1.3; overflow-wrap:anywhere; hyphens:auto; }
+.wpsg-block-product-list .wpsg-product-list__price { font-size:1.2em; }
+.wpsg-block-product-list .wpsg-product-list__taxnote,
+.wpsg-block-product-list .wpsg-product-list__baseprice { font-size:0.8em; }
+.wpsg-block-product-list .wpsg-product-list__action { margin-top:auto; padding-top:0.5em; }
+.wpsg-block-product-list .wpsg-product-list__action form { margin:0; }
+.wpsg-block-product-list .wpsg-product-list__action .wpsg_button { display:block; width:100%; margin:0; text-align:center; box-sizing:border-box; }
+.wpsg-block-mini-cart .wpsg-mini-cart__link,
+.wpsg-block-customer-account .wpsg-customer-account__link { display:inline-flex; flex-wrap:wrap; align-items:baseline; gap:0.5em; }
+.wpsg-block-mini-cart .wpsg-mini-cart__content { display:inline-flex; gap:0.5em; }
+.wpsg-block-mini-cart .wpsg-mini-cart__sum { font-weight:bold; }
+@media (max-width:600px) {
+ .wpsg-block-product-list .wpsg-product-list__items { grid-template-columns:repeat(min(var(--wpsg-columns, 3), 2), minmax(0, 1fr)); }
+}
diff --git a/views/css/gutenberg.css b/views/css/gutenberg.css
deleted file mode 100644
index c626b70..0000000
--- a/views/css/gutenberg.css
+++ /dev/null
@@ -1,4 +0,0 @@
-.wp-block-wpsg-product { background-color:#C4D100; color:#003C6A; margin:-5px; padding:10px; }
-.wp-block-wpsg-product .components-base-control__field { width:100%; display:flex; justify-content:flex-start; align-items:center; margin-bottom:0; }
-.wp-block-wpsg-product .components-base-control__field label { width:150px; }
-.wp-block-wpsg-product .components-base-control+.components-base-control { margin-bottom:0; } \ No newline at end of file
diff --git a/views/css/wpsg-theme.css b/views/css/wpsg-theme.css
index 1dec306..a0403e7 100644
--- a/views/css/wpsg-theme.css
+++ b/views/css/wpsg-theme.css
@@ -573,6 +573,20 @@ html body .wpsg_product_garan_wrap a.wpsg_product_garan img { display:block; max
.wpsg_overview :where(.garan_label_popup .garan_label_popup_image img) { max-width:100%; height:auto; }
.wpsg_overview :where(.garan_label_popup .garan_label_popup_confirm) { flex:0 0 auto; margin-top:1rem; cursor:pointer; }
+/* Blöcke: Produktliste, Mini-Warenkorb, Kundenkonto */
+.wpsg-block-product-list :where(.wpsg-product-list__items) { display:grid; grid-template-columns:repeat(var(--wpsg-columns, 3), minmax(0, 1fr)); gap:calc(var(--wpsg-gap) * 2) var(--wpsg-gap); list-style:none; margin:0; padding:0; }
+.wpsg-block-product-list :where(.wpsg-product-list__item) { display:flex; flex-direction:column; gap:0.5em; min-width:0; margin:0; padding:0; }
+.wpsg-block-product-list :where(.wpsg-product-list__image img) { display:block; width:100%; height:auto; }
+.wpsg-block-product-list :where(.wpsg-product-list__title) { margin:0; font-size:1em; line-height:1.3; overflow-wrap:anywhere; hyphens:auto; }
+.wpsg-block-product-list :where(.wpsg-product-list__price) { font-size:1.2em; }
+.wpsg-block-product-list :where(.wpsg-product-list__taxnote, .wpsg-product-list__baseprice) { font-size:var(--wpsg-font-size-small); opacity:var(--wpsg-muted-opacity); }
+.wpsg-block-product-list :where(.wpsg-product-list__action) { margin-top:auto; padding-top:0.5em; }
+.wpsg-block-product-list :where(.wpsg-product-list__action form) { margin:0; }
+.wpsg-block-product-list :where(.wpsg-product-list__action .wpsg_button) { display:block; width:100%; margin:0; text-align:center; box-sizing:border-box; }
+.wpsg-block-mini-cart :where(.wpsg-mini-cart__link), .wpsg-block-customer-account :where(.wpsg-customer-account__link) { display:inline-flex; flex-wrap:wrap; align-items:baseline; gap:0.5em; text-decoration:none; }
+.wpsg-block-mini-cart :where(.wpsg-mini-cart__content) { display:inline-flex; gap:0.5em; }
+.wpsg-block-mini-cart :where(.wpsg-mini-cart__sum) { font-weight:bold; }
+
/*
* Aufbau mit Klassen-Spezifität: Ausblenden, Ein- und Überblendungen. Allgemeine Regeln der Themes wie
* form input[type=radio] { display:inline-block } dürfen versteckte Bausteine nicht einblenden.
@@ -597,6 +611,8 @@ html body .wpsg_product_garan_wrap a.wpsg_product_garan img { display:block; max
/* Schmale Breiten */
@media (max-width:600px) {
+ .wpsg-block-product-list :where(.wpsg-product-list__items) { grid-template-columns:repeat(min(var(--wpsg-columns, 3), 2), minmax(0, 1fr)); }
+
.wpsg_mod_productindex_grid :where(.wpsg_mod_productindex_product) { width:50%; }
.wpsg_mod_productindex_list :where(.wpsg_mod_productindex_product .wpsg_mod_productindex_content) { margin-left:0; clear:both; }
.wpsg_mod_productindex :where(.wpsg_mod_productindex_order), .wpsg_mod_productindex :where(.wpsg_mod_productindex_pager), .wpsg_mod_productindex :where(.wpsg_mod_productindex_viewselect) { float:none; margin:0.25em 0; }