Skip to content

Instantly share code, notes, and snippets.

View collection promotional box
{% if forloop.index == 2 and section.settings.collection-ad-text_richtext != '' or forloop.index == 2 and section.settings.collection-image %}
<div id="gridparentad" class="grid__item collection-ad-mobile margin-B-M {{ collection_products_per_row }} quarter-width product-square-grid-ad medium--one-half ff small--one-whole product-grid-square">
<div id="dummy"></div>
<div class="{%if section.settings.collection-image == blank %} collection-page-ad{% endif %}
card-shadow collection-product collection-box-1
{%if section.settings.collection-image != blank %}grid__image col-image{%endif%}
" id="element">
{%if section.settings.collection-image%}
{%if section.settings.collection-ad-link != blank%}
<a href="{{section.settings.collection-ad-link}}">
View mobile hero image
{% if section.settings.mobile_slideshow == 'hero' %}
<div class="grid__item medium-down--show mobile-hero--wrapper large--hide medium--one-whole small--one-whole two-fifths-width ">
<div class="hero-container">
{% if section.settings.mobile_masonry_hero != blank %}
<img src="{{ section.settings.mobile_masonry_hero | img_url: "1920x"}}">
{% else %}
<img src="{{ section.settings.mobile_masonry_hero | img_url: "1920x"}}">
{{ "banner-placeholder.png" | asset_url }}
{% endif %}
View header.liquid
<!-- /sections/header.liquid -->
{%assign overlay_color = section.settings.mega-nav-overlay-color%}
{%assign overlay_opacity = section.settings.mega-nav-overlay-opacity | times: 0.01 %}
{% assign logo_location = section.settings.logo-location %}
<style>
.header-logo a.site-header__logo-image{
width:{{section.settings.logo_max_width}}px;
height:100%;
}
@media screen and (max-width:998px){
View product-brand-features.liquid
<!-- /sections/product-brand-features.liquid -->
<!-- Desktop -->
{% for block in section.blocks %}
{% case block.type %}
{% when 'image' %}
<div class="grid--full card-shadow {% if block.settings.id == "left" %}feature-flex{% else %}feature-flex-right{% endif %} product-related-items home-reveal">
{% if block.settings.id == 'left' %}
{% if block.settings.image == blank %}
<div class="grid__item large--one-half left-image placeholder-features "></div>
{% else %}
View Unique Collection Ads
<!-- /sections/collection-template.liquid -->
<style>
.grid__image img {
{% if section.settings.collection-product-size %}
object-fit: cover;
height: 100%;
width: 100%;
{% else %}
object-fit: contain;
height: 100%;
View Smart Button scss Modular
//Smart Button styles
.shopify-payment-button {
margin-top: 15px;
padding-bottom: 28px;
width: 200px;
}
@media screen and (max-width: $med) {
.shopify-payment-button {
margin-right: auto;
View Smart Button scss Palo Alto
//Smart Button styles
.additional-checkout-buttons {
margin-top:10px;
button {
margin-left: 0px;
margin-right: 10px;
margin-bottom: 10px;
}
}
.additional-checkout-button+.additional-checkout-button {margin-left: 0px;}
View fonts
$headerFontStack: 'myFirstFont';
$bodyFontStack: 'myFirstFont';
$baseFontSize: round(14px {{ settings.body_text_size }}); // Henseforth known as 1em
$headingfont: 'myFirstFont';
$buttonfont: 'myFirstFont';
$accent_font: 'myFirstFont';
View header.liquid
{% comment %} Settings Slide Out Navigation {% endcomment %}
{% assign menuPrimary = section.settings.menu_1_list %}
{% assign menuSecondary = section.settings.menu_2_list %}
{% if section.settings.show_announcement %}
{% include 'announcement-bar' %}
{% endif %}
<style>
.main-logo .logo {max-width: {{ section.settings.logo_max_width | append: 'px' }}; }
</style>
View related products