workarea-one_theme 1.3.0

data/app/views/workarea/storefront/products/_media.html.haml

@@ -0,0 +1,22 @@
+.product-media
+  - if product.images.length == 0
+    .product-details__primary-image
+      = link_to(product_image_url(product.primary_image, :zoom), target: '_blank', rel: 'noopener', class: 'product-details__primary-image-link', data: { dialog_button: '' }, style: intrinsic_ratio_product_image_styles(product.primary_image)) do
+        = image_tag product_image_url(product.primary_image, :detail), alt: 'View Larger Image', class: 'product-details__primary-image-link-image'
+
+  - else
+    .product-media__primary-image
+      = link_to(product_image_url(product.primary_image, :zoom), target: '_blank', rel: 'noopener', class: 'product-media__primary-image-link', data: { dialog_button: '' }, style: intrinsic_ratio_product_image_styles(product.primary_image)) do
+        %picture
+          %source{ srcset: product_image_url(product.primary_image, :detail), product_image_url(product.primary_image, :detail) => '1x', product_image_url(product.primary_image, :detail_retina) => '2x', media: "(min-width: #{Workarea.config.storefront_break_points[:medium]}px)" }
+          %source{ srcset: product_image_url(product.primary_image, :detail_mobile), product_image_url(product.primary_image, :detail_mobile) => '1x', product_image_url(product.primary_image, :detail_mobile_retina) => '2x' }
+          = image_tag product_image_url(product.primary_image, :detail), alt: t('workarea.storefront.products.image_alt_attribute', name: product.name), class: 'product-media__primary-image-link-image'
+
+    - if product.images.length > 1
+      .product-media__alt-images
+        .grid.grid--center
+          - product.images.each_with_index do |image, index|
+            .grid__cell{ class: product.alt_images_class }
+              .product-media__alt-image
+                - button_class = index == 0 ? 'product-media__alt-image-link product-media__alt-image-link--selected' : 'product-media__alt-image-link'
+                = link_to(image_tag(product_image_url(image, :small_thumb), alt: t('workarea.storefront.products.zoom')), product_image_url(image, :zoom), class: button_class, target: '_blank', rel: 'noopener', data: { alternate_image_button: { src: product_image_url(image, :detail) }.to_json })

data/app/views/workarea/storefront/products/_media_carousel.html.haml

@@ -0,0 +1,25 @@
+.product-media{ class: ('product-media--carousel' unless product.images.length < 2) }
+  .product-media__container
+    - if product.images.length == 0
+      .product-media__primary-image
+        = link_to(product_image_url(product.primary_image, :zoom), target: '_blank', rel: 'noopener', class: 'product-media__primary-image-link', data: { dialog_button: '' }, style: intrinsic_ratio_product_image_styles(product.primary_image)) do
+          = image_tag product_image_url(product.primary_image, :detail), alt: 'View Larger Image', class: 'product-media__primary-image-link-image'
+
+    - else
+      %ul.product-media__primary-image{ id: "#{product.id}_primary_media_carousel", data: { slick_slider: media_primary_image_slider_options(product.id) } }
+        - product.images.each_with_index do |image, index|
+          %li.product-media__primary-image-item
+            = link_to(product_image_url(image, :zoom), target: '_blank', rel: 'noopener', class: 'product-media__primary-image-link', data: { dialog_button: '' }, style: intrinsic_ratio_product_image_styles(product.primary_image)) do
+              %picture
+                %source{ srcset: product_image_url(image, :detail), product_image_url(image, :detail) => '1x', product_image_url(image, :detail_retina) => '2x', media: "(min-width: #{Workarea.config.storefront_break_points[:medium]}px)" }
+                %source{ srcset: product_image_url(image, :detail_mobile), product_image_url(image, :detail_mobile) => '1x', product_image_url(image, :detail_mobile_retina) => '2x' }
+                = image_tag product_image_url(image, :detail), alt: t('workarea.storefront.products.image_alt_attribute', name: product.name), class: 'product-media__primary-image-link-image'
+
+      - if product.images.length > 1
+        %ul.product-media__alt-image-list{ id: "#{product.id}_alt_media_carousel", data: { slick_slider: media_alt_image_slider_options(product.id) } }
+          - product.images.each_with_index do |image, index|
+            %li.product-media__alt-image
+              - button_class = index == 0 ? 'product-media__alt-image-link product-media__alt-image-link--selected' : 'product-media__alt-image-link'
+              = link_to(image_tag(product_image_url(image, :small_thumb), alt: t('workarea.storefront.products.zoom')), product_image_url(image, :zoom), class: button_class, target: '_blank', rel: 'noopener', data: { alternate_image_button: { src: product_image_url(image, :detail) }.to_json })
+
+          = append_partials('storefront.product_details_alt_images', product: product)

data/app/views/workarea/storefront/products/_pricing.html.haml

@@ -0,0 +1,40 @@
+- cache "#{product.cache_key}/prices", expires_in: Workarea.config.cache_expirations.product_pricing_fragment_cache do
+  - if product.one_price?
+    %p.product-prices__price
+      - if product.show_sell_range?
+        %span
+          = number_to_currency(product.sell_min_price)
+        %span – #{number_to_currency product.sell_max_price}
+      - else
+        %span
+          = number_to_currency(product.sell_min_price)
+
+  - else
+
+    %p.product-prices__price.product-prices__price--original
+      - if product.show_original_range?
+        %s #{number_to_currency product.original_min_price} – #{number_to_currency product.original_max_price}
+      - else
+        %s= number_to_currency product.original_min_price
+
+    - if product.on_sale?
+      %p.product-prices__price.product-prices__price--sale
+        - if product.show_sell_range?
+          %span
+            = number_to_currency(product.sell_min_price)
+          %span – #{number_to_currency product.sell_max_price}
+        - else
+          %span
+            = number_to_currency(product.sell_min_price)
+
+    - else
+      %p.product-prices__price
+        - if product.show_sell_range?
+          %span
+            = number_to_currency(product.sell_min_price)
+          %span – #{number_to_currency product.sell_max_price}
+        - else
+          %span
+            = number_to_currency(product.sell_min_price)
+
+  = append_partials('storefront.product_pricing', product: product)

data/app/views/workarea/storefront/products/_reviews.html.haml

@@ -0,0 +1,27 @@
+- if product.has_reviews?
+  #reviews.reviews
+    .reviews__header.grid.grid--middle
+      .grid__cell.grid__cell--50-at-medium
+        .grid.grid--middle.grid--auto
+          .grid__cell
+            %h2.reviews__heading= t('workarea.storefront.reviews.reviews', count: product.reviews.length)
+
+          .grid__cell
+            %p.reviews__write-action= link_to t('workarea.storefront.reviews.write_a_review'), new_product_review_path(product), class: 'button button--wide', data: { dialog_button: '' }
+            - if display_purchase_requirement_message
+              %span.reviews__write-purchase-requirement= t('workarea.storefront.reviews.purchase_requirement')
+      -# Review sort select injected here by product_reviews_sort_menus.js
+
+    %ol.reviews__review-group
+      - product.reviews.each do |review|
+        %li.reviews__review{ data: { product_review_section_entry: { rating: review.rating.to_f, createdAt: review.created_at.to_i }.to_json } }
+          = rating_stars(review.rating)
+
+          %h3.reviews__review-title= review.title
+          %p.reviews__review-body= review.body
+          .reviews__review-meta
+            %p.reviews__review-author
+              %span= review.user_info
+            - if review.verified?
+              %p.reviews__review-verified= t('workarea.storefront.reviews.verified_purchaser')
+            %p.reviews__review-date= local_time(review.created_at, format: :long, itemprop: 'datePublished')

data/app/views/workarea/storefront/products/_subscription_fields.html.haml

@@ -0,0 +1,15 @@
+.grid__cell
+  - if product.subscribable?
+    %div{ data: { subscription_fields: '' } }
+      .button-property
+        .value
+          = check_box_tag :subscription, nil, params[:subscription], id: dom_id(product, 'subscription')
+        = label_tag dom_id(product, 'subscription'), nil, class: 'button-property__name' do
+          %span.button-property__text= t('workarea.storefront.products.subscribe')
+          = link_to t('workarea.storefront.products.subscription_info_link'), subscriptions_path
+
+      .property{ class: ('hidden' unless params[:subscription].present?) }
+        = label_tag :subscription_frequency, nil, class: 'property__name', for: dom_id(product, 'subscription_frequency') do
+          %span.property__text= t('workarea.storefront.products.subscription_frequency_options')
+        .value
+          = select_tag :subscription_frequency, options_for_select(subscription_frequency_options, params[:subscription_frequency]), id: dom_id(product, 'subscription_frequency')

data/app/views/workarea/storefront/products/_summary.html.haml

@@ -0,0 +1,16 @@
+- cache "#{product.cache_key}/summary", expires_in: 75.minutes do
+  .product-summary__media
+    .product-summary__media-container
+      = link_to product_path(product, product.browse_link_options), class: 'product-summary__media-link', style: intrinsic_ratio_product_image_styles(product.primary_image), data: { analytics_product_impression: product_impression_data(product), analytics: product_click_analytics_data(product).to_json } do
+        = image_tag(product_image_url(product.primary_image, :large_thumb), alt: product.name, class: 'product-summary__media-image')
+
+  .product-summary__info
+    %p.product-summary__name= link_to product.name, product_path(product, product.browse_link_options), data: { analytics: product_click_analytics_data(product).to_json }
+
+    .product-prices.product-prices--summary
+      = render 'workarea/storefront/products/pricing', product: product
+
+    = append_partials('storefront.product_summary', product: product)
+
+  .product-summary__overlay
+    = render 'workarea/storefront/products/quickview_button_placeholder', product: product

data/app/views/workarea/storefront/products/_swatch_summary.html.haml

@@ -0,0 +1,17 @@
+- if product.try(:display_browse_swatches?)
+  .swatch-options.swatch-options--small
+    %ul.swatch-options__group
+      - product.browse_swatch_option.selections.each do |selection|
+        - swatch = product.swatches_by_option[selection.optionize]
+        - swatch_content = render_browse_swatch(selection, swatch)
+
+        - if product.current_browse_selection?(selection)
+          %li.swatch-options__swatch.swatch-options__swatch--selected>
+            = swatch_content
+        - else
+          %li.swatch-options__swatch>
+            - selection_options = option_selection_url_for(product, product.browse_swatch_option, selection)
+            - product_path = product_path(product, product.browse_link_options.merge(selection_options))
+
+            = link_to product_path, title: selection, class: 'swatch-options__swatch-button', data: { product_summary_swatch: { url: summary_product_path(product, selection_options) }.to_json } do
+              = swatch_content

data/app/views/workarea/storefront/products/package_show.html.haml

@@ -0,0 +1,46 @@
+- @title = @product.browser_title
+- @breadcrumbs = @product.breadcrumbs
+- params[:sku] = nil # HACK: avoid issues with current_sku
+
+- content_for :head do
+  - cache "#{@product.cache_key}/head", expires_in: 1.hour do
+    %meta{ property: 'recent-view', content: recent_view_content(product_id: @product.id) }
+    %meta{ property: 'global-id', content: @product.to_global_id.to_param }
+    = append_partials('storefront.product_head', product: @product)
+
+    %link{ href: product_path(@product), rel: 'canonical' }
+
+    - unless @product.meta_description.blank?
+      %meta{ name: :description, content: strip_tags(@product.meta_description) }
+
+    %meta{ property: 'og:url', content: url_for }
+    %meta{ property: 'og:title', content: @product.name }
+    %meta{ property: 'og:type', content: 'product' }
+    - @product.images.each do |image|
+      %meta{ property: 'og:image', content: product_image_url(image, :detail) }
+    - unless @product.meta_description.blank?
+      %meta{ property: 'og:description', content: strip_tags(@product.meta_description) }
+
+- cache "#{@product.cache_key}/show", expires_in: 1.hour do
+  .view
+    .product-detail-container.product-detail-container--package{ itemscope: true, itemtype: 'http://schema.org/Product', data: { analytics: product_view_analytics_data(@product).to_json } }
+
+      .product-details{ class: "product-details--#{@product.template}" }
+        = render "workarea/storefront/products/templates/#{@product.template}", product: @product
+
+      .product-detail-packaged-products{ class: "product-detail-packaged-products--#{@product.template}" }
+        - @product.packaged_products.each do |product|
+          .product-detail-container__section
+            .product-details{ class: "product-details--#{product.template}", itemprop: 'isRelatedTo', itemscope: true, itemtype: 'http://schema.org/Product', data: { analytics: product_view_analytics_data(@product).to_json, packaged_product_id: product.id } }
+              = render "workarea/storefront/products/templates/#{product.template}", product: product
+
+      - if @product.recommendations.any?
+        %h2.recommendations__heading= t('workarea.storefront.recommendations.heading')
+
+        .grid{ data: { analytics: product_list_analytics_data('Product Recommendations').to_json } }
+          - @product.recommendations.each do |product|
+            .grid__cell.grid__cell--50.grid__cell--33-at-medium.grid__cell--16-at-wide
+              .product-summary.product-summary--small{ itemprop: 'isRelatedTo', itemscope: true, itemtype: 'http://schema.org/Product' }
+                = render 'workarea/storefront/products/summary', product: product
+
+      = append_partials('storefront.product_show', product: @product)

data/app/views/workarea/storefront/products/show.html.haml

@@ -0,0 +1,53 @@
+- @title = @product.browser_title
+- @breadcrumbs = @product.breadcrumbs
+
+- content_for :head do
+  - cache "#{@product.cache_key}/head", expires_in: 1.hour do
+    %meta{ property: 'global-id', content: @product.to_global_id.to_param }
+    = append_partials('storefront.product_head', product: @product)
+
+    %link{ href: product_url(@product), rel: 'canonical' }
+
+    %meta{ name: :description, content: strip_tags(@product.meta_description) }
+
+    %meta{ property: 'og:url', content: url_for(only_path: false) }
+    %meta{ property: 'og:title', content: @product.name }
+    %meta{ property: 'og:type', content: 'product' }
+    - @product.images.each do |image|
+      %meta{ property: 'og:image', content: product_image_url(image, :detail) }
+      %meta{ property: 'og:image:secure_url', content: product_image_url(image, :detail) }
+    %meta{ property: 'og:description', content: strip_tags(@product.meta_description) }
+
+- cache "#{@product.cache_key}/show", expires_in: 1.hour do
+
+  = render_schema_org(product_schema(@product, related_products: @product.recommendations))
+
+  .view
+    .product-detail-container{ data: { analytics: product_view_analytics_data(@product).to_json } }
+
+      .product-details{ class: "product-details--#{@product.template}" }
+        = render "workarea/storefront/products/templates/#{@product.template}", product: @product
+
+      .product-detail-container__section
+        - if @product.description.present?
+          .product-detail-container__description#description
+            .product-detail-container__description-body!= @product.description
+
+        %p.product-details__id
+          %span{ itemprop: 'productID' }= @product.id
+
+        = append_partials('storefront.product_description', product: @product)
+
+        = render 'workarea/storefront/products/share', product: @product
+
+      - if @product.recommendations.any?
+        .recommendations
+          %h2.recommendations__heading= t('workarea.storefront.recommendations.heading')
+          .recommendations__products
+            .grid.grid--flush{ data: { analytics: product_list_analytics_data('Product Recommendations').to_json } }
+              - @product.recommendations.each do |product|
+                .grid__cell.grid__cell--50.grid__cell--33-at-medium.grid__cell--16-at-wide
+                  .product-summary.product-summary--small
+                    = render 'workarea/storefront/products/summary', product: product
+
+      = append_partials('storefront.product_show', product: @product)

data/app/views/workarea/storefront/products/templates/_generic.html.haml

@@ -0,0 +1,61 @@
+.grid
+  .grid__cell.grid__cell--50-at-medium
+    = render 'workarea/storefront/products/media_carousel', product: product
+
+  .grid__cell.grid__cell--50-at-medium
+    .product-details__name
+      %h1.product-details__heading= product.name
+
+    .product-prices.product-prices--details
+      = render 'workarea/storefront/products/pricing', product: product
+
+    = form_tag cart_items_path, method: 'post', class: 'product-details__add-to-cart-form', data: { dialog_form: { dialogOptions: { closeAll: true, initModules: true } }, analytics: add_to_cart_analytics_data(product).to_json } do
+      = hidden_field_tag :product_id, product.id, id: dom_id(product, 'product_id')
+      = hidden_field_tag :via, params[:via], id: dom_id(product, 'via')
+
+      .grid.grid--middle
+        .grid__cell.grid__cell--60
+          .grid
+            .grid__cell
+              - if product.sku_options.one?
+                = hidden_field_tag :sku, product.sku_options.first.second
+
+              - else
+                .property
+                  = label_tag :sku, nil, class: 'property__name', for: "sku_#{dom_id(product)}" do
+                    %span.property__text= t('workarea.storefront.products.select_options')
+                  .value
+                    = select_tag :sku, options_for_select(product.sku_options, params[:sku]), required: true, id: "sku_#{dom_id(product)}", data: { product_details_sku_select: product.slug }
+
+              = append_partials('storefront.add_to_cart_form', product: product)
+
+            - if product.purchasable?
+              .grid__cell
+                .product-details__quantity
+                  .property
+                    = label_tag :quantity, nil, class: 'property__name', for: "quantity#{dom_id(product)}" do
+                      %span.property__text= t('workarea.storefront.products.quantity')
+                    .quantity-control
+                      = button_tag '-', { type: 'button', data: { quantity_control: { 'direction': 'dec', 'autosubmit': false }.to_json }, class: 'quantity-control__button quantity-control__decrement'}
+                      .value= number_field_tag :quantity, params[:quantity] || 1, class: 'quantity-control__input text-box text-box--x-small', required: true, min: 1, id: "quantity#{dom_id(product)}"
+                      = button_tag '+', { type: 'button', data: { quantity_control: { 'direction': 'inc', 'autosubmit': false }.to_json }, class: 'quantity-control__button quantity-control__increment'}
+
+        .grid__cell
+          - if product.purchasable?
+            %p.product-details__add-to-cart-action= button_tag t('workarea.storefront.products.add_to_cart'), value: 'add_to_cart', class: 'button'
+
+          - else
+            = hidden_field_tag :quantity, params[:quantity] || 1, id: "quantity#{dom_id(product)}"
+            %p.product-details__unavailable= t('workarea.storefront.products.unavailable')
+
+      - if params[:sku].present?
+        %p.product-details__inventory-status= product.inventory_status
+
+
+    - if product.description.present?
+      .product-details__description
+        %p= truncated_product_description(product, t('workarea.storefront.products.read_more'))
+
+    = append_partials('storefront.product_details', product: product)
+
+    %p.product-details__full-details=link_to t('workarea.storefront.products.view_full_details'), product_path(product, color: params[:color]), class: 'text-button'

data/app/views/workarea/storefront/products/templates/_gift_card.html.haml

@@ -0,0 +1,68 @@
+.grid
+  .grid__cell.grid__cell--50-at-medium
+    = render 'workarea/storefront/products/media_carousel', product: product
+
+  .grid__cell.grid__cell--50-at-medium
+
+    .product-details__name
+      %h1.product-details__heading= product.name
+
+      %p.product-details__id
+        %span= product.id
+
+      .product-prices.product-prices--details
+        = render 'workarea/storefront/products/pricing', product: product
+
+      - if product.description.present?
+        .product-details__description
+          %p= truncated_product_description(product, t('workarea.storefront.products.read_more'))
+
+      = form_tag cart_items_path, method: 'post', class: 'product-details__add-to-cart-form', data: { dialog_form: { dialogOptions: { closeAll: true, initModules: true } }, analytics: add_to_cart_analytics_data(product).to_json } do
+        = hidden_field_tag :product_id, product.id, id: dom_id(product, 'product_id')
+        = hidden_field_tag :via, params[:via], id: dom_id(product, 'via')
+
+        - if product.sku_options.one?
+          = hidden_field_tag :sku, product.sku_options.first.second
+
+        - else
+          .property
+            = label_tag :sku, nil, class: 'property__name', for: "sku_#{dom_id(product)}" do
+              %span.property__text= t('workarea.storefront.products.select_options')
+            .value
+              = select_tag :sku, options_for_select(product.sku_options, params[:sku]), required: true, id: "sku_#{dom_id(product)}", data: { product_details_sku_select: product.slug }
+              - if params[:sku].present?
+                .value__note= product.inventory_status
+
+        = hidden_field_tag :quantity, 1, id: "quantity#{dom_id(product)}"
+
+        .message.message--info
+          %p.message__type
+            %span.message__icon= t('workarea.storefront.messages.info')
+          %p.message__text= t('workarea.storefront.gift_cards.email_to_recipient')
+
+        .property
+          = label_tag :email, nil, class: "property__name", for: "email_#{dom_id(product)}" do
+            %span.property__text= t('workarea.storefront.gift_cards.recipients_email')
+          .value= email_field_tag :email, params[:email], class: 'text-box', required: true, id: "email_#{dom_id(product)}"
+        .property
+          = label_tag :from, nil, class: "property__name", for: "from_#{dom_id(product)}" do
+            %span.property__text= t('workarea.storefront.gift_cards.senders_email')
+            %span.property__requirement.property__requirement--optional= t('workarea.storefront.forms.optional')
+          .value= text_field_tag :from, params[:from], class: 'text-box', id: "from_#{dom_id(product)}", maxlength: 100
+        .property
+          = label_tag :message, nil, class: "property__name", for: "message_#{dom_id(product)}" do
+            %span.property__text= t('workarea.storefront.gift_cards.message_to_recipient')
+            %span.property__requirement.property__requirement--optional= t('workarea.storefront.forms.optional')
+          .value= text_area_tag :message, params[:message], class: 'text-box text-box--multi-line', id: "message_#{dom_id(product)}", maxlength: 500
+
+        - if product.purchasable?
+          %p.product-details__add-to-cart-action= button_tag t('workarea.storefront.products.add_to_cart'), value: 'add_to_cart', class: 'button button--large'
+
+        - else
+          %p.product-details__unavailable= t('workarea.storefront.products.unavailable')
+
+        = append_partials('storefront.add_to_cart_form', product: product)
+
+      = append_partials('storefront.product_details', product: product)
+
+      %p.product-details__full-details=link_to t('workarea.storefront.products.view_full_details'), product_path(product, color: params[:color]), class: 'text-button'

data/app/views/workarea/storefront/products/templates/_option_selects.html.haml

@@ -0,0 +1,61 @@
+.grid
+  .grid__cell.grid__cell--50-at-medium
+    = render 'workarea/storefront/products/media_carousel', product: product
+
+  .grid__cell.grid__cell--50-at-medium
+    .product-details__name
+      %h1.product-details__heading= product.name
+
+    .product-prices.product-prices--details
+      = render 'workarea/storefront/products/pricing', product: product
+
+    = form_tag cart_items_path, method: 'post', class: 'product-details__add-to-cart-form', data: { dialog_form: { dialogOptions: { closeAll: true, initModules: true } }, analytics: add_to_cart_analytics_data(product).to_json } do
+      = hidden_field_tag :product_id, product.id, id: dom_id(product, 'product_id')
+      = hidden_field_tag :sku, product.current_sku
+      = hidden_field_tag :via, params[:via], id: dom_id(product, 'via')
+
+      .grid.grid--middle
+        .grid__cell.grid__cell--60
+          .grid
+            .grid__cell
+              - product.options_for_selection.each do |option|
+                .property
+                  = label_tag option.slug, nil, class: 'property__name', for: "#{option.slug}_#{dom_id(product)}" do
+                    %span.property__text= option.name
+                  .value
+                    = select_tag option.slug, options_for_select([[t('workarea.storefront.products.select_option', name: option.name), nil]] + option.selections, option.current), required: true, id: "#{option.slug}_#{dom_id(product)}", data: { product_details_sku_select: product.slug }
+
+              = append_partials('storefront.add_to_cart_form', product: product)
+
+            - if product.purchasable?
+              .grid__cell
+                .product-details__quantity
+                  .property
+                    = label_tag :quantity, nil, class: 'property__name', for: "quantity#{dom_id(product)}" do
+                      %span.property__text= t('workarea.storefront.products.quantity')
+                    .quantity-control
+                      = button_tag '-', { type: 'button', data: { quantity_control: { 'direction': 'dec', 'autosubmit': false }.to_json }, class: 'quantity-control__button quantity-control__decrement'}
+                      .value= number_field_tag :quantity, params[:quantity] || 1, class: 'quantity-control__input text-box text-box--x-small', required: true, min: 1, id: "quantity#{dom_id(product)}"
+                      = button_tag '+', { type: 'button', data: { quantity_control: { 'direction': 'inc', 'autosubmit': false }.to_json }, class: 'quantity-control__button quantity-control__increment'}
+
+                - unless product.currently_selected_options.blank?
+                  = link_to t('workarea.storefront.products.clear_selections'), product_path(product), data: { option_button: '' }
+
+              .grid__cell
+                %p.product-details__add-to-cart-action= button_tag t('workarea.storefront.products.add_to_cart'), value: 'add_to_cart', class: 'button'
+
+            - else
+              .grid__cell
+                = hidden_field_tag :quantity, params[:quantity] || 1, id: "quantity#{dom_id(product)}"
+                %p.product-details__unavailable= t('workarea.storefront.products.unavailable')
+
+          - if product.current_sku.present?
+            %p.product-details__inventory-status= product.inventory_status
+
+    - if product.description.present?
+      .product-details__description
+        %p= truncated_product_description(product, t('workarea.storefront.products.read_more'))
+
+    = append_partials('storefront.product_details', product: product)
+
+    %p.product-details__full-details=link_to t('workarea.storefront.products.view_full_details'), product_path(product, color: params[:color]), class: 'text-button'