Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Fix shadow being cut on featured collection slider, featured blog slider and collection list slider #1961

Merged
merged 6 commits into from
Sep 14, 2022
Merged

Fix shadow being cut on featured collection slider, featured blog slider and collection list slider #1961

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
97171f4
Fix shadow being cut on feat collection slider
sofiamatulis Sep 13, 2022
6220a4b
Missing commit
sofiamatulis Sep 13, 2022
dcb3549
Remove file
sofiamatulis Sep 13, 2022
ef33839
Merge branch 'main' into fix-shadow-variable-set
sofiamatulis Sep 13, 2022
dfae13c
Rename
sofiamatulis Sep 14, 2022
365b764
Add class
sofiamatulis Sep 14, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 5 additions & 3 deletions assets/base.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -156,7 +156,7 @@
}

.product-card-wrapper .card,
.contains-product-card {
.contains-card--product {
--border-radius: var(--product-card-corner-radius);
--border-width: var(--product-card-border-width);
--border-opacity: var(--product-card-border-opacity);
Expand All @@ -169,7 +169,8 @@
--text-alignment: var(--product-card-text-alignment);
}

.collection-card-wrapper .card {
.collection-card-wrapper .card,
.contains-card--collection {
--border-radius: var(--collection-card-corner-radius);
--border-width: var(--collection-card-border-width);
--border-opacity: var(--collection-card-border-opacity);
Expand All @@ -182,7 +183,8 @@
--text-alignment: var(--collection-card-text-alignment);
}

.article-card-wrapper .card {
.article-card-wrapper .card,
.contains-card--article {
--border-radius: var(--blog-card-corner-radius);
--border-width: var(--blog-card-border-width);
--border-opacity: var(--blog-card-border-opacity);
Expand Down
2 changes: 1 addition & 1 deletion sections/collection-list.liquid
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@
{%- endunless -%}

<slider-component class="slider-mobile-gutter">
<ul class="collection-list contains-card{% if settings.card_style == 'standard' %} contains-card--standard{% endif %} grid grid--{{ section.settings.columns_desktop }}-col-desktop grid--{{ section.settings.columns_mobile }}-col-tablet-down{% if section.settings.swipe_on_mobile %} slider slider--tablet grid--peek{% endif %} collection-list--{{ section.blocks.size }}-items"
<ul class="collection-list contains-card contains-card--collection{% if settings.card_style == 'standard' %} contains-card--standard{% endif %} grid grid--{{ section.settings.columns_desktop }}-col-desktop grid--{{ section.settings.columns_mobile }}-col-tablet-down{% if section.settings.swipe_on_mobile %} slider slider--tablet grid--peek{% endif %} collection-list--{{ section.blocks.size }}-items"
id="Slider-{{ section.id }}"
role="list"
>
Expand Down
2 changes: 1 addition & 1 deletion sections/featured-blog.liquid
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@
{%- if section.settings.blog != blank and section.settings.blog.articles_count > 0 -%}
<slider-component class="slider-mobile-gutter">
<ul id="Slider-{{ section.id }}"
class="blog__posts articles-wrapper contains-card{% if settings.card_style == 'standard' %} contains-card--standard{% endif %} grid grid--peek grid--2-col-tablet grid--{{ section.settings.columns_desktop }}-col-desktop slider {% if posts_displayed > 2 %}slider--tablet{% else %}slider--mobile{% endif %}"
class="blog__posts articles-wrapper contains-card contains-card--article{% if settings.card_style == 'standard' %} contains-card--standard{% endif %} grid grid--peek grid--2-col-tablet grid--{{ section.settings.columns_desktop }}-col-desktop slider {% if posts_displayed > 2 %}slider--tablet{% else %}slider--mobile{% endif %}"
role="list"
>
{%- for article in section.settings.blog.articles limit: section.settings.post_limit -%}
Expand Down
2 changes: 1 addition & 1 deletion sections/featured-collection.liquid
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,7 @@
</div>

<slider-component class="slider-mobile-gutter{% if section.settings.full_width %} slider-component-full-width{% endif %}{% if show_mobile_slider == false %} page-width{% endif %}{% if show_desktop_slider == false and section.settings.full_width == false %} page-width-desktop{% endif %}{% if show_desktop_slider %} slider-component-desktop{% endif %}">
<ul id="Slider-{{ section.id }}" class="grid product-grid contains-card{% if settings.card_style == 'standard' %} contains-card--standard{% endif %} grid--{{ section.settings.columns_desktop }}-col-desktop{% if section.settings.collection == blank %} grid--2-col-tablet-down{% else %} grid--{{ section.settings.columns_mobile }}-col-tablet-down{% endif %}{% if show_mobile_slider or show_desktop_slider %} slider{% if show_desktop_slider %} slider--desktop{% endif %}{% if show_mobile_slider %} slider--tablet grid--peek{% endif %}{% endif %}" role="list" aria-label="{{ 'general.slider.name' | t }}">
<ul id="Slider-{{ section.id }}" class="grid product-grid contains-card contains-card--product{% if settings.card_style == 'standard' %} contains-card--standard{% endif %} grid--{{ section.settings.columns_desktop }}-col-desktop{% if section.settings.collection == blank %} grid--2-col-tablet-down{% else %} grid--{{ section.settings.columns_mobile }}-col-tablet-down{% endif %}{% if show_mobile_slider or show_desktop_slider %} slider{% if show_desktop_slider %} slider--desktop{% endif %}{% if show_mobile_slider %} slider--tablet grid--peek{% endif %}{% endif %}" role="list" aria-label="{{ 'general.slider.name' | t }}">
{%- for product in section.settings.collection.products limit: section.settings.products_to_show -%}
<li id="Slide-{{ section.id }}-{{ forloop.index }}" class="grid__item{% if show_mobile_slider or show_desktop_slider %} slider__slide{% endif %}">
{% render 'card-product',
Expand Down
2 changes: 1 addition & 1 deletion sections/main-product.liquid
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -725,7 +725,7 @@
{%- endif -%}
<slideshow-component class="slider-mobile-gutter">
{%- assign number_of_slides = recommendations.products_count | plus: 0.0 | divided_by: block.settings.products_per_page | ceil -%}
<div id="Slider-{{ block.id }}" class="contains-product-card complementary-slider grid grid--1-col slider slider--everywhere" role="list"{% if number_of_slides > 1 %} aria-label="{{ 'general.slider.name' | t }}"{% endif %}>
<div id="Slider-{{ block.id }}" class="contains-card contains-card--product complementary-slider grid grid--1-col slider slider--everywhere" role="list"{% if number_of_slides > 1 %} aria-label="{{ 'general.slider.name' | t }}"{% endif %}>
{%- for i in (1..number_of_slides) -%}
<div id="Slide-{{ block.id }}-{{ forloop.index }}" class="complementary-slide complementary-slide--{{ settings.card_style }} grid__item slider__slide slideshow__slide" tabindex="-1" role="group"{% if number_of_slides > 1 %} aria-roledescription="{{ 'sections.slideshow.slide' | t }}" aria-label="{{ forloop.index }} {{ 'general.slider.of' | t }} {{ forloop.length }}"{% endif %}>
<ul class="list-unstyled" role="list">
Expand Down