From ec9bd2ed4ea5305730c2ae93671bd9ed52b1fea3 Mon Sep 17 00:00:00 2001 From: Laury GvR Date: Thu, 21 Apr 2016 17:01:55 -0400 Subject: [PATCH] Margin on product listing, responsiveness, related products responsive --- css/app.css | 19 +++++++++++++++++-- functions.php | 15 ++++++++------- scss/plugins/_woocommerce.scss | 22 ++++++++++++++++++++-- 3 files changed, 45 insertions(+), 11 deletions(-) diff --git a/css/app.css b/css/app.css index 7c1b567..edafef3 100644 --- a/css/app.css +++ b/css/app.css @@ -6662,6 +6662,16 @@ main.woocommerce, div.woocommerce { color: white; } main.woocommerce .product.type-product .woocommerce-tabs ul.wc-tabs li a, div.woocommerce .product.type-product .woocommerce-tabs ul.wc-tabs li a { display: block; } + @media only screen and (max-width: 40em) { + main.woocommerce .product.type-product .woocommerce-tabs ul.wc-tabs li, div.woocommerce .product.type-product .woocommerce-tabs ul.wc-tabs li { + width: 50%; + margin: 0; + font-size: 14px; + text-align: center; } + main.woocommerce .product.type-product .woocommerce-tabs ul.wc-tabs li a, div.woocommerce .product.type-product .woocommerce-tabs ul.wc-tabs li a { + font-size: 14px; } + main.woocommerce .product.type-product .woocommerce-tabs ul.wc-tabs li:nth-child(2n), div.woocommerce .product.type-product .woocommerce-tabs ul.wc-tabs li:nth-child(2n) { + float: right; } } main.woocommerce .product.type-product .woocommerce-tabs ul.wc-tabs li.active, div.woocommerce .product.type-product .woocommerce-tabs ul.wc-tabs li.active { border-bottom-color: #0f789f; background-color: #0f789f; @@ -6676,6 +6686,12 @@ main.woocommerce, div.woocommerce { background: #0f789f; } main.woocommerce .product.type-product .woocommerce-tabs ul.wc-tabs li.active a:hover, div.woocommerce .product.type-product .woocommerce-tabs ul.wc-tabs li.active a:hover { color: white; } + @media only screen and (max-width: 40em) { + main.woocommerce .product.type-product .woocommerce-tabs ul.wc-tabs li.active, div.woocommerce .product.type-product .woocommerce-tabs ul.wc-tabs li.active { + border-width: 1px; } } + @media only screen and (max-width: 40em) { + main.woocommerce .product.type-product .woocommerce-tabs ul.wc-tabs, div.woocommerce .product.type-product .woocommerce-tabs ul.wc-tabs { + padding-left: 0; } } main.woocommerce .product.type-product .woocommerce-tabs .tabs .reviews_tab, main.woocommerce .product.type-product .woocommerce-tabs .tabs .additional_information_tab, div.woocommerce .product.type-product .woocommerce-tabs .tabs .reviews_tab, div.woocommerce .product.type-product .woocommerce-tabs .tabs .additional_information_tab { display: none; } main.woocommerce .product.type-product .woocommerce-tabs > div.panel, div.woocommerce .product.type-product .woocommerce-tabs > div.panel { @@ -6931,7 +6947,6 @@ main.woocommerce, div.woocommerce { margin-right: auto; clear: both; } main.woocommerce #content .product.type-product .variations_form .single_variation_wrap .variations_button .quantity, div.woocommerce #content .product.type-product .variations_form .single_variation_wrap .variations_button .quantity { - width: 170px; clear: none; } } @media only screen and (max-width: 40em) { main.woocommerce #content .product.type-product .variations_form .single_variation_wrap, div.woocommerce #content .product.type-product .variations_form .single_variation_wrap { @@ -7189,7 +7204,7 @@ main.woocommerce, div.woocommerce { border: none; padding-right: 15px; } main.woocommerce #content ul.products li.product.type-product > div, div.woocommerce #content ul.products li.product.type-product > div { - margin: 5px; + margin: 0 auto; padding: 5px; border-radius: 5px; width: 100%; } diff --git a/functions.php b/functions.php index 22f7ebe..e7cb100 100644 --- a/functions.php +++ b/functions.php @@ -75,20 +75,21 @@ function glm_site_scripts() } -// This function is to always have the WooCommerce product inquiry tab display -add_filter( 'woocommerce_product_tabs', 'woo_product_inquiry_tab' ); -function woo_product_inquiry_tab( $tabs ) { - - // Adds the new tab + +add_filter( 'woocommerce_product_tabs', 'woo_product_tab_edits' ); +function woo_product_tab_edits( $tabs ) { + // to always have the WooCommerce product inquiry tab display $tabs['product_inquiry_tab'] = array( - 'title' => __( 'Inquiry', 'woocommerce' ), + 'title' => __( 'Product Inquiry', 'woocommerce' ), 'priority' => 50, 'callback' => 'woo_product_inquiry_content' ); + // Rename Tab to Product Data + $tabs['additional_information']['title'] = __( 'More Info' ); // Rename the additional information tab return $tabs; - } + function woo_product_inquiry_content() { global $product; echo do_shortcode('[gravityform id="2" title="true" description="true]'); diff --git a/scss/plugins/_woocommerce.scss b/scss/plugins/_woocommerce.scss index 2f80a04..19cb58f 100644 --- a/scss/plugins/_woocommerce.scss +++ b/scss/plugins/_woocommerce.scss @@ -177,6 +177,19 @@ div.woocommerce { @media #{$medium-only} { /* margin-left: -23px;*/ } + + @media #{$small-only} { + width: 50%; + margin: 0; + font-size: 14px; + text-align: center; + a { + font-size: 14px; + } + &:nth-child(2n) { + float: right; + } + } } li.active { @@ -197,6 +210,12 @@ div.woocommerce { a:hover { color: white; } + @media #{$small-only} { + border-width: 1px; + } + } + @media #{$small-only} { + padding-left: 0; } } .tabs .reviews_tab, @@ -568,7 +587,6 @@ div.woocommerce { clear: both; } .single_variation_wrap .variations_button .quantity { - width: 170px; clear: none; } } @@ -909,7 +927,7 @@ div.woocommerce { padding-right: 15px; } > div { - margin: 5px; + margin: 0 auto; padding: 5px; border-radius: 5px; width: 100%; -- 2.17.1