This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"type": "color", | |
"id": "announcement_bar_color", | |
"label": "Background color", | |
"default": "#000000" | |
}, |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"type": "text", | |
"id": "text", | |
"label": "Announcement text", | |
"default": "Announce something here" | |
}, | |
{ | |
"type": "url", | |
"id": "link", | |
"label": "Announcement link" |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{%- if section.settings.link == blank -%} | |
<div class="announcement-bar"> | |
{%- else -%} | |
<a href="{{ section.settings.link }}" > | |
{%- endif -%} | |
<p class="announcement-bar__message">{{ section.settings.text | escape }}</p> | |
{%- if section.settings.link == blank -%} | |
</div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{% schema %} | |
{ | |
"name": "Announcement bar", | |
"settings": [ | |
{ | |
"type": "checkbox", | |
"id": "show_announcement", | |
"label": "Show announcement", | |
"default": false | |
}, |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{%- if section.settings.show_announcement -%} | |
{%- if section.settings.home_page_only == false or template.name == 'index' -%} | |
<div class="announcement-bar"> | |
<p class="announcement-bar__message"></p> | |
</div> | |
{%- endif -%} | |
{%- endif -%} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
.image-container { | |
display: -ms-grid; | |
display: grid; | |
grid-gap: 30px; | |
-ms-grid-columns: 200px 30px auto; | |
grid-template-columns: 480px auto; | |
} | |
.image-details { | |
position: relative; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
new Drift(document.querySelector('.image-zoom'), { | |
paneContainer: document.querySelector('.image-details') | |
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div class=”image-container”> | |
<img class=”image-zoom” src=”{{ featured_image | img_url: '480x480' }}” alt="{{ image.alt | escape }} data-zoom="{{ featured_image | img_url: '1024x1024', scale: 2 }}> | |
<div class="image-details"></div> | |
</div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import Drift from 'drift-zoom'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
"label": { | |
"de": "Logo-Foto", | |
"en": "Logo image", | |
"es": "Logotipo", | |
"fr": "Image du logo", | |
"it": "Immagine del logo", | |
"ja": "ロゴ画像", | |
"pt-BR": "Imagem do logotipo" | |
} |