Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[RFC] Use nested checkboxes and radio buttons all over admin #2429

Merged
merged 7 commits into from
Dec 20, 2017
Merged

[RFC] Use nested checkboxes and radio buttons all over admin #2429

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
bd6eacb
Remove inline and block label classes
tvdeyen Nov 25, 2017
bf9c5f3
Remove custom label style
tvdeyen Nov 25, 2017
7467115
Add a right margin to nested radios and checkboxes
tvdeyen Nov 25, 2017
183f322
Fix label styles in checkbox field containers
tvdeyen Nov 29, 2017
df6c6d3
Remove custom product form checkbox aligment
tvdeyen Nov 29, 2017
27400bb
Use nested checkboxes in admin ui
tvdeyen Nov 29, 2017
f71543e
Use nested radio buttons in admin ui
tvdeyen Dec 4, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion backend/app/assets/stylesheets/spree/backend/sections/_products.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,6 @@ div[data-hook="admin_products_index_search_buttons"] {
}
input[type="checkbox"] {
width: auto;
vertical-align: bottom;
}
}

Expand Down
27 changes: 10 additions & 17 deletions backend/app/assets/stylesheets/spree/backend/shared/_forms.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,22 +41,14 @@ textarea {
}

label {
font-weight: $font-weight-bold;
font-size: 90%;
display: inline;
margin-bottom: 5px;

&.inline {
display: inline-block !important;
}

&.block {
display: block !important;
}

&.required:after {
content: " *";
}

input[type="radio"],
input[type="checkbox"] {
margin-right: 0.25rem;
}
}

.label-block label { display: block }
Expand Down Expand Up @@ -100,7 +92,7 @@ span.info {
padding: 10px 0;

&.checkbox {
min-height: 73px;
min-height: 5.9rem;
display: flex;
align-items: center;

Expand All @@ -111,22 +103,23 @@ span.info {

label {
cursor: pointer;
display: block;
margin-top: 2.25rem;
}
}

ul {
list-style: none;
margin: 5px 0;
margin: 0.5rem 0;
padding-left: 0;

li {
display: inline-block;
padding-right: 10px;
padding-right: 1rem;

label {
font-weight: normal;
text-transform: none;
margin-bottom: 0;
}

&.white-space-nowrap {
Expand Down
6 changes: 4 additions & 2 deletions backend/app/views/spree/admin/orders/_shipment.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,8 +16,10 @@

<% if shipment.ready? && can?(:ship, shipment) %>
<%= form_tag("#", class: "admin-ship-shipment") do %>
<%= check_box_tag :send_mailer, true, true %>
<%= label_tag :send_mailer, t('spree.send_mailer') %>
<label>
<%= check_box_tag :send_mailer, true, true %>
<%= t('spree.send_mailer') %>
</label>
<%= submit_tag t('spree.actions.ship'), class: "ship-shipment-button" %>
<% end %>
<% end %>
Expand Down
20 changes: 13 additions & 7 deletions backend/app/views/spree/admin/orders/customer_details/_form.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,12 +21,16 @@
<% else %>
<% guest = @order.user.nil? %>
<li>
<%= radio_button_tag :guest_checkout, true, guest %>
<%= label_tag :guest_checkout_true, t('spree.say_yes') %>
<label>
<%= radio_button_tag :guest_checkout, true, guest %>
<%= t('spree.say_yes') %>
</label>
</li>
<li>
<%= radio_button_tag :guest_checkout, false, !guest, disabled: @order.cart? %>
<%= label_tag :guest_checkout_false, t('spree.say_no') %>
<label>
<%= radio_button_tag :guest_checkout, false, !guest, disabled: @order.cart? %>
<%= t('spree.say_no') %>
</label>
</li>
<%= hidden_field_tag :user_id, @order.user_id %>
<% end %>
Expand All @@ -41,10 +45,12 @@
<fieldset class="no-border-bottom">
<legend align="center"><%= t('spree.shipping_address') %></legend>
<% if Spree::Config[:order_bill_address_used] %>
<div class="field" style="position: absolute;margin-top: -15px;left: 0;">
<div class="field">
<span data-hook="use_billing">
<%= check_box_tag 'order[use_billing]', '1', (@order.ship_address.new_record? && @order.bill_address == @order.ship_address) %>
<%= label_tag 'order[use_billing]', t('spree.use_billing_address') %>
<label>
<%= check_box_tag 'order[use_billing]', '1', (@order.ship_address.new_record? && @order.bill_address == @order.ship_address) %>
<%= t('spree.use_billing_address') %>
</label>
</span>
</div>
<% end %>
Expand Down
18 changes: 12 additions & 6 deletions backend/app/views/spree/admin/payment_methods/_form.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,16 +34,22 @@
<%= f.select :auto_capture, [["#{t('spree.use_app_default')} (#{Spree::Config[:auto_capture]})", ''], [t('spree.say_yes'), true], [t('spree.say_no'), false]], {}, {class: 'custom-select fullwidth'} %>
</div>
<div data-hook="available_to_user" class="field">
<%= f.check_box :available_to_users %>
<%= f.label :available_to_users %>
<label>
<%= f.check_box :available_to_users %>
<%= Spree::PaymentMethod.human_attribute_name :available_to_users %>
</label>
</div>
<div data-hook="available_to_user" class="field">
<%= f.check_box :available_to_admin %>
<%= f.label :available_to_admin %>
<label>
<%= f.check_box :available_to_admin %>
<%= Spree::PaymentMethod.human_attribute_name :available_to_admin %>
</label>
</div>
<div data-hook="active" class="field">
<%= f.check_box :active %>
<%= f.label :active %>
<label>
<%= f.check_box :active %>
<%= Spree::PaymentMethod.human_attribute_name :active %>
</label>
</div>
</div>

Expand Down
7 changes: 4 additions & 3 deletions backend/app/views/spree/admin/products/_form.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -71,9 +71,10 @@

<div data-hook="admin_product_form_promotionable">
<%= f.field_container :promotionable do %>
<%= f.label :promotionable do %>
<%= f.check_box :promotionable %> <%= Spree::Product.human_attribute_name(:promotionable) %>
<% end %>
<label>
<%= f.check_box :promotionable %>
<%= Spree::Product.human_attribute_name(:promotionable) %>
</label>
<%= f.field_hint :promotionable %>
<% end %>
</div>
Expand Down
6 changes: 3 additions & 3 deletions backend/app/views/spree/admin/promotions/_form.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,10 +12,10 @@
<% end %>

<%= f.field_container :advertise do %>
<%= label_tag do %>
<label>
<%= f.check_box :advertise %>
<%= Spree::Promotion.human_attribute_name(:advertise) %>
<% end %>
<%= Spree::Promotion.human_attribute_name :advertise %>
</label>
<% end %>
</div>

Expand Down
4 changes: 2 additions & 2 deletions backend/app/views/spree/admin/shared/_rebuild_vat_prices_checkbox.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
<div data-hook="admin_<%= model_name %>_form_generate_vat_prices" class="<%= local_assigns[:wrapper_class] %> checkbox">
<%= form.label :rebuild_vat_prices do %>
<label>
<%= form.check_box :rebuild_vat_prices, checked: form.object.prices.size <= 1 %>
<%= Spree::Variant.human_attribute_name(:rebuild_vat_prices) %>
<% end %>
</label>
</div>

<script type="text/javascript">
Expand Down
6 changes: 4 additions & 2 deletions backend/app/views/spree/admin/shared/named_types/_form.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,10 @@
<%= f.text_field :name, class: 'fullwidth' %>
<% end %>
<div class="checkbox">
<%= f.check_box :active %>
<%= f.label :active %>
<label>
<%= f.check_box :active %>
<%= f.object.class.human_attribute_name :active %>
</label>
</div>
</div>
</div>
17 changes: 9 additions & 8 deletions backend/app/views/spree/admin/shared/preference_fields/_boolean.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,13 @@
<% html_options = local_assigns[:html_options] || {} %>

<div class="field">
<% if local_assigns[:form] %>
<%= form.check_box attribute, html_options %>
<%= form.label attribute, label %>
<% else %>
<%= hidden_field_tag name, 0 %>
<%= check_box_tag name, 1, value, html_options %>
<%= label_tag name, label %>
<% end %>
<label>
<% if local_assigns[:form] %>
<%= form.check_box attribute, html_options %>
<% else %>
<%= hidden_field_tag name, 0 %>
<%= check_box_tag name, 1, value, html_options %>
<% end %>
<%= label || form.object.class.human_attribute_name(attribute) %>
</label>
</div>
16 changes: 9 additions & 7 deletions backend/app/views/spree/admin/shipping_methods/_form.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,9 +48,11 @@
</div>
</div>

<%= f.field_container :available_to_users do %>
<%= f.check_box(:available_to_users) %>
<%= f.label :available_to_users %>
<%= f.field_container :available_to_users, class: %w(checkbox) do %>
<label>
<%= f.check_box(:available_to_users) %>
<%= Spree::ShippingMethod.human_attribute_name :available_to_users %>
</label>
<%= error_message_on :shipping_method, :available_to_users %>
<% end %>

Expand All @@ -61,10 +63,10 @@
<legend align="center"><%= plural_resource_name(Spree::ShippingCategory) %></legend>
<%= f.field_container :categories do %>
<% Spree::ShippingCategory.all.each do |category| %>
<%= label_tag do %>
<label>
<%= check_box_tag('shipping_method[shipping_categories][]', category.id, @shipping_method.shipping_categories.include?(category)) %>
<%= category.name %><br>
<% end %>
</label>
<% end %>
<%= error_message_on :shipping_method, :shipping_category_id %>
<% end %>
Expand All @@ -77,10 +79,10 @@
<%= f.field_container :zones do %>
<% shipping_method_zones = @shipping_method.zones.to_a %>
<% Spree::Zone.all.each do |zone| %>
<%= label_tag do %>
<label>
<%= check_box_tag('shipping_method[zones][]', zone.id, shipping_method_zones.include?(zone)) %>
<%= zone.name %>
<% end %>
</label>
<br>
<% end %>
<%= error_message_on :shipping_method, :zone_id %>
Expand Down
54 changes: 34 additions & 20 deletions backend/app/views/spree/admin/stock_locations/_form.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,44 +22,58 @@
<legend><%= t('.settings') %></legend>

<%= f.field_container :active do %>
<%= f.check_box :active %>
<%= f.label :active %>
<%= f.field_hint :active %>
<label>
<%= f.check_box :active %>
<%= Spree::StockLocation.human_attribute_name :active %>
<%= f.field_hint :active %>
</label>
<% end %>

<%= f.field_container :default do %>
<%= f.check_box :default %>
<%= f.label :default %>
<label>
<%= f.check_box :default %>
<%= Spree::StockLocation.human_attribute_name :default %>
</label>
<% end %>

<%= f.field_container :backorderable_default do %>
<%= f.check_box :backorderable_default %>
<%= f.label :backorderable_default %>
<%= f.field_hint :backorderable_default %>
<label>
<%= f.check_box :backorderable_default %>
<%= Spree::StockLocation.human_attribute_name :backorderable_default %>
<%= f.field_hint :backorderable_default %>
</label>
<% end %>

<%= f.field_container :propagate_all_variants do %>
<%= f.check_box :propagate_all_variants %>
<%= f.label :propagate_all_variants %>
<%= f.field_hint :propagate_all_variants %>
<label>
<%= f.check_box :propagate_all_variants %>
<%= Spree::StockLocation.human_attribute_name :propagate_all_variants %>
<%= f.field_hint :propagate_all_variants %>
</label>
<% end %>

<%= f.field_container :restock_inventory do %>
<%= f.check_box :restock_inventory %>
<%= f.label :restock_inventory %>
<%= f.field_hint :restock_inventory %>
<label>
<%= f.check_box :restock_inventory %>
<%= Spree::StockLocation.human_attribute_name :restock_inventory %>
<%= f.field_hint :restock_inventory %>
</label>
<% end %>

<%= f.field_container :fulfillable do %>
<%= f.check_box :fulfillable %>
<%= f.label :fulfillable %>
<%= f.field_hint :fulfillable %>
<label>
<%= f.check_box :fulfillable %>
<%= Spree::StockLocation.human_attribute_name :fulfillable %>
<%= f.field_hint :fulfillable %>
</label>
<% end %>

<%= f.field_container :check_stock_on_transfer do %>
<%= f.check_box :check_stock_on_transfer %>
<%= f.label :check_stock_on_transfer %>
<%= f.field_hint :check_stock_on_transfer %>
<label>
<%= f.check_box :check_stock_on_transfer %>
<%= Spree::StockLocation.human_attribute_name :check_stock_on_transfer %>
<%= f.field_hint :check_stock_on_transfer %>
</label>
<% end %>
</fieldset>

Expand Down
6 changes: 4 additions & 2 deletions backend/app/views/spree/admin/tax_categories/_form.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,8 +15,10 @@

<div class="col-1">
<%= f.field_container :is_default, class: ['checkbox'] do %>
<%= f.check_box :is_default %>
<%= f.label :is_default %>
<label>
<%= f.check_box :is_default %>
<%= Spree::TaxCategory.human_attribute_name(:is_default) %>
</label>
<% end %>
</div>

Expand Down
12 changes: 8 additions & 4 deletions backend/app/views/spree/admin/tax_rates/_form.html.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,10 @@
<br/><span class="info"><%= t('spree.tax_rate_amount_explanation') %></span>
</div>
<div data-hook="included" class="field">
<%= f.check_box :included_in_price %>
<%= f.label :included_in_price, t('spree.included_in_price') %>
<label>
<%= f.check_box :included_in_price %>
<%= t('spree.included_in_price') %>
</label>
</div>
</div>

Expand All @@ -29,8 +31,10 @@
<%= f.collection_select(:tax_category_ids, @available_categories, :id, :name, {}, {class: 'select2 fullwidth', multiple: "multiple"}) %>
</div>
<div data-hook="show_rate" class="field">
<%= f.check_box :show_rate_in_label %>
<%= f.label :show_rate_in_label, t('spree.show_rate_in_label') %>
<label>
<%= f.check_box :show_rate_in_label %>
<%= t('spree.show_rate_in_label') %>
</label>
</div>

<div class="date-range-filter field">
Expand Down
Loading