From f7912a2240a75a36d6e99682cbe29712fa53fd9c Mon Sep 17 00:00:00 2001 From: Matt-Yorkley <9029026+Matt-Yorkley@users.noreply.github.com> Date: Thu, 8 Jun 2023 19:38:46 +0100 Subject: [PATCH] Fix CSS/layout issues --- .../voucher_adjustments_controller.rb | 9 ++++- .../split_checkout/_voucher_section.html.haml | 34 +++++++++++-------- .../css/darkswarm/split-checkout.scss | 20 +++++------ spec/system/consumer/split_checkout_spec.rb | 3 +- 4 files changed, 38 insertions(+), 28 deletions(-) diff --git a/app/controllers/voucher_adjustments_controller.rb b/app/controllers/voucher_adjustments_controller.rb index 9923733fbb..c34570269c 100644 --- a/app/controllers/voucher_adjustments_controller.rb +++ b/app/controllers/voucher_adjustments_controller.rb @@ -61,7 +61,14 @@ class VoucherAdjustmentsController < BaseController flash.now[:error] = @order.errors.full_messages.to_sentence render status: :unprocessable_entity, cable_ready: cable_car. - replace("#flashes", partial("shared/flashes", locals: { flashes: flash })) + replace("#flashes", partial("shared/flashes", locals: { flashes: flash })). + replace( + "#voucher-section", + partial( + "split_checkout/voucher_section", + locals: { order: @order, voucher_adjustment: @order.voucher_adjustments.first } + ) + ) end def voucher_params diff --git a/app/views/split_checkout/_voucher_section.html.haml b/app/views/split_checkout/_voucher_section.html.haml index c46dce4ec0..19298da409 100644 --- a/app/views/split_checkout/_voucher_section.html.haml +++ b/app/views/split_checkout/_voucher_section.html.haml @@ -1,19 +1,25 @@ %div#voucher-section .checkout-title = t("split_checkout.step2.voucher.apply_voucher") - .checkout-input - .two-columns-inputs.voucher{"data-controller": "toggle-button-disabled"} + .checkout-input{"data-controller": "toggle-button-disabled"} + = form_with url: voucher_adjustments_path, model: @order, method: :post, data: { remote: true } do |form| - if voucher_adjustment.present? - %span.button.voucher-added - %i.ofn-i_051-check-big - = t("split_checkout.step2.voucher.voucher", voucher_amount: voucher_adjustment.originator.display_value) - = link_to t("split_checkout.step2.voucher.remove_code"), voucher_adjustment_path(id: voucher_adjustment.id), method: "delete", data: { confirm: t("split_checkout.step2.voucher.confirm_delete") } - - # This might not be true, ie payment method including a fee which wouldn't be covered by voucher or tax implication raising total to be bigger than the voucher amount ? - - if voucher_adjustment.originator.amount > order.total - .checkout-input - %span.formError.standalone - = t("split_checkout.step2.voucher.warning_forfeit_remaining_amount") + .two-columns-inputs.voucher + %span.button.voucher-added + %i.ofn-i_051-check-big + = t("split_checkout.step2.voucher.voucher", voucher_amount: voucher_adjustment.originator.display_value) + = link_to t("split_checkout.step2.voucher.remove_code"), voucher_adjustment_path(id: voucher_adjustment.id), method: "delete", data: { confirm: t("split_checkout.step2.voucher.confirm_delete") } + + - # This might not be true, ie payment method including a fee which wouldn't be covered by voucher or tax implication raising total to be bigger than the voucher amount ? + - if voucher_adjustment.originator.amount > order.total + .checkout-input + %span.formError.standalone + = t("split_checkout.step2.voucher.warning_forfeit_remaining_amount") - else - = form_with url: voucher_adjustments_path, model: @order, method: :post, data: { remote: true } do |form| - = form.text_field :voucher_code, value: params.dig(:order, :voucher_code), data: { action: "input->toggle-button-disabled#inputIsChanged" }, placeholder: t("split_checkout.step2.voucher.placeholder"), class: "voucher" - = form.submit t("split_checkout.step2.voucher.apply"), disabled: true, class: "button cancel voucher", "data-disable-with": false, data: { "toggle-button-disabled-target": "button" } + .two-columns-inputs + %div.checkout-input + = form.text_field :voucher_code, value: params.dig(:order, :voucher_code), data: { action: "input->toggle-button-disabled#inputIsChanged" }, placeholder: t("split_checkout.step2.voucher.placeholder"), class: "voucher" + = form.error_message_on :voucher_code + + %div.checkout-input + = form.submit t("split_checkout.step2.voucher.apply"), disabled: true, class: "button cancel voucher-button", "data-disable-with": false, data: { "toggle-button-disabled-target": "button" } diff --git a/app/webpacker/css/darkswarm/split-checkout.scss b/app/webpacker/css/darkswarm/split-checkout.scss index 3d9c05b929..1fc90b9815 100644 --- a/app/webpacker/css/darkswarm/split-checkout.scss +++ b/app/webpacker/css/darkswarm/split-checkout.scss @@ -412,22 +412,18 @@ justify-content: normal; align-items: center; - input { - width: 50%; - } - a { color: inherit; } + } - .button { - &.cancel { - width: 30%; - border-radius: 0.5em; - padding:0; - height: 2.5em; - background-color: $teal-400 - } + .voucher-button { + &.cancel { + width: 30%; + border-radius: 0.35em; + padding:0; + height: 2.5em; + background-color: $teal-400 } } diff --git a/spec/system/consumer/split_checkout_spec.rb b/spec/system/consumer/split_checkout_spec.rb index db6fbb3236..148f2a212c 100644 --- a/spec/system/consumer/split_checkout_spec.rb +++ b/spec/system/consumer/split_checkout_spec.rb @@ -788,9 +788,10 @@ describe "As a consumer, I want to checkout my order" do click_on "Remove code" end - within '.voucher' do + within '#voucher-section' do expect(page).to have_button("Apply", disabled: true) end + expect(order.voucher_adjustments.length).to eq(0) end end