rename gallery.js to dialog.js, keep close string in meta.js
This commit is contained in:
parent
37cdc1915b
commit
a063d227d3
3 changed files with 7 additions and 2 deletions
|
|
@ -58,6 +58,9 @@ export const details = {
|
||||||
expand: 'expand all',
|
expand: 'expand all',
|
||||||
collapse: 'collapse all'
|
collapse: 'collapse all'
|
||||||
};
|
};
|
||||||
|
export const dialog = {
|
||||||
|
close: 'Close'
|
||||||
|
};
|
||||||
export const navigation = {
|
export const navigation = {
|
||||||
navLabel: 'Menu',
|
navLabel: 'Menu',
|
||||||
ariaTop: 'Main',
|
ariaTop: 'Main',
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,7 @@
|
||||||
<div class="gallery | grid mt-l-xl" role="list">
|
<div class="gallery | grid mt-l-xl" role="list">
|
||||||
{%- for item in gallery -%}
|
{%- for item in gallery -%}
|
||||||
<dialog class="flow modal{{ loop.index }}">
|
<dialog class="flow modal{{ loop.index }}">
|
||||||
<button class="button" autofocus>Close</button>
|
<button class="button" autofocus>{{ meta.dialog.close }}</button>
|
||||||
{%- image item.image, item.alt, item.caption -%}
|
{%- image item.image, item.alt, item.caption -%}
|
||||||
</dialog>
|
</dialog>
|
||||||
<button data-index="{{ loop.index }}">{%- image item.image, item.alt -%}</button>
|
<button data-index="{{ loop.index }}">{%- image item.image, item.alt -%}</button>
|
||||||
|
|
@ -14,6 +14,6 @@
|
||||||
{% endcss %}
|
{% endcss %}
|
||||||
|
|
||||||
{% js "defer" %}
|
{% js "defer" %}
|
||||||
{% include "scripts/gallery.js" %}
|
{% include "scripts/dialog.js" %}
|
||||||
{% endjs %}
|
{% endjs %}
|
||||||
</is-land>
|
</is-land>
|
||||||
|
|
|
||||||
|
|
@ -1,3 +1,5 @@
|
||||||
|
// manages the behavior of modal several dialogs on a page: open / close buttons and light dismiss.
|
||||||
|
|
||||||
const buttons = document.querySelectorAll('button[data-index]');
|
const buttons = document.querySelectorAll('button[data-index]');
|
||||||
const modals = document.querySelectorAll('dialog');
|
const modals = document.querySelectorAll('dialog');
|
||||||
const closeButtons = document.querySelectorAll('dialog button');
|
const closeButtons = document.querySelectorAll('dialog button');
|
||||||
Loading…
Reference in a new issue