Merge pull request #8193 from jibees/8155-split-checkout-mobile-views

Some responsive modifications for split checkout
This commit is contained in:
Maikel
2021-10-20 11:48:57 +11:00
committed by GitHub
4 changed files with 34 additions and 14 deletions

View File

@@ -7,6 +7,17 @@
span, span > a {
font-size: 1.3rem;
@include headingFont;
}
@media screen and (max-width: 700px) {
span, span > a {
font-size: 1.1rem;
}
span.checkout-tab-number {
display: none;
}
}
&:not(.selected) {
@@ -30,7 +41,7 @@
&.success {
border-bottom: 5px solid $clr-turquoise-bright;
span {
span.checkout-tab-label {
&:after {
content: '';
background-color: $clr-turquoise-bright;

View File

@@ -1,4 +1,4 @@
%checkout.row#checkout
.small-12.medium-12.columns
= render partial: "split_checkout/tabs"
= render partial: "split_checkout/form"
= render partial: "split_checkout/tabs"
= render partial: "split_checkout/form"

View File

@@ -1,12 +1,21 @@
%div.flex
%div.columns.three.text-center.checkout-tab{"class": [("selected" if checkout_step?(:details)), ("success" unless checkout_step?(:details))]}
%span
= link_to_unless checkout_step?(:details), t("split_checkout.your_details"), main_app.checkout_step_path(:details) do
= t("split_checkout.your_details")
%div
%span.checkout-tab-number
1 -
%span.checkout-tab-label
= link_to_unless checkout_step?(:details), t("split_checkout.your_details_without_number"), main_app.checkout_step_path(:details) do
= t("split_checkout.your_details_without_number")
%div.columns.three.text-center.checkout-tab{"class": [("selected" if checkout_step?(:payment)), ("success" if checkout_step?(:summary))]}
%span
= link_to_if checkout_step?(:summary), t("split_checkout.payment_method"), main_app.checkout_step_path(:payment) do
= t("split_checkout.payment_method")
%div
%span.checkout-tab-number
2 -
%span.checkout-tab-label
= link_to_if checkout_step?(:summary), t("split_checkout.payment_method_without_number"), main_app.checkout_step_path(:payment) do
= t("split_checkout.payment_method_without_number")
%div.columns.three.text-center.checkout-tab{"class": ("selected" if checkout_step?(:summary))}
%span
= t("split_checkout.order_summary")
%div
%span.checkout-tab-number
3 -
%span.checkout-tab-label
= t("split_checkout.order_summary_without_number")

View File

@@ -1637,9 +1637,9 @@ en:
cost_currency: "Cost Currency"
split_checkout:
your_details: 1 - Your details
payment_method: 2 - Payment method
order_summary: 3 - Order summary
your_details_without_number: Your details
payment_method_without_number: Payment method
order_summary_without_number: Order summary
step1:
your_details:
title: Your details