From d24348d0f26460cffde4909991ea74288e851ea2 Mon Sep 17 00:00:00 2001 From: David Cook Date: Wed, 7 Feb 2024 10:13:17 +1100 Subject: [PATCH] Increase button size And fix alignment for smaller screens. --- app/components/modal_component/modal_component.scss | 1 + app/views/admin/products_v3/_edit_image.html.haml | 4 ++-- 2 files changed, 3 insertions(+), 2 deletions(-) diff --git a/app/components/modal_component/modal_component.scss b/app/components/modal_component/modal_component.scss index ec878e62ea..d8c3cdd3fc 100644 --- a/app/components/modal_component/modal_component.scss +++ b/app/components/modal_component/modal_component.scss @@ -27,6 +27,7 @@ body.modal-open #admin-menu li.selected a::after { .modal-actions { display: flex; + text-align: center; // Ensure text inside fullwidth buttons are centred on small screens &.justify-space-around { justify-content: space-around; diff --git a/app/views/admin/products_v3/_edit_image.html.haml b/app/views/admin/products_v3/_edit_image.html.haml index 5ef826c268..218bd29ef5 100644 --- a/app/views/admin/products_v3/_edit_image.html.haml +++ b/app/views/admin/products_v3/_edit_image.html.haml @@ -10,7 +10,7 @@ = f.hidden_field :viewable_id, value: product.id .modal-actions.justify-end - %input{ class: "secondary", type: 'button', value: t('.close'), "data-action": "click->modal#close" } + %input{ class: "secondary relaxed", type: 'button', value: t('.close'), "data-action": "click->modal#close" } -# label.button provides a handy shortcut to open the file selector on click. Unfortunately this trick isn't keyboard accessible though.. - = f.label :attachment, t(".upload"), class: "button primary icon-upload-alt" + = f.label :attachment, t(".upload"), class: "button primary relaxed icon-upload-alt" = f.file_field :attachment, accept: "image/*", style: "display: none", "data-action": "change->form#submit"