From 8ee3e8a6e9acd27a24055b36f4abe36ab78b5bab Mon Sep 17 00:00:00 2001 From: Brent Shepherd Date: Mon, 24 Sep 2018 12:14:07 +1000 Subject: [PATCH 01/26] Add WC_Tests_Webhook_Functions::create_webhook() To make it reusable. --- tests/unit-tests/webhooks/functions.php | 15 ++++++++++----- 1 file changed, 10 insertions(+), 5 deletions(-) diff --git a/tests/unit-tests/webhooks/functions.php b/tests/unit-tests/webhooks/functions.php index d9f2d2423fb..080f6118fe3 100644 --- a/tests/unit-tests/webhooks/functions.php +++ b/tests/unit-tests/webhooks/functions.php @@ -103,6 +103,14 @@ class WC_Tests_Webhook_Functions extends WC_Unit_Test_Case { * @since 3.2.0 */ public function test_wc_load_webhooks() { + $webhook = $this->create_webhook(); + $this->assertTrue( wc_load_webhooks() ); + $webhook->delete( true ); + $this->assertFalse( wc_load_webhooks() ); + } + + protected function create_webhook( $topic = 'action.woocommerce_some_action' ) { + $webhook = new WC_Webhook(); $webhook->set_props( array( @@ -111,15 +119,12 @@ class WC_Tests_Webhook_Functions extends WC_Unit_Test_Case { 'user_id' => 0, 'delivery_url' => 'https://requestb.in/17jajv31', 'secret' => 'secret', - 'topic' => 'action.woocommerce_some_action', + 'topic' => $topic, 'api_version' => 2, ) ); $webhook->save(); - $this->assertTrue( wc_load_webhooks() ); - - $webhook->delete( true ); - $this->assertFalse( wc_load_webhooks() ); + return $webhook; } } From 67bf101aaf4ce0123bf0cf8d9c97212480e157b0 Mon Sep 17 00:00:00 2001 From: Brent Shepherd Date: Mon, 24 Sep 2018 13:22:16 +1000 Subject: [PATCH 02/26] Add $status param to wc_load_webhooks() And the corresponding data stores. Defaults to '', meaning do not load only webhooks with a specific status. This maintains backward compatibility. However, the call to wc_load_webhooks() within WooCommerce::load_webhooks() can now only load active webhooks, as they are the only ones that should be enqueued. --- .../class-wc-webhook-data-store.php | 71 +++++++++++++++++-- ...class-wc-webhooks-data-store-interface.php | 4 +- includes/wc-webhook-functions.php | 5 +- tests/unit-tests/webhooks/functions.php | 50 ++++++++++++- 4 files changed, 119 insertions(+), 11 deletions(-) diff --git a/includes/data-stores/class-wc-webhook-data-store.php b/includes/data-stores/class-wc-webhook-data-store.php index fd3a53bfed9..22f3725f7c5 100644 --- a/includes/data-stores/class-wc-webhook-data-store.php +++ b/includes/data-stores/class-wc-webhook-data-store.php @@ -59,7 +59,7 @@ class WC_Webhook_Data_Store implements WC_Webhook_Data_Store_Interface { $webhook->set_id( $webhook_id ); $webhook->apply_changes(); - delete_transient( 'woocommerce_webhook_ids' ); + $this->delete_transients( $webhook->get_status( 'edit' ) ); WC_Cache_Helper::incr_cache_prefix( 'webhooks' ); do_action( 'woocommerce_new_webhook', $webhook_id ); } @@ -180,7 +180,7 @@ class WC_Webhook_Data_Store implements WC_Webhook_Data_Store_Interface { array( '%d' ) ); // WPCS: cache ok, DB call ok. - delete_transient( 'woocommerce_webhook_ids' ); + $this->delete_transients( 'all' ); WC_Cache_Helper::incr_cache_prefix( 'webhooks' ); do_action( 'woocommerce_webhook_deleted', $webhook->get_id(), $webhook ); } @@ -200,18 +200,31 @@ class WC_Webhook_Data_Store implements WC_Webhook_Data_Store_Interface { * Get all webhooks IDs. * * @since 3.3.0 + * @throws InvalidArgumentException If a $status value is passed in that is not in the known wc_get_webhook_statuses() keys. + * @param string $status Optional - status to filter results by. Must be a key in return value of @see wc_get_webhook_statuses(). @since 3.5.0. * @return int[] */ - public function get_webhooks_ids() { + public function get_webhooks_ids( $status = '' ) { global $wpdb; - $ids = get_transient( 'woocommerce_webhook_ids' ); + if ( ! empty( $status ) ) { + $this->validate_status( $status ); + } + + $ids = get_transient( $this->get_transient_key( $status ) ); if ( false === $ids ) { - $results = $wpdb->get_results( "SELECT webhook_id FROM {$wpdb->prefix}wc_webhooks" ); // WPCS: cache ok, DB call ok. + + $query = "SELECT webhook_id FROM {$wpdb->prefix}wc_webhooks"; + + if ( ! empty( $status ) ) { + $query .= $wpdb->prepare( " AND status = %s", $status ); + } + + $results = $wpdb->get_results( $query ); // WPCS: cache ok, DB call ok. $ids = array_map( 'intval', wp_list_pluck( $results, 'webhook_id' ) ); - set_transient( 'woocommerce_webhook_ids', $ids ); + set_transient( $this->get_transient_key( $status ), $ids ); } return $ids; @@ -349,4 +362,50 @@ class WC_Webhook_Data_Store implements WC_Webhook_Data_Store_Interface { return $counts; } + + /** + * Check if a given string is in known statuses, based on return value of @see wc_get_webhook_statuses(). + * + * @since 3.5.0 + * @throws InvalidArgumentException If $status is not empty and not in the known wc_get_webhook_statuses() keys. + * @param string $status Status to check. + */ + private function validate_status( $status ) { + if ( ! array_key_exists( $status, wc_get_webhook_statuses() ) ) { + throw new InvalidArgumentException( sprintf( 'Invalid status given: %s. Status must be one of: %s.', $status, implode( ', ', array_keys( wc_get_webhook_statuses() ) ) ) ); + } + } + + /** + * Get the transient key used to cache a set of webhook IDs, optionally filtered by status. + * + * @since 3.5.0 + * @param string $status Optional - status of cache key. + * @return string + */ + private function get_transient_key( $status = '' ) { + return empty( $status ) ? 'woocommerce_webhook_ids' : sprintf( 'woocommerce_webhook_ids_status_%s', $status ); + } + + /** + * Delete the transients used to cache a set of webhook IDs, optionally filtered by status. + * + * @since 3.5.0 + * @param string $status Optional - status of cache to delete, or 'all' to delete all caches. + */ + private function delete_transients( $status = '' ) { + + // Always delete the non-filtered cache. + delete_transient( $this->get_transient_key( '' ) ); + + if ( ! empty( $status ) ) { + if ( 'all' === $status ) { + foreach ( wc_get_webhook_statuses() as $status_key => $status_string ) { + delete_transient( $this->get_transient_key( $status_key ) ); + } + } else { + delete_transient( $this->get_transient_key( $status ) ); + } + } + } } diff --git a/includes/interfaces/class-wc-webhooks-data-store-interface.php b/includes/interfaces/class-wc-webhooks-data-store-interface.php index 1478e3e7845..58afeebe6f2 100644 --- a/includes/interfaces/class-wc-webhooks-data-store-interface.php +++ b/includes/interfaces/class-wc-webhooks-data-store-interface.php @@ -28,7 +28,9 @@ interface WC_Webhook_Data_Store_Interface { * Get all webhooks IDs. * * @since 3.2.0 + * @throws InvalidArgumentException If a $status value is passed in that is not in the known wc_get_webhook_statuses() keys. + * @param string $status Optional - status to filter results by. Must be a key in return value of @see wc_get_webhook_statuses(). @since 3.5.0. * @return int[] */ - public function get_webhooks_ids(); + public function get_webhooks_ids( $status = '' ); } diff --git a/includes/wc-webhook-functions.php b/includes/wc-webhook-functions.php index cb28a25613c..d7feb86bab1 100644 --- a/includes/wc-webhook-functions.php +++ b/includes/wc-webhook-functions.php @@ -128,11 +128,12 @@ function wc_get_webhook_statuses() { * * @since 3.3.0 * @throws Exception If webhook cannot be read/found and $data parameter of WC_Webhook class constructor is set. + * @param string $status Optional - status to filter results by. Must be a key in return value of @see wc_get_webhook_statuses(). @since 3.5.0. * @return bool */ -function wc_load_webhooks() { +function wc_load_webhooks( $status = '' ) { $data_store = WC_Data_Store::load( 'webhook' ); - $webhooks = $data_store->get_webhooks_ids(); + $webhooks = $data_store->get_webhooks_ids( $status ); $loaded = false; foreach ( $webhooks as $webhook_id ) { diff --git a/tests/unit-tests/webhooks/functions.php b/tests/unit-tests/webhooks/functions.php index 080f6118fe3..5a2f490bacd 100644 --- a/tests/unit-tests/webhooks/functions.php +++ b/tests/unit-tests/webhooks/functions.php @@ -109,12 +109,58 @@ class WC_Tests_Webhook_Functions extends WC_Unit_Test_Case { $this->assertFalse( wc_load_webhooks() ); } - protected function create_webhook( $topic = 'action.woocommerce_some_action' ) { + /** + * Provide webhook statuses for tests. + * + * @since 3.5.0 + */ + public function provider_webhook_statuses() { + + $webhook_statuses = array(); + + foreach ( wc_get_webhook_statuses() as $status_key => $status_string ) { + $webhook_statuses[] = array( $status_key ); + } + + return $webhook_statuses; + } + + /** + * Test the $status param on wc_load_webhooks(). + * + * @dataProvider provider_webhook_statuses + * @param string $status The status of the webhook to test. + * @since 3.5.0 + */ + public function test_wc_load_webhooks_status( $status ) { + + $webhook = $this->create_webhook( 'action.woocommerce_some_action', $status ); + + $this->assertTrue( wc_load_webhooks( '' ) ); + $this->assertTrue( wc_load_webhooks( $status ) ); + + // Find a different, but still valid status. + $other_status = ( 'active' === $status ) ? 'disabled' : 'active'; + + $this->assertFalse( wc_load_webhooks( $other_status ) ); + + $webhook->delete( true ); + $this->assertFalse( wc_load_webhooks( $status ) ); + } + + /** + * @expectedException InvalidArgumentException + */ + public function test_wc_load_webhooks_status_invalid() { + wc_load_webhooks( 'invalid_status' ); + } + + protected function create_webhook( $topic = 'action.woocommerce_some_action', $status = 'active' ) { $webhook = new WC_Webhook(); $webhook->set_props( array( - 'status' => 'active', + 'status' => $status, 'name' => 'Testing webhook', 'user_id' => 0, 'delivery_url' => 'https://requestb.in/17jajv31', From f86b738db3ccd60d40031ca54bb8ea64c58d76eb Mon Sep 17 00:00:00 2001 From: Brent Shepherd Date: Mon, 24 Sep 2018 14:22:01 +1000 Subject: [PATCH 03/26] Use search_webhooks() To avoid duplicate SQL --- .../data-stores/class-wc-webhook-data-store.php | 17 +++++++---------- 1 file changed, 7 insertions(+), 10 deletions(-) diff --git a/includes/data-stores/class-wc-webhook-data-store.php b/includes/data-stores/class-wc-webhook-data-store.php index 22f3725f7c5..6e121f4c793 100644 --- a/includes/data-stores/class-wc-webhook-data-store.php +++ b/includes/data-stores/class-wc-webhook-data-store.php @@ -214,16 +214,13 @@ class WC_Webhook_Data_Store implements WC_Webhook_Data_Store_Interface { $ids = get_transient( $this->get_transient_key( $status ) ); if ( false === $ids ) { - - $query = "SELECT webhook_id FROM {$wpdb->prefix}wc_webhooks"; - - if ( ! empty( $status ) ) { - $query .= $wpdb->prepare( " AND status = %s", $status ); - } - - $results = $wpdb->get_results( $query ); // WPCS: cache ok, DB call ok. - $ids = array_map( 'intval', wp_list_pluck( $results, 'webhook_id' ) ); - + $ids = $this->search_webhooks( + array( + 'limit' => -1, + 'status' => $status, + ) + ); + $ids = array_map( 'intval', $ids ); set_transient( $this->get_transient_key( $status ), $ids ); } From e7a5a2ab2f6b093735d0c921a138e95cbcade982 Mon Sep 17 00:00:00 2001 From: Brent Shepherd Date: Mon, 24 Sep 2018 13:28:39 +1000 Subject: [PATCH 04/26] Only load active webhooks on each request To avoid slowing down page loads on sites with a large number of disabled or paused webhooks, which do not need to be loaded or enqueued. --- includes/class-woocommerce.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/includes/class-woocommerce.php b/includes/class-woocommerce.php index f50f5923bf5..0586af51473 100644 --- a/includes/class-woocommerce.php +++ b/includes/class-woocommerce.php @@ -644,7 +644,7 @@ final class WooCommerce { return; } - wc_load_webhooks(); + wc_load_webhooks( 'active' ); } /** From 9fdbb124ae26ef469c3ae73ef94ec9f2d3fe4df8 Mon Sep 17 00:00:00 2001 From: Brent Shepherd Date: Mon, 24 Sep 2018 12:14:32 +1000 Subject: [PATCH 05/26] Add $limit param to wc_load_webhooks() And the corresponding data stores. Defaults to null, meaning do not limit, for backward compatibility. --- .../class-wc-webhook-data-store.php | 7 +- ...class-wc-webhooks-data-store-interface.php | 3 +- includes/wc-webhook-functions.php | 5 +- tests/unit-tests/webhooks/functions.php | 67 +++++++++++++++++++ 4 files changed, 78 insertions(+), 4 deletions(-) diff --git a/includes/data-stores/class-wc-webhook-data-store.php b/includes/data-stores/class-wc-webhook-data-store.php index 6e121f4c793..521c905b574 100644 --- a/includes/data-stores/class-wc-webhook-data-store.php +++ b/includes/data-stores/class-wc-webhook-data-store.php @@ -202,9 +202,10 @@ class WC_Webhook_Data_Store implements WC_Webhook_Data_Store_Interface { * @since 3.3.0 * @throws InvalidArgumentException If a $status value is passed in that is not in the known wc_get_webhook_statuses() keys. * @param string $status Optional - status to filter results by. Must be a key in return value of @see wc_get_webhook_statuses(). @since 3.5.0. + * @param null|int $limit Limit returned results. @since 3.5.0. * @return int[] */ - public function get_webhooks_ids( $status = '' ) { + public function get_webhooks_ids( $status = '', $limit = null ) { global $wpdb; if ( ! empty( $status ) ) { @@ -224,6 +225,10 @@ class WC_Webhook_Data_Store implements WC_Webhook_Data_Store_Interface { set_transient( $this->get_transient_key( $status ), $ids ); } + if ( null !== $limit && $limit > 0 ) { + $ids = array_slice( $ids, 0, absint( $limit ) ); + } + return $ids; } diff --git a/includes/interfaces/class-wc-webhooks-data-store-interface.php b/includes/interfaces/class-wc-webhooks-data-store-interface.php index 58afeebe6f2..7ffdd5fd980 100644 --- a/includes/interfaces/class-wc-webhooks-data-store-interface.php +++ b/includes/interfaces/class-wc-webhooks-data-store-interface.php @@ -30,7 +30,8 @@ interface WC_Webhook_Data_Store_Interface { * @since 3.2.0 * @throws InvalidArgumentException If a $status value is passed in that is not in the known wc_get_webhook_statuses() keys. * @param string $status Optional - status to filter results by. Must be a key in return value of @see wc_get_webhook_statuses(). @since 3.5.0. + * @param null|int $limit Limit returned results. @since 3.5.0. * @return int[] */ - public function get_webhooks_ids( $status = '' ); + public function get_webhooks_ids( $status = '', $limit = null ); } diff --git a/includes/wc-webhook-functions.php b/includes/wc-webhook-functions.php index d7feb86bab1..e3f37e5d974 100644 --- a/includes/wc-webhook-functions.php +++ b/includes/wc-webhook-functions.php @@ -129,11 +129,12 @@ function wc_get_webhook_statuses() { * @since 3.3.0 * @throws Exception If webhook cannot be read/found and $data parameter of WC_Webhook class constructor is set. * @param string $status Optional - status to filter results by. Must be a key in return value of @see wc_get_webhook_statuses(). @since 3.5.0. + * @param null|int $limit Limit number of webhooks loaded. @since 3.5.0. * @return bool */ -function wc_load_webhooks( $status = '' ) { +function wc_load_webhooks( $status = '', $limit = null ) { $data_store = WC_Data_Store::load( 'webhook' ); - $webhooks = $data_store->get_webhooks_ids( $status ); + $webhooks = $data_store->get_webhooks_ids( $status, $limit ); $loaded = false; foreach ( $webhooks as $webhook_id ) { diff --git a/tests/unit-tests/webhooks/functions.php b/tests/unit-tests/webhooks/functions.php index 5a2f490bacd..213a80d2a5c 100644 --- a/tests/unit-tests/webhooks/functions.php +++ b/tests/unit-tests/webhooks/functions.php @@ -155,6 +155,73 @@ class WC_Tests_Webhook_Functions extends WC_Unit_Test_Case { wc_load_webhooks( 'invalid_status' ); } + /** + * Test the $limit param on wc_load_webhooks(). + * + * @since 3.5.0 + */ + public function test_wc_load_webhooks_limit() { + global $wp_filter; + + $webhook_one = $this->create_webhook( 'action.woocommerce_one_test' ); + $webhook_two = $this->create_webhook( 'action.woocommerce_two_test' ); + + $this->assertTrue( wc_load_webhooks( '', 1 ) ); + $this->assertFalse( isset( $wp_filter['woocommerce_one_test'] ) ); + $this->assertTrue( isset( $wp_filter['woocommerce_two_test'] ) ); + + $webhook_two->delete( true ); + + $this->assertTrue( wc_load_webhooks( '', 1 ) ); + $this->assertTrue( isset( $wp_filter['woocommerce_one_test'] ) ); + + $webhook_one->delete( true ); + + $this->assertFalse( wc_load_webhooks( '', 1 ) ); + } + + /** + * Test the $status and $limit param on wc_load_webhooks(). + * + * @dataProvider provider_webhook_statuses + * @param string $status The status of the webhook to test. + */ + public function test_wc_load_webhooks_status_and_limit( $status ) { + global $wp_filter; + + $webhook_one = $this->create_webhook( 'action.woocommerce_one_test', $status ); + $webhook_two = $this->create_webhook( 'action.woocommerce_two_test', $status ); + + $this->assertTrue( wc_load_webhooks( $status, 1 ) ); + $this->assertFalse( isset( $wp_filter['woocommerce_one_test'] ) ); + + // Only active webhooks are loaded. + if ( 'active' === $status ) { + $this->assertTrue( isset( $wp_filter['woocommerce_two_test'] ) ); + } else { + $this->assertFalse( isset( $wp_filter['woocommerce_two_test'] ) ); + } + + $webhook_two->delete( true ); + + $this->assertTrue( wc_load_webhooks( $status, 1 ) ); + + if ( 'active' === $status ) { + $this->assertTrue( isset( $wp_filter['woocommerce_one_test'] ) ); + } else { + $this->assertFalse( isset( $wp_filter['woocommerce_one_test'] ) ); + } + + $webhook_one->delete( true ); + $this->assertFalse( wc_load_webhooks( $status, 1 ) ); + } + + /** + * Create and save a webhook for testing. + * + * @param string $topic The webhook topic for the test. + * @param string $status The status of the webhook to be tested. + */ protected function create_webhook( $topic = 'action.woocommerce_some_action', $status = 'active' ) { $webhook = new WC_Webhook(); From 0708c738b96d53a1a02046c1f5bb2ade5f33b762 Mon Sep 17 00:00:00 2001 From: Brent Shepherd Date: Mon, 24 Sep 2018 12:15:22 +1000 Subject: [PATCH 06/26] Only load 100 webhooks per request To avoid slowing down page loads on sites with a large numbers of webhooks. --- includes/class-woocommerce.php | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/includes/class-woocommerce.php b/includes/class-woocommerce.php index 0586af51473..259f2094b23 100644 --- a/includes/class-woocommerce.php +++ b/includes/class-woocommerce.php @@ -644,7 +644,9 @@ final class WooCommerce { return; } - wc_load_webhooks( 'active' ); + $limit = apply_filters( 'woocommerce_load_webhooks_limit', 100 ); + + wc_load_webhooks( 'active', $limit ); } /** From 21d724c65daa4e432284ee75a65fbed64e7774b1 Mon Sep 17 00:00:00 2001 From: Brent Shepherd Date: Mon, 24 Sep 2018 15:31:57 +1000 Subject: [PATCH 07/26] PHPCS fixes Add fixes required for Travis to pass the PR, but which aren't related to the PR diff. --- includes/data-stores/class-wc-webhook-data-store.php | 3 ++- includes/wc-webhook-functions.php | 1 + 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/includes/data-stores/class-wc-webhook-data-store.php b/includes/data-stores/class-wc-webhook-data-store.php index 521c905b574..f83bddf80aa 100644 --- a/includes/data-stores/class-wc-webhook-data-store.php +++ b/includes/data-stores/class-wc-webhook-data-store.php @@ -242,7 +242,8 @@ class WC_Webhook_Data_Store implements WC_Webhook_Data_Store_Interface { global $wpdb; $args = wp_parse_args( - $args, array( + $args, + array( 'limit' => 10, 'offset' => 0, 'order' => 'DESC', diff --git a/includes/wc-webhook-functions.php b/includes/wc-webhook-functions.php index e3f37e5d974..aab46c13a9d 100644 --- a/includes/wc-webhook-functions.php +++ b/includes/wc-webhook-functions.php @@ -20,6 +20,7 @@ function wc_webhook_process_delivery( $webhook, $arg ) { // so as to avoid delays or failures in delivery from affecting the // user who triggered it. if ( apply_filters( 'woocommerce_webhook_deliver_async', true, $webhook, $arg ) ) { + $queue_args = array( 'webhook_id' => $webhook->get_id(), 'arg' => $arg, From ed55a3976ad8945975c2d832683519dba961d022 Mon Sep 17 00:00:00 2001 From: Brent Shepherd Date: Mon, 24 Sep 2018 22:47:11 +1000 Subject: [PATCH 08/26] Test against $wp_filter instead of has_filter() Because we don't have the same WC_Webhook instance as used in wc_load_webhooks(), so it's impossible to check if the same object's process() method is attached as a callback. --- tests/unit-tests/webhooks/functions.php | 16 +++++++++------- 1 file changed, 9 insertions(+), 7 deletions(-) diff --git a/tests/unit-tests/webhooks/functions.php b/tests/unit-tests/webhooks/functions.php index 213a80d2a5c..867ef99c9b3 100644 --- a/tests/unit-tests/webhooks/functions.php +++ b/tests/unit-tests/webhooks/functions.php @@ -189,17 +189,19 @@ class WC_Tests_Webhook_Functions extends WC_Unit_Test_Case { public function test_wc_load_webhooks_status_and_limit( $status ) { global $wp_filter; - $webhook_one = $this->create_webhook( 'action.woocommerce_one_test', $status ); - $webhook_two = $this->create_webhook( 'action.woocommerce_two_test', $status ); + $action_one = 'woocommerce_one_test_status_' . $status; + $webhook_one = $this->create_webhook( 'action.' . $action_one, $status ); + $action_two = 'woocommerce_two_test_status_' . $status; + $webhook_two = $this->create_webhook( 'action.' . $action_two, $status ); $this->assertTrue( wc_load_webhooks( $status, 1 ) ); - $this->assertFalse( isset( $wp_filter['woocommerce_one_test'] ) ); + $this->assertFalse( isset( $wp_filter[ $action_one ] ) ); // Only active webhooks are loaded. if ( 'active' === $status ) { - $this->assertTrue( isset( $wp_filter['woocommerce_two_test'] ) ); + $this->assertTrue( isset( $wp_filter[ $action_two ] ) ); } else { - $this->assertFalse( isset( $wp_filter['woocommerce_two_test'] ) ); + $this->assertFalse( isset( $wp_filter[ $action_two ] ) ); } $webhook_two->delete( true ); @@ -207,9 +209,9 @@ class WC_Tests_Webhook_Functions extends WC_Unit_Test_Case { $this->assertTrue( wc_load_webhooks( $status, 1 ) ); if ( 'active' === $status ) { - $this->assertTrue( isset( $wp_filter['woocommerce_one_test'] ) ); + $this->assertTrue( isset( $wp_filter[ $action_one ] ) ); } else { - $this->assertFalse( isset( $wp_filter['woocommerce_one_test'] ) ); + $this->assertFalse( isset( $wp_filter[ $action_one ] ) ); } $webhook_one->delete( true ); From 739af008c630e04b5a05c4ab46117148058924be Mon Sep 17 00:00:00 2001 From: Brent Shepherd Date: Mon, 24 Sep 2018 22:51:14 +1000 Subject: [PATCH 09/26] Fix test_wc_load_webhooks_status_and_limit() As the status is being explicitly passed to wc_load_webhooks(), it will load webhooks with that status, not just active. --- tests/unit-tests/webhooks/functions.php | 15 ++------------- 1 file changed, 2 insertions(+), 13 deletions(-) diff --git a/tests/unit-tests/webhooks/functions.php b/tests/unit-tests/webhooks/functions.php index 867ef99c9b3..d654675d9cd 100644 --- a/tests/unit-tests/webhooks/functions.php +++ b/tests/unit-tests/webhooks/functions.php @@ -196,23 +196,12 @@ class WC_Tests_Webhook_Functions extends WC_Unit_Test_Case { $this->assertTrue( wc_load_webhooks( $status, 1 ) ); $this->assertFalse( isset( $wp_filter[ $action_one ] ) ); - - // Only active webhooks are loaded. - if ( 'active' === $status ) { - $this->assertTrue( isset( $wp_filter[ $action_two ] ) ); - } else { - $this->assertFalse( isset( $wp_filter[ $action_two ] ) ); - } + $this->assertTrue( isset( $wp_filter[ $action_two ] ) ); $webhook_two->delete( true ); $this->assertTrue( wc_load_webhooks( $status, 1 ) ); - - if ( 'active' === $status ) { - $this->assertTrue( isset( $wp_filter[ $action_one ] ) ); - } else { - $this->assertFalse( isset( $wp_filter[ $action_one ] ) ); - } + $this->assertTrue( isset( $wp_filter[ $action_one ] ) ); $webhook_one->delete( true ); $this->assertFalse( wc_load_webhooks( $status, 1 ) ); From 28ca9f1ec4a2cdf6e33e3f10caddbd5b457b1a00 Mon Sep 17 00:00:00 2001 From: Brent Shepherd Date: Thu, 17 Jan 2019 15:17:15 +1000 Subject: [PATCH 10/26] Remove unused $wpdb --- includes/data-stores/class-wc-webhook-data-store.php | 1 - 1 file changed, 1 deletion(-) diff --git a/includes/data-stores/class-wc-webhook-data-store.php b/includes/data-stores/class-wc-webhook-data-store.php index f83bddf80aa..56032e69f26 100644 --- a/includes/data-stores/class-wc-webhook-data-store.php +++ b/includes/data-stores/class-wc-webhook-data-store.php @@ -206,7 +206,6 @@ class WC_Webhook_Data_Store implements WC_Webhook_Data_Store_Interface { * @return int[] */ public function get_webhooks_ids( $status = '', $limit = null ) { - global $wpdb; if ( ! empty( $status ) ) { $this->validate_status( $status ); From 2ed2572afeafbc108a491c21cc6a6daa2b676be3 Mon Sep 17 00:00:00 2001 From: Brent Shepherd Date: Thu, 17 Jan 2019 15:55:54 +1000 Subject: [PATCH 11/26] Clear webhook transients when status changes Background discussion: https://github.com/woocommerce/woocommerce/pull/21427#discussion_r246881785 --- includes/data-stores/class-wc-webhook-data-store.php | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/includes/data-stores/class-wc-webhook-data-store.php b/includes/data-stores/class-wc-webhook-data-store.php index 56032e69f26..2a98cd37958 100644 --- a/includes/data-stores/class-wc-webhook-data-store.php +++ b/includes/data-stores/class-wc-webhook-data-store.php @@ -152,6 +152,10 @@ class WC_Webhook_Data_Store implements WC_Webhook_Data_Store_Interface { $webhook->apply_changes(); + if ( isset( $changes['status'] ) ) { + // We need to delete all transients, because we can't be sure of the old status. + $this->delete_transients( 'all' ); + } wp_cache_delete( $webhook->get_id(), 'webhooks' ); WC_Cache_Helper::incr_cache_prefix( 'webhooks' ); From d2682170fdff3c8daebb1077927185a186e180f1 Mon Sep 17 00:00:00 2001 From: Mike Jolley Date: Mon, 18 Feb 2019 12:49:07 +0000 Subject: [PATCH 12/26] Set woocommerce_load_webhooks_limit to no limit --- includes/class-woocommerce.php | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/includes/class-woocommerce.php b/includes/class-woocommerce.php index 259f2094b23..fac76f4a4ae 100644 --- a/includes/class-woocommerce.php +++ b/includes/class-woocommerce.php @@ -644,7 +644,13 @@ final class WooCommerce { return; } - $limit = apply_filters( 'woocommerce_load_webhooks_limit', 100 ); + /** + * Hook: woocommerce_load_webhooks_limit. + * + * @since 3.6.0 + * @param int $limit Used to limit how many webhooks are loaded. Default: no limit. + */ + $limit = apply_filters( 'woocommerce_load_webhooks_limit', null ); wc_load_webhooks( 'active', $limit ); } From a66293435568c3fd4720b270bad14f0b244c9e41 Mon Sep 17 00:00:00 2001 From: Mike Jolley Date: Mon, 18 Feb 2019 12:53:59 +0000 Subject: [PATCH 13/26] phpcs --- includes/class-woocommerce.php | 2 +- includes/wc-webhook-functions.php | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/includes/class-woocommerce.php b/includes/class-woocommerce.php index fac76f4a4ae..ef6ef27b96e 100644 --- a/includes/class-woocommerce.php +++ b/includes/class-woocommerce.php @@ -183,7 +183,7 @@ final class WooCommerce { */ public function log_errors() { $error = error_get_last(); - if ( in_array( $error['type'], array( E_ERROR, E_PARSE, E_COMPILE_ERROR, E_USER_ERROR, E_RECOVERABLE_ERROR ) ) ) { + if ( in_array( $error['type'], array( E_ERROR, E_PARSE, E_COMPILE_ERROR, E_USER_ERROR, E_RECOVERABLE_ERROR ), true ) ) { $logger = wc_get_logger(); $logger->critical( /* translators: 1: error message 2: file name and path 3: line number */ diff --git a/includes/wc-webhook-functions.php b/includes/wc-webhook-functions.php index aab46c13a9d..faa1aad7674 100644 --- a/includes/wc-webhook-functions.php +++ b/includes/wc-webhook-functions.php @@ -65,7 +65,7 @@ add_action( 'woocommerce_deliver_webhook_async', 'wc_deliver_webhook_async', 10, * @return bool */ function wc_is_webhook_valid_topic( $topic ) { - $invalid_topics = array( + $invalid_topics = array( 'action.woocommerce_login_credentials', 'action.woocommerce_product_csv_importer_check_import_file_path', 'action.woocommerce_webhook_should_deliver', From 1d46294ee8b0097321c77b4db1eec0fdecc4327c Mon Sep 17 00:00:00 2001 From: Mike Jolley Date: Mon, 18 Feb 2019 13:07:04 +0000 Subject: [PATCH 14/26] Update versions --- includes/data-stores/class-wc-webhook-data-store.php | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/includes/data-stores/class-wc-webhook-data-store.php b/includes/data-stores/class-wc-webhook-data-store.php index 2a98cd37958..62f5f9bf1af 100644 --- a/includes/data-stores/class-wc-webhook-data-store.php +++ b/includes/data-stores/class-wc-webhook-data-store.php @@ -201,12 +201,12 @@ class WC_Webhook_Data_Store implements WC_Webhook_Data_Store_Interface { } /** - * Get all webhooks IDs. + * Get webhooks IDs from the database. * * @since 3.3.0 * @throws InvalidArgumentException If a $status value is passed in that is not in the known wc_get_webhook_statuses() keys. - * @param string $status Optional - status to filter results by. Must be a key in return value of @see wc_get_webhook_statuses(). @since 3.5.0. - * @param null|int $limit Limit returned results. @since 3.5.0. + * @param string $status Optional - status to filter results by. Must be a key in return value of @see wc_get_webhook_statuses(). @since 3.6.0. + * @param null|int $limit Limit returned results. @since 3.6.0. * @return int[] */ public function get_webhooks_ids( $status = '', $limit = null ) { @@ -372,7 +372,7 @@ class WC_Webhook_Data_Store implements WC_Webhook_Data_Store_Interface { /** * Check if a given string is in known statuses, based on return value of @see wc_get_webhook_statuses(). * - * @since 3.5.0 + * @since 3.6.0 * @throws InvalidArgumentException If $status is not empty and not in the known wc_get_webhook_statuses() keys. * @param string $status Status to check. */ @@ -385,7 +385,7 @@ class WC_Webhook_Data_Store implements WC_Webhook_Data_Store_Interface { /** * Get the transient key used to cache a set of webhook IDs, optionally filtered by status. * - * @since 3.5.0 + * @since 3.6.0 * @param string $status Optional - status of cache key. * @return string */ @@ -396,7 +396,7 @@ class WC_Webhook_Data_Store implements WC_Webhook_Data_Store_Interface { /** * Delete the transients used to cache a set of webhook IDs, optionally filtered by status. * - * @since 3.5.0 + * @since 3.6.0 * @param string $status Optional - status of cache to delete, or 'all' to delete all caches. */ private function delete_transients( $status = '' ) { From 30db8a8d9cb61182d103f3f338cca056c6400c06 Mon Sep 17 00:00:00 2001 From: Mike Jolley Date: Mon, 18 Feb 2019 13:07:57 +0000 Subject: [PATCH 15/26] version comment --- includes/wc-webhook-functions.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/includes/wc-webhook-functions.php b/includes/wc-webhook-functions.php index faa1aad7674..a30be5b4504 100644 --- a/includes/wc-webhook-functions.php +++ b/includes/wc-webhook-functions.php @@ -130,7 +130,7 @@ function wc_get_webhook_statuses() { * @since 3.3.0 * @throws Exception If webhook cannot be read/found and $data parameter of WC_Webhook class constructor is set. * @param string $status Optional - status to filter results by. Must be a key in return value of @see wc_get_webhook_statuses(). @since 3.5.0. - * @param null|int $limit Limit number of webhooks loaded. @since 3.5.0. + * @param null|int $limit Limit number of webhooks loaded. @since 3.6.0. * @return bool */ function wc_load_webhooks( $status = '', $limit = null ) { From 0c53145f2b202e02394ef6ceb43b03aa4716729c Mon Sep 17 00:00:00 2001 From: Mike Jolley Date: Mon, 18 Feb 2019 13:13:59 +0000 Subject: [PATCH 16/26] Removed limit option from get_webhooks_ids - since transient stores all ids anyway, this logic makes more sense elsewhere --- includes/data-stores/class-wc-webhook-data-store.php | 10 ++-------- .../class-wc-webhooks-data-store-interface.php | 5 ++--- includes/wc-webhook-functions.php | 2 +- 3 files changed, 5 insertions(+), 12 deletions(-) diff --git a/includes/data-stores/class-wc-webhook-data-store.php b/includes/data-stores/class-wc-webhook-data-store.php index 62f5f9bf1af..278f008da1c 100644 --- a/includes/data-stores/class-wc-webhook-data-store.php +++ b/includes/data-stores/class-wc-webhook-data-store.php @@ -206,11 +206,9 @@ class WC_Webhook_Data_Store implements WC_Webhook_Data_Store_Interface { * @since 3.3.0 * @throws InvalidArgumentException If a $status value is passed in that is not in the known wc_get_webhook_statuses() keys. * @param string $status Optional - status to filter results by. Must be a key in return value of @see wc_get_webhook_statuses(). @since 3.6.0. - * @param null|int $limit Limit returned results. @since 3.6.0. * @return int[] */ - public function get_webhooks_ids( $status = '', $limit = null ) { - + public function get_webhooks_ids( $status = '' ) { if ( ! empty( $status ) ) { $this->validate_status( $status ); } @@ -224,14 +222,10 @@ class WC_Webhook_Data_Store implements WC_Webhook_Data_Store_Interface { 'status' => $status, ) ); - $ids = array_map( 'intval', $ids ); + $ids = array_map( 'absint', $ids ); set_transient( $this->get_transient_key( $status ), $ids ); } - if ( null !== $limit && $limit > 0 ) { - $ids = array_slice( $ids, 0, absint( $limit ) ); - } - return $ids; } diff --git a/includes/interfaces/class-wc-webhooks-data-store-interface.php b/includes/interfaces/class-wc-webhooks-data-store-interface.php index 7ffdd5fd980..d80c5f5b937 100644 --- a/includes/interfaces/class-wc-webhooks-data-store-interface.php +++ b/includes/interfaces/class-wc-webhooks-data-store-interface.php @@ -29,9 +29,8 @@ interface WC_Webhook_Data_Store_Interface { * * @since 3.2.0 * @throws InvalidArgumentException If a $status value is passed in that is not in the known wc_get_webhook_statuses() keys. - * @param string $status Optional - status to filter results by. Must be a key in return value of @see wc_get_webhook_statuses(). @since 3.5.0. - * @param null|int $limit Limit returned results. @since 3.5.0. + * @param string $status Optional - status to filter results by. Must be a key in return value of @see wc_get_webhook_statuses(). @since 3.6.0. * @return int[] */ - public function get_webhooks_ids( $status = '', $limit = null ); + public function get_webhooks_ids( $status = '' ); } diff --git a/includes/wc-webhook-functions.php b/includes/wc-webhook-functions.php index a30be5b4504..807d23f1f8f 100644 --- a/includes/wc-webhook-functions.php +++ b/includes/wc-webhook-functions.php @@ -135,7 +135,7 @@ function wc_get_webhook_statuses() { */ function wc_load_webhooks( $status = '', $limit = null ) { $data_store = WC_Data_Store::load( 'webhook' ); - $webhooks = $data_store->get_webhooks_ids( $status, $limit ); + $webhooks = $data_store->get_webhooks_ids( $status ); $loaded = false; foreach ( $webhooks as $webhook_id ) { From d0438264ff6b6c9e56273acf0b38dca7be930c50 Mon Sep 17 00:00:00 2001 From: Mike Jolley Date: Mon, 18 Feb 2019 13:15:32 +0000 Subject: [PATCH 17/26] Add limit to wc_load_webhooks --- includes/wc-webhook-functions.php | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/includes/wc-webhook-functions.php b/includes/wc-webhook-functions.php index 807d23f1f8f..88150e391b5 100644 --- a/includes/wc-webhook-functions.php +++ b/includes/wc-webhook-functions.php @@ -136,15 +136,19 @@ function wc_get_webhook_statuses() { function wc_load_webhooks( $status = '', $limit = null ) { $data_store = WC_Data_Store::load( 'webhook' ); $webhooks = $data_store->get_webhooks_ids( $status ); - $loaded = false; + $loaded = 0; foreach ( $webhooks as $webhook_id ) { $webhook = new WC_Webhook( $webhook_id ); $webhook->enqueue(); - $loaded = true; + $loaded ++; + + if ( $loaded >= $limit ) { + break; + } } - return $loaded; + return 0 < $loaded; } /** From 3a4ef0a1d8d5b7930652bda0d445f32d3195bef5 Mon Sep 17 00:00:00 2001 From: Mike Jolley Date: Mon, 18 Feb 2019 13:19:12 +0000 Subject: [PATCH 18/26] Avoid getting all webhook ids --- includes/admin/class-wc-admin-webhooks.php | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/includes/admin/class-wc-admin-webhooks.php b/includes/admin/class-wc-admin-webhooks.php index c4216044c3e..d96feed1844 100644 --- a/includes/admin/class-wc-admin-webhooks.php +++ b/includes/admin/class-wc-admin-webhooks.php @@ -270,8 +270,9 @@ class WC_Admin_Webhooks { echo '

' . esc_html__( 'Webhooks', 'woocommerce' ) . ' ' . esc_html__( 'Add webhook', 'woocommerce' ) . '

'; // Get the webhooks count. - $data_store = WC_Data_Store::load( 'webhook' ); - $count = count( $data_store->get_webhooks_ids() ); + $data_store = WC_Data_Store::load( 'webhook' ); + $num_webhooks = $data_store->get_count_webhooks_by_status(); + $count = array_sum( $num_webhooks ); if ( 0 < $count ) { $webhooks_table_list->process_bulk_action(); From d787c34206c8f7b33e7b68a9c9e50451f3292631 Mon Sep 17 00:00:00 2001 From: Mike Jolley Date: Mon, 18 Feb 2019 13:34:13 +0000 Subject: [PATCH 19/26] get_webhooks_ids escaping --- .../class-wc-webhook-data-store.php | 29 +++++++++---------- 1 file changed, 13 insertions(+), 16 deletions(-) diff --git a/includes/data-stores/class-wc-webhook-data-store.php b/includes/data-stores/class-wc-webhook-data-store.php index 278f008da1c..62e000a0a85 100644 --- a/includes/data-stores/class-wc-webhook-data-store.php +++ b/includes/data-stores/class-wc-webhook-data-store.php @@ -205,7 +205,7 @@ class WC_Webhook_Data_Store implements WC_Webhook_Data_Store_Interface { * * @since 3.3.0 * @throws InvalidArgumentException If a $status value is passed in that is not in the known wc_get_webhook_statuses() keys. - * @param string $status Optional - status to filter results by. Must be a key in return value of @see wc_get_webhook_statuses(). @since 3.6.0. + * @param string $status Optional - status to filter results by. Must be a key in return value of @see wc_get_webhook_statuses(). @since 3.6.0. * @return int[] */ public function get_webhooks_ids( $status = '' ) { @@ -271,15 +271,15 @@ class WC_Webhook_Data_Store implements WC_Webhook_Data_Store_Interface { 'post_modified' => 'date_modified_gmt', ); $orderby = isset( $orderby_mapping[ $args['orderby'] ] ) ? $orderby_mapping[ $args['orderby'] ] : 'webhook_id'; - - $limit = -1 < $args['limit'] ? sprintf( 'LIMIT %d', $args['limit'] ) : ''; - $offset = 0 < $args['offset'] ? sprintf( 'OFFSET %d', $args['offset'] ) : ''; - $status = ! empty( $args['status'] ) ? "AND `status` = '" . sanitize_key( isset( $statuses[ $args['status'] ] ) ? $statuses[ $args['status'] ] : $args['status'] ) . "'" : ''; - $search = ! empty( $args['search'] ) ? "AND `name` LIKE '%" . $wpdb->esc_like( sanitize_text_field( $args['search'] ) ) . "%'" : ''; - $include = ''; - $exclude = ''; - $date_created = ''; - $date_modified = ''; + $order = "ORDER BY {$orderby} " . esc_sql( strtoupper( $args['order'] ) ); + $limit = -1 < $args['limit'] ? $wpdb->prepare( 'LIMIT %d', $args['limit'] ) : ''; + $offset = 0 < $args['offset'] ? $wpdb->prepare( 'OFFSET %d', $args['offset'] ) : ''; + $status = ! empty( $args['status'] ) ? $wpdb->prepare( 'AND `status` = %s', isset( $statuses[ $args['status'] ] ) ? $statuses[ $args['status'] ] : $args['status'] ) : ''; + $search = ! empty( $args['search'] ) ? "AND `name` LIKE '%" . $wpdb->esc_like( sanitize_text_field( $args['search'] ) ) . "%'" : ''; + $include = ''; + $exclude = ''; + $date_created = ''; + $date_modified = ''; if ( ! empty( $args['include'] ) ) { $args['include'] = implode( ',', wp_parse_id_list( $args['include'] ) ); @@ -295,18 +295,16 @@ class WC_Webhook_Data_Store implements WC_Webhook_Data_Store_Interface { $args['after'] = empty( $args['after'] ) ? '0000-00-00' : $args['after']; $args['before'] = empty( $args['before'] ) ? current_time( 'mysql', 1 ) : $args['before']; - $date_created = "AND `date_created_gmt` BETWEEN STR_TO_DATE('" . $args['after'] . "', '%Y-%m-%d %H:%i:%s') and STR_TO_DATE('" . $args['before'] . "', '%Y-%m-%d %H:%i:%s')"; + $date_created = "AND `date_created_gmt` BETWEEN STR_TO_DATE('" . esc_sql( $args['after'] ) . "', '%Y-%m-%d %H:%i:%s') and STR_TO_DATE('" . esc_sql( $args['before'] ) . "', '%Y-%m-%d %H:%i:%s')"; } if ( ! empty( $args['modified_after'] ) || ! empty( $args['modified_before'] ) ) { $args['modified_after'] = empty( $args['modified_after'] ) ? '0000-00-00' : $args['modified_after']; $args['modified_before'] = empty( $args['modified_before'] ) ? current_time( 'mysql', 1 ) : $args['modified_before']; - $date_modified = "AND `date_modified_gmt` BETWEEN STR_TO_DATE('" . $args['modified_after'] . "', '%Y-%m-%d %H:%i:%s') and STR_TO_DATE('" . $args['modified_before'] . "', '%Y-%m-%d %H:%i:%s')"; + $date_modified = "AND `date_modified_gmt` BETWEEN STR_TO_DATE('" . esc_sql( $args['modified_after'] ) . "', '%Y-%m-%d %H:%i:%s') and STR_TO_DATE('" . esc_sql( $args['modified_before'] ) . "', '%Y-%m-%d %H:%i:%s')"; } - $order = "ORDER BY {$orderby} " . strtoupper( sanitize_key( $args['order'] ) ); - // Check for cache. $cache_key = WC_Cache_Helper::get_cache_prefix( 'webhooks' ) . 'search_webhooks' . md5( implode( ',', $args ) ); $ids = wp_cache_get( $cache_key, 'webhook_search_results' ); @@ -330,9 +328,8 @@ class WC_Webhook_Data_Store implements WC_Webhook_Data_Store_Interface { {$offset}" ); - $results = $wpdb->get_results( $query ); // WPCS: cache ok, DB call ok, unprepared SQL ok. + $ids = wp_parse_id_list( $wpdb->get_col( $query ) ); // phpcs:ignore WordPress.DB.PreparedSQL.NotPrepared - $ids = wp_list_pluck( $results, 'webhook_id' ); wp_cache_set( $cache_key, $ids, 'webhook_search_results' ); return $ids; From 14149e4d54de12338dc2b63cc45bf88de7faeb67 Mon Sep 17 00:00:00 2001 From: Mike Jolley Date: Mon, 18 Feb 2019 13:41:06 +0000 Subject: [PATCH 20/26] phpcs --- includes/admin/class-wc-admin-webhooks-table-list.php | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) diff --git a/includes/admin/class-wc-admin-webhooks-table-list.php b/includes/admin/class-wc-admin-webhooks-table-list.php index 5650228026c..dc0993bf979 100644 --- a/includes/admin/class-wc-admin-webhooks-table-list.php +++ b/includes/admin/class-wc-admin-webhooks-table-list.php @@ -86,8 +86,10 @@ class WC_Admin_Webhooks_Table_List extends WP_List_Table { add_query_arg( array( 'delete' => $webhook->get_id(), - ), admin_url( 'admin.php?page=wc-settings&tab=advanced§ion=webhooks' ) - ), 'delete-webhook' + ), + admin_url( 'admin.php?page=wc-settings&tab=advanced§ion=webhooks' ) + ), + 'delete-webhook' ) ) . '">' . esc_html__( 'Delete permanently', 'woocommerce' ) . '', ); @@ -262,7 +264,10 @@ class WC_Admin_Webhooks_Table_List extends WP_List_Table { echo ''; echo ''; submit_button( - $text, '', '', false, + $text, + '', + '', + false, array( 'id' => 'search-submit', ) From 4b3c1660f1fdaf56b499117fdc3f8e74faa02d0b Mon Sep 17 00:00:00 2001 From: Mike Jolley Date: Mon, 18 Feb 2019 13:41:14 +0000 Subject: [PATCH 21/26] Dedicated count method --- .../class-wc-webhook-data-store.php | 32 +++++++++++++------ 1 file changed, 22 insertions(+), 10 deletions(-) diff --git a/includes/data-stores/class-wc-webhook-data-store.php b/includes/data-stores/class-wc-webhook-data-store.php index 62e000a0a85..f621d4154c7 100644 --- a/includes/data-stores/class-wc-webhook-data-store.php +++ b/includes/data-stores/class-wc-webhook-data-store.php @@ -335,6 +335,27 @@ class WC_Webhook_Data_Store implements WC_Webhook_Data_Store_Interface { return $ids; } + /** + * Count webhooks. + * + * @since 3.6.0 + * @param string $status Status to count. + * @return int + */ + protected function get_webhook_count( $status = 'active' ) { + global $wpdb; + + $count = wp_cache_get( $status . '_count', 'webhooks' ); + + if ( false === $count ) { + $count = absint( $wpdb->get_var( $wpdb->prepare( "SELECT count( webhook_id ) FROM {$wpdb->prefix}wc_webhooks WHERE `status` = %s;", $status ) ) ); + + wp_cache_add( $status . '_count', $count, 'webhooks' ); + } + + return $count; + } + /** * Get total webhook counts by status. * @@ -345,16 +366,7 @@ class WC_Webhook_Data_Store implements WC_Webhook_Data_Store_Interface { $counts = array(); foreach ( $statuses as $status ) { - $count = count( - $this->search_webhooks( - array( - 'limit' => -1, - 'status' => $status, - ) - ) - ); - - $counts[ $status ] = $count; + $counts[ $status ] = $this->get_webhook_count( $status ); } return $counts; From 71d3121872d8198c7e5846f84546eee060326547 Mon Sep 17 00:00:00 2001 From: Mike Jolley Date: Mon, 18 Feb 2019 14:58:32 +0000 Subject: [PATCH 22/26] Performance: Support pagination to avoid double queries to search webhooks --- .../class-wc-admin-webhooks-table-list.php | 13 ++- .../api/legacy/v2/class-wc-api-webhooks.php | 23 ++---- .../api/legacy/v3/class-wc-api-webhooks.php | 23 ++---- .../v1/class-wc-rest-webhooks-controller.php | 31 ++++---- .../class-wc-webhook-data-store.php | 79 +++++++++++++------ 5 files changed, 82 insertions(+), 87 deletions(-) diff --git a/includes/admin/class-wc-admin-webhooks-table-list.php b/includes/admin/class-wc-admin-webhooks-table-list.php index dc0993bf979..d2c6ea5bbc1 100644 --- a/includes/admin/class-wc-admin-webhooks-table-list.php +++ b/includes/admin/class-wc-admin-webhooks-table-list.php @@ -297,22 +297,19 @@ class WC_Admin_Webhooks_Table_List extends WP_List_Table { $args['search'] = sanitize_text_field( wp_unslash( $_REQUEST['s'] ) ); // WPCS: input var okay, CSRF ok. } + $args['paginate'] = true; + // Get the webhooks. $data_store = WC_Data_Store::load( 'webhook' ); $webhooks = $data_store->search_webhooks( $args ); - $this->items = array_map( 'wc_get_webhook', $webhooks ); - - // Get total items. - $args['limit'] = -1; - $args['offset'] = 0; - $total_items = count( $data_store->search_webhooks( $args ) ); + $this->items = array_map( 'wc_get_webhook', $webhooks->webhooks ); // Set the pagination. $this->set_pagination_args( array( - 'total_items' => $total_items, + 'total_items' => $webhooks->total, 'per_page' => $per_page, - 'total_pages' => ceil( $total_items / $per_page ), + 'total_pages' => $webhooks->max_num_pages, ) ); } diff --git a/includes/api/legacy/v2/class-wc-api-webhooks.php b/includes/api/legacy/v2/class-wc-api-webhooks.php index 543caa9d77b..877cb8193ad 100644 --- a/includes/api/legacy/v2/class-wc-api-webhooks.php +++ b/includes/api/legacy/v2/class-wc-api-webhooks.php @@ -326,21 +326,6 @@ class WC_API_Webhooks extends WC_API_Resource { return $webhook->delete( true ); } - /** - * Get webhooks total results - * - * @since 3.3.0 - * @param array $args Request arguments for filtering query. - * @return array - */ - private function get_webhooks_total_results( $args = array() ) { - $data_store = WC_Data_Store::load( 'webhook' ); - $args['limit'] = -1; - $args['offset'] = 0; - - return count( $data_store->search_webhooks( $args ) ); - } - /** * Helper method to get webhook post objects * @@ -390,6 +375,8 @@ class WC_API_Webhooks extends WC_API_Resource { unset( $args['date_query'] ); } + $args['paginate'] = true; + // Get the webhooks. $data_store = WC_Data_Store::load( 'webhook' ); $results = $data_store->search_webhooks( $args ); @@ -397,12 +384,12 @@ class WC_API_Webhooks extends WC_API_Resource { // Get total items. $headers = new stdClass; $headers->page = $page; - $headers->total = $this->get_webhooks_total_results( $args ); + $headers->total = $results->total; $headers->is_single = $args['limit'] > $headers->total; - $headers->total_pages = ceil( $headers->total / $args['limit'] ); + $headers->total_pages = $results->max_num_pages; return array( - 'results' => $results, + 'results' => $results->webhooks, 'headers' => $headers, ); } diff --git a/includes/api/legacy/v3/class-wc-api-webhooks.php b/includes/api/legacy/v3/class-wc-api-webhooks.php index 543caa9d77b..877cb8193ad 100644 --- a/includes/api/legacy/v3/class-wc-api-webhooks.php +++ b/includes/api/legacy/v3/class-wc-api-webhooks.php @@ -326,21 +326,6 @@ class WC_API_Webhooks extends WC_API_Resource { return $webhook->delete( true ); } - /** - * Get webhooks total results - * - * @since 3.3.0 - * @param array $args Request arguments for filtering query. - * @return array - */ - private function get_webhooks_total_results( $args = array() ) { - $data_store = WC_Data_Store::load( 'webhook' ); - $args['limit'] = -1; - $args['offset'] = 0; - - return count( $data_store->search_webhooks( $args ) ); - } - /** * Helper method to get webhook post objects * @@ -390,6 +375,8 @@ class WC_API_Webhooks extends WC_API_Resource { unset( $args['date_query'] ); } + $args['paginate'] = true; + // Get the webhooks. $data_store = WC_Data_Store::load( 'webhook' ); $results = $data_store->search_webhooks( $args ); @@ -397,12 +384,12 @@ class WC_API_Webhooks extends WC_API_Resource { // Get total items. $headers = new stdClass; $headers->page = $page; - $headers->total = $this->get_webhooks_total_results( $args ); + $headers->total = $results->total; $headers->is_single = $args['limit'] > $headers->total; - $headers->total_pages = ceil( $headers->total / $args['limit'] ); + $headers->total_pages = $results->max_num_pages; return array( - 'results' => $results, + 'results' => $results->webhooks, 'headers' => $headers, ); } diff --git a/includes/api/v1/class-wc-rest-webhooks-controller.php b/includes/api/v1/class-wc-rest-webhooks-controller.php index 5971bfcfc12..7ebb28edffd 100644 --- a/includes/api/v1/class-wc-rest-webhooks-controller.php +++ b/includes/api/v1/class-wc-rest-webhooks-controller.php @@ -247,32 +247,29 @@ class WC_REST_Webhooks_V1_Controller extends WC_REST_Controller { */ $prepared_args = apply_filters( 'woocommerce_rest_webhook_query', $args, $request ); unset( $prepared_args['page'] ); + $prepared_args['paginate'] = true; // Get the webhooks. - $data_store = WC_Data_Store::load( 'webhook' ); - $results = $data_store->search_webhooks( $prepared_args ); + $webhooks = array(); + $data_store = WC_Data_Store::load( 'webhook' ); + $results = $data_store->search_webhooks( $prepared_args ); + $webhook_ids = $results->webhooks; - $webhooks = array(); - foreach ( $results as $webhook_id ) { + foreach ( $webhook_ids as $webhook_id ) { $data = $this->prepare_item_for_response( $webhook_id, $request ); $webhooks[] = $this->prepare_response_for_collection( $data ); } - $response = rest_ensure_response( $webhooks ); + $response = rest_ensure_response( $webhooks ); + $per_page = (int) $prepared_args['limit']; + $page = ceil( ( ( (int) $prepared_args['offset'] ) / $per_page ) + 1 ); + $total_webhooks = $results->total; + $max_pages = $results->max_num_pages; + $base = add_query_arg( $request->get_query_params(), rest_url( sprintf( '/%s/%s', $this->namespace, $this->rest_base ) ) ); - // Store pagination values for headers then unset for count query. - $per_page = (int) $prepared_args['limit']; - $page = ceil( ( ( (int) $prepared_args['offset'] ) / $per_page ) + 1 ); + $response->header( 'X-WP-Total', $total_webhooks ); + $response->header( 'X-WP-TotalPages', $max_pages ); - // Calculate totals. - $prepared_args['limit'] = -1; - $prepared_args['offset'] = 0; - $total_webhooks = count( $data_store->search_webhooks( $prepared_args ) ); - $response->header( 'X-WP-Total', (int) $total_webhooks ); - $max_pages = ceil( $total_webhooks / $per_page ); - $response->header( 'X-WP-TotalPages', (int) $max_pages ); - - $base = add_query_arg( $request->get_query_params(), rest_url( sprintf( '/%s/%s', $this->namespace, $this->rest_base ) ) ); if ( $page > 1 ) { $prev_page = $page - 1; if ( $prev_page > $max_pages ) { diff --git a/includes/data-stores/class-wc-webhook-data-store.php b/includes/data-stores/class-wc-webhook-data-store.php index f621d4154c7..27f9b285fc2 100644 --- a/includes/data-stores/class-wc-webhook-data-store.php +++ b/includes/data-stores/class-wc-webhook-data-store.php @@ -233,7 +233,7 @@ class WC_Webhook_Data_Store implements WC_Webhook_Data_Store_Interface { * Search webhooks. * * @param array $args Search arguments. - * @return array + * @return array|object */ public function search_webhooks( $args ) { global $wpdb; @@ -241,10 +241,11 @@ class WC_Webhook_Data_Store implements WC_Webhook_Data_Store_Interface { $args = wp_parse_args( $args, array( - 'limit' => 10, - 'offset' => 0, - 'order' => 'DESC', - 'orderby' => 'id', + 'limit' => 10, + 'offset' => 0, + 'order' => 'DESC', + 'orderby' => 'id', + 'paginate' => false, ) ); @@ -306,33 +307,59 @@ class WC_Webhook_Data_Store implements WC_Webhook_Data_Store_Interface { } // Check for cache. - $cache_key = WC_Cache_Helper::get_cache_prefix( 'webhooks' ) . 'search_webhooks' . md5( implode( ',', $args ) ); - $ids = wp_cache_get( $cache_key, 'webhook_search_results' ); + $cache_key = WC_Cache_Helper::get_cache_prefix( 'webhooks' ) . 'search_webhooks' . md5( implode( ',', $args ) ); + $cache_value = wp_cache_get( $cache_key, 'webhook_search_results' ); - if ( false !== $ids ) { - return $ids; + if ( $cache_value ) { + return $cache_value; } - $query = trim( - "SELECT webhook_id - FROM {$wpdb->prefix}wc_webhooks - WHERE 1=1 - {$status} - {$search} - {$include} - {$exclude} - {$date_created} - {$date_modified} - {$order} - {$limit} - {$offset}" - ); + if ( $args['paginate'] ) { + $query = trim( + "SELECT SQL_CALC_FOUND_ROWS webhook_id + FROM {$wpdb->prefix}wc_webhooks + WHERE 1=1 + {$status} + {$search} + {$include} + {$exclude} + {$date_created} + {$date_modified} + {$order} + {$limit} + {$offset}" + ); - $ids = wp_parse_id_list( $wpdb->get_col( $query ) ); // phpcs:ignore WordPress.DB.PreparedSQL.NotPrepared + $webhook_ids = wp_parse_id_list( $wpdb->get_col( $query ) ); // phpcs:ignore WordPress.DB.PreparedSQL.NotPrepared + $total = (int) $wpdb->get_var( 'SELECT FOUND_ROWS();' ); + $return_value = (object) array( + 'webhooks' => $webhook_ids, + 'total' => $total, + 'max_num_pages' => $args['limit'] > 1 ? ceil( $total / $args['limit'] ) : 1, + ); + } else { + $query = trim( + "SELECT webhook_id + FROM {$wpdb->prefix}wc_webhooks + WHERE 1=1 + {$status} + {$search} + {$include} + {$exclude} + {$date_created} + {$date_modified} + {$order} + {$limit} + {$offset}" + ); - wp_cache_set( $cache_key, $ids, 'webhook_search_results' ); + $webhook_ids = wp_parse_id_list( $wpdb->get_col( $query ) ); // phpcs:ignore WordPress.DB.PreparedSQL.NotPrepared + $return_value = $webhook_ids; + } - return $ids; + wp_cache_set( $cache_key, $return_value, 'webhook_search_results' ); + + return $return_value; } /** From 06ee00c3dae4235d2d8a69bb7d4c3f681e575177 Mon Sep 17 00:00:00 2001 From: Mike Jolley Date: Mon, 18 Feb 2019 15:05:48 +0000 Subject: [PATCH 23/26] Update from master --- assets/css/activation.scss | 14 +- assets/css/admin.scss | 12556 +++++++++++++++-------------- assets/css/twenty-seventeen.scss | 249 +- assets/css/woocommerce.scss | 284 +- 4 files changed, 6866 insertions(+), 6237 deletions(-) diff --git a/assets/css/activation.scss b/assets/css/activation.scss index 7279e617b07..2674c9589ad 100644 --- a/assets/css/activation.scss +++ b/assets/css/activation.scss @@ -14,6 +14,7 @@ div.woocommerce-message { p.woocommerce-actions, .woocommerce-message { + .button-primary { background: #bb77ae; border-color: #a36597; @@ -21,7 +22,9 @@ p.woocommerce-actions, color: #fff; text-shadow: 0 -1px 1px #a36597, 1px 0 1px #a36597, 0 1px 1px #a36597, -1px 0 1px #a36597; - &:hover, &:focus, &:active { + &:hover, + &:focus, + &:active { background: #a36597; border-color: #a36597; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; @@ -33,11 +36,12 @@ p.woocommerce-actions, float: right; top: 0; right: 0; - padding: 0px 15px 10px 28px; + padding: 0 15px 10px 28px; margin-top: -10px; font-size: 13px; line-height: 1.23076923; text-decoration: none; + &::before { position: relative; top: 18px; @@ -67,6 +71,7 @@ div.woocommerce-legacy-shipping-notice, div.woocommerce-no-shipping-methods-notice { overflow: hidden; padding: 1px 12px; + p { position: relative; z-index: 1; @@ -77,9 +82,10 @@ div.woocommerce-no-shipping-methods-notice { font-size: 1.1em; } } + &::before { - content: '\e01b'; - font-family: 'WooCommerce'; + content: "\e01b"; + font-family: "WooCommerce"; text-align: center; line-height: 1; color: #f7f1f6; diff --git a/assets/css/admin.scss b/assets/css/admin.scss index ec4dcc27f95..7f78b2cd538 100644 --- a/assets/css/admin.scss +++ b/assets/css/admin.scss @@ -7,733 +7,749 @@ /** * Imports */ - @import 'mixins'; - @import 'variables'; - @import 'animation'; - @import 'fonts'; +@import "mixins"; +@import "variables"; +@import "animation"; +@import "fonts"; - /** +/** * Styling begins */ - .blockUI.blockOverlay { - @include loader(); - } - - .wc_addons_wrap { - max-width: 1200px; - - h1.search-form-title { - clear: left; - padding: 0; - } - - form.search-form { - clear: both; - display: block; - position: relative; - margin-top: 1em; - margin-bottom: 1em; - - input { - border: 1px solid #ddd; - box-shadow: none; - height: 53px; - padding-left: 50px; - width: 100%; - margin: 0; - } - - button { - background: none; - border: none; - cursor: pointer; - height: 53px; - position: absolute; - width: 53px; - } - } - - .update-plugins .update-count { - background-color: #d54e21; - border-radius: 10px; - color: #fff; - display: inline-block; - font-size: 9px; - font-weight: 600; - line-height: 17px; - margin: 1px 0 0 2px; - padding: 0 6px; - vertical-align: text-top; - } - - .addons-featured { - margin: 0; - } - - ul.subsubsub.subsubsub { - margin: -2px 0 12px; - } - - .subsubsub li::after { - content: '|'; - } - - .subsubsub li:last-child::after { - content: ''; - } - - .addons-banner-block-item-icon, - .addons-column-block-item-icon { - align-items: center; - display: flex; - justify-content: center; - } - - .addons-banner-block, - .addons-wcs-banner-block { - background: #ffffff; - border: 1px solid #ddd; - margin: 0 0 1em 0; - padding: 2em 2em 1em; - } - - .addons-banner-block img { - height: 62px; - } - - .addons-banner-block p { - margin: 0 0 20px; - } - - .addons-banner-block-items { - display: flex; - flex-direction: row; - flex-wrap: wrap; - justify-content: space-around; - margin: 0 -10px 0 -10px; - } - - .addons-banner-block-item { - border: 1px solid #e6e6e6; - border-radius: 3px; - flex: 1; - margin: 1em; - min-width: 200px; - width: 30%; - } - - .addons-banner-block-item-icon { - background: #f7f7f7; - height: 143px; - } - - .addons-banner-block-item-content { - display: flex; - flex-direction: column; - height: 184px; - justify-content: space-between; - padding: 24px; - } - - .addons-banner-block-item-content h3 { - margin-top: 0; - } - - .addons-banner-block-item-content p { - margin: 0 0 auto; - } - - .addons-wcs-banner-block { - display: flex; - align-items: center; - } - - .addons-wcs-banner-block-image { - background: #f7f7f7; - border: 1px solid #e6e6e6; - margin-right: 2em; - padding: 4em; - - .addons-img { - max-height: 86px; - max-width: 97px; - } - } - - .addons-shipping-methods .addons-wcs-banner-block { - margin-left: 0; - margin-right: 0; - margin-top: 1em; - } - - .addons-wcs-banner-block-content { - display: flex; - flex-direction: column; - justify-content: space-around; - align-self: stretch; - padding: 1em 0; - - h1 { - padding-bottom: 0; - } - - p { - margin-bottom: 0; - } - - .wcs-service-logo { - max-width: 40px; - } - } - - .addons-column-section { - display: flex; - flex-direction: row; - flex-wrap: wrap; - justify-content: space-around; - } - - .addons-column { - flex: 1; - width: 50%; - padding: 0 .5em; - } - - .addons-column:nth-child(2) { - margin-right: 0; - } - - .addons-small-light-block, - .addons-small-dark-block, - .addons-column-block { - box-sizing: border-box; - border: 1px solid #ddd; - margin: 0 0 1em; - padding: 20px; - } - - .addons-column-block img { - max-height: 50px; - max-width: 50px; - } - - .addons-small-light-block, - .addons-column-block { - background: #ffffff; - } - - .addons-column-block-left { - float: left; - } - - .addons-column-block-right { - float: right; - } - - .addons-column-block-item { - border-top: 2px solid #f9f9f9; - flex-direction: row; - flex-wrap: wrap; - justify-content: space-between; - margin: 0 -20px; - padding: 20px; - } - - .addons-column-block-item-icon { - background: #f7f7f7; - border: 1px solid #e6e6e6; - height: 100px; - margin: 0 10px 10px 0; - width: 100px; - } - - .addons-column-block-item-content { - display: flex; - flex: 1; - flex-wrap: wrap; - height: 20%; - justify-content: space-between; - min-width: 200px; - } - - .addons-column-block-item-content h2 { - float: left; - margin-top: 8px; - } - - .addons-column-block-item-content a { - float: right; - } - - .addons-column-block-item-content p { - float: left; - } - - .addons-banner-block-item, - .addons-column-block-item { - display: none; - } - - .addons-banner-block-item:nth-child(-n+3) { - display: block; - } - .addons-column-block-item:nth-of-type(-n+3) { - display: flex; - } - - .addons-small-dark-block { - background-color: #54687d; - text-align: center; - } - - .addons-small-dark-items { - display: flex; - flex-wrap: wrap; - justify-content: space-around; - } - - .addons-small-dark-item { - margin: 0 0 20px; - } - - .addons-small-dark-block h1 { - color: #ffffff; - } - - .addons-small-dark-block p { - color: #fafafa; - } - - .addons-small-dark-item-icon img { - height: 30px; - } - - .addons-small-dark-item a { - margin: 28px auto 0; - } - - .addons-small-light-block { - display: flex; - flex-wrap: wrap; - } - - .addons-small-light-block h1 { - margin-top: -12px; - } - - .addons-small-light-block p { - margin-top: 0; - } - - .addons-small-light-block img { - height: 225px; - margin: 0 0 0 -20px; - } - - .addons-small-light-block-content { - display: flex; - flex: 1 1 100px; - flex-direction: column; - justify-content: space-around; - } - - .addons-small-light-block-buttons { - display: flex; - justify-content: space-between; - } - - .addons-small-light-block-content a { - width: 48%; - } - - .addons-button { - border-radius: 3px; - cursor: pointer; - display: block; - height: 37px; - line-height: 37px; - text-align: center; - text-decoration: none; - width: 124px; - } - - .addons-button-solid { - background-color: #955a89; - color: #ffffff; - } - - .addons-button-solid:hover { - color: #ffffff; - opacity: 0.8; - } - - .addons-button-outline-green { - border: 1px solid #73ae39; - color: #73ae39; - } - - .addons-button-outline-green:hover { - color: #73ae39; - opacity: 0.8; - } - - .addons-button-outline-white { - border: 1px solid #ffffff; - color: #ffffff; - } - - .addons-button-outline-white:hover { - color: #ffffff; - opacity: 0.8; - } - - .addons-button-installed { - background: #e6e6e6; - color: #3c3c3c; - } - - .addons-button-installed:hover { - color: #3c3c3c; - opacity: 0.8; - } - - @media only screen and (max-width : 400px) { - .addons-featured { - margin: -1% -5%; - } - - .addons-button { - width: 100%; - } - - .addons-small-dark-item { - width: 100%; - } - - .addons-column-block-item-icon { - background: none; - border: none; - height: 75px; - margin: 0 10px 10px 0; - width: 75px; - } - } - - .products { - overflow: hidden; - display: flex; - flex-flow: row; - flex-wrap: wrap; - margin: 0 -.5em; - - li { - float: left; - border: 1px solid #ddd; - margin: 0 .5em 1em !important; - padding: 0; - vertical-align: top; - width: 25%; - min-width: 280px; - min-height: 220px; - flex: 1; - overflow: hidden; - background: #f5f5f5; - box-shadow: - inset 0 1px 0 rgba(255, 255, 255, 0.2), - inset 0 -1px 0 rgba(0, 0, 0, 0.1); - - a { - text-decoration: none; - color: inherit; - display: block; - height: 100%; - - .product-img-wrap { - background: #fff; - display: block; - } - - img { - max-width: 258px; - max-height: 24px; - padding: 17px 20px; - display: block; - margin: 0; - background: #fff; - border-right: 260px solid #fff; - } - - img.extension-thumb + h3 { - display: none; - } - - .price { - display: none; - } - - h2, h3 { - margin: 0 !important; - padding: 20px !important; - background: #fff; - } - - p { - padding: 20px !important; - margin: 0 !important; - border-top: 1px solid #f1f1f1; - } - - &:hover, - &:focus { - background-color: #fff; - } - } - } - } - - .storefront { - background: url('../images/storefront-bg.jpg') bottom right #f6f6f6; - border: 1px solid #ddd; - margin-top: 1em; - padding: 20px; - overflow: hidden; - zoom: 1; - - img { - width: 278px; - height: auto; - float: left; - margin: 0 20px 0 0; - box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1); - } - - p { - max-width: 750px; - } - } - } - - .woocommerce-message, - .woocommerce-BlankState { - a.button-primary, - button.button-primary { - background: #bb77ae; - border-color: #a36597; - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; - color: #fff; - text-shadow: 0 -1px 1px #a36597, 1px 0 1px #a36597, 0 1px 1px #a36597, -1px 0 1px #a36597; - display: inline-block; - - &:hover, &:focus, &:active { - background: #a36597; - border-color: #a36597; - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; - } - } - } - - .woocommerce-message { - position: relative; - border-left-color: #cc99c2 !important; - overflow: hidden; - - a.skip, - a.docs { - text-decoration: none !important; - } - - a.woocommerce-message-close { - position: static; - float: right; - padding: 0px 15px 10px 28px; - margin-top: -10px; - font-size: 13px; - line-height: 1.23076923; - text-decoration: none; - &::before { - position: relative; - top: 18px; - left: -20px; - transition: all 0.1s ease-in-out; - } - } - - .twitter-share-button { - margin-top: -3px; - margin-left: 3px; - vertical-align: middle; - } - } - - #variable_product_options #message, #variable_product_options .notice { - margin: 10px; - } - - .clear { - clear: both; - } - - .wrap.woocommerce div.updated, - .wrap.woocommerce div.error { - margin-top: 10px; - } - - mark.amount { - background: transparent none; - color: inherit; - } - - /** +.blockUI.blockOverlay { + + @include loader(); +} + +.wc_addons_wrap { + max-width: 1200px; + + h1.search-form-title { + clear: left; + padding: 0; + } + + form.search-form { + clear: both; + display: block; + position: relative; + margin-top: 1em; + margin-bottom: 1em; + + input { + border: 1px solid #ddd; + box-shadow: none; + height: 53px; + padding-left: 50px; + width: 100%; + margin: 0; + } + + button { + background: none; + border: none; + cursor: pointer; + height: 53px; + position: absolute; + width: 53px; + } + } + + .update-plugins .update-count { + background-color: #d54e21; + border-radius: 10px; + color: #fff; + display: inline-block; + font-size: 9px; + font-weight: 600; + line-height: 17px; + margin: 1px 0 0 2px; + padding: 0 6px; + vertical-align: text-top; + } + + .addons-featured { + margin: 0; + } + + ul.subsubsub.subsubsub { + margin: -2px 0 12px; + } + + .subsubsub li::after { + content: "|"; + } + + .subsubsub li:last-child::after { + content: ""; + } + + .addons-banner-block-item-icon, + .addons-column-block-item-icon { + align-items: center; + display: flex; + justify-content: center; + } + + .addons-banner-block, + .addons-wcs-banner-block { + background: #fff; + border: 1px solid #ddd; + margin: 0 0 1em 0; + padding: 2em 2em 1em; + } + + .addons-banner-block img { + height: 62px; + } + + .addons-banner-block p { + margin: 0 0 20px; + } + + .addons-banner-block-items { + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: space-around; + margin: 0 -10px 0 -10px; + } + + .addons-banner-block-item { + border: 1px solid #e6e6e6; + border-radius: 3px; + flex: 1; + margin: 1em; + min-width: 200px; + width: 30%; + } + + .addons-banner-block-item-icon { + background: #f7f7f7; + height: 143px; + } + + .addons-banner-block-item-content { + display: flex; + flex-direction: column; + height: 184px; + justify-content: space-between; + padding: 24px; + } + + .addons-banner-block-item-content h3 { + margin-top: 0; + } + + .addons-banner-block-item-content p { + margin: 0 0 auto; + } + + .addons-wcs-banner-block { + display: flex; + align-items: center; + } + + .addons-wcs-banner-block-image { + background: #f7f7f7; + border: 1px solid #e6e6e6; + margin-right: 2em; + padding: 4em; + + .addons-img { + max-height: 86px; + max-width: 97px; + } + } + + .addons-shipping-methods .addons-wcs-banner-block { + margin-left: 0; + margin-right: 0; + margin-top: 1em; + } + + .addons-wcs-banner-block-content { + display: flex; + flex-direction: column; + justify-content: space-around; + align-self: stretch; + padding: 1em 0; + + h1 { + padding-bottom: 0; + } + + p { + margin-bottom: 0; + } + + .wcs-service-logo { + max-width: 40px; + } + } + + .addons-column-section { + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: space-around; + } + + .addons-column { + flex: 1; + width: 50%; + padding: 0 0.5em; + } + + .addons-column:nth-child(2) { + margin-right: 0; + } + + .addons-small-light-block, + .addons-small-dark-block, + .addons-column-block { + box-sizing: border-box; + border: 1px solid #ddd; + margin: 0 0 1em; + padding: 20px; + } + + .addons-column-block img { + max-height: 50px; + max-width: 50px; + } + + .addons-small-light-block, + .addons-column-block { + background: #fff; + } + + .addons-column-block-left { + float: left; + } + + .addons-column-block-right { + float: right; + } + + .addons-column-block-item { + border-top: 2px solid #f9f9f9; + flex-direction: row; + flex-wrap: wrap; + justify-content: space-between; + margin: 0 -20px; + padding: 20px; + } + + .addons-column-block-item-icon { + background: #f7f7f7; + border: 1px solid #e6e6e6; + height: 100px; + margin: 0 10px 10px 0; + width: 100px; + } + + .addons-column-block-item-content { + display: flex; + flex: 1; + flex-wrap: wrap; + height: 20%; + justify-content: space-between; + min-width: 200px; + } + + .addons-column-block-item-content h2 { + float: left; + margin-top: 8px; + } + + .addons-column-block-item-content a { + float: right; + } + + .addons-column-block-item-content p { + float: left; + } + + .addons-banner-block-item, + .addons-column-block-item { + display: none; + } + + .addons-banner-block-item:nth-child(-n+3) { + display: block; + } + + .addons-column-block-item:nth-of-type(-n+3) { + display: flex; + } + + .addons-small-dark-block { + background-color: #54687d; + text-align: center; + } + + .addons-small-dark-items { + display: flex; + flex-wrap: wrap; + justify-content: space-around; + } + + .addons-small-dark-item { + margin: 0 0 20px; + } + + .addons-small-dark-block h1 { + color: #fff; + } + + .addons-small-dark-block p { + color: #fafafa; + } + + .addons-small-dark-item-icon img { + height: 30px; + } + + .addons-small-dark-item a { + margin: 28px auto 0; + } + + .addons-small-light-block { + display: flex; + flex-wrap: wrap; + } + + .addons-small-light-block h1 { + margin-top: -12px; + } + + .addons-small-light-block p { + margin-top: 0; + } + + .addons-small-light-block img { + height: 225px; + margin: 0 0 0 -20px; + } + + .addons-small-light-block-content { + display: flex; + flex: 1 1 100px; + flex-direction: column; + justify-content: space-around; + } + + .addons-small-light-block-buttons { + display: flex; + justify-content: space-between; + } + + .addons-small-light-block-content a { + width: 48%; + } + + .addons-button { + border-radius: 3px; + cursor: pointer; + display: block; + height: 37px; + line-height: 37px; + text-align: center; + text-decoration: none; + width: 124px; + } + + .addons-button-solid { + background-color: #955a89; + color: #fff; + } + + .addons-button-solid:hover { + color: #fff; + opacity: 0.8; + } + + .addons-button-outline-green { + border: 1px solid #73ae39; + color: #73ae39; + } + + .addons-button-outline-green:hover { + color: #73ae39; + opacity: 0.8; + } + + .addons-button-outline-white { + border: 1px solid #fff; + color: #fff; + } + + .addons-button-outline-white:hover { + color: #fff; + opacity: 0.8; + } + + .addons-button-installed { + background: #e6e6e6; + color: #3c3c3c; + } + + .addons-button-installed:hover { + color: #3c3c3c; + opacity: 0.8; + } + + @media only screen and (max-width: 400px) { + + .addons-featured { + margin: -1% -5%; + } + + .addons-button { + width: 100%; + } + + .addons-small-dark-item { + width: 100%; + } + + .addons-column-block-item-icon { + background: none; + border: none; + height: 75px; + margin: 0 10px 10px 0; + width: 75px; + } + } + + .products { + overflow: hidden; + display: flex; + flex-flow: row; + flex-wrap: wrap; + margin: 0 -0.5em; + + li { + float: left; + border: 1px solid #ddd; + margin: 0 0.5em 1em !important; + padding: 0; + vertical-align: top; + width: 25%; + min-width: 280px; + min-height: 220px; + flex: 1; + overflow: hidden; + background: #f5f5f5; + box-shadow: + inset 0 1px 0 rgba(255, 255, 255, 0.2), + inset 0 -1px 0 rgba(0, 0, 0, 0.1); + + a { + text-decoration: none; + color: inherit; + display: block; + height: 100%; + + .product-img-wrap { + background: #fff; + display: block; + } + + img { + max-width: 258px; + max-height: 24px; + padding: 17px 20px; + display: block; + margin: 0; + background: #fff; + border-right: 260px solid #fff; + } + + img.extension-thumb + h3 { + display: none; + } + + .price { + display: none; + } + + h2, + h3 { + margin: 0 !important; + padding: 20px !important; + background: #fff; + } + + p { + padding: 20px !important; + margin: 0 !important; + border-top: 1px solid #f1f1f1; + } + + &:hover, + &:focus { + background-color: #fff; + } + } + } + } + + .storefront { + background: url("../images/storefront-bg.jpg") bottom right #f6f6f6; + border: 1px solid #ddd; + margin-top: 1em; + padding: 20px; + overflow: hidden; + zoom: 1; + + img { + width: 278px; + height: auto; + float: left; + margin: 0 20px 0 0; + box-shadow: 0 1px 6px rgba(0, 0, 0, 0.1); + } + + p { + max-width: 750px; + } + } +} + +.woocommerce-message, +.woocommerce-BlankState { + + a.button-primary, + button.button-primary { + background: #bb77ae; + border-color: #a36597; + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; + color: #fff; + text-shadow: 0 -1px 1px #a36597, 1px 0 1px #a36597, 0 1px 1px #a36597, -1px 0 1px #a36597; + display: inline-block; + + &:hover, + &:focus, + &:active { + background: #a36597; + border-color: #a36597; + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; + } + } +} + +.woocommerce-message { + position: relative; + border-left-color: #cc99c2 !important; + overflow: hidden; + + a.skip, + a.docs { + text-decoration: none !important; + } + + a.woocommerce-message-close { + position: static; + float: right; + padding: 0 15px 10px 28px; + margin-top: -10px; + font-size: 13px; + line-height: 1.23076923; + text-decoration: none; + + &::before { + position: relative; + top: 18px; + left: -20px; + transition: all 0.1s ease-in-out; + } + } + + .twitter-share-button { + margin-top: -3px; + margin-left: 3px; + vertical-align: middle; + } +} + +#variable_product_options #message, + #variable_product_options .notice { + margin: 10px; +} + +.clear { + clear: both; +} + +.wrap.woocommerce div.updated, +.wrap.woocommerce div.error { + margin-top: 10px; +} + +mark.amount { + background: transparent none; + color: inherit; +} + +/** * Help Tip */ - .woocommerce-help-tip { - color: #666; - display: inline-block; - font-size: 1.1em; - font-style: normal; - height: 16px; - line-height: 16px; - position: relative; - vertical-align: middle; - width: 16px; +.woocommerce-help-tip { + color: #666; + display: inline-block; + font-size: 1.1em; + font-style: normal; + height: 16px; + line-height: 16px; + position: relative; + vertical-align: middle; + width: 16px; - &::after { - @include icon_dashicons( '\f223' ); - cursor: help; - } - } + &::after { - h2 .woocommerce-help-tip { - margin-top: -5px; - margin-left: 0.25em; - } + @include icon_dashicons( "\f223" ); + cursor: help; + } +} - table.wc_status_table { - margin-bottom: 1em; +h2 .woocommerce-help-tip { + margin-top: -5px; + margin-left: 0.25em; +} - h2 { - font-size: 14px; - margin: 0; - } +table.wc_status_table { + margin-bottom: 1em; - tr:nth-child( 2n ) { - th, - td { - background: #fcfcfc; - } - } + h2 { + font-size: 14px; + margin: 0; + } - th { - font-weight: 700; - padding: 9px; - } + tr:nth-child(2n) { - td:first-child { - width: 33%; - } + th, + td { + background: #fcfcfc; + } + } - td.help { - width: 1em; - } + th { + font-weight: 700; + padding: 9px; + } - td, th { - font-size: 1.1em; - font-weight: normal; + td:first-child { + width: 33%; + } - &.run-tool { - text-align:right; - } + td.help { + width: 1em; + } - strong.name { - display: block; - margin-bottom: .5em; - } + td, + th { + font-size: 1.1em; + font-weight: normal; - mark { - background: transparent none; - } + &.run-tool { + text-align: right; + } - mark.yes { - color: $green; - } + strong.name { + display: block; + margin-bottom: 0.5em; + } - mark.no { - color: #999; - } + mark { + background: transparent none; + } - mark.error, .red { - color: $red; - } + mark.yes { + color: $green; + } - ul { - margin: 0; - } - } + mark.no { + color: #999; + } - .help_tip { - cursor: help; - } - } + mark.error, + .red { + color: $red; + } - table.wc_status_table--tools { - td, th { - padding: 2em; - } - } + ul { + margin: 0; + } + } - .taxonomy-product_cat { - .check-column .woocommerce-help-tip { - font-size: 1.5em; - margin: -3px 0 0 5px; - display: block; - position: absolute; - } - } + .help_tip { + cursor: help; + } +} - #debug-report { - display: none; - margin: 10px 0; - padding: 0; - position: relative; +table.wc_status_table--tools { - textarea { - font-family: monospace; - width: 100%; - margin: 0; - height: 300px; - padding: 20px; - border-radius: 0; - resize: none; - font-size: 12px; - line-height: 20px; - outline: 0; - } - } + td, + th { + padding: 2em; + } +} + +.taxonomy-product_cat { + + .check-column .woocommerce-help-tip { + font-size: 1.5em; + margin: -3px 0 0 5px; + display: block; + position: absolute; + } +} + +#debug-report { + display: none; + margin: 10px 0; + padding: 0; + position: relative; + + textarea { + font-family: monospace; + width: 100%; + margin: 0; + height: 300px; + padding: 20px; + border-radius: 0; + resize: none; + font-size: 12px; + line-height: 20px; + outline: 0; + } +} - /** +/** * DB log viewer */ - .wp-list-table.logs { +.wp-list-table.logs { - .log-level { - display: inline; - padding: .2em .6em .3em; - font-size: 80%; - font-weight: bold; - line-height: 1; - color: #fff; - text-align: center; - white-space: nowrap; - vertical-align: baseline; - border-radius: .2em; + .log-level { + display: inline; + padding: 0.2em 0.6em 0.3em; + font-size: 80%; + font-weight: bold; + line-height: 1; + color: #fff; + text-align: center; + white-space: nowrap; + vertical-align: baseline; + border-radius: 0.2em; - &:empty { - display: none; - } - } + &:empty { + display: none; + } + } - /** + /** * Add color to levels * * Descending severity: @@ -744,2165 +760,2358 @@ * debug -> gree */ - .log-level--emergency, - .log-level--alert { - background-color: #ff4136; - } - .log-level--critical, - .log-level--error { - background-color: #ff851b; - } - .log-level--warning, - .log-level--notice { - color: #222; - background-color: #ffdc00; - } - .log-level--info { - background-color: #0074d9; - } - .log-level--debug { - background-color: #3d9970; - } + .log-level--emergency, + .log-level--alert { + background-color: #ff4136; + } - // Adjust log table columns only when table is not collapsed - @media screen and ( min-width: 783px ) { - .column-timestamp { - width: 18%; - } - .column-level { - width: 14%; - } - .column-source { - width: 15%; - } - } - } + .log-level--critical, + .log-level--error { + background-color: #ff851b; + } - #log-viewer-select { - padding: 10px 0 8px; - line-height: 28px; - h2 a { - vertical-align: middle; - } - } + .log-level--warning, + .log-level--notice { + color: #222; + background-color: #ffdc00; + } - #log-viewer { - background: #fff; - border: 1px solid #e5e5e5; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04); - padding: 5px 20px; + .log-level--info { + background-color: #0074d9; + } - pre { - font-family: monospace; - white-space: pre-wrap; - word-wrap: break-word; - } - } + .log-level--debug { + background-color: #3d9970; + } - .inline-edit-product.quick-edit-row { - .inline-edit-col-center, - .inline-edit-col-right { - float: right !important; - } - } + // Adjust log table columns only when table is not collapsed + @media screen and ( min-width: 783px ) { - #woocommerce-fields.inline-edit-col { - clear: left; + .column-timestamp { + width: 18%; + } - label.featured, - label.manage_stock { - margin-left: 10px; - } + .column-level { + width: 14%; + } - label.stock_status_field { - clear: both; - float: left; - } + .column-source { + width: 15%; + } + } +} - .dimensions div { - display: block; - margin: 0.2em 0; +#log-viewer-select { + padding: 10px 0 8px; + line-height: 28px; - span.title { - display: block; - float: left; - width: 5em; - } + h2 a { + vertical-align: middle; + } +} - span.input-text-wrap { - display: block; - margin-left: 5em; - } - } +#log-viewer { + background: #fff; + border: 1px solid #e5e5e5; + box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04); + padding: 5px 20px; - .text { - box-sizing: border-box; - width: 99%; - float: left; - margin: 1px 1% 1px 1px; - } + pre { + font-family: monospace; + white-space: pre-wrap; + word-wrap: break-word; + } +} - .length, .width, .height { - width: 32.33%; - } +.inline-edit-product.quick-edit-row { - .height { - margin-right: 0; - } - } + .inline-edit-col-center, + .inline-edit-col-right { + float: right !important; + } +} - #woocommerce-fields-bulk.inline-edit-col { - label { - clear: left; - } +#woocommerce-fields.inline-edit-col { + clear: left; - .inline-edit-group { - label { - clear: none; - width: 49%; - margin: 0.2em 0; - } - &.dimensions label { - width: 75%; - max-width: 75%; - } - } + label.featured, + label.manage_stock { + margin-left: 10px; + } - .regular_price, - .sale_price, - .weight, - .stock, - .length { - box-sizing: border-box; - width: 100%; - margin-left: 4.4em; - } + label.stock_status_field { + clear: both; + float: left; + } - .length, - .width, - .height { - box-sizing: border-box; - width: 25%; - } - } + .dimensions div { + display: block; + margin: 0.2em 0; - .column-coupon_code { - line-height: 2.25em; - } + span.title { + display: block; + float: left; + width: 5em; + } - ul.wc_coupon_list, - .column-coupon_code { - margin: 0; - overflow: hidden; - zoom: 1; - clear: both; - } + span.input-text-wrap { + display: block; + margin-left: 5em; + } + } - ul.wc_coupon_list { - padding-bottom: 5px; + .text { + box-sizing: border-box; + width: 99%; + float: left; + margin: 1px 1% 1px 1px; + } - li { - margin: 0; + .length, + .width, + .height { + width: 32.33%; + } - &.code { - display: inline-block; - position: relative; - padding: 0 .5em; - background-color: #fff; - border: 1px solid #aaa; - -webkit-box-shadow: 0 1px 0 #dfdfdf; - box-shadow: 0 1px 0 #dfdfdf; + .height { + margin-right: 0; + } +} - border-radius: 4px; - margin-right: 5px; - margin-top: 5px; +#woocommerce-fields-bulk.inline-edit-col { - &.editable { - padding-right: 2em; - } + label { + clear: left; + } - .tips { - cursor: pointer; + .inline-edit-group { - span { - color: #888; + label { + clear: none; + width: 49%; + margin: 0.2em 0; + } - &:hover { - color: #000; - } - } - } + &.dimensions label { + width: 75%; + max-width: 75%; + } + } - .remove-coupon { - text-decoration: none; - color: #888; - position: absolute; - top: 7px; - right: 20px; + .regular_price, + .sale_price, + .weight, + .stock, + .length { + box-sizing: border-box; + width: 100%; + margin-left: 4.4em; + } - /*rtl:raw: + .length, + .width, + .height { + box-sizing: border-box; + width: 25%; + } +} + +.column-coupon_code { + line-height: 2.25em; +} + +ul.wc_coupon_list, +.column-coupon_code { + margin: 0; + overflow: hidden; + zoom: 1; + clear: both; +} + +ul.wc_coupon_list { + padding-bottom: 5px; + + li { + margin: 0; + + &.code { + display: inline-block; + position: relative; + padding: 0 0.5em; + background-color: #fff; + border: 1px solid #aaa; + -webkit-box-shadow: 0 1px 0 #dfdfdf; + box-shadow: 0 1px 0 #dfdfdf; + + border-radius: 4px; + margin-right: 5px; + margin-top: 5px; + + &.editable { + padding-right: 2em; + } + + .tips { + cursor: pointer; + + span { + color: #888; + + &:hover { + color: #000; + } + } + } + + .remove-coupon { + text-decoration: none; + color: #888; + position: absolute; + top: 7px; + right: 20px; + + /*rtl:raw: left: 7px; */ - &::before { - @include icon_dashicons( '\f158' ); - } - &:hover::before { - color: $red; - } - } - } - } - } - - ul.wc_coupon_list_block { - margin: 0; - padding-bottom: 2px; - - li { - border-top: 1px solid #fff; - border-bottom: 1px solid #ccc; - line-height: 2.5em; - margin: 0; - padding: 0.5em 0; - } - - li:first-child { - border-top: 0; - padding-top: 0; - } - - li:last-child { - border-bottom: 0; - padding-bottom: 0; - } - } - - .button.wc-reload { - @include ir(); - padding: 0; - height: 28px; - width: 28px !important; - display: inline-block; - - &::after { - @include icon_dashicons( '\f345' ); - line-height: 28px; - } - } - - #woocommerce-order-data { - .hndle, - .handlediv { - display: none; - } - - .inside { - display: block !important; - } - } - - #order_data { - padding: 23px 24px 12px; - - h2 { - margin: 0; - font-family: 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', sans-serif; - font-size: 21px; - font-weight: normal; - line-height: 1.2; - text-shadow: 1px 1px 1px white; - padding: 0; - } - - h3 { - font-size: 14px; - } - - h3, h4 { - color: #333; - margin: 1.33em 0 0; - } - - p { - color: #777; - } - - p.order_number { - margin: 0; - font-family: 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', sans-serif; - font-weight: normal; - line-height: 1.6em; - font-size: 16px; - } - - .order_data_column_container { - clear: both; - } - - .order_data_column { - width: 32%; - padding: 0 2% 0 0; - float: left; - - > h3 span { - display: block; - } - - &:last-child { - padding-right: 0; - } - - p { - padding: 0 !important; - } - - .address strong { - display: block; - } - - .form-field { - float: left; - clear: left; - width: 48%; - padding: 0; - margin: 9px 0 0; - - label { - display: block; - padding: 0 0 3px; - } - - input, - textarea { - width: 100%; - } - - select { - width: 100%; - } - - .select2-container { - width: 100% !important; - } - - .date-picker { - width: 50%; - } - - .hour, - .minute { - width: 3.5em; - } - - small { - display: block; - margin: 5px 0 0; - color: #999; - } - } - - .form-field.last, - ._billing_last_name_field, - ._billing_address_2_field, - ._billing_postcode_field, - ._billing_state_field, - ._billing_phone_field, - ._shipping_last_name_field, - ._shipping_address_2_field, - ._shipping_postcode_field, - ._shipping_state_field { - float: right; - clear: right; - } - - .form-field-wide, - ._billing_company_field, - ._shipping_company_field, - ._transaction_id_field { - width: 100%; - clear: both; - - input, - textarea, - select, - .wc-enhanced-select, - .wc-category-search, - .wc-customer-search { - width: 100%; - } - } - - p.none_set { - color: #999; - } - - div.edit_address { - display: none; - zoom: 1; - padding-right: 1px; - } - - .wc-customer-user, .wc-order-status { - label a { - float: right; - margin-left: 8px; - } - } - - a.edit_address { - width: 14px; - height: 0; - padding: 14px 0 0; - margin: 0 0 0 6px; - overflow: hidden; - position: relative; - color: #999; - border: 0; - float: right; - &:hover, &:focus { - color: #000; - } - &::after { - font-family: 'WooCommerce'; - position: absolute; - top: 0; - left: 0; - text-align: center; - vertical-align: top; - line-height: 14px; - font-size: 14px; - font-weight: 400; - } - } - a.edit_address::after { - font-family: 'Dashicons'; - content: '\f464'; - } - - .billing-same-as-shipping, - .load_customer_shipping, - .load_customer_billing { - font-size: 13px; - display: inline-block; - font-weight: normal; - } - - .load_customer_shipping { - margin-right: .3em; - } - } - } - - .order_actions { - margin: 0; - overflow: hidden; - zoom: 1; - - li { - border-top: 1px solid #fff; - border-bottom: 1px solid #ddd; - padding: 6px 0; - margin: 0; - line-height: 1.6em; - float: left; - width: 50%; - text-align: center; - - a { - float: none; - text-align: center; - text-decoration: underline; - } - - &.wide { - width: auto; - float: none; - clear: both; - padding: 6px; - text-align: left; - overflow: hidden; - } - - #delete-action { - line-height: 25px; - vertical-align: middle; - text-align: left; - float: left; - } - - .save_order { - float: right; - } - - &#actions { - overflow: hidden; - - .button { - width: 24px; - box-sizing: border-box; - float: right; - } - - select { - width: 225px; - box-sizing: border-box; - float: left; - } - } - } - } - - #woocommerce-order-items { - .inside { - margin: 0; - padding: 0; - background: #fefefe; - } - - .wc-order-data-row { - border-bottom: 1px solid #dfdfdf; - padding: 1.5em 2em; - background: #f8f8f8; - @include clearfix(); - line-height: 2em; - text-align: right; - - p { - margin: 0; - line-height: 2em; - } - - .wc-used-coupons { - text-align: left; - - .tips { - display: inline-block; - } - } - } - - .wc-used-coupons { - float: left; - width: 50%; - } - - .wc-order-totals { - float: right; - width: 50%; - margin: 0; - padding: 0; - text-align: right; - - .amount { - font-weight: 700; - } - - .label { - vertical-align: top; - } - - .total { - font-size: 1em !important; - width: 10em; - margin: 0 0 0 0.5em; - box-sizing: border-box; - - input[type='text'] { - width: 96%; - float: right; - } - } - - .refunded-total { - color: $red; - } - } - - .refund-actions { - margin-top: 5px; - padding-top: 12px; - border-top: 1px solid #dfdfdf; - - .button { - float: right; - margin-left: 4px; - } - - .cancel-action { - float: left; - margin-left: 0; - } - } - - .add_meta { - margin-left: 0 !important; - } - - h3 small { - color: #999; - } - - .amount { - white-space: nowrap; - } - - .add-items { - .description { - margin-right: 10px; - } - .button { - float: left; - margin-right: 0.25em; - } - .button-primary { - float: none; - margin-right: 0; - } - } - } - - #woocommerce-order-items { - .inside { - display: block !important; - } - .hndle, .handlediv { - display: none; - } - .woocommerce_order_items_wrapper { - margin: 0; - overflow-x: auto; - - table.woocommerce_order_items { - width: 100%; - background: #fff; - - thead th { - text-align: left; - padding: 1em; - font-weight: normal; - color: #999; - background: #f8f8f8; - -webkit-touch-callout: none; - -webkit-user-select: none; - -khtml-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - &.sortable { - cursor: pointer; - } - &:last-child { - padding-right: 2em; - } - &:first-child { - padding-left: 2em; - } - .wc-arrow { - float: right; - position: relative; - margin-right: -1em; - } - } - - tbody th, td { - padding: 1.5em 1em 1em; - text-align: left; - line-height: 1.5em; - vertical-align: top; - border-bottom: 1px solid #f8f8f8; - - textarea { - width: 100%; - } - - select { - width: 50%; - } - - input, textarea { - font-size: 14px; - padding: 4px; - color: #555; - } - &:last-child { - padding-right: 2em; - } - &:first-child { - padding-left: 2em; - } - } - - tbody tr:last-child td { - border-bottom: 1px solid #dfdfdf; - } - - tbody tr:first-child td { - border-top: 8px solid #f8f8f8; - } - - tbody#order_line_items tr:first-child td { - border-top: none; - } - - td.thumb { - text-align: left; - width: 38px; - padding-bottom: 1.5em; - .wc-order-item-thumbnail { - width: 38px; - height: 38px; - border: 2px solid #e8e8e8; - background: #f8f8f8; - color: #ccc; - position: relative; - font-size: 21px; - display: block; - text-align: center; - &::before { - @include icon_dashicons( '\f128' ); - width: 38px; - line-height: 38px; - display: block; - } - img { - width: 100%; - height: 100%; - margin: 0; - padding: 0; - position: relative; - } - } - } - td.name { - .wc-order-item-sku, .wc-order-item-variation { - display: block; - margin-top: 0.5em; - font-size: 0.92em !important; - color: #888; - } - } - - .item { - min-width: 200px; - } - - .center, - .variation-id { - text-align: center; - } - - .cost, - .tax, - .quantity, - .line_cost, - .line_tax, - .tax_class, - .item_cost { - text-align: right; - - label { - white-space: nowrap; - color: #999; - font-size: 0.833em; - - input { - display: inline; - } - } - - input { - width: 70px; - vertical-align: middle; - text-align: right; - } - - select { - width: 85px; - height: 26px; - vertical-align: middle; - font-size: 1em; - } - - .split-input { - display: inline-block; - background: #fff; - border: 1px solid #ddd; - box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.07); - margin: 1px 0; - min-width: 80px; - overflow: hidden; - line-height: 1em; - text-align: right; - - div.input { - width: 100%; - box-sizing: border-box; - label { - font-size: 0.75em; - padding: 4px 6px 0; - color: #555; - display: block; - } - input { - width: 100%; - box-sizing: border-box; - border: 0; - box-shadow: none; - margin: 0; - padding: 0 6px 4px; - color: #555; - background: transparent; - &::-webkit-input-placeholder { - color: #ddd; - } - } - } - div.input:first-child { - border-bottom: 1px dashed #ddd; - background: #fff; - label { - color: #ccc; - } - input { - color: #ccc; - } - } - } - - .view { - white-space: nowrap; - } - - .edit { - text-align: left; - } - - small.times, del, .wc-order-item-taxes, .wc-order-item-discount, .wc-order-item-refund-fields { - font-size: 0.92em !important; - color: #888; - } - - .wc-order-item-taxes, .wc-order-item-refund-fields { - margin: 0; - label { - display: block; - } - } - - .wc-order-item-discount { - display: block; - margin-top: 0.5em; - } - - small.times { - margin-right: 0.25em; - } - } - - .quantity { - text-align: center; - - input { - text-align: center; - width: 50px; - } - } - - span.subtotal { - opacity: 0.5; - } - - td.tax_class, - th.tax_class { - text-align: left; - } - - .calculated { - border-color: #ae8ca2; - border-style: dotted; - } - - table.meta { - width: 100%; - } - - table.meta, - table.display_meta { - margin: 0.5em 0 0; - font-size: 0.92em !important; - color: #888; - - tr { - th { - border: 0; - padding: 0 4px 0.5em 0; - line-height: 1.5em; - width: 20%; - } - td { - padding: 0 4px 0.5em 0; - border: 0; - line-height: 1.5em; - - input { - width: 100%; - margin: 0; - position: relative; - border-bottom: 0; - box-shadow: none; - } - - textarea { - width: 100%; - height: 4em; - margin: 0; - box-shadow: none; - } - - input:focus + textarea { - border-top-color: #999; - } - - p { - margin: 0 0 0.5em; - line-height: 1.5em; - } - - p:last-child { - margin: 0; - } - } - } - } - - .refund_by { - border-bottom: 1px dotted #999; - } - - tr.fee .thumb div { - @include ir(); - font-size: 1.5em; - line-height: 1em; - vertical-align: middle; - margin: 0 auto; - - &::before { - @include icon( '\e007' ); - color: #ccc; - } - } - - tr.refund .thumb div { - @include ir(); - font-size: 1.5em; - line-height: 1em; - vertical-align: middle; - margin: 0 auto; - - &::before { - @include icon( '\e014' ); - color: #ccc; - } - } - - tr.shipping { - .thumb div { - @include ir(); - font-size: 1.5em; - line-height: 1em; - vertical-align: middle; - margin: 0 auto; - - &::before { - @include icon( '\e01a' ); - color: #ccc; - } - } - .shipping_method_name, - .shipping_method { - width: 100%; - margin: 0 0 0.5em; - } - } - - th.line_tax { - white-space: nowrap; - } - - th.line_tax, - td.line_tax { - .delete-order-tax { - @include ir(); - float: right; - font-size: 14px; - visibility: hidden; - margin: 3px -18px 0 0; - - &::before { - @include icon_dashicons( '\f153' ); - color: #999; - } - - &:hover::before { - color: $red; - } - } - - &:hover .delete-order-tax { - visibility: visible; - } - } - - small.refunded { - display: block; - color: $red; - white-space: nowrap; - margin-top: 0.5em; - &::before { - @include icon_dashicons( '\f171' ); - position: relative; - top: auto; - left: auto; - margin: -1px 4px 0 0; - vertical-align: middle; - line-height: 1em; - } - } - } - } - .wc-order-edit-line-item { - padding-left: 0; - } - .wc-order-edit-line-item-actions { - width: 44px; - text-align: right; - padding-left: 0; - vertical-align: middle; - a { - color: #ccc; - display: inline-block; - cursor: pointer; - padding: 0 0 0.5em; - margin: 0 0 0 12px; - vertical-align: middle; - text-decoration: none; - line-height: 16px; - width: 16px; - overflow: hidden; - &::before { - margin: 0; - padding: 0; - font-size: 16px; - width: 16px; - height: 16px; - } - &:hover { - &::before { - color: #999; - } - } - &:first-child { - margin-left: 0; - } - } - - .edit-order-item::before { - @include icon_dashicons( '\f464' ); - position: relative; - } - - .delete-order-item, - .delete_refund { - &::before { - @include icon_dashicons( '\f158' ); - position: relative; - } - &:hover::before { - color: $red; - } - } - } - - tbody tr .wc-order-edit-line-item-actions { - visibility: hidden; - } - tbody tr:hover .wc-order-edit-line-item-actions { - visibility: visible; - } - - .wc-order-totals .wc-order-edit-line-item-actions { - width: 1.5em; - visibility: visible !important; - a { - padding: 0; - } - } - } - - #woocommerce-order-downloads { - .buttons { - float: left; - padding: 0; - margin: 0; - vertical-align: top; - - .add_item_id, - .select2-container { - width: 400px !important; - margin-right: 9px; - vertical-align: top; - float: left; - } - - button { - margin: 2px 0 0; - } - } - - h3 small { - color: #999; - } - } - - #poststuff #woocommerce-order-actions .inside { - margin: 0; - padding: 0; - - ul.order_actions li { - padding: 6px 10px; - box-sizing: border-box; - - &:last-child { - border-bottom: 0; - } - } - } - - #poststuff #woocommerce-order-notes .inside { - margin: 0; - padding: 0; - - ul.order_notes li { - padding: 0 10px; - } - } - - #woocommerce_customers { - p.search-box { - margin: 6px 0 4px; - float: left; - } - - .tablenav { - float: right; - clear: none; - } - } - - .widefat { - &.customers td { - vertical-align: middle; - padding: 4px 7px; - } - - .column-order_title { - width: 15%; - - time { - display: block; - color: #999; - margin: 3px 0; - } - } - - .column-orders, .column-paying, .column-spent { - text-align: center; - width: 8%; - } - - .column-last_order { - width: 11%; - } - - .column-wc_actions { - width: 110px; - - a.button { - @include ir(); - display: inline-block; - margin: 2px 4px 2px 0; - padding: 0 !important; - height: 2em !important; - width: 2em; - overflow: hidden; - vertical-align: middle; - - &::after { - font-family: 'Dashicons'; - speak: none; - font-weight: normal; - font-variant: normal; - text-transform: none; - margin: 0; - text-indent: 0; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - text-align: center; - line-height: 1.85; - } - - img { - display: block; - width: 12px; - height: auto; - } - } - - a.edit::after { - content: '\f464'; - } - - a.link::after { - font-family: 'WooCommerce'; - content: '\e00d'; - } - - a.view::after { - content: '\f177'; - } - - a.refresh::after { - font-family: 'WooCommerce'; - content: '\e031'; - } - - a.processing::after { - font-family: 'WooCommerce'; - content: '\e00f'; - } - - a.complete::after { - content: '\f147'; - } - } - - small.meta { - display: block; - color: #999; - font-size: inherit; - margin: 3px 0; - } - } - - .post-type-shop_order { - .tablenav .one-page .displaying-num { - display: none; - } - .wp-list-table { - margin-top: 1em; - - thead, - tfoot { - th { - padding: .75em 1em; - } - th.sortable a, th.sorted a { - padding: 0; - } - th:first-child { - padding-left: 2em; - } - th:last-child { - padding-right: 2em; - } - } - tbody { - td, - th { - padding: 1em; - line-height: 26px; - } - td:first-child { - padding-left: 2em; - } - td:last-child { - padding-right: 2em; - } - } - tbody tr { - border-top: 1px solid #f5f5f5; - } - tbody tr:hover:not(.status-trash):not(.no-link) td { - cursor: pointer; - } - .no-link { - cursor: default !important; - } - - // Columns. - td, - th { - width: 12ch; - vertical-align: middle; - p { - margin: 0; - } - } - .check-column { - width: 1px; - white-space: nowrap; - padding: 1em 1em 1em 1em !important; - vertical-align: middle; - input { - vertical-align: text-top; - margin: 1px 0; - } - } - .column-order_number { - width: 20ch; - } - .column-order_total { - width: 8ch; - text-align: right; - - a span { - float:right; - } - } - .column-order_date, - .column-order_status { - width: 10ch; - } - .column-order_status { - width: 14ch; - } - .column-shipping_address, - .column-billing_address { - width: 20ch; - line-height: 1.5em; - .description { - display: block; - color: #999; - } - } - .column-wc_actions { - text-align: right; - - a.button { - text-indent: 9999px; - margin: 2px 0 2px 4px; - } - } - .order-preview { - float:right; - width: 16px; - padding: 20px 4px 4px 4px; - height: 0; - overflow: hidden; - position: relative; - border: 2px solid transparent; - border-radius: 4px; - - &::before { - @include icon( '\e010' ); - line-height: 16px; - font-size: 14px; - vertical-align:middle; - top: 4px; - - } - &:hover { - border: 2px solid #00a0d2; - } - } - .order-preview.disabled { - &::before { - content: ''; - background: url('../images/wpspin.gif') no-repeat center top; - } - } - } - } - - .order-status { - display: inline-flex; - line-height: 2.5em; - color: #777; - background: #E5E5E5; - border-radius: 4px; - border-bottom: 1px solid rgba(0,0,0,0.05); - margin: -.25em 0; - cursor: inherit !important; - white-space: nowrap; - max-width: 100%; - - &.status-completed { - background: #C8D7E1; - color: #2e4453; - } - - &.status-on-hold { - background: #f8dda7; - color: #94660c; - } - - &.status-failed { - background: #eba3a3; - color: #761919; - } - - &.status-processing { - background: #C6E1C6; - color: #5B841B; - } - - &.status-trash { - background: #eba3a3; - color: #761919; - } - - > span { - margin: 0 1em; - overflow: hidden; - text-overflow: ellipsis; - } - } - - .wc-order-preview { - .order-status { - float: right; - margin-right: 54px; - } - article { - padding: 0 !important; - } - .modal-close { - border-radius: 0; - } - .wc-order-preview-table { - width: 100%; - margin: 0; - th, td { - padding: 1em 1.5em; - text-align: left; - border: 0; - border-bottom: 1px solid #eee; - margin: 0; - background: transparent; - box-shadow: none; - text-align: right; - vertical-align: top; - } - td:first-child, - th:first-child { - text-align: left; - } - th { - border-color: #ccc; - } - tr:last-child td { - border: 0; - } - .wc-order-item-sku { - margin-top: .5em; - } - .wc-order-item-meta { - margin-top: .5em; - th, td { - padding: 0; - border: 0; - text-align: left; - vertical-align: top; - } - td:last-child { - padding-left: .5em; - } - } - } - .wc-order-preview-addresses { - overflow: hidden; - padding-bottom: 1.5em; - - .wc-order-preview-address, - .wc-order-preview-note { - width: 50%; - float: left; - padding: 1.5em 1.5em 0; - box-sizing: border-box; - word-wrap: break-word; - - h2 { - margin-top: 0; - } - strong { - display: block; - margin-top: 1.5em; - } - strong:first-child { - margin-top: 0; - } - } - } - footer { - .wc-action-button-group { - display: inline-block; - float: left; - } - .button.button-large { - margin-left: 10px; - padding: 0 10px !important; - line-height: 28px; - height: auto; - display: inline-block; - } - } - .wc-action-button-group label { - display: none; - } - } - - .wc-action-button-group { - vertical-align: middle; - line-height: 26px; - text-align: left; - label { - margin-right: 6px; - cursor: default; - font-weight: bold; - line-height: 28px; - } - .wc-action-button-group__items { - display: inline-flex; - flex-flow: row wrap; - align-content: flex-start; - justify-content: flex-start; - } - .wc-action-button { - margin: 0 0 0 -1px !important; - border: 1px solid #ccc; - padding: 0 10px !important; - border-radius: 0 !important; - float: none; - line-height: 28px; - height: auto; - z-index: 1; - position:relative; - overflow: hidden; - text-overflow: ellipsis; - flex: 1 0 auto; - box-sizing: border-box; - text-align: center; - white-space: nowrap; - } - .wc-action-button:hover, - .wc-action-button:focus { - border: 1px solid #999; - z-index: 2; - } - .wc-action-button:first-child { - margin-left: 0 !important; - border-top-left-radius: 3px !important; - border-bottom-left-radius: 3px !important; - } - .wc-action-button:last-child { - border-top-right-radius: 3px !important; - border-bottom-right-radius: 3px !important; - } - } - @media screen and (max-width: 782px) { - .wc-order-preview footer { - .wc-action-button-group .wc-action-button-group__items { - display: flex; - } - .wc-action-button-group { - float: none; - display: block; - margin-bottom: 4px; - } - .button.button-large { - width: 100%; - float: none; - text-align: center; - margin: 0; - display: block; - } - } - - .post-type-shop_order .wp-list-table { - td.check-column { - width: 1em; - } - td.column-order_number { - padding-left: 0; - padding-bottom: .5em; - } - td.column-order_status, - td.column-order_date { - display: inline-block !important; - padding: 0 1em 1em 1em !important; - &:before { - display: none !important; - } - } - td.column-order_date { - padding-left: 0 !important; - } - td.column-order_status { - float: right; - } - } - } - - .column-customer_message .note-on { - @include ir(); - margin: 0 auto; - color: #999; - - &::after { - @include icon( '\e026' ); - line-height: 16px; - } - } - - .column-order_notes .note-on { - @include ir(); - margin: 0 auto; - color: #999; - - &::after { - @include icon( '\e027' ); - line-height: 16px; - } - } - - .attributes-table { - td, - th { - width: 15%; - vertical-align: top; - } - - .attribute-terms { - width: 32%; - } - - .attribute-actions { - width: 2em; - - .configure-terms { - @include ir(); - padding: 0 !important; - height: 2em !important; - width: 2em; - - &::after { - @include icon('\f111'); - font-family: 'Dashicons'; - line-height: 1.85; - } - } - } - } - - /* Order notes */ - ul.order_notes { - padding: 2px 0 0; - - li { - .note_content { - padding: 10px; - background: #efefef; - position: relative; - - p { - margin: 0; - padding: 0; - word-wrap: break-word; - } - } - - p.meta { - padding: 10px; - color: #999; - margin: 0; - font-size: 11px; - - .exact-date { - border-bottom: 1px dotted #999; - } - } - - a.delete_note { - color: $red; - } - - .note_content::after { - content: ''; - display: block; - position: absolute; - bottom: -10px; - left: 20px; - width: 0; - height: 0; - border-width: 10px 10px 0 0; - border-style: solid; - border-color: #efefef transparent; - } - } - li.system-note { - .note_content { - background: #d7cad2; - } - .note_content::after { - border-color: #d7cad2 transparent; - } - } - li.customer-note { - .note_content { - background: #a7cedc; - } - .note_content::after { - border-color: #a7cedc transparent; - } - } - } - - .add_note { - border-top: 1px solid #ddd; - padding: 10px 10px 0; - - h4 { - margin-top: 5px !important; - } - - #add_order_note { - width: 100%; - height: 50px; - } - } - - table.wp-list-table { - .column-thumb { - width: 52px; - text-align: center; - white-space: nowrap; - } - - .column-handle { - width: 17px; - display: none; - } - - tbody { - td.column-handle { - cursor: move; - width: 17px; - text-align: center; - vertical-align: text-top; - - &::before { - content: '\f333'; - font-family: 'Dashicons'; - text-align: center; - line-height: 1; - color: #999; - display: block; - width: 17px; - height: 100%; - margin: 4px 0 0 0; - } - } - } - - .column-name { - width: 22%; - } - - .column-product_cat, - .column-product_tag { - width: 11% !important; - } - - .column-featured, - .column-product_type { - width: 48px; - text-align: left !important; - } - - .column-customer_message, - .column-order_notes { - width: 48px; - text-align: center; - img { - margin: 0 auto; - padding-top: 0 !important; - } - } - - .manage-column.column-featured img, - .manage-column.column-product_type img { - padding-left: 2px; - } - - .column-price .woocommerce-price-suffix { - display: none; - } - - img { - margin: 1px 2px; - } - - .row-actions { - color: #999; - } - - td.column-thumb img { - margin: 0; - width: auto; - height: auto; - max-width: 40px; - max-height: 40px; - vertical-align: middle; - } - - span.na { - color: #999; - } - - .column-sku { - width: 10%; - } - - .column-price { - width: 10ch; - } - - .column-is_in_stock { - text-align: left !important; - width: 12ch; - } - - span.wc-image, - span.wc-featured { - @include ir(); - margin: 0 auto; - - &::before { - @include icon_dashicons( '\f128' ); - } - } - - span.wc-featured { - &::before { - content: '\f155'; - } - &.not-featured::before { - content: '\f154'; - } - } - - td.column-featured span.wc-featured { - font-size: 1.6em; - cursor: pointer; - } - - mark { - &.instock, - &.outofstock, - &.onbackorder { - font-weight: 700; - background: transparent none; - line-height: 1; - } - - &.instock { - color: $green; - } - - &.outofstock { - color: #aa4444; - } - - &.onbackorder { - color: #eaa600; - } - } - - .order-notes_head, - .notes_head, - .status_head { - @include ir(); - margin: 0 auto; - - &::after { - @include icon; - } - } - - .order-notes_head::after { - content: '\e028'; - } - - .notes_head::after { - content: '\e026'; - } - - .status_head::after { - content: '\e011'; - } - - .column-order_items { - width: 12%; - - table.order_items { - width: 100%; - margin: 3px 0 0; - padding: 0; - display: none; - - td { - border: 0; - margin: 0; - padding: 0 0 3px; - } - - td.qty { - color: #999; - padding-right: 6px; - text-align: left; - } - } - } - } - - mark.notice { - background: #fff; - color: $red; - margin: 0 0 0 10px; - } - - a.export_rates, - a.import_rates { - float: right; - margin-left: 9px; - margin-top: -2px; - margin-bottom: 0; - } - - #rates-search { - float: right; - input.wc-tax-rates-search-field { - padding: 4px 8px; - font-size: 1.2em; - } - } - #rates-pagination { - float: right; - margin-right: 0.5em; - .tablenav { - margin: 0; - } - } - - .wc_input_table_wrapper { - overflow-x: auto; - display: block; - } - - table.wc_tax_rates, - table.wc_input_table { - width: 100%; - - th, td { - display: table-cell !important; - } - - span.tips { - color: $blue; - } - - th { - white-space: nowrap; - padding: 10px; - } - - td { - padding: 0; - border-right: 1px solid #dfdfdf; - border-bottom: 1px solid #dfdfdf; - border-top: 0; - background: #fff; - cursor: default; - - input[type=text], - input[type=number] { - width: 100% !important; - min-width: 100px; - padding: 8px 10px; - margin: 0; - border: 0; - outline: 0; - background: transparent none; - - &:focus { - outline: 0; - box-shadow: none; - } - } - - &.compound, - &.apply_to_shipping { - padding: 5px 7px; - vertical-align: middle; - - input { - width: auto; - padding: 0; - } - } - } - - td:last-child { - border-right: 0; - } - - tr.current td { - background-color: #fefbcc; - } - - .item_cost, - .cost { - text-align: right; - - input { - text-align: right; - } - } - - th.sort { - width: 17px; - padding: 0 4px; - } - - td.sort { - padding: 0 4px; - } - - .ui-sortable:not( .ui-sortable-disabled ) td.sort { - cursor: move; - font-size: 15px; - background: #f9f9f9; - text-align: center; - vertical-align: middle; - - &::before { - content: '\f333'; - font-family: 'Dashicons'; - text-align: center; - line-height: 1; - color: #999; - display: block; - width: 17px; - float: left; - height: 100%; - } - - &:hover::before { - color: #333; - } - } - - .button { - float: left; - margin-right: 5px; - } - - .export, - .import { - float: right; - margin-right: 0; - margin-left: 5px; - } - - span.tips { - padding: 0 3px; - } - - .pagination { - float: right; - - .button { - margin-left: 5px; - margin-right: 0; - } - - .current { - background: #bbb; - text-shadow: none; - } - } - - tr:last-child td { - border-bottom: 0; - } - } - - table.wc_gateways, - table.wc_emails, - table.wc_shipping { - position: relative; - - th, td { - display: table-cell !important; - padding: 1em !important; - vertical-align: top; - line-height: 1.75em; - } - - &.wc_emails td { - vertical-align: middle; - } - - tr:nth-child( odd ) td { - background: #f9f9f9; - } - - td.name { - font-weight: 700; - } - - .settings { - text-align: right; - } - - .radio, - .default, - .status { - text-align: center; - - .tips { - margin: 0 auto; - } - - input { - margin: 0; - } - } - td.sort { - font-size: 15px; - text-align: center; - - .wc-item-reorder-nav { + &::before { + + @include icon_dashicons( "\f158" ); + } + + &:hover::before { + color: $red; + } + } + } + } +} + +ul.wc_coupon_list_block { + margin: 0; + padding-bottom: 2px; + + li { + border-top: 1px solid #fff; + border-bottom: 1px solid #ccc; + line-height: 2.5em; + margin: 0; + padding: 0.5em 0; + } + + li:first-child { + border-top: 0; + padding-top: 0; + } + + li:last-child { + border-bottom: 0; + padding-bottom: 0; + } +} + +.button.wc-reload { + + @include ir(); + padding: 0; + height: 28px; + width: 28px !important; + display: inline-block; + + &::after { + + @include icon_dashicons( "\f345" ); + line-height: 28px; + } +} + +#woocommerce-order-data { + + .hndle, + .handlediv { + display: none; + } + + .inside { + display: block !important; + } +} + +#order_data { + padding: 23px 24px 12px; + + h2 { + margin: 0; + font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", sans-serif; + font-size: 21px; + font-weight: normal; + line-height: 1.2; + text-shadow: 1px 1px 1px white; + padding: 0; + } + + h3 { + font-size: 14px; + } + + h3, + h4 { + color: #333; + margin: 1.33em 0 0; + } + + p { + color: #777; + } + + p.order_number { + margin: 0; + font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", sans-serif; + font-weight: normal; + line-height: 1.6em; + font-size: 16px; + } + + .order_data_column_container { + clear: both; + } + + .order_data_column { + width: 32%; + padding: 0 2% 0 0; + float: left; + + > h3 span { + display: block; + } + + &:last-child { + padding-right: 0; + } + + p { + padding: 0 !important; + } + + .address strong { + display: block; + } + + .form-field { + float: left; + clear: left; + width: 48%; + padding: 0; + margin: 9px 0 0; + + label { + display: block; + padding: 0 0 3px; + } + + input, + textarea { + width: 100%; + } + + select { + width: 100%; + } + + .select2-container { + width: 100% !important; + } + + .date-picker { + width: 50%; + } + + .hour, + .minute { + width: 3.5em; + } + + small { + display: block; + margin: 5px 0 0; + color: #999; + } + } + + .form-field.last, + ._billing_last_name_field, + ._billing_address_2_field, + ._billing_postcode_field, + ._billing_state_field, + ._billing_phone_field, + ._shipping_last_name_field, + ._shipping_address_2_field, + ._shipping_postcode_field, + ._shipping_state_field { + float: right; + clear: right; + } + + .form-field-wide, + ._billing_company_field, + ._shipping_company_field, + ._transaction_id_field { + width: 100%; + clear: both; + + input, + textarea, + select, + .wc-enhanced-select, + .wc-category-search, + .wc-customer-search { + width: 100%; + } + } + + p.none_set { + color: #999; + } + + div.edit_address { + display: none; + zoom: 1; + padding-right: 1px; + } + + .wc-customer-user, + .wc-order-status { + + label a { + float: right; + margin-left: 8px; + } + } + + a.edit_address { + width: 14px; + height: 0; + padding: 14px 0 0; + margin: 0 0 0 6px; + overflow: hidden; + position: relative; + color: #999; + border: 0; + float: right; + + &:hover, + &:focus { + color: #000; + } + + &::after { + font-family: "WooCommerce"; + position: absolute; + top: 0; + left: 0; + text-align: center; + vertical-align: top; + line-height: 14px; + font-size: 14px; + font-weight: 400; + } + } + + a.edit_address::after { + font-family: "Dashicons"; + content: "\f464"; + } + + .billing-same-as-shipping, + .load_customer_shipping, + .load_customer_billing { + font-size: 13px; + display: inline-block; + font-weight: normal; + } + + .load_customer_shipping { + margin-right: 0.3em; + } + } +} + +.order_actions { + margin: 0; + overflow: hidden; + zoom: 1; + + li { + border-top: 1px solid #fff; + border-bottom: 1px solid #ddd; + padding: 6px 0; + margin: 0; + line-height: 1.6em; + float: left; + width: 50%; + text-align: center; + + a { + float: none; + text-align: center; + text-decoration: underline; + } + + &.wide { + width: auto; + float: none; + clear: both; + padding: 6px; + text-align: left; + overflow: hidden; + } + + #delete-action { + line-height: 25px; + vertical-align: middle; + text-align: left; + float: left; + } + + .save_order { + float: right; + } + + &#actions { + overflow: hidden; + + .button { + width: 24px; + box-sizing: border-box; + float: right; + } + + select { + width: 225px; + box-sizing: border-box; + float: left; + } + } + } +} + +#woocommerce-order-items { + + .inside { + margin: 0; + padding: 0; + background: #fefefe; + } + + .wc-order-data-row { + border-bottom: 1px solid #dfdfdf; + padding: 1.5em 2em; + background: #f8f8f8; + + @include clearfix(); + line-height: 2em; + text-align: right; + + p { + margin: 0; + line-height: 2em; + } + + .wc-used-coupons { + text-align: left; + + .tips { + display: inline-block; + } + } + } + + .wc-used-coupons { + float: left; + width: 50%; + } + + .wc-order-totals { + float: right; + width: 50%; + margin: 0; + padding: 0; + text-align: right; + + .amount { + font-weight: 700; + } + + .label { + vertical-align: top; + } + + .total { + font-size: 1em !important; + width: 10em; + margin: 0 0 0 0.5em; + box-sizing: border-box; + + input[type="text"] { + width: 96%; + float: right; + } + } + + .refunded-total { + color: $red; + } + } + + .refund-actions { + margin-top: 5px; + padding-top: 12px; + border-top: 1px solid #dfdfdf; + + .button { + float: right; + margin-left: 4px; + } + + .cancel-action { + float: left; + margin-left: 0; + } + } + + .add_meta { + margin-left: 0 !important; + } + + h3 small { + color: #999; + } + + .amount { + white-space: nowrap; + } + + .add-items { + + .description { + margin-right: 10px; + } + + .button { + float: left; + margin-right: 0.25em; + } + + .button-primary { + float: none; + margin-right: 0; + } + } +} + +#woocommerce-order-items { + + .inside { + display: block !important; + } + + .hndle, + .handlediv { + display: none; + } + + .woocommerce_order_items_wrapper { + margin: 0; + overflow-x: auto; + + table.woocommerce_order_items { + width: 100%; + background: #fff; + + thead th { + text-align: left; + padding: 1em; + font-weight: normal; + color: #999; + background: #f8f8f8; + -webkit-touch-callout: none; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + + &.sortable { + cursor: pointer; + } + + &:last-child { + padding-right: 2em; + } + + &:first-child { + padding-left: 2em; + } + + .wc-arrow { + float: right; + position: relative; + margin-right: -1em; + } + } + + tbody th, + td { + padding: 1.5em 1em 1em; + text-align: left; + line-height: 1.5em; + vertical-align: top; + border-bottom: 1px solid #f8f8f8; + + textarea { + width: 100%; + } + + select { + width: 50%; + } + + input, + textarea { + font-size: 14px; + padding: 4px; + color: #555; + } + + &:last-child { + padding-right: 2em; + } + + &:first-child { + padding-left: 2em; + } + } + + tbody tr:last-child td { + border-bottom: 1px solid #dfdfdf; + } + + tbody tr:first-child td { + border-top: 8px solid #f8f8f8; + } + + tbody#order_line_items tr:first-child td { + border-top: none; + } + + td.thumb { + text-align: left; + width: 38px; + padding-bottom: 1.5em; + + .wc-order-item-thumbnail { + width: 38px; + height: 38px; + border: 2px solid #e8e8e8; + background: #f8f8f8; + color: #ccc; + position: relative; + font-size: 21px; + display: block; + text-align: center; + + &::before { + + @include icon_dashicons( "\f128" ); + width: 38px; + line-height: 38px; + display: block; + } + + img { + width: 100%; + height: 100%; + margin: 0; + padding: 0; + position: relative; + } + } + } + + td.name { + + .wc-order-item-sku, + .wc-order-item-variation { + display: block; + margin-top: 0.5em; + font-size: 0.92em !important; + color: #888; + } + } + + .item { + min-width: 200px; + } + + .center, + .variation-id { + text-align: center; + } + + .cost, + .tax, + .quantity, + .line_cost, + .line_tax, + .tax_class, + .item_cost { + text-align: right; + + label { + white-space: nowrap; + color: #999; + font-size: 0.833em; + + input { + display: inline; + } + } + + input { + width: 70px; + vertical-align: middle; + text-align: right; + } + + select { + width: 85px; + height: 26px; + vertical-align: middle; + font-size: 1em; + } + + .split-input { + display: inline-block; + background: #fff; + border: 1px solid #ddd; + box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.07); + margin: 1px 0; + min-width: 80px; + overflow: hidden; + line-height: 1em; + text-align: right; + + div.input { + width: 100%; + box-sizing: border-box; + + label { + font-size: 0.75em; + padding: 4px 6px 0; + color: #555; + display: block; + } + + input { + width: 100%; + box-sizing: border-box; + border: 0; + box-shadow: none; + margin: 0; + padding: 0 6px 4px; + color: #555; + background: transparent; + + &::-webkit-input-placeholder { + color: #ddd; + } + } + } + + div.input:first-child { + border-bottom: 1px dashed #ddd; + background: #fff; + + label { + color: #ccc; + } + + input { + color: #ccc; + } + } + } + + .view { + white-space: nowrap; + } + + .edit { + text-align: left; + } + + small.times, + del, + .wc-order-item-taxes, + .wc-order-item-discount, + .wc-order-item-refund-fields { + font-size: 0.92em !important; + color: #888; + } + + .wc-order-item-taxes, + .wc-order-item-refund-fields { + margin: 0; + + label { + display: block; + } + } + + .wc-order-item-discount { + display: block; + margin-top: 0.5em; + } + + small.times { + margin-right: 0.25em; + } + } + + .quantity { + text-align: center; + + input { + text-align: center; + width: 50px; + } + } + + span.subtotal { + opacity: 0.5; + } + + td.tax_class, + th.tax_class { + text-align: left; + } + + .calculated { + border-color: #ae8ca2; + border-style: dotted; + } + + table.meta { + width: 100%; + } + + table.meta, + table.display_meta { + margin: 0.5em 0 0; + font-size: 0.92em !important; + color: #888; + + tr { + + th { + border: 0; + padding: 0 4px 0.5em 0; + line-height: 1.5em; + width: 20%; + } + + td { + padding: 0 4px 0.5em 0; + border: 0; + line-height: 1.5em; + + input { + width: 100%; + margin: 0; + position: relative; + border-bottom: 0; + box-shadow: none; + } + + textarea { + width: 100%; + height: 4em; + margin: 0; + box-shadow: none; + } + + input:focus + textarea { + border-top-color: #999; + } + + p { + margin: 0 0 0.5em; + line-height: 1.5em; + } + + p:last-child { + margin: 0; + } + } + } + } + + .refund_by { + border-bottom: 1px dotted #999; + } + + tr.fee .thumb div { + + @include ir(); + font-size: 1.5em; + line-height: 1em; + vertical-align: middle; + margin: 0 auto; + + &::before { + + @include icon( "\e007" ); + color: #ccc; + } + } + + tr.refund .thumb div { + + @include ir(); + font-size: 1.5em; + line-height: 1em; + vertical-align: middle; + margin: 0 auto; + + &::before { + + @include icon( "\e014" ); + color: #ccc; + } + } + + tr.shipping { + + .thumb div { + + @include ir(); + font-size: 1.5em; + line-height: 1em; + vertical-align: middle; + margin: 0 auto; + + &::before { + + @include icon( "\e01a" ); + color: #ccc; + } + } + + .shipping_method_name, + .shipping_method { + width: 100%; + margin: 0 0 0.5em; + } + } + + th.line_tax { + white-space: nowrap; + } + + th.line_tax, + td.line_tax { + + .delete-order-tax { + + @include ir(); + float: right; + font-size: 14px; + visibility: hidden; + margin: 3px -18px 0 0; + + &::before { + + @include icon_dashicons( "\f153" ); + color: #999; + } + + &:hover::before { + color: $red; + } + } + + &:hover .delete-order-tax { + visibility: visible; + } + } + + small.refunded { + display: block; + color: $red; + white-space: nowrap; + margin-top: 0.5em; + + &::before { + + @include icon_dashicons( "\f171" ); + position: relative; + top: auto; + left: auto; + margin: -1px 4px 0 0; + vertical-align: middle; + line-height: 1em; + } + } + } + } + + .wc-order-edit-line-item { + padding-left: 0; + } + + .wc-order-edit-line-item-actions { + width: 44px; + text-align: right; + padding-left: 0; + vertical-align: middle; + + a { + color: #ccc; + display: inline-block; + cursor: pointer; + padding: 0 0 0.5em; + margin: 0 0 0 12px; + vertical-align: middle; + text-decoration: none; + line-height: 16px; + width: 16px; + overflow: hidden; + + &::before { + margin: 0; + padding: 0; + font-size: 16px; + width: 16px; + height: 16px; + } + + &:hover { + + &::before { + color: #999; + } + } + + &:first-child { + margin-left: 0; + } + } + + .edit-order-item::before { + + @include icon_dashicons( "\f464" ); + position: relative; + } + + .delete-order-item, + .delete_refund { + + &::before { + + @include icon_dashicons( "\f158" ); + position: relative; + } + + &:hover::before { + color: $red; + } + } + } + + tbody tr .wc-order-edit-line-item-actions { + visibility: hidden; + } + + tbody tr:hover .wc-order-edit-line-item-actions { + visibility: visible; + } + + .wc-order-totals .wc-order-edit-line-item-actions { + width: 1.5em; + visibility: visible !important; + + a { + padding: 0; + } + } +} + +#woocommerce-order-downloads { + + .buttons { + float: left; + padding: 0; + margin: 0; + vertical-align: top; + + .add_item_id, + .select2-container { + width: 400px !important; + margin-right: 9px; + vertical-align: top; + float: left; + } + + button { + margin: 2px 0 0; + } + } + + h3 small { + color: #999; + } +} + +#poststuff #woocommerce-order-actions .inside { + margin: 0; + padding: 0; + + ul.order_actions li { + padding: 6px 10px; + box-sizing: border-box; + + &:last-child { + border-bottom: 0; + } + } +} + +#poststuff #woocommerce-order-notes .inside { + margin: 0; + padding: 0; + + ul.order_notes li { + padding: 0 10px; + } +} + +#woocommerce_customers { + + p.search-box { + margin: 6px 0 4px; + float: left; + } + + .tablenav { + float: right; + clear: none; + } +} + +.widefat { + + &.customers td { + vertical-align: middle; + padding: 4px 7px; + } + + .column-order_title { + width: 15%; + + time { + display: block; + color: #999; + margin: 3px 0; + } + } + + .column-orders, + .column-paying, + .column-spent { + text-align: center; + width: 8%; + } + + .column-last_order { + width: 11%; + } + + .column-wc_actions { + width: 110px; + + a.button { + + @include ir(); + display: inline-block; + margin: 2px 4px 2px 0; + padding: 0 !important; + height: 2em !important; + width: 2em; + overflow: hidden; + vertical-align: middle; + + &::after { + font-family: "Dashicons"; + speak: none; + font-weight: normal; + font-variant: normal; + text-transform: none; + margin: 0; + text-indent: 0; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + text-align: center; + line-height: 1.85; + } + + img { + display: block; + width: 12px; + height: auto; + } + } + + a.edit::after { + content: "\f464"; + } + + a.link::after { + font-family: "WooCommerce"; + content: "\e00d"; + } + + a.view::after { + content: "\f177"; + } + + a.refresh::after { + font-family: "WooCommerce"; + content: "\e031"; + } + + a.processing::after { + font-family: "WooCommerce"; + content: "\e00f"; + } + + a.complete::after { + content: "\f147"; + } + } + + small.meta { + display: block; + color: #999; + font-size: inherit; + margin: 3px 0; + } +} + +.post-type-shop_order { + + .tablenav .one-page .displaying-num { + display: none; + } + + .wp-list-table { + margin-top: 1em; + + thead, + tfoot { + + th { + padding: 0.75em 1em; + } + + th.sortable a, + th.sorted a { + padding: 0; + } + + th:first-child { + padding-left: 2em; + } + + th:last-child { + padding-right: 2em; + } + } + + tbody { + + td, + th { + padding: 1em; + line-height: 26px; + } + + td:first-child { + padding-left: 2em; + } + + td:last-child { + padding-right: 2em; + } + } + + tbody tr { + border-top: 1px solid #f5f5f5; + } + + tbody tr:hover:not(.status-trash):not(.no-link) td { + cursor: pointer; + } + + .no-link { + cursor: default !important; + } + + // Columns. + td, + th { + width: 12ch; + vertical-align: middle; + + p { + margin: 0; + } + } + + .check-column { + width: 1px; + white-space: nowrap; + padding: 1em 1em 1em 1em !important; + vertical-align: middle; + + input { + vertical-align: text-top; + margin: 1px 0; + } + } + + .column-order_number { + width: 20ch; + } + + .column-order_total { + width: 8ch; + text-align: right; + + a span { + float: right; + } + } + + .column-order_date, + .column-order_status { + width: 10ch; + } + + .column-order_status { + width: 14ch; + } + + .column-shipping_address, + .column-billing_address { + width: 20ch; + line-height: 1.5em; + + .description { + display: block; + color: #999; + } + } + + .column-wc_actions { + text-align: right; + + a.button { + text-indent: 9999px; + margin: 2px 0 2px 4px; + } + } + + .order-preview { + float: right; + width: 16px; + padding: 20px 4px 4px 4px; + height: 0; + overflow: hidden; + position: relative; + border: 2px solid transparent; + border-radius: 4px; + + &::before { + + @include icon( "\e010" ); + line-height: 16px; + font-size: 14px; + vertical-align: middle; + top: 4px; + + } + + &:hover { + border: 2px solid #00a0d2; + } + } + + .order-preview.disabled { + + &::before { + content: ""; + background: url("../images/wpspin.gif") no-repeat center top; + } + } + } +} + +.order-status { + display: inline-flex; + line-height: 2.5em; + color: #777; + background: #e5e5e5; + border-radius: 4px; + border-bottom: 1px solid rgba(0, 0, 0, 0.05); + margin: -0.25em 0; + cursor: inherit !important; + white-space: nowrap; + max-width: 100%; + + &.status-completed { + background: #c8d7e1; + color: #2e4453; + } + + &.status-on-hold { + background: #f8dda7; + color: #94660c; + } + + &.status-failed { + background: #eba3a3; + color: #761919; + } + + &.status-processing { + background: #c6e1c6; + color: #5b841b; + } + + &.status-trash { + background: #eba3a3; + color: #761919; + } + + > span { + margin: 0 1em; + overflow: hidden; + text-overflow: ellipsis; + } +} + +.wc-order-preview { + + .order-status { + float: right; + margin-right: 54px; + } + + article { + padding: 0 !important; + } + + .modal-close { + border-radius: 0; + } + + .wc-order-preview-table { + width: 100%; + margin: 0; + + th, + td { + padding: 1em 1.5em; + text-align: left; + border: 0; + border-bottom: 1px solid #eee; + margin: 0; + background: transparent; + box-shadow: none; + text-align: right; + vertical-align: top; + } + + td:first-child, + th:first-child { + text-align: left; + } + + th { + border-color: #ccc; + } + + tr:last-child td { + border: 0; + } + + .wc-order-item-sku { + margin-top: 0.5em; + } + + .wc-order-item-meta { + margin-top: 0.5em; + + th, + td { + padding: 0; + border: 0; + text-align: left; + vertical-align: top; + } + + td:last-child { + padding-left: 0.5em; + } + } + } + + .wc-order-preview-addresses { + overflow: hidden; + padding-bottom: 1.5em; + + .wc-order-preview-address, + .wc-order-preview-note { + width: 50%; + float: left; + padding: 1.5em 1.5em 0; + box-sizing: border-box; + word-wrap: break-word; + + h2 { + margin-top: 0; + } + + strong { + display: block; + margin-top: 1.5em; + } + + strong:first-child { + margin-top: 0; + } + } + } + + footer { + + .wc-action-button-group { + display: inline-block; + float: left; + } + + .button.button-large { + margin-left: 10px; + padding: 0 10px !important; + line-height: 28px; + height: auto; + display: inline-block; + } + } + + .wc-action-button-group label { + display: none; + } +} + +.wc-action-button-group { + vertical-align: middle; + line-height: 26px; + text-align: left; + + label { + margin-right: 6px; + cursor: default; + font-weight: bold; + line-height: 28px; + } + + .wc-action-button-group__items { + display: inline-flex; + flex-flow: row wrap; + align-content: flex-start; + justify-content: flex-start; + } + + .wc-action-button { + margin: 0 0 0 -1px !important; + border: 1px solid #ccc; + padding: 0 10px !important; + border-radius: 0 !important; + float: none; + line-height: 28px; + height: auto; + z-index: 1; + position: relative; + overflow: hidden; + text-overflow: ellipsis; + flex: 1 0 auto; + box-sizing: border-box; + text-align: center; + white-space: nowrap; + } + + .wc-action-button:hover, + .wc-action-button:focus { + border: 1px solid #999; + z-index: 2; + } + + .wc-action-button:first-child { + margin-left: 0 !important; + border-top-left-radius: 3px !important; + border-bottom-left-radius: 3px !important; + } + + .wc-action-button:last-child { + border-top-right-radius: 3px !important; + border-bottom-right-radius: 3px !important; + } +} + +@media screen and (max-width: 782px) { + + .wc-order-preview footer { + + .wc-action-button-group .wc-action-button-group__items { + display: flex; + } + + .wc-action-button-group { + float: none; + display: block; + margin-bottom: 4px; + } + + .button.button-large { + width: 100%; + float: none; + text-align: center; + margin: 0; + display: block; + } + } + + .post-type-shop_order .wp-list-table { + + td.check-column { + width: 1em; + } + + td.column-order_number { + padding-left: 0; + padding-bottom: 0.5em; + } + + td.column-order_status, + td.column-order_date { + display: inline-block !important; + padding: 0 1em 1em 1em !important; + + &::before { + display: none !important; + } + } + + td.column-order_date { + padding-left: 0 !important; + } + + td.column-order_status { + float: right; + } + } +} + +.column-customer_message .note-on { + + @include ir(); + margin: 0 auto; + color: #999; + + &::after { + + @include icon( "\e026" ); + line-height: 16px; + } +} + +.column-order_notes .note-on { + + @include ir(); + margin: 0 auto; + color: #999; + + &::after { + + @include icon( "\e027" ); + line-height: 16px; + } +} + +.attributes-table { + + td, + th { + width: 15%; + vertical-align: top; + } + + .attribute-terms { + width: 32%; + } + + .attribute-actions { + width: 2em; + + .configure-terms { + + @include ir(); + padding: 0 !important; + height: 2em !important; + width: 2em; + + &::after { + + @include icon("\f111"); + font-family: "Dashicons"; + line-height: 1.85; + } + } + } +} + +/* Order notes */ +ul.order_notes { + padding: 2px 0 0; + + li { + + .note_content { + padding: 10px; + background: #efefef; + position: relative; + + p { + margin: 0; + padding: 0; + word-wrap: break-word; + } + } + + p.meta { + padding: 10px; + color: #999; + margin: 0; + font-size: 11px; + + .exact-date { + border-bottom: 1px dotted #999; + } + } + + a.delete_note { + color: $red; + } + + .note_content::after { + content: ""; + display: block; + position: absolute; + bottom: -10px; + left: 20px; + width: 0; + height: 0; + border-width: 10px 10px 0 0; + border-style: solid; + border-color: #efefef transparent; + } + } + + li.system-note { + + .note_content { + background: #d7cad2; + } + + .note_content::after { + border-color: #d7cad2 transparent; + } + } + + li.customer-note { + + .note_content { + background: #a7cedc; + } + + .note_content::after { + border-color: #a7cedc transparent; + } + } +} + +.add_note { + border-top: 1px solid #ddd; + padding: 10px 10px 0; + + h4 { + margin-top: 5px !important; + } + + #add_order_note { + width: 100%; + height: 50px; + } +} + +table.wp-list-table { + + .column-thumb { + width: 52px; + text-align: center; + white-space: nowrap; + } + + .column-handle { + width: 17px; + display: none; + } + + tbody { + + td.column-handle { + cursor: move; + width: 17px; + text-align: center; + vertical-align: text-top; + + &::before { + content: "\f333"; + font-family: "Dashicons"; + text-align: center; + line-height: 1; + color: #999; + display: block; + width: 17px; + height: 100%; + margin: 4px 0 0 0; + } + } + } + + .column-name { + width: 22%; + } + + .column-product_cat, + .column-product_tag { + width: 11% !important; + } + + .column-featured, + .column-product_type { + width: 48px; + text-align: left !important; + } + + .column-customer_message, + .column-order_notes { + width: 48px; + text-align: center; + + img { + margin: 0 auto; + padding-top: 0 !important; + } + } + + .manage-column.column-featured img, + .manage-column.column-product_type img { + padding-left: 2px; + } + + .column-price .woocommerce-price-suffix { + display: none; + } + + img { + margin: 1px 2px; + } + + .row-actions { + color: #999; + } + + td.column-thumb img { + margin: 0; + width: auto; + height: auto; + max-width: 40px; + max-height: 40px; + vertical-align: middle; + } + + span.na { + color: #999; + } + + .column-sku { + width: 10%; + } + + .column-price { + width: 10ch; + } + + .column-is_in_stock { + text-align: left !important; + width: 12ch; + } + + span.wc-image, + span.wc-featured { + + @include ir(); + margin: 0 auto; + + &::before { + + @include icon_dashicons( "\f128" ); + } + } + + span.wc-featured { + + &::before { + content: "\f155"; + } + + &.not-featured::before { + content: "\f154"; + } + } + + td.column-featured span.wc-featured { + font-size: 1.6em; + cursor: pointer; + } + + mark { + + &.instock, + &.outofstock, + &.onbackorder { + font-weight: 700; + background: transparent none; + line-height: 1; + } + + &.instock { + color: $green; + } + + &.outofstock { + color: #a44; + } + + &.onbackorder { + color: #eaa600; + } + } + + .order-notes_head, + .notes_head, + .status_head { + + @include ir(); + margin: 0 auto; + + &::after { + + @include icon; + } + } + + .order-notes_head::after { + content: "\e028"; + } + + .notes_head::after { + content: "\e026"; + } + + .status_head::after { + content: "\e011"; + } + + .column-order_items { + width: 12%; + + table.order_items { + width: 100%; + margin: 3px 0 0; + padding: 0; + display: none; + + td { + border: 0; + margin: 0; + padding: 0 0 3px; + } + + td.qty { + color: #999; + padding-right: 6px; + text-align: left; + } + } + } +} + +mark.notice { + background: #fff; + color: $red; + margin: 0 0 0 10px; +} + +a.export_rates, +a.import_rates { + float: right; + margin-left: 9px; + margin-top: -2px; + margin-bottom: 0; +} + +#rates-search { + float: right; + + input.wc-tax-rates-search-field { + padding: 4px 8px; + font-size: 1.2em; + } +} + +#rates-pagination { + float: right; + margin-right: 0.5em; + + .tablenav { + margin: 0; + } +} + +.wc_input_table_wrapper { + overflow-x: auto; + display: block; +} + +table.wc_tax_rates, +table.wc_input_table { + width: 100%; + + th, + td { + display: table-cell !important; + } + + span.tips { + color: $blue; + } + + th { + white-space: nowrap; + padding: 10px; + } + + td { + padding: 0; + border-right: 1px solid #dfdfdf; + border-bottom: 1px solid #dfdfdf; + border-top: 0; + background: #fff; + cursor: default; + + input[type=text], + input[type=number] { + width: 100% !important; + min-width: 100px; + padding: 8px 10px; + margin: 0; + border: 0; + outline: 0; + background: transparent none; + + &:focus { + outline: 0; + box-shadow: none; + } + } + + &.compound, + &.apply_to_shipping { + padding: 5px 7px; + vertical-align: middle; + + input { + width: auto; + padding: 0; + } + } + } + + td:last-child { + border-right: 0; + } + + tr.current td { + background-color: #fefbcc; + } + + .item_cost, + .cost { + text-align: right; + + input { + text-align: right; + } + } + + th.sort { + width: 17px; + padding: 0 4px; + } + + td.sort { + padding: 0 4px; + } + + .ui-sortable:not(.ui-sortable-disabled) td.sort { + cursor: move; + font-size: 15px; + background: #f9f9f9; + text-align: center; + vertical-align: middle; + + &::before { + content: "\f333"; + font-family: "Dashicons"; + text-align: center; + line-height: 1; + color: #999; + display: block; + width: 17px; + float: left; + height: 100%; + } + + &:hover::before { + color: #333; + } + } + + .button { + float: left; + margin-right: 5px; + } + + .export, + .import { + float: right; + margin-right: 0; + margin-left: 5px; + } + + span.tips { + padding: 0 3px; + } + + .pagination { + float: right; + + .button { + margin-left: 5px; + margin-right: 0; + } + + .current { + background: #bbb; + text-shadow: none; + } + } + + tr:last-child td { + border-bottom: 0; + } +} + +table.wc_gateways, +table.wc_emails, +table.wc_shipping { + position: relative; + + th, + td { + display: table-cell !important; + padding: 1em !important; + vertical-align: top; + line-height: 1.75em; + } + + &.wc_emails td { + vertical-align: middle; + } + + tr:nth-child(odd) td { + background: #f9f9f9; + } + + td.name { + font-weight: 700; + } + + .settings { + text-align: right; + } + + .radio, + .default, + .status { + text-align: center; + + .tips { + margin: 0 auto; + } + + input { + margin: 0; + } + } + + td.sort { + font-size: 15px; + text-align: center; + + .wc-item-reorder-nav { white-space: nowrap; width: 72px; - &:before { - content: '\f333'; - font-family: 'Dashicons'; + &::before { + content: "\f333"; + font-family: "Dashicons"; text-align: center; line-height: 1; color: #999; @@ -2913,6 +3122,7 @@ line-height: 24px; cursor: move; } + button { position: relative; overflow: hidden; @@ -2929,7 +3139,8 @@ cursor: pointer; outline: none; } - button:before { + + button::before { display: inline-block; position: absolute; top: 0; @@ -2942,2984 +3153,3179 @@ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } + button:hover, button:focus { color: #191e23; } - .wc-move-down:before { + + .wc-move-down::before { content: "\f347"; } - .wc-move-up:before { + + .wc-move-up::before { content: "\f343"; } + .wc-move-disabled { color: #d5d5d5 !important; cursor: default; pointer-events: none; } - } - } - .wc-payment-gateway-method-name { - font-weight: normal; - } - .wc-email-settings-table-name { - font-weight: 700; - span { - font-weight: normal; - color: #999; - margin: 0 0 0 4px !important; - } - } - .wc-payment-gateway-method-toggle-enabled, - .wc-payment-gateway-method-toggle-disabled { - padding-top: 1px; - display: block; - outline: 0; - box-shadow: none; - } - .wc-email-settings-table-status { - text-align: center; - width: 1em; - .tips { - margin: 0 auto; - } - } - } - .wc-shipping-zone-settings { - th { - padding: 24px 24px 24px 0; - } - td.forminp { - input, textarea { - padding: 8px; - max-width: 100% !important; - } - .wc-shipping-zone-region-select { - width: 448px; - max-width: 100% !important; - .select2-choices { - padding: 8px 8px 4px; - border-color: #DDDDDD; - min-height: 0; - line-height: 1; - input { - padding: 0; - } - li { - margin: 0 4px 4px 0; - } - } - } - } - .wc-shipping-zone-postcodes-toggle { - margin: 0.5em 0 0; - font-size: 0.9em; - text-decoration: underline; - display: block; - } - .wc-shipping-zone-postcodes-toggle + .wc-shipping-zone-postcodes { - display:none; - } - .wc-shipping-zone-postcodes { - textarea { - margin: 10px 0; - } - .description { - font-size: 0.9em; - color: #999; - } - } - } - .wc-shipping-zone-settings + p.submit { - margin-top: 0; - } - table { - tr, tr:hover { - table.wc-shipping-zone-methods { - tr .row-actions { - position: relative; - } - tr:hover .row-actions { - position: static; - } - } - } - } - .wc-shipping-zones-heading .page-title-action { - display: inline-block; - } - table.wc-shipping-zones, table.wc-shipping-zone-methods, table.wc-shipping-classes { - td, th { - vertical-align: top; - line-height: 24px; - padding: 1em !important; - font-size: 14px; - background: #fff; - display: table-cell !important; - li { - line-height: 24px; - font-size: 14px; - } - .woocommerce-help-tip { - margin: 0 !important; - } - } - thead { - th { - vertical-align: middle; - } - .wc-shipping-zone-sort { - text-align: center; - } - } - td.wc-shipping-zones-blank-state, td.wc-shipping-zone-method-blank-state { - background: #f7f1f6 !important; - overflow: hidden; - position: relative; - padding: 7.5em 7.5% !important; - border-bottom: 2px solid #eee2ec; - - &.wc-shipping-zone-method-blank-state { - padding: 2em !important; - p { - margin-bottom: 0; - } - } - p, li { - color: #a46497; - font-size: 1.5em; - line-height: 1.5em; - margin: 0 0 1em; - position: relative; - z-index: 1; - text-shadow: 1px 1px 1px white; - - &.main { - font-size: 2em; - } - } - li { - margin-left: 1em; - list-style: circle inside; - } - &::before { - content: '\e01b'; - font-family: 'WooCommerce'; - text-align: center; - line-height: 1; - color: #eee2ec; - display: block; - width: 1em; - font-size: 40em; - top: 50%; - right: -3.75%; - margin-top: -0.1875em; - position: absolute; - } - .button-primary { - background-color: #804877; - border-color: #804877; - box-shadow: inset 0 1px 0 rgba( 255, 255, 255, 0.2 ), 0 1px 0 rgba( 0, 0, 0, 0.15 ); - margin: 0; - opacity: 1; - text-shadow: 0 -1px 1px #8a4f7f, 1px 0 1px #8a4f7f, 0 1px 1px #8a4f7f, -1px 0 1px #8a4f7f; - font-size: 1.5em; - padding: 0.75em 1em; - height: auto; - position: relative; - z-index: 1; - } - } - .wc-shipping-zone-method-rows { - tr:nth-child( even ) td { - background: #f9f9f9; - } - } - tr.odd, .wc-shipping-class-rows tr:nth-child( odd ) { - td { - background: #f9f9f9; - } - } - tbody.wc-shipping-zone-rows { - td { - border-top: 2px solid #f9f9f9; - } - tr:first-child { - td { - border-top: 0; - } - } - } - tr.wc-shipping-zone-worldwide { - td { - background: #f9f9f9; - border-top: 2px solid #e1e1e1; - } - } - ul, p { - margin: 0; - } - td.wc-shipping-zone-sort, td.wc-shipping-zone-method-sort { - cursor: move; - font-size: 15px; - text-align: center; - - &::before { - content: '\f333'; - font-family: 'Dashicons'; - text-align: center; - line-height: 1; - color: #999; - display: block; - width: 17px; - float: left; - height: 100%; - line-height: 24px; - } - &:hover::before { - color: #333; - } - } - td.wc-shipping-zone-worldwide { - text-align: center; - &::before { - content: '\f319'; - font-family: 'dashicons'; - text-align: center; - line-height: 1; - color: #999; - display: block; - width: 17px; - float: left; - height: 100%; - line-height: 24px; - } - } - .wc-shipping-zone-name, - .wc-shipping-zone-methods { - width: 25%; - } - .wc-shipping-class-description, - .wc-shipping-class-name, - .wc-shipping-class-slug, - .wc-shipping-zone-name, - .wc-shipping-zone-region { - input, select, textarea { - width: 100%; - } - a.wc-shipping-zone-delete, a.wc-shipping-class-delete { - color: #a00; - } - a.wc-shipping-zone-delete:hover, a.wc-shipping-class-delete:hover { - color: red; - } - } - .wc-shipping-class-count { - text-align: center; - } - td.wc-shipping-zone-methods { - color: #555; - .method_disabled { - text-decoration: line-through; - } - ul { - position: relative; - padding-right: 32px; - li { - color: #555; - display: inline; - margin: 0; - } - li::before { - content: ', '; - } - li:first-child::before { - content: ''; - } - } - .add_shipping_method { - display: block; - width: 24px; - padding: 24px 0 0; - height: 0; - overflow: hidden; - cursor: pointer; - - &::before { - @include icon; - font-family: 'Dashicons'; - content: '\f502'; - color: #999; - vertical-align: middle; - line-height: 24px; - font-size: 16px; - margin: 0; - } - - &.disabled { - cursor: not-allowed; - &::before { - color: #ccc; - } - } - } - } - .wc-shipping-zone-method-title { - width: 25%; - .wc-shipping-zone-method-delete { - color: red; - } - } - .wc-shipping-zone-method-enabled { - text-align: center; - - a { - display: inline-block; - } - - .woocommerce-input-toggle { - margin-top: 3px; - } - } - .wc-shipping-zone-method-type { - display: block; - } - tfoot { - input, select { - vertical-align: middle !important; - } - .button-secondary { - float: right; - } - } - .editing { - .wc-shipping-zone-view, .wc-shipping-zone-edit { - display: none; - } - } - } - - .woocommerce-input-toggle { - height: 16px; - width: 32px; - border: 2px solid #935687; - background-color: #935687; - display: inline-block; - text-indent: -9999px; - border-radius: 10em; - position: relative; - margin-top: -1px; - vertical-align: text-top; - - &:before { - content: ""; - display: block; - width: 16px; - height: 16px; - background: #fff; - position: absolute; - top: 0; - right: 0; - border-radius: 100%; - } - - &.woocommerce-input-toggle--disabled { - border-color: #999; - background-color: #999; - - &:before { - right: auto; - left: 0; - } - } - &.woocommerce-input-toggle--loading { - opacity: 0.5; - } - } - - .wc-modal-shipping-method-settings { - background: #f8f8f8; - padding: 1em !important; - form .form-table { - width: 100%; - background: #fff; - margin: 0 0 1.5em; - tr { - th { - width: 30%; - position: relative; - .woocommerce-help-tip { - float: right; - margin: -8px -0.5em 0 0; - vertical-align: middle; - right: 0; - top: 50%; - position: absolute; - } - } - td { - input, select, textarea { - width: 50%; - min-width: 250px; - } - input[type='checkbox'] { - width: auto; - min-width: 16px; - } - } - td, th { - vertical-align: middle; - margin: 0; - line-height: 24px; - padding: 1em; - border-bottom: 1px solid #f8f8f8; - } - } - &:last-of-type { - margin-bottom: 0; - } - } - } - - .wc-backbone-modal .wc-shipping-zone-method-selector { - p { - margin-top: 0; - } - .wc-shipping-zone-method-description { - margin: 0.75em 1px 0; - line-height: 1.5em; - color: #999; - font-style: italic; - } - select { - width: 100%; - cursor: pointer; - } - } - - img.help_tip { - margin: 0 0 0 9px; - vertical-align: middle; - } - - .postbox img.help_tip { - margin-top: 0; - } - - .postbox .woocommerce-help-tip { - margin: 0 0 0 9px; - } - - .status-enabled, - .status-manual, - .status-disabled { - font-size: 1.4em; - @include ir(); - } - - .status-manual::before { - @include icon( '\e008' ); - color: #999; - } - - .status-enabled::before { - @include icon( '\e015' ); - color: $woocommerce; - } - - .status-disabled::before { - @include icon( '\e013' ); - color: #ccc; - } - - .woocommerce { - - h2.woo-nav-tab-wrapper { - margin-bottom: 1em; - } - - nav.woo-nav-tab-wrapper { - margin: 1.5em 0 1em; - } - - .subsubsub { - margin: -8px 0 0; - } - - .wc-admin-breadcrumb { - margin-left: 0.5em; - a { - color: #a46497; - } - } - - #template div { - margin: 0; - - p .button { - float: right; - margin-left: 10px; - margin-top: -4px; - } - - .editor textarea { - margin-bottom: 8px; - } - } - - textarea[disabled='disabled'] { - background: #dfdfdf !important; - } - - table.form-table { - margin: 0; - position: relative; - table-layout: fixed; - - .forminp-radio ul { - margin: 0; - li { - line-height: 1.4em; - } - } - - input[type="text"], - input[type="number"], - input[type="email"] { - height: auto; - } - - textarea.input-text { - height: 100%; - min-width: 150px; - display: block; - } - - // Give regular settings inputs a standard width and padding. - textarea, - input[type="text"], - input[type="email"], - input[type="number"], - input[type="password"], - input[type="datetime"], - input[type="datetime-local"], - input[type="date"], - input[type="time"], - input[type="week"], - input[type="url"], - input[type="tel"], - input.regular-input { - width: 400px; - margin: 0; - padding: 6px; - box-sizing: border-box; - vertical-align: top; - } - - input[type="datetime-local"], - input[type="date"], - input[type="time"], - input[type="week"], - input[type="tel"] { - width: 200px; - } - - select { - width: 400px; - margin: 0; - box-sizing: border-box; - height: 32px; - line-height: 32px; - vertical-align: top; - } - - input[size] { - width: auto !important; - } - - // Ignore nested inputs. - table { - select, - textarea, - input[type="text"], - input[type="email"], - input[type="number"], - input.regular-input { - width: auto; - } - } - - textarea.wide-input { - width: 100%; - } - - img.help_tip, - .woocommerce-help-tip { - padding: 0; - margin: -4px 0 0 5px; - vertical-align: middle; - cursor: help; - line-height: 1; - } - - span.help_tip { - cursor: help; - color: $blue; - } - - th { - position: relative; - padding-right: 24px; - } - - th label { - position: relative; - display: block; - - img.help_tip, - .woocommerce-help-tip { - margin: -8px -24px 0 0; - position: absolute; - right: 0; - top: 50%; - } - } - - th label + .woocommerce-help-tip { - margin: 0 0 0 0; - position: absolute; - right: 0; - top: 20px; - } - - woocommerce-help-tip - - .select2-container { - vertical-align: top; - margin-bottom: 3px; - } - - table.widefat th { - padding-right: inherit; - } - - .wp-list-table .woocommerce-help-tip { - float: none; - } - - fieldset { - margin-top: 4px; - - img.help_tip, - .woocommerce-help-tip { - margin: -3px 0 0 5px; - } - - p.description { - margin-bottom: 8px; - } - - &:first-child { - margin-top: 0; - } - } - - .iris-picker { - z-index: 100; - display: none; - position: absolute; - border: 1px solid #ccc; - border-radius: 3px; - box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); - - .ui-slider { - border: 0 !important; - margin: 0 !important; - width: auto !important; - height: auto !important; - background: none transparent !important; - - .ui-slider-handle { - margin-bottom: 0 !important; - } - } - } - - .iris-error { - background-color: #ffafaf; - } - - .colorpickpreview { - padding: 7px 0; - line-height: 1em; - display: inline-block; - width: 26px; - border: 1px solid #ddd; - font-size: 14px; - } - - .image_width_settings { - vertical-align: middle; - - label { - margin-left: 10px; - } - - input { - width: auto; - } - } - - .wc_payment_gateways_wrapper, - .wc_emails_wrapper { - padding: 0 15px 10px 0; - } - } - - .wc-shipping-zone-settings { - - td.forminp { - input, textarea { - width: 448px; - padding: 6px 11px; - } - - .select2-search input { - padding: 6px; - } - } - } - } - - .woocommerce #tabs-wrap table a.remove { - margin-left: 4px; - } - - .woocommerce #tabs-wrap table p { - margin: 0 0 4px !important; - overflow: hidden; - zoom: 1; - } - - .woocommerce #tabs-wrap table p a.add { - float: left; - } - - #wp-excerpt-editor-container { - background: #fff; - } - - #product_variation-parent #parent_id { - width: 100%; - } - - #postimagediv img { - border: 1px solid #d5d5d5; - max-width: 100%; - } - - #woocommerce-product-images .inside { - margin: 0; - padding: 0; - - .add_product_images { - padding: 0 12px 12px; - } - - #product_images_container { - padding: 0 0 0 9px; - - ul { - @include clearfix(); - margin: 0; - padding: 0; - - li.image, - li.add, - li.wc-metabox-sortable-placeholder { - width: 80px; - float: left; - cursor: move; - border: 1px solid #d5d5d5; - margin: 9px 9px 0 0; - background: #f7f7f7; - @include border-radius(2px); - position: relative; - box-sizing: border-box; - - img { - width: 100%; - height: auto; - display: block; - } - } - - li.wc-metabox-sortable-placeholder { - border: 3px dashed #dddddd; - position: relative; - - &::after { - @include icon_dashicons( '\f161' ); - font-size: 2.618em; - line-height: 72px; - color: #ddd; - } - } - - ul.actions { - position: absolute; - top: -8px; - right: -8px; - padding: 2px; - display: none; - - li { - float: right; - margin: 0 0 0 2px; - - a { - width: 1em; - height: 1em; - margin: 0; - height: 0; - display: block; - overflow: hidden; - - &.tips { - cursor: pointer; - } - } - - a.delete { - @include ir(); - font-size: 1.4em; - - &::before { - @include icon_dashicons( '\f153' ); - color: #999; - background: #fff; - border-radius: 50%; - height: 1em; - width: 1em; - line-height: 1em; - } - - &:hover::before { - color: $red; - } - } - } - } - - li:hover ul.actions { - display: block; - } - } - } - } - - #woocommerce-product-data { - .hndle { - padding: 10px; - - span { - display: block; - vertical-align: middle; - line-height: 24px; - - span { - display: inline; - line-height: inherit; - vertical-align: baseline; - } - } - - select { - margin: 0; - } - - label { - padding-right: 1em; - font-size: 12px; - vertical-align: baseline; - } - - label:first-child { - margin-right: 1em; - border-right: 1px solid #dfdfdf; - } - - input, select { - margin-top: -3px 0 0; - vertical-align: middle; - } - - select { - margin-left: 0.5em; - } - } - - > .handlediv { - margin-top: 4px; - } - - .wrap { - margin: 0; - } - } - - #woocommerce-coupon-description { - padding: 3px 8px; - font-size: 1.7em; - line-height: 1.42em; - height: auto; - width: 100%; - outline: 0; - margin: 10px 0; - display: block; - - &::-webkit-input-placeholder { - line-height: 1.42em; - color: #bbb; - } - - &::-moz-placeholder { - line-height: - 1.42em; - color: #bbb; - } - - &:-ms-input-placeholder { - line-height: 1.42em; - color: #bbb; - } - - &:-moz-placeholder { - line-height: 1.42em; - color: #bbb; - } - } - - #woocommerce-product-data, - #woocommerce-coupon-data { - .panel-wrap { - background: #fff; - } - - .woocommerce_options_panel, - .wc-metaboxes-wrapper { - float: left; - width: 80%; - - .wc-radios { - display: block; - float: left; - margin: 0; - - li { - display: block; - padding: 0 0 10px; - - input { - width: auto; - } - } - } - } - } - - #woocommerce-product-data, - #woocommerce-coupon-data, - .woocommerce { - .panel-wrap { - overflow: hidden; - } - - ul.wc-tabs { - margin: 0; - width: 20%; - float: left; - line-height: 1em; - padding: 0 0 10px; - position: relative; - background-color: #fafafa; - border-right: 1px solid #eee; - box-sizing: border-box; - - &::after { - content: ''; - display: block; - width: 100%; - height: 9999em; - position: absolute; - bottom: -9999em; - left: 0; - background-color: #fafafa; - border-right: 1px solid #eee; - } - - li { - margin: 0; - padding: 0; - display: block; - position: relative; - - a { - margin: 0; - padding: 10px; - display: block; - box-shadow: none; - text-decoration: none; - line-height: 20px !important; - border-bottom: 1px solid #eee; - - span { - margin-left: 0.618em; - margin-right: 0.618em; - } - - &::before { - @include iconbeforedashicons( '\f107' ); - } - } - - &.general_options a::before { - content: '\f107'; - } - - &.inventory_options a::before { - content: '\f481'; - } - - &.shipping_options a::before { - font-family: 'WooCommerce'; - content: '\e01a'; - } - - &.linked_product_options a::before { - content: '\f103'; - } - - &.attribute_options a::before { - content: '\f175'; - } - - &.advanced_options a::before { - font-family: 'Dashicons'; - content: '\f111'; - } - - &.variations_options a::before { - content: '\f509'; - } - - &.usage_restriction_options a::before { - font-family: 'WooCommerce'; - content: '\e602'; - } - - &.usage_limit_options a::before { - font-family: 'WooCommerce'; - content: '\e601'; - } - - &.general_coupon_data a::before { - font-family: 'WooCommerce'; - content: '\e600'; - } - - &.active a { - color: #555; - position: relative; - background-color: #eee; - } - } - } - } - - /** + } + } + + .wc-payment-gateway-method-name { + font-weight: normal; + } + + .wc-email-settings-table-name { + font-weight: 700; + + span { + font-weight: normal; + color: #999; + margin: 0 0 0 4px !important; + } + } + + .wc-payment-gateway-method-toggle-enabled, + .wc-payment-gateway-method-toggle-disabled { + padding-top: 1px; + display: block; + outline: 0; + box-shadow: none; + } + + .wc-email-settings-table-status { + text-align: center; + width: 1em; + + .tips { + margin: 0 auto; + } + } +} + +.wc-shipping-zone-settings { + + th { + padding: 24px 24px 24px 0; + } + + td.forminp { + + input, + textarea { + padding: 8px; + max-width: 100% !important; + } + + .wc-shipping-zone-region-select { + width: 448px; + max-width: 100% !important; + + .select2-choices { + padding: 8px 8px 4px; + border-color: #ddd; + min-height: 0; + line-height: 1; + + input { + padding: 0; + } + + li { + margin: 0 4px 4px 0; + } + } + } + } + + .wc-shipping-zone-postcodes-toggle { + margin: 0.5em 0 0; + font-size: 0.9em; + text-decoration: underline; + display: block; + } + + .wc-shipping-zone-postcodes-toggle + .wc-shipping-zone-postcodes { + display: none; + } + + .wc-shipping-zone-postcodes { + + textarea { + margin: 10px 0; + } + + .description { + font-size: 0.9em; + color: #999; + } + } +} + +.wc-shipping-zone-settings + p.submit { + margin-top: 0; +} + +table { + + tr, + tr:hover { + + table.wc-shipping-zone-methods { + + tr .row-actions { + position: relative; + } + + tr:hover .row-actions { + position: static; + } + } + } +} + +.wc-shipping-zones-heading .page-title-action { + display: inline-block; +} + +table.wc-shipping-zones, + table.wc-shipping-zone-methods, + table.wc-shipping-classes { + + td, + th { + vertical-align: top; + line-height: 24px; + padding: 1em !important; + font-size: 14px; + background: #fff; + display: table-cell !important; + + li { + line-height: 24px; + font-size: 14px; + } + + .woocommerce-help-tip { + margin: 0 !important; + } + } + + thead { + + th { + vertical-align: middle; + } + + .wc-shipping-zone-sort { + text-align: center; + } + } + + td.wc-shipping-zones-blank-state, + td.wc-shipping-zone-method-blank-state { + background: #f7f1f6 !important; + overflow: hidden; + position: relative; + padding: 7.5em 7.5% !important; + border-bottom: 2px solid #eee2ec; + + &.wc-shipping-zone-method-blank-state { + padding: 2em !important; + + p { + margin-bottom: 0; + } + } + + p, + li { + color: #a46497; + font-size: 1.5em; + line-height: 1.5em; + margin: 0 0 1em; + position: relative; + z-index: 1; + text-shadow: 1px 1px 1px white; + + &.main { + font-size: 2em; + } + } + + li { + margin-left: 1em; + list-style: circle inside; + } + + &::before { + content: "\e01b"; + font-family: "WooCommerce"; + text-align: center; + line-height: 1; + color: #eee2ec; + display: block; + width: 1em; + font-size: 40em; + top: 50%; + right: -3.75%; + margin-top: -0.1875em; + position: absolute; + } + + .button-primary { + background-color: #804877; + border-color: #804877; + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 0 rgba(0, 0, 0, 0.15); + margin: 0; + opacity: 1; + text-shadow: 0 -1px 1px #8a4f7f, 1px 0 1px #8a4f7f, 0 1px 1px #8a4f7f, -1px 0 1px #8a4f7f; + font-size: 1.5em; + padding: 0.75em 1em; + height: auto; + position: relative; + z-index: 1; + } + } + + .wc-shipping-zone-method-rows { + + tr:nth-child(even) td { + background: #f9f9f9; + } + } + + tr.odd, + .wc-shipping-class-rows tr:nth-child(odd) { + + td { + background: #f9f9f9; + } + } + + tbody.wc-shipping-zone-rows { + + td { + border-top: 2px solid #f9f9f9; + } + + tr:first-child { + + td { + border-top: 0; + } + } + } + + tr.wc-shipping-zone-worldwide { + + td { + background: #f9f9f9; + border-top: 2px solid #e1e1e1; + } + } + + ul, + p { + margin: 0; + } + + td.wc-shipping-zone-sort, + td.wc-shipping-zone-method-sort { + cursor: move; + font-size: 15px; + text-align: center; + + &::before { + content: "\f333"; + font-family: "Dashicons"; + text-align: center; + line-height: 1; + color: #999; + display: block; + width: 17px; + float: left; + height: 100%; + line-height: 24px; + } + + &:hover::before { + color: #333; + } + } + + td.wc-shipping-zone-worldwide { + text-align: center; + + &::before { + content: "\f319"; + font-family: "dashicons"; + text-align: center; + line-height: 1; + color: #999; + display: block; + width: 17px; + float: left; + height: 100%; + line-height: 24px; + } + } + + .wc-shipping-zone-name, + .wc-shipping-zone-methods { + width: 25%; + } + + .wc-shipping-class-description, + .wc-shipping-class-name, + .wc-shipping-class-slug, + .wc-shipping-zone-name, + .wc-shipping-zone-region { + + input, + select, + textarea { + width: 100%; + } + + a.wc-shipping-zone-delete, + a.wc-shipping-class-delete { + color: #a00; + } + + a.wc-shipping-zone-delete:hover, + a.wc-shipping-class-delete:hover { + color: red; + } + } + + .wc-shipping-class-count { + text-align: center; + } + + td.wc-shipping-zone-methods { + color: #555; + + .method_disabled { + text-decoration: line-through; + } + + ul { + position: relative; + padding-right: 32px; + + li { + color: #555; + display: inline; + margin: 0; + } + + li::before { + content: ", "; + } + + li:first-child::before { + content: ""; + } + } + + .add_shipping_method { + display: block; + width: 24px; + padding: 24px 0 0; + height: 0; + overflow: hidden; + cursor: pointer; + + &::before { + + @include icon; + font-family: "Dashicons"; + content: "\f502"; + color: #999; + vertical-align: middle; + line-height: 24px; + font-size: 16px; + margin: 0; + } + + &.disabled { + cursor: not-allowed; + + &::before { + color: #ccc; + } + } + } + } + + .wc-shipping-zone-method-title { + width: 25%; + + .wc-shipping-zone-method-delete { + color: red; + } + } + + .wc-shipping-zone-method-enabled { + text-align: center; + + a { + display: inline-block; + } + + .woocommerce-input-toggle { + margin-top: 3px; + } + } + + .wc-shipping-zone-method-type { + display: block; + } + + tfoot { + + input, + select { + vertical-align: middle !important; + } + + .button-secondary { + float: right; + } + } + + .editing { + + .wc-shipping-zone-view, + .wc-shipping-zone-edit { + display: none; + } + } +} + +.woocommerce-input-toggle { + height: 16px; + width: 32px; + border: 2px solid #935687; + background-color: #935687; + display: inline-block; + text-indent: -9999px; + border-radius: 10em; + position: relative; + margin-top: -1px; + vertical-align: text-top; + + &::before { + content: ""; + display: block; + width: 16px; + height: 16px; + background: #fff; + position: absolute; + top: 0; + right: 0; + border-radius: 100%; + } + + &.woocommerce-input-toggle--disabled { + border-color: #999; + background-color: #999; + + &::before { + right: auto; + left: 0; + } + } + + &.woocommerce-input-toggle--loading { + opacity: 0.5; + } +} + +.wc-modal-shipping-method-settings { + background: #f8f8f8; + padding: 1em !important; + + form .form-table { + width: 100%; + background: #fff; + margin: 0 0 1.5em; + + tr { + + th { + width: 30%; + position: relative; + + .woocommerce-help-tip { + float: right; + margin: -8px -0.5em 0 0; + vertical-align: middle; + right: 0; + top: 50%; + position: absolute; + } + } + + td { + + input, + select, + textarea { + width: 50%; + min-width: 250px; + } + + input[type="checkbox"] { + width: auto; + min-width: 16px; + } + } + + td, + th { + vertical-align: middle; + margin: 0; + line-height: 24px; + padding: 1em; + border-bottom: 1px solid #f8f8f8; + } + } + + &:last-of-type { + margin-bottom: 0; + } + } +} + +.wc-backbone-modal .wc-shipping-zone-method-selector { + + p { + margin-top: 0; + } + + .wc-shipping-zone-method-description { + margin: 0.75em 1px 0; + line-height: 1.5em; + color: #999; + font-style: italic; + } + + select { + width: 100%; + cursor: pointer; + } +} + +img.help_tip { + margin: 0 0 0 9px; + vertical-align: middle; +} + +.postbox img.help_tip { + margin-top: 0; +} + +.postbox .woocommerce-help-tip { + margin: 0 0 0 9px; +} + +.status-enabled, +.status-manual, +.status-disabled { + font-size: 1.4em; + + @include ir(); +} + +.status-manual::before { + + @include icon( "\e008" ); + color: #999; +} + +.status-enabled::before { + + @include icon( "\e015" ); + color: $woocommerce; +} + +.status-disabled::before { + + @include icon( "\e013" ); + color: #ccc; +} + +.woocommerce { + + h2.woo-nav-tab-wrapper { + margin-bottom: 1em; + } + + nav.woo-nav-tab-wrapper { + margin: 1.5em 0 1em; + } + + .subsubsub { + margin: -8px 0 0; + } + + .wc-admin-breadcrumb { + margin-left: 0.5em; + + a { + color: #a46497; + } + } + + #template div { + margin: 0; + + p .button { + float: right; + margin-left: 10px; + margin-top: -4px; + } + + .editor textarea { + margin-bottom: 8px; + } + } + + textarea[disabled="disabled"] { + background: #dfdfdf !important; + } + + table.form-table { + margin: 0; + position: relative; + table-layout: fixed; + + .forminp-radio ul { + margin: 0; + + li { + line-height: 1.4em; + } + } + + input[type="text"], + input[type="number"], + input[type="email"] { + height: auto; + } + + textarea.input-text { + height: 100%; + min-width: 150px; + display: block; + } + + // Give regular settings inputs a standard width and padding. + textarea, + input[type="text"], + input[type="email"], + input[type="number"], + input[type="password"], + input[type="datetime"], + input[type="datetime-local"], + input[type="date"], + input[type="time"], + input[type="week"], + input[type="url"], + input[type="tel"], + input.regular-input { + width: 400px; + margin: 0; + padding: 6px; + box-sizing: border-box; + vertical-align: top; + } + + input[type="datetime-local"], + input[type="date"], + input[type="time"], + input[type="week"], + input[type="tel"] { + width: 200px; + } + + select { + width: 400px; + margin: 0; + box-sizing: border-box; + height: 32px; + line-height: 32px; + vertical-align: top; + } + + input[size] { + width: auto !important; + } + + // Ignore nested inputs. + table { + + select, + textarea, + input[type="text"], + input[type="email"], + input[type="number"], + input.regular-input { + width: auto; + } + } + + textarea.wide-input { + width: 100%; + } + + img.help_tip, + .woocommerce-help-tip { + padding: 0; + margin: -4px 0 0 5px; + vertical-align: middle; + cursor: help; + line-height: 1; + } + + span.help_tip { + cursor: help; + color: $blue; + } + + th { + position: relative; + padding-right: 24px; + } + + th label { + position: relative; + display: block; + + img.help_tip, + .woocommerce-help-tip { + margin: -8px -24px 0 0; + position: absolute; + right: 0; + top: 50%; + } + } + + th label + .woocommerce-help-tip { + margin: 0 0 0 0; + position: absolute; + right: 0; + top: 20px; + } + + woocommerce-help-tip + + .select2-container { + vertical-align: top; + margin-bottom: 3px; + } + + table.widefat th { + padding-right: inherit; + } + + .wp-list-table .woocommerce-help-tip { + float: none; + } + + fieldset { + margin-top: 4px; + + img.help_tip, + .woocommerce-help-tip { + margin: -3px 0 0 5px; + } + + p.description { + margin-bottom: 8px; + } + + &:first-child { + margin-top: 0; + } + } + + .iris-picker { + z-index: 100; + display: none; + position: absolute; + border: 1px solid #ccc; + border-radius: 3px; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); + + .ui-slider { + border: 0 !important; + margin: 0 !important; + width: auto !important; + height: auto !important; + background: none transparent !important; + + .ui-slider-handle { + margin-bottom: 0 !important; + } + } + } + + .iris-error { + background-color: #ffafaf; + } + + .colorpickpreview { + padding: 7px 0; + line-height: 1em; + display: inline-block; + width: 26px; + border: 1px solid #ddd; + font-size: 14px; + } + + .image_width_settings { + vertical-align: middle; + + label { + margin-left: 10px; + } + + input { + width: auto; + } + } + + .wc_payment_gateways_wrapper, + .wc_emails_wrapper { + padding: 0 15px 10px 0; + } + } + + .wc-shipping-zone-settings { + + td.forminp { + + input, + textarea { + width: 448px; + padding: 6px 11px; + } + + .select2-search input { + padding: 6px; + } + } + } +} + +.woocommerce #tabs-wrap table a.remove { + margin-left: 4px; +} + +.woocommerce #tabs-wrap table p { + margin: 0 0 4px !important; + overflow: hidden; + zoom: 1; +} + +.woocommerce #tabs-wrap table p a.add { + float: left; +} + +#wp-excerpt-editor-container { + background: #fff; +} + +#product_variation-parent #parent_id { + width: 100%; +} + +#postimagediv img { + border: 1px solid #d5d5d5; + max-width: 100%; +} + +#woocommerce-product-images .inside { + margin: 0; + padding: 0; + + .add_product_images { + padding: 0 12px 12px; + } + + #product_images_container { + padding: 0 0 0 9px; + + ul { + + @include clearfix(); + margin: 0; + padding: 0; + + li.image, + li.add, + li.wc-metabox-sortable-placeholder { + width: 80px; + float: left; + cursor: move; + border: 1px solid #d5d5d5; + margin: 9px 9px 0 0; + background: #f7f7f7; + + @include border-radius(2px); + position: relative; + box-sizing: border-box; + + img { + width: 100%; + height: auto; + display: block; + } + } + + li.wc-metabox-sortable-placeholder { + border: 3px dashed #ddd; + position: relative; + + &::after { + + @include icon_dashicons( "\f161" ); + font-size: 2.618em; + line-height: 72px; + color: #ddd; + } + } + + ul.actions { + position: absolute; + top: -8px; + right: -8px; + padding: 2px; + display: none; + + li { + float: right; + margin: 0 0 0 2px; + + a { + width: 1em; + height: 1em; + margin: 0; + height: 0; + display: block; + overflow: hidden; + + &.tips { + cursor: pointer; + } + } + + a.delete { + + @include ir(); + font-size: 1.4em; + + &::before { + + @include icon_dashicons( "\f153" ); + color: #999; + background: #fff; + border-radius: 50%; + height: 1em; + width: 1em; + line-height: 1em; + } + + &:hover::before { + color: $red; + } + } + } + } + + li:hover ul.actions { + display: block; + } + } + } +} + +#woocommerce-product-data { + + .hndle { + padding: 10px; + + span { + display: block; + vertical-align: middle; + line-height: 24px; + + span { + display: inline; + line-height: inherit; + vertical-align: baseline; + } + } + + select { + margin: 0; + } + + label { + padding-right: 1em; + font-size: 12px; + vertical-align: baseline; + } + + label:first-child { + margin-right: 1em; + border-right: 1px solid #dfdfdf; + } + + input, + select { + margin-top: -3px 0 0; + vertical-align: middle; + } + + select { + margin-left: 0.5em; + } + } + + > .handlediv { + margin-top: 4px; + } + + .wrap { + margin: 0; + } +} + +#woocommerce-coupon-description { + padding: 3px 8px; + font-size: 1.7em; + line-height: 1.42em; + height: auto; + width: 100%; + outline: 0; + margin: 10px 0; + display: block; + + &::-webkit-input-placeholder { + line-height: 1.42em; + color: #bbb; + } + + &::-moz-placeholder { + line-height: 1.42em; + color: #bbb; + } + + &:-ms-input-placeholder { + line-height: 1.42em; + color: #bbb; + } + + &:-moz-placeholder { + line-height: 1.42em; + color: #bbb; + } +} + +#woocommerce-product-data, +#woocommerce-coupon-data { + + .panel-wrap { + background: #fff; + } + + .woocommerce_options_panel, + .wc-metaboxes-wrapper { + float: left; + width: 80%; + + .wc-radios { + display: block; + float: left; + margin: 0; + + li { + display: block; + padding: 0 0 10px; + + input { + width: auto; + } + } + } + } +} + +#woocommerce-product-data, +#woocommerce-coupon-data, +.woocommerce { + + .panel-wrap { + overflow: hidden; + } + + ul.wc-tabs { + margin: 0; + width: 20%; + float: left; + line-height: 1em; + padding: 0 0 10px; + position: relative; + background-color: #fafafa; + border-right: 1px solid #eee; + box-sizing: border-box; + + &::after { + content: ""; + display: block; + width: 100%; + height: 9999em; + position: absolute; + bottom: -9999em; + left: 0; + background-color: #fafafa; + border-right: 1px solid #eee; + } + + li { + margin: 0; + padding: 0; + display: block; + position: relative; + + a { + margin: 0; + padding: 10px; + display: block; + box-shadow: none; + text-decoration: none; + line-height: 20px !important; + border-bottom: 1px solid #eee; + + span { + margin-left: 0.618em; + margin-right: 0.618em; + } + + &::before { + + @include iconbeforedashicons( "\f107" ); + } + } + + &.general_options a::before { + content: "\f107"; + } + + &.inventory_options a::before { + content: "\f481"; + } + + &.shipping_options a::before { + font-family: "WooCommerce"; + content: "\e01a"; + } + + &.linked_product_options a::before { + content: "\f103"; + } + + &.attribute_options a::before { + content: "\f175"; + } + + &.advanced_options a::before { + font-family: "Dashicons"; + content: "\f111"; + } + + &.variations_options a::before { + content: "\f509"; + } + + &.usage_restriction_options a::before { + font-family: "WooCommerce"; + content: "\e602"; + } + + &.usage_limit_options a::before { + font-family: "WooCommerce"; + content: "\e601"; + } + + &.general_coupon_data a::before { + font-family: "WooCommerce"; + content: "\e600"; + } + + &.active a { + color: #555; + position: relative; + background-color: #eee; + } + } + } +} + +/** * Shipping */ - .woocommerce_page_wc-settings { - input[type=url], input[type=email] { - direction: ltr; - } +.woocommerce_page_wc-settings { - .shippingrows { - th.check-column { - padding-top: 20px; - } + input[type=url], + input[type=email] { + direction: ltr; + } - tfoot th { - padding-left: 10px; - } + .shippingrows { - .add.button::before { - @include iconbefore( '\e007' ); - } - } + th.check-column { + padding-top: 20px; + } - h3.wc-settings-sub-title { - font-size: 1.2em; - } - } + tfoot th { + padding-left: 10px; + } - #woocommerce-product-data, - #woocommerce-product-type-options, - #woocommerce-order-data, - #woocommerce-order-downloads, - #woocommerce-coupon-data { - .inside { - margin: 0; - padding: 0; - } - } + .add.button::before { - .woocommerce_options_panel, - .panel { - padding: 9px; - color: #555; + @include iconbefore( "\e007" ); + } + } - .form-field .woocommerce-help-tip { - font-size: 1.4em; - } - } + h3.wc-settings-sub-title { + font-size: 1.2em; + } +} - .woocommerce_page_settings .woocommerce_options_panel, - .panel { - padding: 0; - } +#woocommerce-product-data, +#woocommerce-product-type-options, +#woocommerce-order-data, +#woocommerce-order-downloads, +#woocommerce-coupon-data { - #woocommerce-product-type-options .panel, - #woocommerce-product-specs .inside { - margin: 0; - padding: 9px; - } + .inside { + margin: 0; + padding: 0; + } +} - .woocommerce_options_panel p, - #woocommerce-product-type-options .panel p, - .woocommerce_options_panel fieldset.form-field { - margin: 0 0 9px; - font-size: 12px; - padding: 5px 9px; - line-height: 24px; +.woocommerce_options_panel, +.panel { + padding: 9px; + color: #555; - &::after { - content: '.'; - display: block; - height: 0; - clear: both; - visibility: hidden; - } - } + .form-field .woocommerce-help-tip { + font-size: 1.4em; + } +} - .woocommerce_options_panel .checkbox, - .woocommerce_variable_attributes .checkbox { - width: auto; - margin: 4px 0 !important; - vertical-align: middle; - float: left; - } +.woocommerce_page_settings .woocommerce_options_panel, +.panel { + padding: 0; +} - .woocommerce_variations, - .woocommerce_options_panel { - .downloadable_files table { - width: 100%; - padding: 0 !important; +#woocommerce-product-type-options .panel, +#woocommerce-product-specs .inside { + margin: 0; + padding: 9px; +} - th { - padding: 7px 0 7px 7px !important; +.woocommerce_options_panel p, +#woocommerce-product-type-options .panel p, +.woocommerce_options_panel fieldset.form-field { + margin: 0 0 9px; + font-size: 12px; + padding: 5px 9px; + line-height: 24px; - &.sort { - width: 17px; - padding: 7px !important; - } + &::after { + content: "."; + display: block; + height: 0; + clear: both; + visibility: hidden; + } +} - .woocommerce-help-tip { - font-size: 1.1em; - margin-left: 0; - } - } +.woocommerce_options_panel .checkbox, +.woocommerce_variable_attributes .checkbox { + width: auto; + margin: 4px 0 !important; + vertical-align: middle; + float: left; +} - td { - vertical-align: middle !important; - padding: 4px 0 4px 7px !important; - position: relative; +.woocommerce_variations, +.woocommerce_options_panel { - &:last-child { - padding-right: 7px !important; - } + .downloadable_files table { + width: 100%; + padding: 0 !important; - input.input_text { - width: 100%; - float: none; - min-width: 0; - margin: 1px 0; - } + th { + padding: 7px 0 7px 7px !important; - .upload_file_button { - width: auto; - float: right; - cursor: pointer; - } + &.sort { + width: 17px; + padding: 7px !important; + } - .delete { - @include ir(); - font-size: 1.2em; + .woocommerce-help-tip { + font-size: 1.1em; + margin-left: 0; + } + } - &::before { - @include icon_dashicons( '\f153' ); - color: #999; - } + td { + vertical-align: middle !important; + padding: 4px 0 4px 7px !important; + position: relative; - &:hover { - &::before { - color: $red; - } - } - } - } + &:last-child { + padding-right: 7px !important; + } - td.sort { - width: 17px; - cursor: move; - font-size: 15px; - text-align: center; - background: #f9f9f9; - padding-right: 7px !important; + input.input_text { + width: 100%; + float: none; + min-width: 0; + margin: 1px 0; + } - &::before { - content: '\f333'; - font-family: 'Dashicons'; - text-align: center; - line-height: 1; - color: #999; - display: block; - width: 17px; - float: left; - height: 100%; - } + .upload_file_button { + width: auto; + float: right; + cursor: pointer; + } - &:hover::before { - color: #333; - } - } - } - } - .woocommerce_variation { - h3 .sort { - width: 17px; - height: 26px; - cursor: move; - float: right; - font-size: 15px; - font-weight: 400; - margin-right: 0.5em; - visibility: hidden; - text-align: center; - vertical-align: middle; + .delete { - &::before { - content: '\f333'; - font-family: 'Dashicons'; - text-align: center; - line-height: 28px; - color: #999; - display: block; - width: 17px; - float: left; - height: 100%; - } + @include ir(); + font-size: 1.2em; - &:hover::before { - color: #777; - } - } - h3:hover, &.ui-sortable-helper { - .sort { - visibility: visible; - } - } - } + &::before { - .woocommerce_options_panel { - min-height: 175px; - box-sizing: border-box; + @include icon_dashicons( "\f153" ); + color: #999; + } - .downloadable_files { - padding: 0 9px 0 162px; - position: relative; - margin: 9px 0; + &:hover { - label { - position: absolute; - left: 0; - margin: 0 0 0 12px; - line-height: 24px; - } - } + &::before { + color: $red; + } + } + } + } - p { - margin: 9px 0; - } + td.sort { + width: 17px; + cursor: move; + font-size: 15px; + text-align: center; + background: #f9f9f9; + padding-right: 7px !important; - p.form-field, - fieldset.form-field { - padding: 5px 20px 5px 162px !important; /** Padding for aligning labels left - 12px + 150 label width **/ - } + &::before { + content: "\f333"; + font-family: "Dashicons"; + text-align: center; + line-height: 1; + color: #999; + display: block; + width: 17px; + float: left; + height: 100%; + } - .sale_price_dates_fields { - .short:first-of-type { - margin-bottom: 1em; - } + &:hover::before { + color: #333; + } + } + } +} - .short:nth-of-type( 2 ) { - clear: left; - } - } +.woocommerce_variation { - label, - legend { - float: left; - width: 150px; - padding: 0; - margin: 0 0 0 -150px; + h3 .sort { + width: 17px; + height: 26px; + cursor: move; + float: right; + font-size: 15px; + font-weight: 400; + margin-right: 0.5em; + visibility: hidden; + text-align: center; + vertical-align: middle; - .req { - font-weight: 700; - font-style: normal; - color: $red; - } - } + &::before { + content: "\f333"; + font-family: "Dashicons"; + text-align: center; + line-height: 28px; + color: #999; + display: block; + width: 17px; + float: left; + height: 100%; + } - .description { - padding: 0; - margin: 0 0 0 7px; - clear: none; - display: inline; - } + &:hover::before { + color: #777; + } + } - .description-block { - margin-left: 0; - display: block; - } + h3:hover, + &.ui-sortable-helper { - textarea, - input, - select { - margin: 0; - } + .sort { + visibility: visible; + } + } +} - textarea { - float: left; - height: 3.5em; - line-height: 1.5em; - vertical-align: top; - } +.woocommerce_options_panel { + min-height: 175px; + box-sizing: border-box; - input[type='text'], - input[type='email'], - input[type='number'], - input[type='password'] { - width: 50%; - float: left; - } + .downloadable_files { + padding: 0 9px 0 162px; + position: relative; + margin: 9px 0; - input.button { - width: auto; - margin-left: 8px; - } + label { + position: absolute; + left: 0; + margin: 0 0 0 12px; + line-height: 24px; + } + } - select { - float: left; - } + p { + margin: 9px 0; + } - input[type='text'].short, - input[type='email'].short, - input[type='number'].short, - input[type='password'].short, - .short { - width: 50%; - } + p.form-field, + fieldset.form-field { + padding: 5px 20px 5px 162px !important; /** Padding for aligning labels left - 12px + 150 label width **/ + } - .sized { - width: auto !important; - margin-right: 6px; - } + .sale_price_dates_fields { - .options_group { - border-top: 1px solid white; - border-bottom: 1px solid #eee; + .short:first-of-type { + margin-bottom: 1em; + } - &:first-child { - border-top: 0; - } + .short:nth-of-type(2) { + clear: left; + } + } - &:last-child { - border-bottom: 0; - } + label, + legend { + float: left; + width: 150px; + padding: 0; + margin: 0 0 0 -150px; - fieldset { - margin: 9px 0; - font-size: 12px; - padding: 5px 9px; - line-height: 24px; + .req { + font-weight: 700; + font-style: normal; + color: $red; + } + } - label { - width: auto; - float: none; - } + .description { + padding: 0; + margin: 0 0 0 7px; + clear: none; + display: inline; + } - ul { - float: left; - width: 50%; - margin: 0; - padding: 0; + .description-block { + margin-left: 0; + display: block; + } - li { - margin: 0; - width: auto; + textarea, + input, + select { + margin: 0; + } - input { - width: auto; - float: none; - margin-right: 4px; - } - } - } + textarea { + float: left; + height: 3.5em; + line-height: 1.5em; + vertical-align: top; + } - ul.wc-radios label { - margin-left: 0; - } - } - } + input[type="text"], + input[type="email"], + input[type="number"], + input[type="password"] { + width: 50%; + float: left; + } - .dimensions_field .wrap { - display: block; - width: 50%; + input.button { + width: auto; + margin-left: 8px; + } - input { - width: 30.75%; - margin-right: 3.8%; - } + select { + float: left; + } - .last { - margin-right: 0; - } - } + input[type="text"].short, + input[type="email"].short, + input[type="number"].short, + input[type="password"].short, + .short { + width: 50%; + } - &.padded { - padding: 1em; - } + .sized { + width: auto !important; + margin-right: 6px; + } - .select2-container { - float: left; - } - } + .options_group { + border-top: 1px solid white; + border-bottom: 1px solid #eee; - #woocommerce-product-data input.dp-applied { - float: left; - } + &:first-child { + border-top: 0; + } - #grouped_product_options, - #virtual_product_options, - #simple_product_options { - padding: 12px; - font-style: italic; - color: #666; - } + &:last-child { + border-bottom: 0; + } - /** + fieldset { + margin: 9px 0; + font-size: 12px; + padding: 5px 9px; + line-height: 24px; + + label { + width: auto; + float: none; + } + + ul { + float: left; + width: 50%; + margin: 0; + padding: 0; + + li { + margin: 0; + width: auto; + + input { + width: auto; + float: none; + margin-right: 4px; + } + } + } + + ul.wc-radios label { + margin-left: 0; + } + } + } + + .dimensions_field .wrap { + display: block; + width: 50%; + + input { + width: 30.75%; + margin-right: 3.8%; + } + + .last { + margin-right: 0; + } + } + + &.padded { + padding: 1em; + } + + .select2-container { + float: left; + } +} + +#woocommerce-product-data input.dp-applied { + float: left; +} + +#grouped_product_options, +#virtual_product_options, +#simple_product_options { + padding: 12px; + font-style: italic; + color: #666; +} + +/** * WooCommerce meta boxes */ - .wc-metaboxes-wrapper { - .toolbar { - margin: 0 !important; - border-top: 1px solid white; - border-bottom: 1px solid #eee; - padding: 9px 12px !important; - - &:first-child { - border-top: 0; - } - - &:last-child { - border-bottom: 0; - } - - .add_variation { - float: right; - margin-left: 5px; - } - - .save-variation-changes, - .cancel-variation-changes { - float: left; - margin-right: 5px; - } - } - - p.toolbar { - overflow: hidden; - zoom: 1; - } - - .expand-close { - margin-right: 2px; - color: #777; - font-size: 12px; - font-style: italic; - a { - background: none; - padding: 0; - font-size: 12px; - text-decoration: none; - } - } - - &#product_attributes .expand-close { - float: right; - line-height: 28px; - } - - button.add_variable_attribute, - .fr { - float: right; - margin: 0 0 0 6px; - } - - .wc-metaboxes { - border-bottom: 1px solid #eee; - } - - .wc-metabox-sortable-placeholder { - border-color: #bbb; - background-color: #f5f5f5; - margin-bottom: 9px; - border-width: 1px; - border-style: dashed; - } - - .wc-metabox { - background: #fff; - border-bottom: 1px solid #eee; - margin: 0 !important; - - select { - font-weight: 400; - } - - &:last-of-type { - border-bottom: 0; - } - - .handlediv { - width: 27px; - - &::before { - content: '\f142' !important; - cursor: pointer; - display: inline-block; - font: 400 20px/1 'Dashicons'; - line-height: 0.5 !important; - padding: 8px 10px; - position: relative; - right: 12px; - top: 0; - } - } - - &.closed { - @include border-radius(3px); - - .handlediv::before { - content: '\f140' !important; - } - - h3 { - border: 0; - } - } - - h3 { - margin: 0 !important; - padding: 0.75em 0.75em 0.75em 1em !important; - font-size: 1em !important; - overflow: hidden; - zoom: 1; - cursor: move; - - button, a.delete { - float: right; - } - - a.delete { - color: red; - font-weight: normal; - line-height: 26px; - text-decoration: none; - position: relative; - visibility: hidden; - } - - strong { - font-weight: normal; - line-height: 26px; - font-weight: 700; - } - - select { - font-family: sans-serif; - max-width: 20%; - margin: 0.25em 0.25em 0.25em 0; - } - - .handlediv { - background-position: 6px 5px !important; - visibility: hidden; - height: 26px; - } - - &.fixed { - cursor: pointer !important; - } - } - - &.woocommerce_variation h3 { - cursor: pointer; - padding: 0.5em 0.75em 0.5em 1em !important; - a.delete, .handlediv, .sort { - margin-top: 0.25em; - } - } - - h3:hover, &.ui-sortable-helper { - a.delete, .handlediv { - visibility: visible; - } - } - - table { - width: 100%; - position: relative; - background-color: #fdfdfd; - padding: 1em; - border-top: 1px solid #eee; - - td { - text-align: left; - padding: 0 6px 1em 0; - vertical-align: top; - border: 0; - - label { - text-align: left; - display: block; - line-height: 21px; - } - - input { - float: left; - min-width: 200px; - } - - input, - textarea { - width: 100%; - margin: 0; - display: block; - font-size: 14px; - padding: 4px; - color: #555; - } - - select, - .select2-container { - width: 100% !important; - } - - input.short { - width: 200px; - } - - input.checkbox { - width: 16px; - min-width: inherit; - vertical-align: text-bottom; - display: inline-block; - float: none; - } - } - - td.attribute_name { - width: 200px; - } - - .plus, - .minus { - margin-top: 6px; - } - - .fl { - float: left; - } - - .fr { - float: right; - } - } - } - } - - .variations-pagenav { - float: right; - line-height: 24px; - - .displaying-num { - color: #777; - font-size: 12px; - font-style: italic; - } - - a { - padding: 0 10px 3px; - background: rgba(0, 0, 0, 0.05); - font-size: 16px; - font-weight: 400; - text-decoration: none; - } - - a.disabled, - a.disabled:active, - a.disabled:focus, - a.disabled:hover { - color: #a0a5aa; - background: rgba(0, 0, 0, 0.05); - } - } - - .variations-defaults { - float: left; - select { - margin: 0.25em 0.25em 0.25em 0; - } - } - - .woocommerce_variable_attributes { - background-color: #fdfdfd; - border-top: 1px solid #eee; - - .data { - @include clearfix; - padding: 1em 2em; - } - - .upload_image_button { - display: block; - width: 64px; - height: 64px; - float: left; - margin-right: 20px; - position: relative; - cursor: pointer; - - img { - width: 100%; - height: auto; - display: none; - } - - &::before { - content: '\f128'; - font-family: 'Dashicons'; - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - text-align: center; - line-height: 64px; - font-size: 64px; - font-weight: 400; - -webkit-font-smoothing: antialiased; - } - - &.remove { - img { - display: block; - } - - &::before { - content: '\f335'; - display: none; - } - - &:hover::before { - display: block; - } - } - } - - .options { - border: 1px solid #eee; - border-width: 1px 0; - padding: 0.25em 0; - - label { - display: inline-block; - padding: 4px 1em 2px 0; - } - - input[type=checkbox] { - margin: 0 5px 0 .5em!important; - vertical-align: middle; - } - } - } - - .form-row { - label { - display: inline-block; - } - - .woocommerce-help-tip { - float: right; - } - - input[type="text"], - input[type="number"], - input[type="password"], - input[type="color"], - input[type="date"], - input[type="datetime"], - input[type="datetime-local"], - input[type="email"], - input[type="month"], - input[type="search"], - input[type="tel"], - input[type="time"], - input[type="url"], - input[type="week"], - select, - textarea { - width: 100%; - vertical-align: middle; - margin: 2px 0 0; - padding: 5px; - } - - select { - height: 30px; - line-height: 30px; - } - - &.dimensions_field { - .wrap { - clear:left; - display: block; - } - input { - width: 33%; - float: left; - vertical-align: middle; - - &:last-of-type { - margin-right: 0; - width: 34%; - } - } - } - - &.form-row-first, - &.form-row-last { - width: 48%; - float: right; - } - - &.form-row-first { - clear: both; - float: left; - } - - &.form-row-full { - clear: both; - } - } - - /** +.wc-metaboxes-wrapper { + + .toolbar { + margin: 0 !important; + border-top: 1px solid white; + border-bottom: 1px solid #eee; + padding: 9px 12px !important; + + &:first-child { + border-top: 0; + } + + &:last-child { + border-bottom: 0; + } + + .add_variation { + float: right; + margin-left: 5px; + } + + .save-variation-changes, + .cancel-variation-changes { + float: left; + margin-right: 5px; + } + } + + p.toolbar { + overflow: hidden; + zoom: 1; + } + + .expand-close { + margin-right: 2px; + color: #777; + font-size: 12px; + font-style: italic; + + a { + background: none; + padding: 0; + font-size: 12px; + text-decoration: none; + } + } + + &#product_attributes .expand-close { + float: right; + line-height: 28px; + } + + button.add_variable_attribute, + .fr { + float: right; + margin: 0 0 0 6px; + } + + .wc-metaboxes { + border-bottom: 1px solid #eee; + } + + .wc-metabox-sortable-placeholder { + border-color: #bbb; + background-color: #f5f5f5; + margin-bottom: 9px; + border-width: 1px; + border-style: dashed; + } + + .wc-metabox { + background: #fff; + border-bottom: 1px solid #eee; + margin: 0 !important; + + select { + font-weight: 400; + } + + &:last-of-type { + border-bottom: 0; + } + + .handlediv { + width: 27px; + + &::before { + content: "\f142" !important; + cursor: pointer; + display: inline-block; + font: 400 20px/1 "Dashicons"; + line-height: 0.5 !important; + padding: 8px 10px; + position: relative; + right: 12px; + top: 0; + } + } + + &.closed { + + @include border-radius(3px); + + .handlediv::before { + content: "\f140" !important; + } + + h3 { + border: 0; + } + } + + h3 { + margin: 0 !important; + padding: 0.75em 0.75em 0.75em 1em !important; + font-size: 1em !important; + overflow: hidden; + zoom: 1; + cursor: move; + + button, + a.delete { + float: right; + } + + a.delete { + color: red; + font-weight: normal; + line-height: 26px; + text-decoration: none; + position: relative; + visibility: hidden; + } + + strong { + font-weight: normal; + line-height: 26px; + font-weight: 700; + } + + select { + font-family: sans-serif; + max-width: 20%; + margin: 0.25em 0.25em 0.25em 0; + } + + .handlediv { + background-position: 6px 5px !important; + visibility: hidden; + height: 26px; + } + + &.fixed { + cursor: pointer !important; + } + } + + &.woocommerce_variation h3 { + cursor: pointer; + padding: 0.5em 0.75em 0.5em 1em !important; + + a.delete, + .handlediv, + .sort { + margin-top: 0.25em; + } + } + + h3:hover, + &.ui-sortable-helper { + + a.delete, + .handlediv { + visibility: visible; + } + } + + table { + width: 100%; + position: relative; + background-color: #fdfdfd; + padding: 1em; + border-top: 1px solid #eee; + + td { + text-align: left; + padding: 0 6px 1em 0; + vertical-align: top; + border: 0; + + label { + text-align: left; + display: block; + line-height: 21px; + } + + input { + float: left; + min-width: 200px; + } + + input, + textarea { + width: 100%; + margin: 0; + display: block; + font-size: 14px; + padding: 4px; + color: #555; + } + + select, + .select2-container { + width: 100% !important; + } + + input.short { + width: 200px; + } + + input.checkbox { + width: 16px; + min-width: inherit; + vertical-align: text-bottom; + display: inline-block; + float: none; + } + } + + td.attribute_name { + width: 200px; + } + + .plus, + .minus { + margin-top: 6px; + } + + .fl { + float: left; + } + + .fr { + float: right; + } + } + } +} + +.variations-pagenav { + float: right; + line-height: 24px; + + .displaying-num { + color: #777; + font-size: 12px; + font-style: italic; + } + + a { + padding: 0 10px 3px; + background: rgba(0, 0, 0, 0.05); + font-size: 16px; + font-weight: 400; + text-decoration: none; + } + + a.disabled, + a.disabled:active, + a.disabled:focus, + a.disabled:hover { + color: #a0a5aa; + background: rgba(0, 0, 0, 0.05); + } +} + +.variations-defaults { + float: left; + + select { + margin: 0.25em 0.25em 0.25em 0; + } +} + +.woocommerce_variable_attributes { + background-color: #fdfdfd; + border-top: 1px solid #eee; + + .data { + + @include clearfix; + padding: 1em 2em; + } + + .upload_image_button { + display: block; + width: 64px; + height: 64px; + float: left; + margin-right: 20px; + position: relative; + cursor: pointer; + + img { + width: 100%; + height: auto; + display: none; + } + + &::before { + content: "\f128"; + font-family: "Dashicons"; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + text-align: center; + line-height: 64px; + font-size: 64px; + font-weight: 400; + -webkit-font-smoothing: antialiased; + } + + &.remove { + + img { + display: block; + } + + &::before { + content: "\f335"; + display: none; + } + + &:hover::before { + display: block; + } + } + } + + .options { + border: 1px solid #eee; + border-width: 1px 0; + padding: 0.25em 0; + + label { + display: inline-block; + padding: 4px 1em 2px 0; + } + + input[type=checkbox] { + margin: 0 5px 0 0.5em !important; + vertical-align: middle; + } + } +} + +.form-row { + + label { + display: inline-block; + } + + .woocommerce-help-tip { + float: right; + } + + input[type="text"], + input[type="number"], + input[type="password"], + input[type="color"], + input[type="date"], + input[type="datetime"], + input[type="datetime-local"], + input[type="email"], + input[type="month"], + input[type="search"], + input[type="tel"], + input[type="time"], + input[type="url"], + input[type="week"], + select, + textarea { + width: 100%; + vertical-align: middle; + margin: 2px 0 0; + padding: 5px; + } + + select { + height: 30px; + line-height: 30px; + } + + &.dimensions_field { + + .wrap { + clear: left; + display: block; + } + + input { + width: 33%; + float: left; + vertical-align: middle; + + &:last-of-type { + margin-right: 0; + width: 34%; + } + } + } + + &.form-row-first, + &.form-row-last { + width: 48%; + float: right; + } + + &.form-row-first { + clear: both; + float: left; + } + + &.form-row-full { + clear: both; + } +} + +/** * Tooltips */ - .tips { - cursor: help; - text-decoration: none; - } +.tips { + cursor: help; + text-decoration: none; +} - img.tips { - padding: 5px 0 0; - } +img.tips { + padding: 5px 0 0; +} - #tiptip_holder { - display: none; - z-index: 8675309; - position: absolute; - top: 0; - /*rtl:ignore*/ - left: 0; +#tiptip_holder { + display: none; + z-index: 8675309; + position: absolute; + top: 0; + + /*rtl:ignore*/ + left: 0; - &.tip_top { - padding-bottom: 5px; + &.tip_top { + padding-bottom: 5px; - #tiptip_arrow_inner { - margin-top: -7px; - margin-left: -6px; - border-top-color: #333; - } - } + #tiptip_arrow_inner { + margin-top: -7px; + margin-left: -6px; + border-top-color: #333; + } + } - &.tip_bottom { - padding-top: 5px; + &.tip_bottom { + padding-top: 5px; - #tiptip_arrow_inner { - margin-top: -5px; - margin-left: -6px; - border-bottom-color: #333; - } - } + #tiptip_arrow_inner { + margin-top: -5px; + margin-left: -6px; + border-bottom-color: #333; + } + } - &.tip_right { - padding-left: 5px; + &.tip_right { + padding-left: 5px; - #tiptip_arrow_inner { - margin-top: -6px; - margin-left: -5px; - border-right-color: #333; - } - } + #tiptip_arrow_inner { + margin-top: -6px; + margin-left: -5px; + border-right-color: #333; + } + } - &.tip_left { - padding-right: 5px; + &.tip_left { + padding-right: 5px; - #tiptip_arrow_inner { - margin-top: -6px; - margin-left: -7px; - border-left-color: #333; - } - } - } + #tiptip_arrow_inner { + margin-top: -6px; + margin-left: -7px; + border-left-color: #333; + } + } +} - #tiptip_content, - .chart-tooltip, - .wc_error_tip { - color: #fff; - font-size: 0.8em; - max-width: 150px; - background: #333; - text-align: center; - border-radius: 3px; - padding: 0.618em 1em; - box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); +#tiptip_content, +.chart-tooltip, +.wc_error_tip { + color: #fff; + font-size: 0.8em; + max-width: 150px; + background: #333; + text-align: center; + border-radius: 3px; + padding: 0.618em 1em; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); - code { - padding: 1px; - background: #888; - } - } + code { + padding: 1px; + background: #888; + } +} - #tiptip_arrow, - #tiptip_arrow_inner { - position: absolute; - border-color: transparent; - border-style: solid; - border-width: 6px; - height: 0; - width: 0; - } +#tiptip_arrow, +#tiptip_arrow_inner { + position: absolute; + border-color: transparent; + border-style: solid; + border-width: 6px; + height: 0; + width: 0; +} - /*rtl:raw: +/*rtl:raw: #tiptip_arrow { right: 50%; margin-right: -6px; } */ - .wc_error_tip { - max-width: 20em; - line-height: 1.8em; - position: absolute; - white-space: normal; - background: #d82223; - margin: 1.5em 1px 0 -1em; - z-index: 9999999; +.wc_error_tip { + max-width: 20em; + line-height: 1.8em; + position: absolute; + white-space: normal; + background: #d82223; + margin: 1.5em 1px 0 -1em; + z-index: 9999999; - &::after { - content: ''; - display: block; - border: 8px solid #d82223; - border-right-color: transparent; - border-left-color: transparent; - border-top-color: transparent; - position: absolute; - top: -3px; - left: 50%; - margin: -1em 0 0 -3px; - } - } + &::after { + content: ""; + display: block; + border: 8px solid #d82223; + border-right-color: transparent; + border-left-color: transparent; + border-top-color: transparent; + position: absolute; + top: -3px; + left: 50%; + margin: -1em 0 0 -3px; + } +} - /** +/** * Date picker */ - img.ui-datepicker-trigger { - vertical-align: middle; - margin-top: -1px; - cursor: pointer; - } +img.ui-datepicker-trigger { + vertical-align: middle; + margin-top: -1px; + cursor: pointer; +} - .woocommerce_options_panel img.ui-datepicker-trigger, - .wc-metabox-content img.ui-datepicker-trigger { - float: left; - margin-right: 8px; - margin-top: 4px; - margin-left: 4px; - } +.woocommerce_options_panel img.ui-datepicker-trigger, +.wc-metabox-content img.ui-datepicker-trigger { + float: left; + margin-right: 8px; + margin-top: 4px; + margin-left: 4px; +} - #ui-datepicker-div { - display: none; - } +#ui-datepicker-div { + display: none; +} - /** +/** * Reports */ - .woocommerce-reports-remove-filter { - color: red; - text-decoration: none; - } - .woocommerce-reports-wrap, - .woocommerce-reports-wide { - &.woocommerce-reports-wrap { - margin-left: 300px; - padding-top: 18px; - } - - &.halved { - margin: 0; - overflow: hidden; - zoom: 1; - } - - .widefat th { - padding: 7px; - } - - .widefat td { - vertical-align: top; - padding: 7px; - .description { - margin: 4px 0 0; - } - } - - .postbox { - &::after { - content: '.'; - display: block; - height: 0; - clear: both; - visibility: hidden; - } - - h3 { - cursor: default !important; - } - - .inside { - padding: 10px; - margin: 0 !important; - } - - div.stats_range, - h3.stats_range { - border-bottom-color: #dfdfdf; - margin: 0; - padding: 0 !important; - - .export_csv { - float: right; - line-height: 26px; - border-left: 1px solid #dfdfdf; - padding: 10px; - display: block; - text-decoration: none; - - &::before { - @include iconbeforedashicons( '\f346' ); - margin-right: 4px; - } - } - - ul { - list-style: none outside; - margin: 0; - padding: 0; - zoom: 1; - background: #f5f5f5; - border-bottom: 1px solid #ccc; - - &::before, - &::after { - content: ' '; - display: table; - } - - &::after { - clear: both; - } - - li { - float: left; - margin: 0; - padding: 0; - line-height: 26px; - font-weight: bold; - font-size: 14px; - - a { - border-right: 1px solid #dfdfdf; - padding: 10px; - display: block; - text-decoration: none; - } - - &.active { - background: #fff; - box-shadow: 0 4px 0 0 #fff; - - a { - color: #777; - } - } - - &.custom { - padding: 9px 10px; - vertical-align: middle; - - form, - div { - display: inline; - margin: 0; - - input.range_datepicker { - padding: 0; - margin: 0 10px 0 0; - background: transparent; - border: 0; - color: #777; - text-align: center; - box-shadow: none; - - &.from { - margin-right: 0; - } - } - } - } - } - } - } - - .chart-with-sidebar { - padding: 12px 12px 12px 249px; - margin: 0 !important; - - .chart-sidebar { - width: 225px; - margin-left: -237px; - float: left; - } - } - - .chart-widgets { - margin: 0; - padding: 0; - - li.chart-widget { - margin: 0 0 1em; - background: #fafafa; - border: 1px solid #dfdfdf; - - &::after { - content: '.'; - display: block; - height: 0; - clear: both; - visibility: hidden; - } - - h4 { - background: #fff; - border: 1px solid #dfdfdf; - border-left-width: 0; - border-right-width: 0; - padding: 10px; - margin: 0; - color: $blue; - border-top-width: 0; - background-image: linear-gradient(to top, #ececec, #f9f9f9); - - &.section_title:hover { - color: $red; - } - } - - .section_title { - cursor: pointer; - - span { - display: block; - - &::after { - @include iconafter( '\e035' ); - float: right; - font-size: 0.9em; - line-height: 1.618; - } - } - - &.open { - color: #333; - - span::after { - display: none; - } - } - } - - .section { - border-bottom: 1px solid #dfdfdf; - - .select2-container { - width: 100% !important; - } - - &:last-of-type { - border-radius: 0 0 3px 3px; - } - } - - table { - width: 100%; - - td { - padding: 7px 10px; - vertical-align: top; - border-top: 1px solid #e5e5e5; - line-height: 1.4em; - } - - tr:first-child td { - border-top: 0; - } - - td.count { - background: #f5f5f5; - } - - td.name { - max-width: 175px; - - a { - word-wrap: break-word; - } - } - - td.sparkline { - vertical-align: middle; - } - - .wc_sparkline { - width: 32px; - height: 1em; - display: block; - float: right; - } - - tr.active td { - background: #f5f5f5; - } - } - - form, - p { - margin: 0; - padding: 10px; - - .submit { - margin-top: 10px; - } - } - - #product_ids { - width: 100%; - } - - .select_all, - .select_none { - float: right; - color: #999; - margin-left: 4px; - margin-top: 10px; - } - - .description { - margin-left: .5em; - font-weight: normal; - opacity: .8; - } - } - } - - .chart-legend { - list-style: none outside; - margin: 0 0 1em; - padding: 0; - border: 1px solid #dfdfdf; - border-right-width: 0; - border-bottom-width: 0; - background: #fff; - - li { - border-right: 5px solid #aaa; - color: #aaa; - padding: 1em; - display: block; - margin: 0; - transition: all ease 0.5s; - box-shadow: - inset 0 -1px 0 0 #dfdfdf; - - strong { - font-size: 1.618em; - line-height: 1.2em; - color: #464646; - font-weight: normal; - display: block; - font-family: 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', sans-serif; - - del { - color: #e74c3c; - font-weight: normal; - } - } - - &:hover { - box-shadow: - inset 0 -1px 0 0 #dfdfdf, - inset 300px 0 0 rgba(156, 93, 144, 0.1); - border-right: 5px solid #9c5d90 !important; - padding-left: 1.5em; - color: #9c5d90; - } - } - } - - .pie-chart-legend { - margin: 12px 0 0; - overflow: hidden; - - li { - float: left; - margin: 0; - padding: 6px 0 0; - border-top: 4px solid #999; - text-align: center; - box-sizing: border-box; - width: 50%; - } - } - - .stat { - font-size: 1.5em !important; - font-weight: 700; - text-align: center; - } - - .chart-placeholder { - width: 100%; - height: 650px; - overflow: hidden; - position: relative; - } - - .chart-prompt { - line-height: 650px; - margin: 0; - color: #999; - font-size: 1.2em; - font-style: italic; - text-align: center; - } - - .chart-container { - background: #fff; - padding: 12px; - position: relative; - border: 1px solid #dfdfdf; - border-radius: 3px; - } - - .main .chart-legend { - margin-top: 12px; - - li { - border-right: 0; - margin: 0 8px 0 0; - float: left; - border-top: 4px solid #aaa; - } - } - } - - .woocommerce-reports-main { - float: left; - min-width: 100%; - - table td { - padding: 9px; - } - } - - .woocommerce-reports-sidebar { - display: inline; - width: 281px; - margin-left: -300px; - clear: both; - float: left; - } - - .woocommerce-reports-left { - width: 49.5%; - float: left; - } - - .woocommerce-reports-right { - width: 49.5%; - float: right; - } - } - - .woocommerce-wide-reports-wrap { - padding-bottom: 11px; - - .widefat { - .export-data { - float: right; - } - - th, - td { - vertical-align: middle; - padding: 7px; - } - } - } - - form.report_filters { - p { - vertical-align: middle; - } - - label, - input, - div { - vertical-align: middle; - } - } - - .chart-tooltip { - position: absolute; - display: none; - line-height: 1; - } - - table.bar_chart { - width: 100%; - - thead th { - text-align: left; - color: #ccc; - padding: 6px 0; - } - - tbody { - th { - padding: 6px 0; - width: 25%; - text-align: left !important; - font-weight: normal !important; - border-bottom: 1px solid #fee; - } - - td { - text-align: right; - line-height: 24px; - padding: 6px 6px 6px 0; - border-bottom: 1px solid #fee; - - span { - color: #8a4b75; - display: block; - } - - span.alt { - color: #47a03e; - margin-top: 6px; - } - } - - td.bars { - position: relative; - text-align: left; - padding: 6px 6px 6px 0; - border-bottom: 1px solid #fee; - - span, - a { - text-decoration: none; - clear: both; - background: #8a4b75; - float: left; - display: block; - line-height: 24px; - height: 24px; - border-radius: 3px; - } - - span.alt { - clear: both; - background: #47a03e; - - span { - margin: 0; - color: #c5dec2 !important; - text-shadow: 0 1px 0 #47a03e; - background: transparent; - } - } - } - } - } - - .post-type-shop_order .woocommerce-BlankState-message::before { - @include icon( '\e01d' ); - } - - .post-type-shop_coupon .woocommerce-BlankState-message::before { - @include icon( '\e600' ); - } - - .post-type-product .woocommerce-BlankState-message::before { - @include icon( '\e006' ); - } - - .woocommerce-BlankState--api .woocommerce-BlankState-message::before { - @include icon( '\e01c' ); - } - - .woocommerce-BlankState--webhooks .woocommerce-BlankState-message::before { - @include icon( '\e01b' ); - } - - .woocommerce-BlankState { - text-align: center; - padding: 5em 0 0; - - .woocommerce-BlankState-message { - color: #aaa; - margin: 0 auto 1.5em; - line-height: 1.5em; - font-size: 1.2em; - max-width: 500px; - - &::before { - color: #ddd; - text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.2), 0 1px 0 rgba(255, 255, 255, 0.8); - font-size: 8em; - display: block; - position: relative !important; - top: auto; - left: auto; - line-height: 1em; - margin: 0 0 0.1875em; - } - } - - .woocommerce-BlankState-cta { - font-size: 1.2em; - padding: 0.75em 1.5em; - margin: 0 .25em; - height: auto; - display: inline-block !important - } - } - - /** +.woocommerce-reports-remove-filter { + color: red; + text-decoration: none; +} + +.woocommerce-reports-wrap, +.woocommerce-reports-wide { + + &.woocommerce-reports-wrap { + margin-left: 300px; + padding-top: 18px; + } + + &.halved { + margin: 0; + overflow: hidden; + zoom: 1; + } + + .widefat th { + padding: 7px; + } + + .widefat td { + vertical-align: top; + padding: 7px; + + .description { + margin: 4px 0 0; + } + } + + .postbox { + + &::after { + content: "."; + display: block; + height: 0; + clear: both; + visibility: hidden; + } + + h3 { + cursor: default !important; + } + + .inside { + padding: 10px; + margin: 0 !important; + } + + div.stats_range, + h3.stats_range { + border-bottom-color: #dfdfdf; + margin: 0; + padding: 0 !important; + + .export_csv { + float: right; + line-height: 26px; + border-left: 1px solid #dfdfdf; + padding: 10px; + display: block; + text-decoration: none; + + &::before { + + @include iconbeforedashicons( "\f346" ); + margin-right: 4px; + } + } + + ul { + list-style: none outside; + margin: 0; + padding: 0; + zoom: 1; + background: #f5f5f5; + border-bottom: 1px solid #ccc; + + &::before, + &::after { + content: " "; + display: table; + } + + &::after { + clear: both; + } + + li { + float: left; + margin: 0; + padding: 0; + line-height: 26px; + font-weight: bold; + font-size: 14px; + + a { + border-right: 1px solid #dfdfdf; + padding: 10px; + display: block; + text-decoration: none; + } + + &.active { + background: #fff; + box-shadow: 0 4px 0 0 #fff; + + a { + color: #777; + } + } + + &.custom { + padding: 9px 10px; + vertical-align: middle; + + form, + div { + display: inline; + margin: 0; + + input.range_datepicker { + padding: 0; + margin: 0 10px 0 0; + background: transparent; + border: 0; + color: #777; + text-align: center; + box-shadow: none; + + &.from { + margin-right: 0; + } + } + } + } + } + } + } + + .chart-with-sidebar { + padding: 12px 12px 12px 249px; + margin: 0 !important; + + .chart-sidebar { + width: 225px; + margin-left: -237px; + float: left; + } + } + + .chart-widgets { + margin: 0; + padding: 0; + + li.chart-widget { + margin: 0 0 1em; + background: #fafafa; + border: 1px solid #dfdfdf; + + &::after { + content: "."; + display: block; + height: 0; + clear: both; + visibility: hidden; + } + + h4 { + background: #fff; + border: 1px solid #dfdfdf; + border-left-width: 0; + border-right-width: 0; + padding: 10px; + margin: 0; + color: $blue; + border-top-width: 0; + background-image: linear-gradient(to top, #ececec, #f9f9f9); + + &.section_title:hover { + color: $red; + } + } + + .section_title { + cursor: pointer; + + span { + display: block; + + &::after { + + @include iconafter( "\e035" ); + float: right; + font-size: 0.9em; + line-height: 1.618; + } + } + + &.open { + color: #333; + + span::after { + display: none; + } + } + } + + .section { + border-bottom: 1px solid #dfdfdf; + + .select2-container { + width: 100% !important; + } + + &:last-of-type { + border-radius: 0 0 3px 3px; + } + } + + table { + width: 100%; + + td { + padding: 7px 10px; + vertical-align: top; + border-top: 1px solid #e5e5e5; + line-height: 1.4em; + } + + tr:first-child td { + border-top: 0; + } + + td.count { + background: #f5f5f5; + } + + td.name { + max-width: 175px; + + a { + word-wrap: break-word; + } + } + + td.sparkline { + vertical-align: middle; + } + + .wc_sparkline { + width: 32px; + height: 1em; + display: block; + float: right; + } + + tr.active td { + background: #f5f5f5; + } + } + + form, + p { + margin: 0; + padding: 10px; + + .submit { + margin-top: 10px; + } + } + + #product_ids { + width: 100%; + } + + .select_all, + .select_none { + float: right; + color: #999; + margin-left: 4px; + margin-top: 10px; + } + + .description { + margin-left: 0.5em; + font-weight: normal; + opacity: 0.8; + } + } + } + + .chart-legend { + list-style: none outside; + margin: 0 0 1em; + padding: 0; + border: 1px solid #dfdfdf; + border-right-width: 0; + border-bottom-width: 0; + background: #fff; + + li { + border-right: 5px solid #aaa; + color: #aaa; + padding: 1em; + display: block; + margin: 0; + transition: all ease 0.5s; + box-shadow: inset 0 -1px 0 0 #dfdfdf; + + strong { + font-size: 1.618em; + line-height: 1.2em; + color: #464646; + font-weight: normal; + display: block; + font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", sans-serif; + + del { + color: #e74c3c; + font-weight: normal; + } + } + + &:hover { + box-shadow: + inset 0 -1px 0 0 #dfdfdf, + inset 300px 0 0 rgba(156, 93, 144, 0.1); + border-right: 5px solid #9c5d90 !important; + padding-left: 1.5em; + color: #9c5d90; + } + } + } + + .pie-chart-legend { + margin: 12px 0 0; + overflow: hidden; + + li { + float: left; + margin: 0; + padding: 6px 0 0; + border-top: 4px solid #999; + text-align: center; + box-sizing: border-box; + width: 50%; + } + } + + .stat { + font-size: 1.5em !important; + font-weight: 700; + text-align: center; + } + + .chart-placeholder { + width: 100%; + height: 650px; + overflow: hidden; + position: relative; + } + + .chart-prompt { + line-height: 650px; + margin: 0; + color: #999; + font-size: 1.2em; + font-style: italic; + text-align: center; + } + + .chart-container { + background: #fff; + padding: 12px; + position: relative; + border: 1px solid #dfdfdf; + border-radius: 3px; + } + + .main .chart-legend { + margin-top: 12px; + + li { + border-right: 0; + margin: 0 8px 0 0; + float: left; + border-top: 4px solid #aaa; + } + } + } + + .woocommerce-reports-main { + float: left; + min-width: 100%; + + table td { + padding: 9px; + } + } + + .woocommerce-reports-sidebar { + display: inline; + width: 281px; + margin-left: -300px; + clear: both; + float: left; + } + + .woocommerce-reports-left { + width: 49.5%; + float: left; + } + + .woocommerce-reports-right { + width: 49.5%; + float: right; + } +} + +.woocommerce-wide-reports-wrap { + padding-bottom: 11px; + + .widefat { + + .export-data { + float: right; + } + + th, + td { + vertical-align: middle; + padding: 7px; + } + } +} + +form.report_filters { + + p { + vertical-align: middle; + } + + label, + input, + div { + vertical-align: middle; + } +} + +.chart-tooltip { + position: absolute; + display: none; + line-height: 1; +} + +table.bar_chart { + width: 100%; + + thead th { + text-align: left; + color: #ccc; + padding: 6px 0; + } + + tbody { + + th { + padding: 6px 0; + width: 25%; + text-align: left !important; + font-weight: normal !important; + border-bottom: 1px solid #fee; + } + + td { + text-align: right; + line-height: 24px; + padding: 6px 6px 6px 0; + border-bottom: 1px solid #fee; + + span { + color: #8a4b75; + display: block; + } + + span.alt { + color: #47a03e; + margin-top: 6px; + } + } + + td.bars { + position: relative; + text-align: left; + padding: 6px 6px 6px 0; + border-bottom: 1px solid #fee; + + span, + a { + text-decoration: none; + clear: both; + background: #8a4b75; + float: left; + display: block; + line-height: 24px; + height: 24px; + border-radius: 3px; + } + + span.alt { + clear: both; + background: #47a03e; + + span { + margin: 0; + color: #c5dec2 !important; + text-shadow: 0 1px 0 #47a03e; + background: transparent; + } + } + } + } +} + +.post-type-shop_order .woocommerce-BlankState-message::before { + + @include icon( "\e01d" ); +} + +.post-type-shop_coupon .woocommerce-BlankState-message::before { + + @include icon( "\e600" ); +} + +.post-type-product .woocommerce-BlankState-message::before { + + @include icon( "\e006" ); +} + +.woocommerce-BlankState--api .woocommerce-BlankState-message::before { + + @include icon( "\e01c" ); +} + +.woocommerce-BlankState--webhooks .woocommerce-BlankState-message::before { + + @include icon( "\e01b" ); +} + +.woocommerce-BlankState { + text-align: center; + padding: 5em 0 0; + + .woocommerce-BlankState-message { + color: #aaa; + margin: 0 auto 1.5em; + line-height: 1.5em; + font-size: 1.2em; + max-width: 500px; + + &::before { + color: #ddd; + text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.2), 0 1px 0 rgba(255, 255, 255, 0.8); + font-size: 8em; + display: block; + position: relative !important; + top: auto; + left: auto; + line-height: 1em; + margin: 0 0 0.1875em; + } + } + + .woocommerce-BlankState-cta { + font-size: 1.2em; + padding: 0.75em 1.5em; + margin: 0 0.25em; + height: auto; + display: inline-block !important; + } +} + +/** * Small screen optimisation */ - @media only screen and (max-width: 1280px) { - #order_data { - .order_data_column { - width: 48%; +@media only screen and (max-width: 1280px) { - &:first-child { - width: 100%; - } - } - } - .woocommerce_options_panel { - .description { - display: block; - clear: both; - margin-left: 0; - } + #order_data { - .short, - input[type='text'].short, - input[type='email'].short, - input[type='number'].short, - input[type='password'].short, - .dimensions_field .wrap { - width: 80%; - } - } + .order_data_column { + width: 48%; + + &:first-child { + width: 100%; + } + } + } + + .woocommerce_options_panel { + + .description { + display: block; + clear: both; + margin-left: 0; + } + + .short, + input[type="text"].short, + input[type="email"].short, + input[type="number"].short, + input[type="password"].short, + .dimensions_field .wrap { + width: 80%; + } + } - .woocommerce_variations, - .woocommerce_options_panel { - .downloadable_files { - padding: 0; - clear: both; + .woocommerce_variations, + .woocommerce_options_panel { - label { - position: static; - } + .downloadable_files { + padding: 0; + clear: both; - table { - margin: 0 12px 24px; - width: 94%; + label { + position: static; + } - .sort { - visibility: hidden; - } - } - } + table { + margin: 0 12px 24px; + width: 94%; - .woocommerce_variable_attributes .downloadable_files table { - margin: 0 0 1em; - width: 100%; - } - } - } + .sort { + visibility: hidden; + } + } + } - /** + .woocommerce_variable_attributes .downloadable_files table { + margin: 0 0 1em; + width: 100%; + } + } +} + +/** * Optimisation for screens 900px and smaller */ - @media only screen and (max-width: 900px) { +@media only screen and (max-width: 900px) { - #woocommerce-coupon-data ul.coupon_data_tabs, - #woocommerce-product-data ul.product_data_tabs, - #woocommerce-product-data .wc-tabs-back { - width: 10%; - } + #woocommerce-coupon-data ul.coupon_data_tabs, + #woocommerce-product-data ul.product_data_tabs, + #woocommerce-product-data .wc-tabs-back { + width: 10%; + } - #woocommerce-coupon-data .wc-metaboxes-wrapper, - #woocommerce-coupon-data .woocommerce_options_panel, - #woocommerce-product-data .wc-metaboxes-wrapper, - #woocommerce-product-data .woocommerce_options_panel { - width: 90%; - } + #woocommerce-coupon-data .wc-metaboxes-wrapper, + #woocommerce-coupon-data .woocommerce_options_panel, + #woocommerce-product-data .wc-metaboxes-wrapper, + #woocommerce-product-data .woocommerce_options_panel { + width: 90%; + } - #woocommerce-coupon-data ul.coupon_data_tabs li a, - #woocommerce-product-data ul.product_data_tabs li a { - position: relative; - text-indent: -999px; - padding: 10px; + #woocommerce-coupon-data ul.coupon_data_tabs li a, + #woocommerce-product-data ul.product_data_tabs li a { + position: relative; + text-indent: -999px; + padding: 10px; - &::before { - position: absolute; - top: 0; - right: 0; - bottom: 0; - left: 0; - text-indent: 0; - text-align: center; - line-height: 40px; - width: 100%; - height: 40px; - } - } - } + &::before { + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + text-indent: 0; + text-align: center; + line-height: 40px; + width: 100%; + height: 40px; + } + } +} - /** +/** * Optimisation for screens 782px and smaller */ - @media only screen and (max-width: 782px) { - #wp-excerpt-media-buttons a { - font-size: 16px; - line-height: 37px; - height: 39px; - padding: 0 20px 0 15px; - } +@media only screen and (max-width: 782px) { - #wp-excerpt-editor-tools { - padding-top: 20px; - padding-right: 15px; - overflow: hidden; - margin-bottom: -1px; - } + #wp-excerpt-media-buttons a { + font-size: 16px; + line-height: 37px; + height: 39px; + padding: 0 20px 0 15px; + } - #woocommerce-product-data .checkbox { - width: 25px; - } + #wp-excerpt-editor-tools { + padding-top: 20px; + padding-right: 15px; + overflow: hidden; + margin-bottom: -1px; + } - .variations-pagenav { - float: none; - text-align: center; - font-size: 18px; + #woocommerce-product-data .checkbox { + width: 25px; + } - .displaying-num { - font-size: 16px; - } + .variations-pagenav { + float: none; + text-align: center; + font-size: 18px; - a { - padding: 8px 20px 11px; - font-size: 18px; - } + .displaying-num { + font-size: 16px; + } - select { - padding: 0 20px; - } - } + a { + padding: 8px 20px 11px; + font-size: 18px; + } - .variations-defaults { - float: none; - text-align: center; - margin-top: 10px; - } + select { + padding: 0 20px; + } + } - .post-type-product { - .wp-list-table { - .column-thumb { - display: none; - text-align: left; - padding-bottom: 0; + .variations-defaults { + float: none; + text-align: center; + margin-top: 10px; + } - &::before { - display: none !important; - } + .post-type-product { - img { - max-width: 32px; - } - } + .wp-list-table { - .is-expanded td:not( .hidden ) { - overflow: visible; - } + .column-thumb { + display: none; + text-align: left; + padding-bottom: 0; - .toggle-row { - top: -28px; - } - } - } + &::before { + display: none !important; + } - .post-type-shop_order { - .wp-list-table { - .column-customer_message, - .column-order_notes { - text-align: inherit; - } + img { + max-width: 32px; + } + } - .column-order_notes .note-on { - font-size: 1.3em; - margin: 0; - } + .is-expanded td:not(.hidden) { + overflow: visible; + } - .is-expanded td:not(.hidden ) { - overflow: visible; - } + .toggle-row { + top: -28px; + } + } + } - .toggle-row { - top: -15px; - } - } - } - } + .post-type-shop_order { - @media only screen and (max-width: 500px) { - .woocommerce_options_panel label, - .woocommerce_options_panel legend { - float: none; - width: auto; - display: block; - margin: 0; - } + .wp-list-table { - .woocommerce_options_panel fieldset.form-field, - .woocommerce_options_panel p.form-field { - padding: 5px 20px !important; - } + .column-customer_message, + .column-order_notes { + text-align: inherit; + } - .addons-wcs-banner-block { - flex-direction: column; - } + .column-order_notes .note-on { + font-size: 1.3em; + margin: 0; + } - .wc_addons_wrap { - .addons-wcs-banner-block { - padding: 40px; - } + .is-expanded td:not(.hidden) { + overflow: visible; + } - .addons-wcs-banner-block-image { - padding: 1em; - text-align: center; - width: 100%; - padding: 2em 0; - margin: 0; + .toggle-row { + top: -15px; + } + } + } +} - .addons-img { - margin: 0; - } - } - } - } +@media only screen and (max-width: 500px) { - /** + .woocommerce_options_panel label, + .woocommerce_options_panel legend { + float: none; + width: auto; + display: block; + margin: 0; + } + + .woocommerce_options_panel fieldset.form-field, + .woocommerce_options_panel p.form-field { + padding: 5px 20px !important; + } + + .addons-wcs-banner-block { + flex-direction: column; + } + + .wc_addons_wrap { + + .addons-wcs-banner-block { + padding: 40px; + } + + .addons-wcs-banner-block-image { + padding: 1em; + text-align: center; + width: 100%; + padding: 2em 0; + margin: 0; + + .addons-img { + margin: 0; + } + } + } +} + +/** * Backbone modal dialog */ - .wc-backbone-modal { - * { - box-sizing: border-box; - } +.wc-backbone-modal { - .wc-backbone-modal-content { - position: fixed; - background: #fff; - z-index: 100000; - left: 50%; - top: 50%; - transform: translate(-50%, -50%); - max-width: 100%; - min-width: 500px; - article { - overflow: auto; - } - } + * { + box-sizing: border-box; + } - &.wc-backbone-modal-shipping-method-settings .wc-backbone-modal-content { - width: 75%; - min-width: 500px; - } + .wc-backbone-modal-content { + position: fixed; + background: #fff; + z-index: 100000; + left: 50%; + top: 50%; + transform: translate(-50%, -50%); + max-width: 100%; + min-width: 500px; - .select2-container { - width: 100% !important; - } - } + article { + overflow: auto; + } + } - @media screen and (max-width: 782px) { - .wc-backbone-modal .wc-backbone-modal-content { - width: 100%; - height: 100%; - min-width: 100%; - } - } + &.wc-backbone-modal-shipping-method-settings .wc-backbone-modal-content { + width: 75%; + min-width: 500px; + } - .wc-backbone-modal-backdrop { - position: fixed; - top: 0; - left: 0; - right: 0; - bottom: 0; - min-height: 360px; - background: #000; - opacity: 0.7; - z-index: 99900; - } + .select2-container { + width: 100% !important; + } +} - .wc-backbone-modal-main { - padding-bottom: 55px; +@media screen and (max-width: 782px) { - header, - article { - display: block; - position: relative; - } + .wc-backbone-modal .wc-backbone-modal-content { + width: 100%; + height: 100%; + min-width: 100%; + } +} - .wc-backbone-modal-header { - height: auto; - background: #fcfcfc; - padding: 1em 1.5em; - border-bottom: 1px solid #ddd; +.wc-backbone-modal-backdrop { + position: fixed; + top: 0; + left: 0; + right: 0; + bottom: 0; + min-height: 360px; + background: #000; + opacity: 0.7; + z-index: 99900; +} - h1 { - margin: 0; - font-size: 18px; - font-weight: 700; - line-height: 1.5em; - } +.wc-backbone-modal-main { + padding-bottom: 55px; - .modal-close-link { - cursor: pointer; - color: #777; - height: 54px; - width: 54px; - padding: 0; - position: absolute; - top: 0; - right: 0; - text-align: center; - border: 0; - border-left: 1px solid #ddd; - background-color: transparent; - transition: color 0.1s ease-in-out, background 0.1s ease-in-out; + header, + article { + display: block; + position: relative; + } - &::before { - font: normal 22px/50px 'dashicons' !important; - color: #666; - display: block; - content: '\f335'; - font-weight: 300; - } + .wc-backbone-modal-header { + height: auto; + background: #fcfcfc; + padding: 1em 1.5em; + border-bottom: 1px solid #ddd; - &:hover, - &:focus { - background: #ddd; - border-color: #ccc; - color: #000; - } + h1 { + margin: 0; + font-size: 18px; + font-weight: 700; + line-height: 1.5em; + } - &:focus { - outline: none; - } - } - } + .modal-close-link { + cursor: pointer; + color: #777; + height: 54px; + width: 54px; + padding: 0; + position: absolute; + top: 0; + right: 0; + text-align: center; + border: 0; + border-left: 1px solid #ddd; + background-color: transparent; + transition: color 0.1s ease-in-out, background 0.1s ease-in-out; - article { - padding: 1.5em; + &::before { + font: normal 22px/50px "dashicons" !important; + color: #666; + display: block; + content: "\f335"; + font-weight: 300; + } - p { + &:hover, + &:focus { + background: #ddd; + border-color: #ccc; + color: #000; + } + + &:focus { + outline: none; + } + } + } + + article { + padding: 1.5em; + + p { margin: 1.5em 0; - } - p:first-child { - margin-top: 0; - } + } - p:last-child { + p:first-child { + margin-top: 0; + } + + p:last-child { margin-bottom: 0; - } - .pagination { + } + + .pagination { padding: 10px 0 0; text-align: center; - } - table.widefat { + } + + table.widefat { margin: 0; width: 100%; border: 0; @@ -5932,13 +6338,15 @@ &:first-child { padding-left: 0; } + &:last-child { padding-right: 0; text-align: right; } } - tbody td, tbody th { + tbody td, + tbody th { padding: 1em; text-align: left; vertical-align: middle; @@ -5946,6 +6354,7 @@ &:first-child { padding-left: 0; } + &:last-child { padding-right: 0; text-align: right; @@ -5959,481 +6368,524 @@ } } - footer { - position: absolute; - left: 0; - right: 0; - bottom: 0; - z-index: 100; - padding: 1em 1.5em; - background: #fcfcfc; - border-top: 1px solid #dfdfdf; - box-shadow: 0 -4px 4px -4px rgba(0, 0, 0, 0.1); + footer { + position: absolute; + left: 0; + right: 0; + bottom: 0; + z-index: 100; + padding: 1em 1.5em; + background: #fcfcfc; + border-top: 1px solid #dfdfdf; + box-shadow: 0 -4px 4px -4px rgba(0, 0, 0, 0.1); - .inner { - text-align: right; - line-height: 23px; + .inner { + text-align: right; + line-height: 23px; - .button { - margin-bottom: 0; - } - } - } - } + .button { + margin-bottom: 0; + } + } + } +} - /** +/** * Select2 elements. */ - .select2-drop, - .select2-dropdown { - z-index: 999999 !important; - } - .select2-results { - line-height: 1.5em; - .select2-results__option, .select2-results__group { - margin: 0; - padding: 8px; - } - .description { - display: block; - color: #999; - padding-top: 4px; - } - } - .select2-dropdown { - border-color: #ddd; - } - .select2-dropdown--below { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); - } - .select2-dropdown--above { - box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.1); - } - .select2-container { - .select2-selection__rendered.ui-sortable li { - cursor: move; - } - .select2-selection { - border-color: #ddd; - } - .select2-search__field { - min-width: 150px; - } - .select2-selection--single { - height: 32px; - .select2-selection__rendered { - line-height: 32px; - padding-right: 24px; - } - .select2-selection__arrow { - right: 3px; - height: 30px; - } - } - .select2-selection--multiple { - min-height: 28px; - border-radius: 0; - line-height: 1.5; - li { - margin: 0; - } - .select2-selection__choice { - padding: 2px 6px; - .description { - display: none; - } - } - } - .select2-selection__clear { - color: #999; - margin-top: -1px; - } - .select2-search--inline .select2-search__field { - font-family: inherit; - font-size: inherit; - font-weight: inherit; - padding: 3px 0; - } - } - .woocommerce table.form-table .select2-container { - min-width: 400px !important; - } - .post-type-product .tablenav, - .post-type-shop_order .tablenav { - .actions { - overflow: visible; - } - select, - input { - line-height: 1; - height: 32px; - } - .select2-container { - float: left; - width: 240px !important; - font-size: 14px; - vertical-align: middle; - margin: 1px 6px 4px 1px; - } - } +.select2-drop, +.select2-dropdown { + z-index: 999999 !important; +} - .woocommerce-progress-form-wrapper, - .woocommerce-exporter-wrapper, - .woocommerce-importer-wrapper { - text-align: center; - max-width: 700px; - margin: 40px auto; +.select2-results { + line-height: 1.5em; - .error { - text-align: left; - } + .select2-results__option, + .select2-results__group { + margin: 0; + padding: 8px; + } - .wc-progress-steps { - padding: 0 0 24px; - margin: 0; - list-style: none outside; - overflow: hidden; - color: #ccc; - width:100%; - display: -webkit-inline-flex; - display: -ms-inline-flexbox; - display: inline-flex; - li { - width: 25%; - float: left; - padding: 0 0 0.8em; - margin: 0; - text-align: center; - position: relative; - border-bottom: 4px solid #ccc; - line-height: 1.4em; - } - li::before { - content: ''; - border: 4px solid #ccc; - border-radius: 100%; - width: 4px; - height: 4px; - position: absolute; - bottom: 0; - left: 50%; - margin-left: -6px; - margin-bottom: -8px; - background: #fff; - } - li.active { - border-color: #a16696; - color: #a16696; - &::before { - border-color: #a16696; - } - } - li.done { - border-color: #a16696; - color: #a16696; - &::before { - border-color: #a16696; - background: #a16696; - } - } - } + .description { + display: block; + color: #999; + padding-top: 4px; + } +} - .button { - font-size: 1.25em; - padding: 0.5em 1em !important; - line-height: 1.5em !important; - margin-right: 0.5em; - margin-bottom: 2px; - height: auto !important; - border-radius: 4px; - background-color: #bb77ae; - border-color: #a36597; - -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; - text-shadow: 0 -1px 1px #a36597, 1px 0 1px #a36597, 0 1px 1px #a36597, -1px 0 1px #a36597; - margin: 0; - opacity: 1; +.select2-dropdown { + border-color: #ddd; +} - &:hover, &:focus, &:active { - background: #a36597; - border-color: #a36597; - -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; - } - } +.select2-dropdown--below { + box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); +} - .error .button { - font-size: 1em; - } +.select2-dropdown--above { + box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.1); +} - .wc-actions { - overflow: hidden; - border-top: 1px solid #eee; - margin: 0; - padding: 23px 24px 24px; - line-height: 3em; +.select2-container { - .button { - float: right; - } + .select2-selection__rendered.ui-sortable li { + cursor: move; + } - .woocommerce-importer-toggle-advanced-options { - color: #999; - } - } + .select2-selection { + border-color: #ddd; + } - .woocommerce-exporter, - .woocommerce-importer, - .wc-progress-form-content { - background: #fff; - overflow: hidden; - padding: 0; - margin: 0 0 16px; - box-shadow: 0 1px 3px rgba(0,0,0,.13); - color: #555; - text-align: left; + .select2-search__field { + min-width: 150px; + } - header { - border-bottom: 1px solid #eee; - margin: 0; - padding: 24px 24px 0; - } + .select2-selection--single { + height: 32px; - section { - padding: 24px 24px 0; - } + .select2-selection__rendered { + line-height: 32px; + padding-right: 24px; + } - h2 { - margin: 0 0 24px; - color: #555; - font-size: 24px; - font-weight: normal; - line-height: 1em; - } + .select2-selection__arrow { + right: 3px; + height: 30px; + } + } - p { - font-size: 1em; - line-height: 1.75em; - font-size: 16px; - color: #555; - margin: 0 0 24px; - } + .select2-selection--multiple { + min-height: 28px; + border-radius: 0; + line-height: 1.5; - .form-row { - margin-top: 24px; - } + li { + margin: 0; + } - .spinner { - display: none; - } + .select2-selection__choice { + padding: 2px 6px; - .woocommerce-importer-options th, - .woocommerce-importer-options td, - .woocommerce-exporter-options th, - .woocommerce-exporter-options td { - vertical-align: top; - line-height: 1.75em; - padding: 0 0 24px 0; + .description { + display: none; + } + } + } - label { - color: #555; - font-weight: normal; - } + .select2-selection__clear { + color: #999; + margin-top: -1px; + } - input[type="checkbox"] { - margin: 0 4px 0 0; - padding: 7px; - } + .select2-search--inline .select2-search__field { + font-family: inherit; + font-size: inherit; + font-weight: inherit; + padding: 3px 0; + } +} - input[type="text"], - input[type="number"] { - padding: 7px; - height: auto; - margin: 0; - } +.woocommerce table.form-table .select2-container { + min-width: 400px !important; +} - .woocommerce-importer-file-url-field-wrapper { - border: 1px solid #ddd; - -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.07); - box-shadow: inset 0 1px 2px rgba(0,0,0,.07); - background-color: #fff; - color: #32373c; - outline: 0; - line-height: 1; - display: block; +.post-type-product .tablenav, +.post-type-shop_order .tablenav { - code { - background: none; - font-size: smaller; - padding: 0; - margin: 0; - color: #999; - padding: 7px 0 0 7px; - display: inline-block; - } - input { - font-family: Consolas,Monaco,monospace; - border: 0; - margin: 0; - outline: 0; - box-shadow: none; - display: inline-block; - min-width: 100%; - } - } - } + .actions { + overflow: visible; + } - .woocommerce-exporter-options th, - .woocommerce-importer-options th { - width: 35%; - padding-right: 20px; - } + select, + input { + line-height: 1; + height: 32px; + } - progress { - width: 100%; - height: 42px; - margin: 0 auto 24px; - display: block; - -webkit-appearance: none; - border: none; - display: none; - background: #f5f5f5; - border: 2px solid #eee; - border-radius: 4px; - padding: 0; - box-shadow: 0 1px 0px 0 rgba(255, 255, 255, 0.2); - } + .select2-container { + float: left; + width: 240px !important; + font-size: 14px; + vertical-align: middle; + margin: 1px 6px 4px 1px; + } +} - progress::-webkit-progress-bar { - background: transparent none; - border: 0; - border-radius: 4px; - padding: 0; - box-shadow: none; - } +.woocommerce-progress-form-wrapper, +.woocommerce-exporter-wrapper, +.woocommerce-importer-wrapper { + text-align: center; + max-width: 700px; + margin: 40px auto; - progress::-webkit-progress-value { - border-radius: 3px; - box-shadow: inset 0 1px 1px 0 rgba(255, 255, 255, 0.4); - background: #A46497; - background: linear-gradient( top, #A46497, #66405F ), #A46497; - transition: width 1s ease; - } + .error { + text-align: left; + } - progress::-moz-progress-bar { - border-radius: 3px; - box-shadow: inset 0 1px 1px 0 rgba(255, 255, 255, 0.4); - background: #A46497; - background: linear-gradient( top, #A46497, #66405F ), #A46497; - transition: width 1s ease; - } + .wc-progress-steps { + padding: 0 0 24px; + margin: 0; + list-style: none outside; + overflow: hidden; + color: #ccc; + width: 100%; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; - progress::-ms-fill { - border-radius: 3px; - box-shadow: inset 0 1px 1px 0 rgba(255, 255, 255, 0.4); - background: #A46497; - background: linear-gradient( to bottom, #A46497, #66405F ), #A46497; - transition: width 1s ease; - } + li { + width: 25%; + float: left; + padding: 0 0 0.8em; + margin: 0; + text-align: center; + position: relative; + border-bottom: 4px solid #ccc; + line-height: 1.4em; + } - &.woocommerce-exporter__exporting, - &.woocommerce-importer__importing { - .spinner { - display: block; - } - progress { - display: block; - } - .wc-actions, - .woocommerce-exporter-options { - display: none; - } - } + li::before { + content: ""; + border: 4px solid #ccc; + border-radius: 100%; + width: 4px; + height: 4px; + position: absolute; + bottom: 0; + left: 50%; + margin-left: -6px; + margin-bottom: -8px; + background: #fff; + } - .wc-importer-mapping-table-wrapper, - .wc-importer-error-log { - padding: 0; - } + li.active { + border-color: #a16696; + color: #a16696; - .wc-importer-mapping-table, - .wc-importer-error-log-table { - margin: 0; - border: 0; - box-shadow: none; - width: 100%; - table-layout: fixed; + &::before { + border-color: #a16696; + } + } - td, th { - border: 0; - padding: 12px; - vertical-align: middle; - word-wrap: break-word; + li.done { + border-color: #a16696; + color: #a16696; - select { - width: 100%; - } - } + &::before { + border-color: #a16696; + background: #a16696; + } + } + } - tbody tr:nth-child(odd) td, - tbody tr:nth-child(odd) th { - background: #fbfbfb; - } + .button { + font-size: 1.25em; + padding: 0.5em 1em !important; + line-height: 1.5em !important; + margin-right: 0.5em; + margin-bottom: 2px; + height: auto !important; + border-radius: 4px; + background-color: #bb77ae; + border-color: #a36597; + -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; + text-shadow: 0 -1px 1px #a36597, 1px 0 1px #a36597, 0 1px 1px #a36597, -1px 0 1px #a36597; + margin: 0; + opacity: 1; - th { - font-weight: bold; - } + &:hover, + &:focus, + &:active { + background: #a36597; + border-color: #a36597; + -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; + box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; + } + } - td:first-child, - th:first-child { - padding-left: 24px; - } + .error .button { + font-size: 1em; + } - td:last-child, - th:last-child { - padding-right: 24px; - } + .wc-actions { + overflow: hidden; + border-top: 1px solid #eee; + margin: 0; + padding: 23px 24px 24px; + line-height: 3em; - .wc-importer-mapping-table-name { - width: 50%; - .description { - color: #999; - margin-top: 4px; - display: block; - code { - background: none; - padding: 0; - white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */ - word-wrap: break-word; /* IE */ - word-break: break-all; - } - } - } - } + .button { + float: right; + } - .woocommerce-importer-done { - text-align: center; - padding: 48px 24px; - font-size: 1.5em; - line-height: 1.75em; + .woocommerce-importer-toggle-advanced-options { + color: #999; + } + } - &::before { - @include icon( '\e015' ); - color: #A16696; - position: static; - font-size: 100px; - display: block; - float: none; - margin: 0 0 24px; - } - } - } - } + .woocommerce-exporter, + .woocommerce-importer, + .wc-progress-form-content { + background: #fff; + overflow: hidden; + padding: 0; + margin: 0 0 16px; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.13); + color: #555; + text-align: left; - .wc-pointer { - .wc-pointer-buttons { - .close { - float: left; - margin: 6px 0 0 15px; - } - } - } + header { + border-bottom: 1px solid #eee; + margin: 0; + padding: 24px 24px 0; + } + + section { + padding: 24px 24px 0; + } + + h2 { + margin: 0 0 24px; + color: #555; + font-size: 24px; + font-weight: normal; + line-height: 1em; + } + + p { + font-size: 1em; + line-height: 1.75em; + font-size: 16px; + color: #555; + margin: 0 0 24px; + } + + .form-row { + margin-top: 24px; + } + + .spinner { + display: none; + } + + .woocommerce-importer-options th, + .woocommerce-importer-options td, + .woocommerce-exporter-options th, + .woocommerce-exporter-options td { + vertical-align: top; + line-height: 1.75em; + padding: 0 0 24px 0; + + label { + color: #555; + font-weight: normal; + } + + input[type="checkbox"] { + margin: 0 4px 0 0; + padding: 7px; + } + + input[type="text"], + input[type="number"] { + padding: 7px; + height: auto; + margin: 0; + } + + .woocommerce-importer-file-url-field-wrapper { + border: 1px solid #ddd; + -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.07); + box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.07); + background-color: #fff; + color: #32373c; + outline: 0; + line-height: 1; + display: block; + + code { + background: none; + font-size: smaller; + padding: 0; + margin: 0; + color: #999; + padding: 7px 0 0 7px; + display: inline-block; + } + + input { + font-family: Consolas, Monaco, monospace; + border: 0; + margin: 0; + outline: 0; + box-shadow: none; + display: inline-block; + min-width: 100%; + } + } + } + + .woocommerce-exporter-options th, + .woocommerce-importer-options th { + width: 35%; + padding-right: 20px; + } + + progress { + width: 100%; + height: 42px; + margin: 0 auto 24px; + display: block; + -webkit-appearance: none; + border: none; + display: none; + background: #f5f5f5; + border: 2px solid #eee; + border-radius: 4px; + padding: 0; + box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.2); + } + + progress::-webkit-progress-bar { + background: transparent none; + border: 0; + border-radius: 4px; + padding: 0; + box-shadow: none; + } + + progress::-webkit-progress-value { + border-radius: 3px; + box-shadow: inset 0 1px 1px 0 rgba(255, 255, 255, 0.4); + background: #a46497; + background: linear-gradient(top, #a46497, #66405f), #a46497; + transition: width 1s ease; + } + + progress::-moz-progress-bar { + border-radius: 3px; + box-shadow: inset 0 1px 1px 0 rgba(255, 255, 255, 0.4); + background: #a46497; + background: linear-gradient(top, #a46497, #66405f), #a46497; + transition: width 1s ease; + } + + progress::-ms-fill { + border-radius: 3px; + box-shadow: inset 0 1px 1px 0 rgba(255, 255, 255, 0.4); + background: #a46497; + background: linear-gradient(to bottom, #a46497, #66405f), #a46497; + transition: width 1s ease; + } + + &.woocommerce-exporter__exporting, + &.woocommerce-importer__importing { + + .spinner { + display: block; + } + + progress { + display: block; + } + + .wc-actions, + .woocommerce-exporter-options { + display: none; + } + } + + .wc-importer-mapping-table-wrapper, + .wc-importer-error-log { + padding: 0; + } + + .wc-importer-mapping-table, + .wc-importer-error-log-table { + margin: 0; + border: 0; + box-shadow: none; + width: 100%; + table-layout: fixed; + + td, + th { + border: 0; + padding: 12px; + vertical-align: middle; + word-wrap: break-word; + + select { + width: 100%; + } + } + + tbody tr:nth-child(odd) td, + tbody tr:nth-child(odd) th { + background: #fbfbfb; + } + + th { + font-weight: bold; + } + + td:first-child, + th:first-child { + padding-left: 24px; + } + + td:last-child, + th:last-child { + padding-right: 24px; + } + + .wc-importer-mapping-table-name { + width: 50%; + + .description { + color: #999; + margin-top: 4px; + display: block; + + code { + background: none; + padding: 0; + white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */ + word-wrap: break-word; /* IE */ + word-break: break-all; + } + } + } + } + + .woocommerce-importer-done { + text-align: center; + padding: 48px 24px; + font-size: 1.5em; + line-height: 1.75em; + + &::before { + + @include icon( "\e015" ); + color: #a16696; + position: static; + font-size: 100px; + display: block; + float: none; + margin: 0 0 24px; + } + } + } +} + +.wc-pointer { + + .wc-pointer-buttons { + + .close { + float: left; + margin: 6px 0 0 15px; + } + } +} diff --git a/assets/css/twenty-seventeen.scss b/assets/css/twenty-seventeen.scss index 6181d04469d..a736eb31b93 100644 --- a/assets/css/twenty-seventeen.scss +++ b/assets/css/twenty-seventeen.scss @@ -1,30 +1,32 @@ /** * Twenty Seventeen integration styles */ -@import 'mixins'; -@import 'animation'; +@import "mixins"; +@import "animation"; /** * Fonts */ @font-face { - font-family: 'star'; - src: url('../fonts/star.eot'); - src: url('../fonts/star.eot?#iefix') format('embedded-opentype'), - url('../fonts/star.woff') format('woff'), - url('../fonts/star.ttf') format('truetype'), - url('../fonts/star.svg#star') format('svg'); + font-family: "star"; + src: url("../fonts/star.eot"); + src: + url("../fonts/star.eot?#iefix") format("embedded-opentype"), + url("../fonts/star.woff") format("woff"), + url("../fonts/star.ttf") format("truetype"), + url("../fonts/star.svg#star") format("svg"); font-weight: normal; font-style: normal; } @font-face { - font-family: 'WooCommerce'; - src: url('../fonts/WooCommerce.eot'); - src: url('../fonts/WooCommerce.eot?#iefix') format('embedded-opentype'), - url('../fonts/WooCommerce.woff') format('woff'), - url('../fonts/WooCommerce.ttf') format('truetype'), - url('../fonts/WooCommerce.svg#WooCommerce') format('svg'); + font-family: "WooCommerce"; + src: url("../fonts/WooCommerce.eot"); + src: + url("../fonts/WooCommerce.eot?#iefix") format("embedded-opentype"), + url("../fonts/WooCommerce.woff") format("woff"), + url("../fonts/WooCommerce.ttf") format("truetype"), + url("../fonts/WooCommerce.svg#WooCommerce") format("svg"); font-weight: normal; font-style: normal; } @@ -55,17 +57,21 @@ /** * Global elements */ - .woocommerce { +.woocommerce { + .blockUI.blockOverlay { position: relative; + @include loader(); } .loader { + @include loader(); } form .form-row { + .required { color: firebrick; text-decoration: none; @@ -78,14 +84,16 @@ .optional { visibility: visible; - } + } } .woocommerce-form-login { + .woocommerce-form-login__submit { float: left; margin-right: 1em; } + .woocommerce-form-login__rememberme { display: inline-block; line-height: 3em; @@ -101,6 +109,7 @@ font-size: 0.8125rem; a { + @include link(); } } @@ -128,7 +137,7 @@ float: none; line-height: 1.5; border-radius: 2px; - transition: background-color ease-in-out .3s; + transition: background-color ease-in-out 0.3s; } span.page-numbers { @@ -147,7 +156,7 @@ top: 0; left: 0; display: inline-block; - padding: .5em 1em; + padding: 0.5em 1em; font-size: 13px; font-size: 0.8125rem; text-transform: uppercase; @@ -155,10 +164,12 @@ } .price { + del { - opacity: .5; + opacity: 0.5; display: inline-block; } + ins { display: inline-block; } @@ -190,7 +201,9 @@ .woocommerce-message, .woocommerce-error, .woocommerce-info { + a { + @include link_white(); } } @@ -224,37 +237,40 @@ * Shop page */ .woocommerce-result-count { - padding: .75em 0; + padding: 0.75em 0; } /** * Products */ ul.products { + li.product { list-style: none; .price, .star-rating { display: block; - margin-bottom: .75em; + margin-bottom: 0.75em; } .woocommerce-placeholder { - border: 1px solid #F2F2F2; + border: 1px solid #f2f2f2; } .button { + @include link(); &.loading { - opacity: .5; + opacity: 0.5; } } .added_to_cart { + @include link(); - margin-left: .5em; + margin-left: 0.5em; } } } @@ -266,10 +282,10 @@ ul.products { line-height: 1; font-size: 1em; width: 5.4em; - font-family: 'star'; + font-family: "star"; &::before { - content: '\73\73\73\73\73'; + content: "\73\73\73\73\73"; float: left; top: 0; left: 0; @@ -286,7 +302,7 @@ ul.products { } span::before { - content: '\53\53\53\53\53'; + content: "\53\53\53\53\53"; top: 0; position: absolute; left: 0; @@ -318,13 +334,15 @@ a.remove { } } -dl.variation, .wc-item-meta { +dl.variation, + .wc-item-meta { list-style: none outside; - dt, .wc-item-meta-label { + dt, + .wc-item-meta-label { float: left; clear: both; - margin-right: .25em; + margin-right: 0.25em; display: inline-block; list-style: none outside; } @@ -343,6 +361,7 @@ dl.variation, .wc-item-meta { * Single product */ .single-product { + div.product { position: relative; } @@ -365,14 +384,15 @@ dl.variation, .wc-item-meta { .star-rating { float: left; - margin-right: .25em; + margin-right: 0.25em; } } form.cart { + .quantity { float: left; - margin-right: .5em; + margin-right: 0.5em; } input { @@ -381,10 +401,12 @@ dl.variation, .wc-item-meta { } .woocommerce-variation-add-to-cart { + .button { - padding-top: .72em; - padding-bottom: .72em; + padding-top: 0.72em; + padding-bottom: 0.72em; } + .button.disabled { opacity: 0.2; } @@ -392,12 +414,13 @@ dl.variation, .wc-item-meta { } table.variations { + label { margin: 0; } select { - margin-right: .5em; + margin-right: 0.5em; } } @@ -421,7 +444,7 @@ table.variations { } .woocommerce-product-gallery__image--placeholder { - border: 1px solid #F2F2F2; + border: 1px solid #f2f2f2; } .woocommerce-product-gallery__image:nth-child(n+2) { @@ -430,6 +453,7 @@ table.variations { } .flex-control-thumbs { + li { list-style: none; cursor: pointer; @@ -437,7 +461,7 @@ table.variations { } img { - opacity: .5; + opacity: 0.5; &:hover, &.flex-active { @@ -453,27 +477,33 @@ table.variations { } .woocommerce-product-gallery--columns-3 { + .flex-control-thumbs li { width: 33.3333%; } + .flex-control-thumbs li:nth-child(3n+1) { clear: left; } } .woocommerce-product-gallery--columns-4 { + .flex-control-thumbs li { width: 25%; } + .flex-control-thumbs li:nth-child(4n+1) { clear: left; } } .woocommerce-product-gallery--columns-5 { + .flex-control-thumbs li { width: 20%; } + .flex-control-thumbs li:nth-child(5n+1) { clear: left; } @@ -493,6 +523,7 @@ table.variations { margin-right: 1em; &.active { + a { box-shadow: 0 3px 0 rgba(15, 15, 15, 1); } @@ -500,6 +531,7 @@ table.variations { } a { + @include link(); } @@ -517,6 +549,7 @@ table.variations { } #reviews { + li.review, li.comment { list-style: none; @@ -530,11 +563,12 @@ table.variations { } p.meta { - margin-bottom: .5em; + margin-bottom: 0.5em; } } p.stars { + a { position: relative; height: 1em; @@ -552,40 +586,46 @@ table.variations { width: 1em; height: 1em; line-height: 1; - font-family: 'WooCommerce'; - content: '\e021'; + font-family: "WooCommerce"; + content: "\e021"; text-indent: 0; } &:hover { + ~ a::before { - content: '\e021'; + content: "\e021"; } } } &:hover { + a { + &::before { - content: '\e020'; + content: "\e020"; } } } &.selected { + a.active { + &::before { - content: '\e020'; + content: "\e020"; } ~ a::before { - content: '\e021'; + content: "\e021"; } } - a:not( .active ) { + a:not(.active) { + &::before { - content: '\e020'; + content: "\e020"; } } } @@ -624,17 +664,21 @@ table.variations { } .widget_shopping_cart { + .buttons { + a { display: inline-block; - margin: 0 .5em 0 0; + margin: 0 0.5em 0 0; } } } .widget_layered_nav { + .chosen { - &:before { + + &::before { content: "×"; display: inline-block; width: 16px; @@ -644,12 +688,13 @@ table.variations { text-align: center; border-radius: 100%; border: 1px solid black; - margin-right: .25em; + margin-right: 0.25em; } } } .widget_price_filter { + .price_slider { margin-bottom: 1em; } @@ -661,7 +706,7 @@ table.variations { .button { float: left; - padding: .4em 1em; + padding: 0.4em 1em; } } @@ -720,17 +765,19 @@ table.variations { } .widget_rating_filter { + li { text-align: right; .star-rating { float: left; - margin-top: .3em; + margin-top: 0.3em; } } } .widget_product_search { + form { position: relative; } @@ -741,8 +788,8 @@ table.variations { input[type=submit] { position: absolute; - top: .5em; - right: .5em; + top: 0.5em; + right: 0.5em; padding-left: 1em; padding-right: 1em; } @@ -752,6 +799,7 @@ table.variations { * Account section */ .woocommerce-account { + .woocommerce-MyAccount-navigation { float: right; width: 25%; @@ -759,7 +807,7 @@ table.variations { li { list-style: none; - padding: .5em 0; + padding: 0.5em 0; border-bottom: 1px solid #ddd; a { @@ -770,14 +818,15 @@ table.variations { } } - &:before { + &::before { content: "→"; display: inline-block; - margin-right: .25em; + margin-right: 0.25em; color: #ddd; } &.is-active { + a { box-shadow: 0 3px 0 rgba(15, 15, 15, 1); } @@ -794,8 +843,9 @@ table.variations { * Cart */ .woocommerce-cart-form { + td { - padding: 1em .5em; + padding: 1em 0.5em; } img { @@ -818,14 +868,16 @@ table.variations { } .actions { + .input-text { width: 130px !important; float: left; - margin-right: .25em; + margin-right: 0.25em; } } .quantity { + input { width: 4em; } @@ -833,21 +885,25 @@ table.variations { } .cart_totals { - th, td { + + th, + td { vertical-align: top; padding: 1em 0; line-height: 1.5em; } + th { padding-right: 1em; } + .woocommerce-shipping-destination { margin-bottom: 0; } } .shipping-calculator-button { - margin-top: .5em; + margin-top: 0.5em; display: inline-block; } @@ -860,7 +916,7 @@ table.variations { margin: 0; li { - margin-bottom: .5em; + margin-bottom: 0.5em; input { float: left; @@ -886,7 +942,7 @@ table.variations { border-color: #999; } - &:after { + &::after { content: "→"; } } @@ -895,6 +951,7 @@ table.variations { * Checkout */ #ship-to-different-address { + label { font-weight: 300; cursor: pointer; @@ -903,7 +960,7 @@ table.variations { position: relative; display: block; - &:before { + &::before { content: ""; display: block; height: 16px; @@ -912,13 +969,13 @@ table.variations { background: #bbb; border-radius: 13em; box-sizing: content-box; - transition: all ease-in-out .3s; + transition: all ease-in-out 0.3s; position: absolute; top: 4px; right: 0; } - &:after { + &::after { content: ""; display: block; width: 14px; @@ -928,7 +985,7 @@ table.variations { top: 7px; right: 17px; border-radius: 13em; - transition: all ease-in-out .3s; + transition: all ease-in-out 0.3s; } } @@ -936,11 +993,11 @@ table.variations { display: none; } - input[type=checkbox]:checked + span:after { + input[type=checkbox]:checked + span::after { right: 3px; } - input[type=checkbox]:checked + span:before { + input[type=checkbox]:checked + span::before { border-color: #000; background: #000; } @@ -948,10 +1005,12 @@ table.variations { } .woocommerce-no-js { + form.woocommerce-form-login, form.woocommerce-form-coupon { display: block !important; } + .woocommerce-form-login-toggle, .woocommerce-form-coupon-toggle, .showcoupon { @@ -960,37 +1019,40 @@ table.variations { } .woocommerce-terms-and-conditions { - border: 1px solid rgba(0,0,0,.2); - box-shadow: inset 0 1px 2px rgba(0,0,0,.1); - background: rgba(0,0,0,.05); + border: 1px solid rgba(0, 0, 0, 0.2); + box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); + background: rgba(0, 0, 0, 0.05); } .woocommerce-terms-and-conditions-link { display: inline-block; - &:after { + &::after { content: ""; display: inline-block; border-style: solid; margin-bottom: 2px; - margin-left: .25em; + margin-left: 0.25em; border-width: 6px 6px 0 6px; border-color: #111 transparent transparent transparent; } - &.woocommerce-terms-and-conditions-link--open:after { + + &.woocommerce-terms-and-conditions-link--open::after { border-width: 0 6px 6px 6px; border-color: transparent transparent #111 transparent; } } .woocommerce-checkout { + .woocommerce-input-wrapper { + .description { background: royalblue; color: #fff; border-radius: 3px; padding: 1em; - margin: .5em 0 0; + margin: 0.5em 0 0; clear: both; display: none; position: relative; @@ -1002,11 +1064,11 @@ table.variations { box-shadow: none; } - &:before { + &::before { left: 50%; top: 0%; margin-top: -4px; - transform: translatex(-50%) rotate(180deg); + transform: translateX(-50%) rotate(180deg); content: ""; position: absolute; border-width: 4px 6px 0 6px; @@ -1022,26 +1084,32 @@ table.variations { .select2-choice:hover { box-shadow: none !important; } + .select2-choice { - padding: .7em 0 .7em .7em; + padding: 0.7em 0 0.7em 0.7em; } + .select2-container .select2-selection--single { height: 48px; } + .select2-container .select2-selection--single .select2-selection__rendered { line-height: 48px; } + .select2-container--default .select2-selection--single .select2-selection__arrow { height: 46px; } + .select2-container--focus .select2-selection { border-color: black; } } .woocommerce-checkout-review-order-table { + td { - padding: 1em .5em; + padding: 1em 0.5em; } dl.variation { @@ -1063,6 +1131,7 @@ table.variations { ul, ol { + &:last-of-type { margin-bottom: 0; } @@ -1102,7 +1171,8 @@ table.variations { display: none; & + label { - &:before { + + &::before { content: ""; display: inline-block; width: 16px; @@ -1111,14 +1181,15 @@ table.variations { box-shadow: 0 0 0 2px black; background: white; margin-left: 4px; - margin-right: .5em; + margin-right: 0.5em; border-radius: 100%; transform: translateY(2px); } } &:checked + label { - &:before { + + &::before { background: black; } } @@ -1126,10 +1197,12 @@ table.variations { } .colors-dark { + .page-numbers { color: #444; - &.next, &.prev { + &.next, + &.prev { color: #ddd; } } @@ -1143,17 +1216,21 @@ table.variations { } .wc_payment_method { + .payment_box { background: #333; } } .select2-container--default { + .select2-results { + .select2-results__options { - background:#333; + background: #333; } - .select2-results__option[data-selected="true"]{ + + .select2-results__option[data-selected="true"] { color: #333; } } @@ -1177,7 +1254,9 @@ table.variations { * Layout stuff */ @media screen and (min-width: 48em) { + .has-sidebar.woocommerce-page:not(.error404) { + #primary { width: 74%; } diff --git a/assets/css/woocommerce.scss b/assets/css/woocommerce.scss index 556920251db..20f5c1e02c5 100644 --- a/assets/css/woocommerce.scss +++ b/assets/css/woocommerce.scss @@ -7,10 +7,10 @@ /** * Imports */ -@import 'mixins'; -@import 'variables'; -@import 'animation'; -@import 'fonts'; +@import "mixins"; +@import "variables"; +@import "animation"; +@import "fonts"; /** * Global styles @@ -40,11 +40,11 @@ p.demo_store, .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); - height: 1px; - overflow: hidden; - position: absolute !important; - width: 1px; - word-wrap: normal !important; + height: 1px; + overflow: hidden; + position: absolute !important; + width: 1px; + word-wrap: normal !important; } .admin-bar p.demo_store { @@ -62,12 +62,15 @@ p.demo_store, * Main WooCommerce styles */ .woocommerce { + .blockUI.blockOverlay { position: relative; + @include loader(); } .loader { + @include loader(); } @@ -98,6 +101,7 @@ p.demo_store, } .woocommerce-breadcrumb { + @include clearfix(); margin: 0 0 1em; padding: 0; @@ -179,7 +183,7 @@ p.demo_store, } .woocommerce-product-gallery__wrapper { - transition: all cubic-bezier(0.795, -0.035, 0.000, 1.000) .5s; + transition: all cubic-bezier(0.795, -0.035, 0, 1) 0.5s; margin: 0; padding: 0; } @@ -190,7 +194,7 @@ p.demo_store, } .woocommerce-product-gallery__image--placeholder { - border: 1px solid #F2F2F2; + border: 1px solid #f2f2f2; } .woocommerce-product-gallery__image:nth-child(n+2) { @@ -200,8 +204,8 @@ p.demo_store, .woocommerce-product-gallery__trigger { position: absolute; - top: .5em; - right: .5em; + top: 0.5em; + right: 0.5em; font-size: 2em; z-index: 9; width: 36px; @@ -211,7 +215,7 @@ p.demo_store, border-radius: 100%; box-sizing: content-box; - &:before { + &::before { content: ""; display: block; width: 10px; @@ -224,7 +228,7 @@ p.demo_store, box-sizing: content-box; } - &:after { + &::after { content: ""; display: block; width: 2px; @@ -253,7 +257,7 @@ p.demo_store, img { cursor: pointer; - opacity: .5; + opacity: 0.5; margin: 0; &.flex-active, @@ -266,18 +270,21 @@ p.demo_store, } .woocommerce-product-gallery--columns-3 { + .flex-control-thumbs li:nth-child(3n+1) { clear: left; } } .woocommerce-product-gallery--columns-4 { + .flex-control-thumbs li:nth-child(4n+1) { clear: left; } } .woocommerce-product-gallery--columns-5 { + .flex-control-thumbs li:nth-child(5n+1) { clear: left; } @@ -311,6 +318,7 @@ p.demo_store, } .woocommerce-tabs { + ul.tabs { list-style: none; padding: 0 0 0 1em; @@ -319,7 +327,7 @@ p.demo_store, position: relative; li { - border: 1px solid darken( $secondary, 10% ); + border: 1px solid darken($secondary, 10%); background-color: $secondary; display: inline-block; position: relative; @@ -337,7 +345,7 @@ p.demo_store, &:hover { text-decoration: none; - color: lighten( $secondarytext, 10% ); + color: lighten($secondarytext, 10%); } } @@ -362,12 +370,12 @@ p.demo_store, &::before, &::after { - border: 1px solid darken( $secondary, 10% ); + border: 1px solid darken($secondary, 10%); position: absolute; bottom: -1px; width: 5px; height: 5px; - content: ' '; + content: " "; box-sizing: border-box; } @@ -388,11 +396,11 @@ p.demo_store, &::before { position: absolute; - content: ' '; + content: " "; width: 100%; bottom: 0; left: 0; - border-bottom: 1px solid darken( $secondary, 10% ); + border-bottom: 1px solid darken($secondary, 10%); z-index: 1; } } @@ -405,11 +413,13 @@ p.demo_store, p.cart { margin-bottom: 2em; + @include clearfix(); } form.cart { margin-bottom: 2em; + @include clearfix(); div.quantity { @@ -482,6 +492,7 @@ p.demo_store, } .group_table { + td.woocommerce-grouped-product-list-item__label { padding-right: 1em; padding-left: 1em; @@ -502,7 +513,7 @@ p.demo_store, display: inline-block; width: auto; margin: 0 auto; - transform:scale(1.5, 1.5); + transform: scale(1.5, 1.5); } } } @@ -536,6 +547,7 @@ p.demo_store, padding: 0; list-style: none outside; clear: both; + @include clearfix(); li { @@ -544,6 +556,7 @@ p.demo_store, } ul.products li.product { + .onsale { top: 0; right: 0; @@ -576,7 +589,7 @@ p.demo_store, } .woocommerce-placeholder { - border: 1px solid #F2F2F2; + border: 1px solid #f2f2f2; } .star-rating { @@ -635,12 +648,12 @@ p.demo_store, white-space: nowrap; padding: 0; clear: both; - border: 1px solid darken( $secondary, 10% ); + border: 1px solid darken($secondary, 10%); border-right: 0; margin: 1px; li { - border-right: 1px solid darken( $secondary, 10% ); + border-right: 1px solid darken($secondary, 10%); padding: 0; margin: 0; float: left; @@ -664,7 +677,7 @@ p.demo_store, a:hover, a:focus { background: $secondary; - color: darken( $secondary, 40% ); + color: darken($secondary, 40%); } } } @@ -701,8 +714,8 @@ p.demo_store, padding-right: 2.618em; &::after { - font-family: 'WooCommerce'; - content: '\e01c'; + font-family: "WooCommerce"; + content: "\e01c"; vertical-align: top; font-weight: 400; position: absolute; @@ -713,8 +726,8 @@ p.demo_store, } &.added::after { - font-family: 'WooCommerce'; - content: '\e017'; + font-family: "WooCommerce"; + content: "\e017"; margin-left: 0.53em; vertical-align: bottom; } @@ -776,6 +789,7 @@ p.demo_store, * Reviews */ #reviews { + h2 small { float: right; color: $subtext; @@ -803,7 +817,9 @@ p.demo_store, } #comments { + .add_review { + @include clearfix(); } @@ -812,6 +828,7 @@ p.demo_store, } ol.commentlist { + @include clearfix(); margin: 0; width: 100%; @@ -840,16 +857,17 @@ p.demo_store, width: 32px; height: auto; background: $secondary; - border: 1px solid darken( $secondary, 3% ); + border: 1px solid darken($secondary, 3%); margin: 0; box-shadow: none; } .comment-text { margin: 0 0 0 50px; - border: 1px solid darken( $secondary, 3% ); + border: 1px solid darken($secondary, 3%); border-radius: 4px; padding: 1em 1em 0; + @include clearfix(); p { @@ -872,7 +890,7 @@ p.demo_store, } #respond { - border: 1px solid darken( $secondary, 3% ); + border: 1px solid darken($secondary, 3%); border-radius: 4px; padding: 1em 1em 0; margin: 20px 0 0 50px; @@ -880,7 +898,7 @@ p.demo_store, } .commentlist > li::before { - content: ''; + content: ""; } } } @@ -896,11 +914,11 @@ p.demo_store, line-height: 1; font-size: 1em; width: 5.4em; - font-family: 'star'; + font-family: "star"; &::before { - content: '\73\73\73\73\73'; - color: darken( $secondary, 10% ); + content: "\73\73\73\73\73"; + color: darken($secondary, 10%); float: left; top: 0; left: 0; @@ -917,7 +935,7 @@ p.demo_store, } span::before { - content: '\53\53\53\53\53'; + content: "\53\53\53\53\53"; top: 0; position: absolute; left: 0; @@ -925,6 +943,7 @@ p.demo_store, } .woocommerce-product-rating { + @include clearfix(); line-height: 2; display: block; @@ -946,6 +965,7 @@ p.demo_store, } #review_form #respond { + @include clearfix(); position: static; margin: 0; @@ -969,6 +989,7 @@ p.demo_store, } p.stars { + a { position: relative; height: 1em; @@ -985,33 +1006,35 @@ p.demo_store, width: 1em; height: 1em; line-height: 1; - font-family: 'WooCommerce'; - content: '\e021'; + font-family: "WooCommerce"; + content: "\e021"; text-indent: 0; } &:hover ~ a::before { - content: '\e021'; + content: "\e021"; } } &:hover a::before { - content: '\e020'; + content: "\e020"; } &.selected { + a.active { + &::before { - content: '\e020'; + content: "\e020"; } ~ a::before { - content: '\e021'; + content: "\e021"; } } - a:not( .active )::before { - content: '\e020'; + a:not(.active)::before { + content: "\e020"; } } } @@ -1081,6 +1104,7 @@ p.demo_store, } tbody:first-child tr:first-child { + th, td { border-top: 0; @@ -1118,6 +1142,7 @@ p.demo_store, } table.woocommerce-MyAccount-downloads { + td, th { vertical-align: top; @@ -1126,24 +1151,29 @@ p.demo_store, &:first-child { text-align: left; } + &:last-child { text-align: left; } + .woocommerce-MyAccount-downloads-file::before { - content: '\2193'; + content: "\2193"; display: inline-block; } } } td.product-name { - dl.variation, .wc-item-meta { + + dl.variation, + .wc-item-meta { list-style: none outside; - dt, .wc-item-meta-label { + dt, + .wc-item-meta-label { float: left; clear: both; - margin-right: .25em; + margin-right: 0.25em; display: inline-block; list-style: none outside; } @@ -1179,6 +1209,7 @@ p.demo_store, li { padding: 4px 0; margin: 0; + @include clearfix(); list-style: none; @@ -1199,6 +1230,7 @@ p.demo_store, margin: 0; padding-left: 1em; border-left: 2px solid rgba(0, 0, 0, 0.1); + @include clearfix(); dt, @@ -1232,6 +1264,7 @@ p.demo_store, &.widget_shopping_cart, .widget_shopping_cart { + .total { border-top: 3px double $secondary; padding: 4px 0 0; @@ -1255,7 +1288,9 @@ p.demo_store, } .buttons { + @include clearfix(); + a { margin-right: 5px; margin-bottom: 5px; @@ -1288,12 +1323,13 @@ p.demo_store, } .woocommerce-input-wrapper { + .description { background: #1e85be; color: #fff; border-radius: 3px; padding: 1em; - margin: .5em 0 0; + margin: 0.5em 0 0; clear: both; display: none; position: relative; @@ -1305,11 +1341,11 @@ p.demo_store, box-shadow: none; } - &:before { + &::before { left: 50%; top: 0%; margin-top: -4px; - transform: translatex(-50%) rotate(180deg); + transform: translateX(-50%) rotate(180deg); content: ""; position: absolute; border-width: 4px 6px 0 6px; @@ -1336,7 +1372,7 @@ p.demo_store, .optional { visibility: visible; - } + } .input-checkbox { display: inline; @@ -1367,9 +1403,11 @@ p.demo_store, } &.woocommerce-invalid { + label { color: $red; } + .select2-container, input.input-text, select { @@ -1378,6 +1416,7 @@ p.demo_store, } &.woocommerce-validated { + .select2-container, input.input-text, select { @@ -1401,7 +1440,7 @@ p.demo_store, form.login, form.checkout_coupon, form.register { - border: 1px solid darken( $secondary, 10% ); + border: 1px solid darken($secondary, 10%); padding: 20px; margin: 2em 0; text-align: left; @@ -1414,13 +1453,15 @@ p.demo_store, padding: 0; li { - margin: 0 0 .5em; + margin: 0 0 0.5em; line-height: 1.5em; list-style: none outside; + input { margin: 3px 0.4375em 0 0; vertical-align: top; } + label { display: inline; } @@ -1439,6 +1480,7 @@ p.demo_store, * Order page */ ul.order_details { + @include clearfix(); margin: 0 0 3em; list-style: none; @@ -1449,7 +1491,7 @@ p.demo_store, text-transform: uppercase; font-size: 0.715em; line-height: 1; - border-right: 1px dashed darken( $secondary, 10% ); + border-right: 1px dashed darken($secondary, 10%); padding-right: 2em; margin-left: 0; padding-left: 0; @@ -1481,7 +1523,9 @@ p.demo_store, margin-bottom: 0; } } + .woocommerce-customer-details { + address { font-style: normal; margin-bottom: 0; @@ -1493,19 +1537,24 @@ p.demo_store, border-radius: 5px; padding: 6px 12px; } + .woocommerce-customer-details--phone, .woocommerce-customer-details--email { margin-bottom: 0; padding-left: 1.5em; } + .woocommerce-customer-details--phone::before { - @include iconbefore( '\e037' ); + + @include iconbefore( "\e037" ); margin-left: -1.5em; line-height: 1.75; position: absolute; } + .woocommerce-customer-details--email::before { - @include iconbefore( '\e02d' ); + + @include iconbefore( "\e02d" ); margin-left: -1.5em; line-height: 1.75; position: absolute; @@ -1522,6 +1571,7 @@ p.demo_store, list-style: none outside; .woocommerce-widget-layered-nav-list__item { + @include clearfix(); padding: 0 0 1px; list-style: none; @@ -1531,11 +1581,14 @@ p.demo_store, padding: 1px 0; } } + .woocommerce-widget-layered-nav-list__item--chosen a::before { - @include iconbefore( '\e013' ); + + @include iconbefore( "\e013" ); color: $red; } } + .woocommerce-widget-layered-nav-dropdown__submit { margin-top: 1em; } @@ -1557,10 +1610,11 @@ p.demo_store, text-decoration: none; &::before { - @include iconbefore( '\e013' ); + + @include iconbefore( "\e013" ); color: $red; vertical-align: inherit; - margin-right: .5em; + margin-right: 0.5em; } } } @@ -1570,6 +1624,7 @@ p.demo_store, * Price filter widget */ .widget_price_filter { + .price_slider { margin-bottom: 1em; } @@ -1602,6 +1657,7 @@ p.demo_store, cursor: ew-resize; outline: none; top: -0.3em; + /* rtl:ignore */ margin-left: -0.5em; } @@ -1650,6 +1706,7 @@ p.demo_store, list-style: none outside; li { + @include clearfix(); padding: 0 0 1px; list-style: none; @@ -1666,16 +1723,19 @@ p.demo_store, } li.chosen a::before { - @include iconbefore( '\e013' ); + + @include iconbefore( "\e013" ); color: $red; } } .woocommerce-form-login { + .woocommerce-form-login__submit { float: left; margin-right: 1em; } + .woocommerce-form-login__rememberme { display: inline-block; } @@ -1683,10 +1743,12 @@ p.demo_store, } .woocommerce-no-js { + form.woocommerce-form-login, form.woocommerce-form-coupon { display: block !important; } + .woocommerce-form-login-toggle, .woocommerce-form-coupon-toggle, .showcoupon { @@ -1704,13 +1766,14 @@ p.demo_store, color: $secondarytext; border-top: 3px solid $primary; list-style: none outside; + @include clearfix(); width: auto; word-wrap: break-word; &::before { - font-family: 'WooCommerce'; - content: '\e028'; + font-family: "WooCommerce"; + content: "\e028"; display: inline-block; position: absolute; top: 1em; @@ -1731,8 +1794,9 @@ p.demo_store, /** * Right to left styles */ - .rtl.woocommerce .price_label, - .rtl.woocommerce .price_label span { +.rtl.woocommerce .price_label, +.rtl.woocommerce .price_label span { + /* rtl:ignore */ direction: ltr; unicode-bidi: embed; @@ -1742,7 +1806,7 @@ p.demo_store, border-top-color: #8fae1b; &::before { - content: '\e015'; + content: "\e015"; color: #8fae1b; } } @@ -1759,7 +1823,7 @@ p.demo_store, border-top-color: #b81c23; &::before { - content: '\e016'; + content: "\e016"; color: #b81c23; } } @@ -1768,11 +1832,14 @@ p.demo_store, * Account page */ .woocommerce-account { + .woocommerce { + @include clearfix(); } .addresses .title { + @include clearfix(); h3 { @@ -1785,6 +1852,7 @@ p.demo_store, } ol.commentlist.notes li.note { + p.meta { font-weight: 700; margin-bottom: 0; @@ -1794,6 +1862,7 @@ p.demo_store, margin-bottom: 0; } } + ul.digital-downloads { margin-left: 0; padding-left: 0; @@ -1804,7 +1873,8 @@ p.demo_store, padding-left: 0; &::before { - @include iconbefore( '\e00a' ); + + @include iconbefore( "\e00a" ); } .count { @@ -1820,7 +1890,9 @@ p.demo_store, .woocommerce-cart, .woocommerce-checkout, #add_payment_method { + table.cart { + .product-thumbnail { min-width: 32px; } @@ -1838,7 +1910,7 @@ p.demo_store, td.actions .coupon .input-text { float: left; box-sizing: border-box; - border: 1px solid darken( $secondary, 10% ); + border: 1px solid darken($secondary, 10%); padding: 6px 6px 5px; margin: 0 4px 0 0; outline: 0; @@ -1851,6 +1923,7 @@ p.demo_store, } .wc-proceed-to-checkout { + @include clearfix; padding: 1em 0; @@ -1864,14 +1937,16 @@ p.demo_store, } .cart-collaterals { + .shipping-calculator-button { float: none; - margin-top: .5em; + margin-top: 0.5em; display: inline-block; } .shipping-calculator-button::after { - @include iconafter( '\e019' ); + + @include iconafter( "\e019" ); } .shipping-calculator-form { @@ -1879,6 +1954,7 @@ p.demo_store, } .cart_totals { + p small { color: $subtext; font-size: 0.83em; @@ -1890,6 +1966,7 @@ p.demo_store, padding: 0; tr:first-child { + th, td { border-top: 0; @@ -1925,6 +2002,7 @@ p.demo_store, tr th { border-top: 1px solid $secondary; } + .woocommerce-shipping-destination { margin-bottom: 0; } @@ -1934,8 +2012,11 @@ p.demo_store, margin-top: 0; } } + .checkout { + .col-2 { + h3#ship-to-different-address { float: left; clear: none; @@ -1972,10 +2053,11 @@ p.demo_store, border-radius: 5px; ul.payment_methods { + @include clearfix(); text-align: left; padding: 1em; - border-bottom: 1px solid darken( $secondary, 10% ); + border-bottom: 1px solid darken($secondary, 10%); margin: 0; list-style: none outside; @@ -2003,6 +2085,7 @@ p.demo_store, } li:not(.woocommerce-notice) { + @include clearfix; } } @@ -2020,36 +2103,40 @@ p.demo_store, font-size: 0.92em; border-radius: 2px; line-height: 1.5; - background-color: darken( $secondary, 5% ); + background-color: darken($secondary, 5%); color: $secondarytext; - input.input-text, textarea { - border-color: darken( $secondary, 15% ); - border-top-color: darken( $secondary, 20% ); + input.input-text, + textarea { + border-color: darken($secondary, 15%); + border-top-color: darken($secondary, 20%); } ::-webkit-input-placeholder { - color: darken( $secondary, 20% ); + color: darken($secondary, 20%); } :-moz-placeholder { - color: darken( $secondary, 20% ); + color: darken($secondary, 20%); } :-ms-input-placeholder { - color: darken( $secondary, 20% ); + color: darken($secondary, 20%); } .woocommerce-SavedPaymentMethods { list-style: none outside; margin: 0; + .woocommerce-SavedPaymentMethods-token, .woocommerce-SavedPaymentMethods-new { margin: 0 0 0.5em; + label { cursor: pointer; } } + .woocommerce-SavedPaymentMethods-tokenInput { vertical-align: middle; margin: -3px 1em 0 0; @@ -2062,6 +2149,7 @@ p.demo_store, padding: 0; margin: 1em 0 0; } + .wc-credit-card-form-card-number, .wc-credit-card-form-card-expiry, .wc-credit-card-form-card-cvc { @@ -2072,34 +2160,35 @@ p.demo_store, background-size: 32px 20px; &.visa { - background-image: url('../images/icons/credit-cards/visa.svg'); + background-image: url("../images/icons/credit-cards/visa.svg"); } &.mastercard { - background-image: url('../images/icons/credit-cards/mastercard.svg'); + background-image: url("../images/icons/credit-cards/mastercard.svg"); } &.laser { - background-image: url('../images/icons/credit-cards/laser.svg'); + background-image: url("../images/icons/credit-cards/laser.svg"); } &.dinersclub { - background-image: url('../images/icons/credit-cards/diners.svg'); + background-image: url("../images/icons/credit-cards/diners.svg"); } &.maestro { - background-image: url('../images/icons/credit-cards/maestro.svg'); + background-image: url("../images/icons/credit-cards/maestro.svg"); } &.jcb { - background-image: url('../images/icons/credit-cards/jcb.svg'); + background-image: url("../images/icons/credit-cards/jcb.svg"); } &.amex { - background-image: url('../images/icons/credit-cards/amex.svg'); + background-image: url("../images/icons/credit-cards/amex.svg"); } + &.discover { - background-image: url('../images/icons/credit-cards/discover.svg'); + background-image: url("../images/icons/credit-cards/discover.svg"); } } @@ -2118,9 +2207,9 @@ p.demo_store, } &::before { - content: ''; + content: ""; display: block; - border: 1em solid darken( $secondary, 5% ); /* arrow size / color */ + border: 1em solid darken($secondary, 5%); /* arrow size / color */ border-right-color: transparent; border-left-color: transparent; border-top-color: transparent; @@ -2132,6 +2221,7 @@ p.demo_store, } .payment_method_paypal { + .about_paypal { float: right; line-height: 52px; @@ -2147,12 +2237,13 @@ p.demo_store, } .woocommerce-terms-and-conditions { - border: 1px solid rgba(0,0,0,.2); - box-shadow: inset 0 1px 2px rgba(0,0,0,.1); - background: rgba(0,0,0,.05); + border: 1px solid rgba(0, 0, 0, 0.2); + box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); + background: rgba(0, 0, 0, 0.05); } .woocommerce-invalid { + #terms { outline: 2px solid red; outline-offset: 2px; @@ -2206,6 +2297,7 @@ p.demo_store, * Twenty Thirteen specific styles */ .single-product .twentythirteen { + .entry-summary, #reply-title, #respond #commentform { @@ -2231,7 +2323,7 @@ p.demo_store, /** * Twenty Sixteen specific styles */ -body:not( .search-results ) .twentysixteen .entry-summary { +body:not(.search-results) .twentysixteen .entry-summary { color: inherit; font-size: inherit; line-height: inherit; From 387b20480c9c6ce61dc230be055d07b7f1abedee Mon Sep 17 00:00:00 2001 From: Mike Jolley Date: Mon, 18 Feb 2019 15:06:35 +0000 Subject: [PATCH 24/26] Update from master --- assets/css/activation.scss | 4 +- assets/css/admin.scss | 122 +++++++++++++++---------------- assets/css/twenty-seventeen.scss | 8 +- assets/css/woocommerce.scss | 6 +- 4 files changed, 70 insertions(+), 70 deletions(-) diff --git a/assets/css/activation.scss b/assets/css/activation.scss index 2674c9589ad..e21c839aa7c 100644 --- a/assets/css/activation.scss +++ b/assets/css/activation.scss @@ -23,8 +23,8 @@ p.woocommerce-actions, text-shadow: 0 -1px 1px #a36597, 1px 0 1px #a36597, 0 1px 1px #a36597, -1px 0 1px #a36597; &:hover, - &:focus, - &:active { + &:focus, + &:active { background: #a36597; border-color: #a36597; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; diff --git a/assets/css/admin.scss b/assets/css/admin.scss index 7f78b2cd538..dbafd787f45 100644 --- a/assets/css/admin.scss +++ b/assets/css/admin.scss @@ -475,7 +475,7 @@ } h2, - h3 { + h3 { margin: 0 !important; padding: 20px !important; background: #fff; @@ -530,8 +530,8 @@ display: inline-block; &:hover, - &:focus, - &:active { + &:focus, + &:active { background: #a36597; border-color: #a36597; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; @@ -574,7 +574,7 @@ } #variable_product_options #message, - #variable_product_options .notice { +#variable_product_options .notice { margin: 10px; } @@ -648,7 +648,7 @@ table.wc_status_table { } td, - th { + th { font-size: 1.1em; font-weight: normal; @@ -674,7 +674,7 @@ table.wc_status_table { } mark.error, - .red { + .red { color: $red; } @@ -691,7 +691,7 @@ table.wc_status_table { table.wc_status_table--tools { td, - th { + th { padding: 2em; } } @@ -868,8 +868,8 @@ table.wc_status_table--tools { } .length, - .width, - .height { + .width, + .height { width: 32.33%; } @@ -1055,7 +1055,7 @@ ul.wc_coupon_list_block { } h3, - h4 { + h4 { color: #333; margin: 1.33em 0 0; } @@ -1180,7 +1180,7 @@ ul.wc_coupon_list_block { } .wc-customer-user, - .wc-order-status { + .wc-order-status { label a { float: right; @@ -1200,7 +1200,7 @@ ul.wc_coupon_list_block { float: right; &:hover, - &:focus { + &:focus { color: #000; } @@ -1416,7 +1416,7 @@ ul.wc_coupon_list_block { } .hndle, - .handlediv { + .handlediv { display: none; } @@ -1461,7 +1461,7 @@ ul.wc_coupon_list_block { } tbody th, - td { + td { padding: 1.5em 1em 1em; text-align: left; line-height: 1.5em; @@ -1477,7 +1477,7 @@ ul.wc_coupon_list_block { } input, - textarea { + textarea { font-size: 14px; padding: 4px; color: #555; @@ -1541,7 +1541,7 @@ ul.wc_coupon_list_block { td.name { .wc-order-item-sku, - .wc-order-item-variation { + .wc-order-item-variation { display: block; margin-top: 0.5em; font-size: 0.92em !important; @@ -1651,16 +1651,16 @@ ul.wc_coupon_list_block { } small.times, - del, - .wc-order-item-taxes, - .wc-order-item-discount, - .wc-order-item-refund-fields { + del, + .wc-order-item-taxes, + .wc-order-item-discount, + .wc-order-item-refund-fields { font-size: 0.92em !important; color: #888; } .wc-order-item-taxes, - .wc-order-item-refund-fields { + .wc-order-item-refund-fields { margin: 0; label { @@ -2026,8 +2026,8 @@ ul.wc_coupon_list_block { } .column-orders, - .column-paying, - .column-spent { + .column-paying, + .column-spent { text-align: center; width: 8%; } @@ -2127,7 +2127,7 @@ ul.wc_coupon_list_block { } th.sortable a, - th.sorted a { + th.sorted a { padding: 0; } @@ -2333,7 +2333,7 @@ ul.wc_coupon_list_block { margin: 0; th, - td { + td { padding: 1em 1.5em; text-align: left; border: 0; @@ -2366,7 +2366,7 @@ ul.wc_coupon_list_block { margin-top: 0.5em; th, - td { + td { padding: 0; border: 0; text-align: left; @@ -2924,7 +2924,7 @@ table.wc_input_table { width: 100%; th, - td { + td { display: table-cell !important; } @@ -3064,7 +3064,7 @@ table.wc_shipping { position: relative; th, - td { + td { display: table-cell !important; padding: 1em !important; vertical-align: top; @@ -3216,7 +3216,7 @@ table.wc_shipping { td.forminp { input, - textarea { + textarea { padding: 8px; max-width: 100% !important; } @@ -3273,7 +3273,7 @@ table.wc_shipping { table { tr, - tr:hover { + tr:hover { table.wc-shipping-zone-methods { @@ -3293,11 +3293,11 @@ table { } table.wc-shipping-zones, - table.wc-shipping-zone-methods, - table.wc-shipping-classes { +table.wc-shipping-zone-methods, +table.wc-shipping-classes { td, - th { + th { vertical-align: top; line-height: 24px; padding: 1em !important; @@ -3327,7 +3327,7 @@ table.wc-shipping-zones, } td.wc-shipping-zones-blank-state, - td.wc-shipping-zone-method-blank-state { + td.wc-shipping-zone-method-blank-state { background: #f7f1f6 !important; overflow: hidden; position: relative; @@ -3343,7 +3343,7 @@ table.wc-shipping-zones, } p, - li { + li { color: #a46497; font-size: 1.5em; line-height: 1.5em; @@ -3400,7 +3400,7 @@ table.wc-shipping-zones, } tr.odd, - .wc-shipping-class-rows tr:nth-child(odd) { + .wc-shipping-class-rows tr:nth-child(odd) { td { background: #f9f9f9; @@ -3430,12 +3430,12 @@ table.wc-shipping-zones, } ul, - p { + p { margin: 0; } td.wc-shipping-zone-sort, - td.wc-shipping-zone-method-sort { + td.wc-shipping-zone-method-sort { cursor: move; font-size: 15px; text-align: center; @@ -3487,18 +3487,18 @@ table.wc-shipping-zones, .wc-shipping-zone-region { input, - select, - textarea { + select, + textarea { width: 100%; } a.wc-shipping-zone-delete, - a.wc-shipping-class-delete { + a.wc-shipping-class-delete { color: #a00; } a.wc-shipping-zone-delete:hover, - a.wc-shipping-class-delete:hover { + a.wc-shipping-class-delete:hover { color: red; } } @@ -3590,7 +3590,7 @@ table.wc-shipping-zones, tfoot { input, - select { + select { vertical-align: middle !important; } @@ -3602,7 +3602,7 @@ table.wc-shipping-zones, .editing { .wc-shipping-zone-view, - .wc-shipping-zone-edit { + .wc-shipping-zone-edit { display: none; } } @@ -3675,8 +3675,8 @@ table.wc-shipping-zones, td { input, - select, - textarea { + select, + textarea { width: 50%; min-width: 250px; } @@ -3688,7 +3688,7 @@ table.wc-shipping-zones, } td, - th { + th { vertical-align: middle; margin: 0; line-height: 24px; @@ -4013,7 +4013,7 @@ img.help_tip { td.forminp { input, - textarea { + textarea { width: 448px; padding: 6px 11px; } @@ -4190,7 +4190,7 @@ img.help_tip { } input, - select { + select { margin-top: -3px 0 0; vertical-align: middle; } @@ -4386,7 +4386,7 @@ img.help_tip { .woocommerce_page_wc-settings { input[type=url], - input[type=email] { + input[type=email] { direction: ltr; } @@ -4591,7 +4591,7 @@ img.help_tip { } h3:hover, - &.ui-sortable-helper { + &.ui-sortable-helper { .sort { visibility: visible; @@ -4911,7 +4911,7 @@ img.help_tip { cursor: move; button, - a.delete { + a.delete { float: right; } @@ -4952,17 +4952,17 @@ img.help_tip { padding: 0.5em 0.75em 0.5em 1em !important; a.delete, - .handlediv, - .sort { + .handlediv, + .sort { margin-top: 0.25em; } } h3:hover, - &.ui-sortable-helper { + &.ui-sortable-helper { a.delete, - .handlediv { + .handlediv { visibility: visible; } } @@ -6346,7 +6346,7 @@ table.bar_chart { } tbody td, - tbody th { + tbody th { padding: 1em; text-align: left; vertical-align: middle; @@ -6402,7 +6402,7 @@ table.bar_chart { line-height: 1.5em; .select2-results__option, - .select2-results__group { + .select2-results__group { margin: 0; padding: 8px; } @@ -6595,8 +6595,8 @@ table.bar_chart { opacity: 1; &:hover, - &:focus, - &:active { + &:focus, + &:active { background: #a36597; border-color: #a36597; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 1px 0 #a36597; @@ -6810,7 +6810,7 @@ table.bar_chart { table-layout: fixed; td, - th { + th { border: 0; padding: 12px; vertical-align: middle; diff --git a/assets/css/twenty-seventeen.scss b/assets/css/twenty-seventeen.scss index a736eb31b93..55e386e10e3 100644 --- a/assets/css/twenty-seventeen.scss +++ b/assets/css/twenty-seventeen.scss @@ -335,11 +335,11 @@ a.remove { } dl.variation, - .wc-item-meta { +.wc-item-meta { list-style: none outside; dt, - .wc-item-meta-label { + .wc-item-meta-label { float: left; clear: both; margin-right: 0.25em; @@ -887,7 +887,7 @@ table.variations { .cart_totals { th, - td { + td { vertical-align: top; padding: 1em 0; line-height: 1.5em; @@ -1202,7 +1202,7 @@ table.variations { color: #444; &.next, - &.prev { + &.prev { color: #ddd; } } diff --git a/assets/css/woocommerce.scss b/assets/css/woocommerce.scss index 20f5c1e02c5..b34562dffb8 100644 --- a/assets/css/woocommerce.scss +++ b/assets/css/woocommerce.scss @@ -1166,11 +1166,11 @@ p.demo_store, td.product-name { dl.variation, - .wc-item-meta { + .wc-item-meta { list-style: none outside; dt, - .wc-item-meta-label { + .wc-item-meta-label { float: left; clear: both; margin-right: 0.25em; @@ -2107,7 +2107,7 @@ p.demo_store, color: $secondarytext; input.input-text, - textarea { + textarea { border-color: darken($secondary, 15%); border-top-color: darken($secondary, 20%); } From dc883012b82a6c3d749856aa621c07a0ce567bfe Mon Sep 17 00:00:00 2001 From: Mike Jolley Date: Mon, 18 Feb 2019 16:58:16 +0000 Subject: [PATCH 25/26] Missed null check in wc_load_webhooks --- includes/wc-webhook-functions.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/includes/wc-webhook-functions.php b/includes/wc-webhook-functions.php index 88150e391b5..4845889f952 100644 --- a/includes/wc-webhook-functions.php +++ b/includes/wc-webhook-functions.php @@ -143,7 +143,7 @@ function wc_load_webhooks( $status = '', $limit = null ) { $webhook->enqueue(); $loaded ++; - if ( $loaded >= $limit ) { + if ( ! is_null( $limit ) && $loaded >= $limit ) { break; } } From 02ee0f21bb9243b931e8a55675d0c534ebf74a2b Mon Sep 17 00:00:00 2001 From: Claudio Sanches Date: Mon, 18 Feb 2019 16:48:01 -0300 Subject: [PATCH 26/26] Fixed coding standards --- includes/interfaces/class-wc-webhooks-data-store-interface.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/includes/interfaces/class-wc-webhooks-data-store-interface.php b/includes/interfaces/class-wc-webhooks-data-store-interface.php index d80c5f5b937..3d4839de9f0 100644 --- a/includes/interfaces/class-wc-webhooks-data-store-interface.php +++ b/includes/interfaces/class-wc-webhooks-data-store-interface.php @@ -29,7 +29,7 @@ interface WC_Webhook_Data_Store_Interface { * * @since 3.2.0 * @throws InvalidArgumentException If a $status value is passed in that is not in the known wc_get_webhook_statuses() keys. - * @param string $status Optional - status to filter results by. Must be a key in return value of @see wc_get_webhook_statuses(). @since 3.6.0. + * @param string $status Optional - status to filter results by. Must be a key in return value of @see wc_get_webhook_statuses(). @since 3.6.0. * @return int[] */ public function get_webhooks_ids( $status = '' );