From 4e1ea5184e06b07c818d2e1907bba3fe73d7d43f Mon Sep 17 00:00:00 2001 From: raicem Date: Wed, 22 Nov 2023 10:28:29 +0300 Subject: [PATCH] Marketplace: fix the number of cards in the number of results page Co-authored-by: andfinally --- .../product-list-content.scss | 15 ++++++++++----- 1 file changed, 10 insertions(+), 5 deletions(-) diff --git a/plugins/woocommerce-admin/client/marketplace/components/product-list-content/product-list-content.scss b/plugins/woocommerce-admin/client/marketplace/components/product-list-content/product-list-content.scss index 57d64ae6d5a..39ddb363efe 100644 --- a/plugins/woocommerce-admin/client/marketplace/components/product-list-content/product-list-content.scss +++ b/plugins/woocommerce-admin/client/marketplace/components/product-list-content/product-list-content.scss @@ -21,9 +21,10 @@ grid-template-columns: repeat(2, 1fr); } - // Hide third and above product cards on Discover and search results page due to API result count - // These are progressively displayed at larger screen sizes. - &__discover .woocommerce-marketplace__product-card:nth-child(n+3) { + // Hide third and above product cards on Discover and suggestions on "no results" search results page + // due to item count. We display progressively more on larger screen sizes. + &__discover .woocommerce-marketplace__product-card:nth-child(n+3), + &__no-results .woocommerce-marketplace__product-card:nth-child(n+3) { display: none; } } @@ -35,7 +36,9 @@ gap: $large-gap; grid-template-columns: repeat(3, 1fr); } - &__discover .woocommerce-marketplace__product-card:nth-child(3) { + + &__discover .woocommerce-marketplace__product-card:nth-child(3), + &__no-results .woocommerce-marketplace__product-card:nth-child(3) { display: block; } } @@ -46,7 +49,9 @@ &__product-list-content { grid-template-columns: repeat(4, 1fr); } - &__discover .woocommerce-marketplace__product-card:nth-child(4) { + + &__discover .woocommerce-marketplace__product-card:nth-child(4), + &__no-results .woocommerce-marketplace__product-card:nth-child(4) { display: block; } }