Make the product title a link to the product page.

Shopify · May 27, 2024 · 682c02e · 682c02e
1 parent da18752
commit 682c02e
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 2 deletions.
diff --git a/assets/quick-add.css b/assets/quick-add.css
@@ -134,6 +134,11 @@
   padding-left: 1rem;
 }
 
+.quick-add-modal__content-info--bulk-details > a:hover {
+  color: rgb(var(--color-foreground));
+  text-decoration: underline;
+}
+
 @media screen and (min-width: 990px) {
   .quick-add-modal__content-info--bulk .quick-add__product-media,
   .quick-add-modal__content-info--bulk .quick-add__product-container,

diff --git a/snippets/card-product.liquid b/snippets/card-product.liquid
@@ -495,8 +495,17 @@
                     </div>
                     <div>
                       <div class="quick-add-modal__content-info--bulk-details small-hide medium-hide">
-                        <h3 class="h2">{{ card_product.title | escape }}</h3>
-                        {% render 'price', product: card_product, price_class: '', show_compare_at_price: true %}
+                        <a
+                          href="{{ card_product.url }}"
+                          id="StandardCardNoMediaLink-{{ section_id }}-{{ card_product.id }}"
+                          class="full-unstyled-link"
+                          aria-labelledby="StandardCardNoMediaLink-{{ section_id }}-{{ card_product.id }} NoMediaStandardBadge-{{ section_id }}-{{ card_product.id }}"
+                        >
+                          <h3 class="h2">
+                            {{ card_product.title | escape }}
+                          </h3>
+                          {% render 'price', product: card_product, price_class: '', show_compare_at_price: true %}
+                        </a>
                         {%- if card_product.quantity_price_breaks_configured? -%}
                           <div class="card__information-volume-pricing-note">
                             <span class="caption">{{ 'products.product.volume_pricing.note' | t }}</span>