From fbc4516b7708ba21ed2e1eb6e42faa4ae2353706 Mon Sep 17 00:00:00 2001 From: Laurel Fulford Date: Tue, 7 Apr 2020 15:55:25 -0700 Subject: [PATCH] fix: style billing form to be more compact --- newspack-theme/inc/woocommerce.php | 13 +++++++++++++ newspack-theme/sass/plugins/woocommerce.scss | 4 ++++ 2 files changed, 17 insertions(+) diff --git a/newspack-theme/inc/woocommerce.php b/newspack-theme/inc/woocommerce.php index 689005587..8e9886c49 100644 --- a/newspack-theme/inc/woocommerce.php +++ b/newspack-theme/inc/woocommerce.php @@ -154,3 +154,16 @@ function newspack_woocommerce_wrapper_after() { } } add_action( 'woocommerce_after_main_content', 'newspack_woocommerce_wrapper_after' ); + +/** + * Replace .form-row-wide classes with classes to style fields narrower. + */ +function newspack_checkout_fields_styling( $fields ) { + $fields['billing']['billing_city']['class'][0] = 'form-row-first'; + $fields['billing']['billing_postcode']['class'][0] = 'form-row-first'; + $fields['billing']['billing_state']['class'][0] = 'form-row-last'; + $fields['billing']['billing_phone']['class'][0] = 'form-row-last'; + return $fields; +} +add_filter( 'woocommerce_checkout_fields', 'newspack_checkout_fields_styling', 9999 ); + diff --git a/newspack-theme/sass/plugins/woocommerce.scss b/newspack-theme/sass/plugins/woocommerce.scss index 42a7c01b6..de7232cbe 100644 --- a/newspack-theme/sass/plugins/woocommerce.scss +++ b/newspack-theme/sass/plugins/woocommerce.scss @@ -77,6 +77,10 @@ a.button { .optional { visibility: visible; } + + &.form-row-first { + clear: left; + } } }