Skip to content
Code-Schnipsel Gruppen Projekte
Commit 7c7ffc0e erstellt von Michael Danielczok's avatar Michael Danielczok
Dateien durchsuchen

fix: billing address structure improved

Übergeordneter 3c26bca6
Keine zugehörigen Branchen gefunden
Keine zugehörigen Tags gefunden
2 Merge Requests!9feat: checkout billing address design improved,!8feat: checkout billing address design improved
Leerzeichenänderungen ausblenden
Inline Nebeneinander
src/QUI/ERP/Order/SimpleCheckout/Checkout.css
+ 1
− 18
Zeige Datei @ 7c7ffc0e
......@@ -71,30 +71,13 @@
}
/* section */
.simpleCheckout-detail-section {
.simpleCheckout-details-section {
margin-bottom: var(--_sectionSpacing);
padding: var(--_sectionPadding);
background-color: #f8f8f8;
}
.simpleCheckout-detail-sectionn .simpleCheckoutCard-subheader {
text-align: center;
position: relative;
background: #fff;
display: inline-block;
top: -2rem;
padding-inline: 1em;
margin-bottom: 0;
}
@media screen and (max-width: 767px) {
.simpleCheckout-detail-sectionn .simpleCheckoutCard-subheader {
transform: translateX(-50%);
left: 50%;
}
}
.quiqqer-simple-checkout-data-or {
text-align: center;
margin: 3rem 0;
......
src/QUI/ERP/Order/SimpleCheckout/Checkout.html
+ 6
− 6
Zeige Datei @ 7c7ffc0e
......@@ -9,7 +9,7 @@
{template_event name="quiqqer::order::simple::expressButtons" Order=$Order assign=expressButtons}
{if !empty($expressButtons)}
<div class="quiqqer-simple-checkout-data-express simpleCheckout-detail-section">
<div class="quiqqer-simple-checkout-data-express simpleCheckout-details-section">
<h2 class="simpleCheckoutCard-subheader">
{locale group="quiqqer/order-simple-checkout" var="simpleCheckout.subheader.expressCheckout"}
</h2>
......@@ -25,7 +25,7 @@
</div>
{/if}
<div class="quiqqer-simple-checkout-data-contact simpleCheckout-detail-section">
<div class="quiqqer-simple-checkout-data-contact simpleCheckout-details-section">
<h2 class="simpleCheckoutCard-subheader">
{locale group="quiqqer/order-simple-checkout" var="title.contact"}
</h2>
......@@ -54,28 +54,28 @@
{/if}
</div>
<div class="quiqqer-simple-checkout-data-delivery simpleCheckout-detail-section">
<div class="quiqqer-simple-checkout-data-delivery simpleCheckout-details-section">
<h2 class="simpleCheckoutCard-subheader">
{locale group="quiqqer/order" var="ordering.step.title.CustomerData"}
</h2>
{$Delivery->create()}
</div>
<div class="quiqqer-simple-checkout-data-shipping simpleCheckout-detail-section">
<div class="quiqqer-simple-checkout-data-shipping simpleCheckout-details-section">
<h2 class="simpleCheckoutCard-subheader">
{locale group="quiqqer/shipping" var="ordering.step.title.Shipping"}
</h2>
{$Shipping->create()}
</div>
<div class="quiqqer-simple-checkout-data-payment simpleCheckout-detail-section">
<div class="quiqqer-simple-checkout-data-payment simpleCheckout-details-section">
<h2 class="simpleCheckoutCard-subheader">
{locale group="quiqqer/order" var="ordering.step.title.Payment"}
</h2>
{$Payment->create()}
</div>
<div class="quiqqer-simple-checkout-data-billing simpleCheckout-detail-section">
<div class="quiqqer-simple-checkout-data-billing simpleCheckout-details-section">
<h2 class="simpleCheckoutCard-subheader">
{locale group="quiqqer/order-simple-checkout" var="ordering.step.title.Billing"}
</h2>
......
src/QUI/ERP/Order/SimpleCheckout/Steps/CheckoutBillingAddress.css
+ 16
− 14
Zeige Datei @ 7c7ffc0e
.quiqqer-simple-checkout-billing label {
display: block;
cursor: pointer;
clear: both;
}
.quiqqer-simple-checkout-billing__entry {
......@@ -22,8 +23,17 @@
margin-top: 1rem;
}
.quiqqer-simple-checkout-billing-diffContainer > .inner,
.quiqqer-order-customerData-edit-street_no__container {
--form-gap: 1rem;
display: flex;
flex-wrap: wrap;
gap: var(--form-gap);
}
.quiqqer-simple-checkout-billing-diffContainer label {
margin-bottom: 1rem;
width: 100%;
}
.quiqqer-simple-checkout-billing label select,
......@@ -43,25 +53,17 @@
.quiqqer-simple-checkout-billing-diffContainer .quiqqer-order-customerData-edit-lastname,
.quiqqer-simple-checkout-billing-diffContainer .quiqqer-order-customerData-edit-zip,
.quiqqer-simple-checkout-billing-diffContainer .quiqqer-order-customerData-edit-city {
float: left;
width: calc(50% - 10px) !important;
flex: 1 0 calc(50% - var(--form-gap));
}
.quiqqer-simple-checkout-billing .quiqqer-order-customerData-edit-lastname,
.quiqqer-simple-checkout-billing .quiqqer-order-customerData-edit-city {
clear: initial !important;
margin-left: 20px;
.quiqqer-order-customerData-edit-street_no__container input[name="billing_street"] {
flex: 1 0 calc(75% - var(--form-gap));
}
.quiqqer-simple-checkout-billing .quiqqer-order-customerData-edit-street_no [name="billing_street"] {
float: left;
margin-right: 10px;
width: calc(100% - 130px) !important;
.quiqqer-order-customerData-edit-street_no__container input[name="billing_street_number"] {
flex: 1 0 calc(25% - var(--form-gap));
}
.quiqqer-simple-checkout-billing .quiqqer-order-customerData-edit-street_no [name="billing_street_number"] {
width: 120px !important;
}
.quiqqer-simple-checkout-billing__entry:hover,
.quiqqer-simple-checkout-billing__entry.selected {
......
src/QUI/ERP/Order/SimpleCheckout/Steps/CheckoutBillingAddress.html
+ 4
− 2
Zeige Datei @ 7c7ffc0e
......@@ -40,8 +40,10 @@
{locale group="quiqqer/frontend-users" var="street_no"}
</span>
{if empty($Address->getAttribute('street_no'))}
<input type="text" name="billing_street" value="" autocomplete="shipping street-address">
<input type="text" name="billing_street_number" value="">
<div class="quiqqer-order-customerData-edit-street_no__container">
<input type="text" name="billing_street" value="" autocomplete="shipping street-address">
<input type="text" name="billing_street_number" value="">
</div>
{else}
<input type="text"
name="billing_street_no"
......
0% oder .
You are about to add 0 people to the discussion. Proceed with caution.
Bearbeitung dieser Nachricht zuerst beenden!
Bitte registrieren oder zum Kommentieren

PCSG & QUIQQER support and DEV System - GitLab