Skip to content

Commit addf6dc

Browse files
mnyropmnyrop
committed
fix carousel widths, turn autoplay off
1 parent 8c6d442 commit addf6dc

File tree

8 files changed

+363
-198
lines changed

8 files changed

+363
-198
lines changed

‎.tool-versions

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
nodejs 23.11.0

‎package-lock.json

Lines changed: 343 additions & 184 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@
3535
"@lhci/cli": "^0.14.0",
3636
"@untitaker/hyperlink": "^0.1.32",
3737
"clean-css": "^5.2.4",
38-
"flickity": "^3.0.0",
38+
"flickity": "^2.3.0",
3939
"itemsjs": "^2.1.25",
4040
"leaflet": "^1.9.4",
4141
"leaflet-iiif": "^3.0.0",

‎site/_includes/components/heros/exhibits-carousel.html

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,16 +5,16 @@ <h2 class="text-center text-4xl tracking-tight font-bold pb-2">Explore the Exhib
55
</div>
66
<div class="mx-auto text-center">
77
<button aria-label="navigate previous exhibits" id="prev-exhibit" class="h-8 w-8 md:h-12 md:w-12 md:-mr-2 text-accent hover:text-neutral-content tooltip tooltip-left" data-tip="Previous">{% include "svg/arrow-left.svg" %}</button>
8-
<button aria-label="start autoplay exhibits" id="play-exhibit" class="hidden h-8 w-8 md:h-12 md:w-12 md:-mr-2 text-accent hover:text-neutral-content tooltip tooltip-bottom" data-tip="Autoplay">
8+
<button aria-label="start autoplay exhibits" id="play-exhibit" class="h-8 w-8 md:h-12 md:w-12 md:-mr-2 text-accent hover:text-neutral-content tooltip tooltip-bottom" data-tip="Autoplay">
99
{% include "svg/play.svg" %}
1010
</button>
11-
<button aria-label="stop autoplay exhibits" id="pause-exhibit" class="h-8 w-8 md:h-12 md:w-12 md:-mr-2 text-accent hover:text-neutral-content tooltip tooltip-bottom" data-tip="Pause">
11+
<button aria-label="stop autoplay exhibits" id="pause-exhibit" class="hidden h-8 w-8 md:h-12 md:w-12 md:-mr-2 text-accent hover:text-neutral-content tooltip tooltip-bottom" data-tip="Pause">
1212
{% include "svg/pause.svg" %}
1313
</button>
1414
<button aria-label="navigate next exhibits" id="next-exhibit" class="h-8 w-8 md:h-12 md:w-12 text-accent hover:text-neutral-content tooltip tooltip-right" data-tip="Next">{% include "svg/arrow-right.svg" %}</button>
1515
</div>
1616
<div class="hero block">
17-
<div class="hero-content mx-auto">
17+
<div class="hero-content w-full mx-auto">
1818
<div id="exhibits-carousel" class="w-full">
1919
{%- for exhibit in collections.exhibit-en -%}
2020
<div class="p-4 lg:w-1/3 sm:w-1/2 w-full">
@@ -39,8 +39,9 @@ <h2 class="text-center text-4xl tracking-tight font-bold pb-2">Explore the Exhib
3939
pageDots: false,
4040
lazyLoad: true,
4141
pauseAutoPlayOnHover: false,
42-
autoPlay: 3200
42+
autoPlay: 2600,
4343
});
44+
exhibitCarousel.pausePlayer();
4445

4546
prevExhibitButton.addEventListener('click', () => exhibitCarousel.previous());
4647
nextExhibitButton.addEventListener('click', () => exhibitCarousel.next());

‎site/_includes/components/heros/items-carousel.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<div class="hero block not-prose bg-neutral text-neutral-content mx-[calc(50%-50vw)] my-12 w-auto">
2-
<div class="hero-content mx-auto">
2+
<div class="hero-content w-full mx-auto">
33
{% include "components/items/carousel.html" %}
44
</div>
55
</div>

‎site/_includes/components/heros/oh-carousel.html

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,16 +5,16 @@ <h2 class="text-center text-4xl tracking-tight font-bold pb-2">Oral Histories</h
55
</div>
66
<div class="mx-auto text-center">
77
<button aria-label="navigate previous oral histories" id="prev-oh" class="h-8 w-8 md:h-12 md:w-12 md:-mr-2 text-accent hover:text-neutral-content tooltip tooltip-left" data-tip="Previous">{% include "svg/arrow-left.svg" %}</button>
8-
<button aria-label="start autoplay oral histories" id="play-oh" class="hidden h-8 w-8 md:h-12 md:w-12 md:-mr-2 text-accent hover:text-neutral-content tooltip tooltip-bottom" data-tip="Autoplay">
8+
<button aria-label="start autoplay oral histories" id="play-oh" class="h-8 w-8 md:h-12 md:w-12 md:-mr-2 text-accent hover:text-neutral-content tooltip tooltip-bottom" data-tip="Autoplay">
99
{% include "svg/play.svg" %}
1010
</button>
11-
<button aria-label="stop autoplay oral histories" id="pause-oh" class="h-8 w-8 md:h-12 md:w-12 md:-mr-2 text-accent hover:text-neutral-content tooltip tooltip-bottom" data-tip="Pause">
11+
<button aria-label="stop autoplay oral histories" id="pause-oh" class="hidden h-8 w-8 md:h-12 md:w-12 md:-mr-2 text-accent hover:text-neutral-content tooltip tooltip-bottom" data-tip="Pause">
1212
{% include "svg/pause.svg" %}
1313
</button>
1414
<button aria-label="navigate next oral histories" id="next-oh" class="h-8 w-8 md:h-12 md:w-12 text-accent hover:text-neutral-content tooltip tooltip-right" data-tip="Next">{% include "svg/arrow-right.svg" %}</button>
1515
</div>
1616
<div class="hero block">
17-
<div class="hero-content mx-auto">
17+
<div class="hero-content w-full mx-auto">
1818
<div id="oh-carousel" class="w-full">
1919
{%- for history in oral-histories -%}
2020
<div class="p-4 lg:w-1/4 md:w-1/3 sm:w-1/2 w-full">
@@ -39,8 +39,9 @@ <h2 class="text-center text-4xl tracking-tight font-bold pb-2">Oral Histories</h
3939
pageDots: false,
4040
lazyLoad: true,
4141
pauseAutoPlayOnHover: false,
42-
autoPlay: 3000
42+
autoPlay: 2600
4343
});
44+
ohCarousel.pausePlayer();
4445

4546
prevOHButton.addEventListener('click', () => ohCarousel.previous());
4647
nextOHButton.addEventListener('click', () => ohCarousel.next());

‎site/_includes/components/items/carousel.html

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,10 @@ <h2 class="text-center text-4xl tracking-tight font-bold pb-2">Archival Material
55
</div>
66
<div class="mx-auto text-center pb-6">
77
<button aria-label="navigate previous items" id="prev-item" class="h-8 w-8 md:h-12 md:w-12 md:-mr-2 text-accent hover:text-neutral-content tooltip tooltip-left" data-tip="Previous">{% include "svg/arrow-left.svg" %}</button>
8-
<button aria-label="start autoplay items" id="play-item" class="hidden h-8 w-8 md:h-12 md:w-12 md:-mr-2 text-accent hover:text-neutral-content tooltip tooltip-bottom" data-tip="Autoplay">
8+
<button aria-label="start autoplay items" id="play-item" class="h-8 w-8 md:h-12 md:w-12 md:-mr-2 text-accent hover:text-neutral-content tooltip tooltip-bottom" data-tip="Autoplay">
99
{% include "svg/play.svg" %}
1010
</button>
11-
<button aria-label="stop autoplay items" id="pause-item" class="h-8 w-8 md:h-12 md:w-12 md:-mr-2 text-accent hover:text-neutral-content tooltip tooltip-bottom" data-tip="Pause">
11+
<button aria-label="stop autoplay items" id="pause-item" class="hidden h-8 w-8 md:h-12 md:w-12 md:-mr-2 text-accent hover:text-neutral-content tooltip tooltip-bottom" data-tip="Pause">
1212
{% include "svg/pause.svg" %}
1313
</button>
1414
<button aria-label="navigate next items" id="next-item" class="h-8 w-8 md:h-12 md:w-12 text-accent hover:text-neutral-content tooltip tooltip-right" data-tip="Next">{% include "svg/arrow-right.svg" %}</button>
@@ -33,10 +33,11 @@ <h2 class="text-center text-4xl tracking-tight font-bold pb-2">Archival Material
3333
imagesLoaded: true,
3434
prevNextButtons: false,
3535
pageDots: false,
36-
// lazyLoad: true,
36+
lazyLoad: true,
3737
pauseAutoPlayOnHover: false,
38-
autoPlay: 2800
38+
autoPlay: 2600
3939
});
40+
itemCarousel.pausePlayer();
4041

4142
prevItemButton.addEventListener('click', () => itemCarousel.previous());
4243
nextItemButton.addEventListener('click', () => itemCarousel.next());

‎site/_includes/partials/head.html

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,9 @@
4040
<link rel="icon" href="{{ '/assets/favicon.png' | url }}" type="image/png">
4141
<script src="https://cdn.jsdelivr.net/npm/[email protected]/index.js" defer></script>
4242
<script src="{{ '/assets/vendor/flickity.min.js' | url }}"></script>
43+
<!-- <script src="https://unpkg.com/flickity@2/dist/flickity.pkgd.min.js"></script> -->
4344
<link rel="stylesheet" href="{{ '/assets/vendor/flickity.min.css' | url }}"/>
45+
<!-- <link rel="stylesheet" href="https://unpkg.com/flickity@2/dist/flickity.min.css"> -->
4446
</head>
4547

4648

0 commit comments

Comments
 (0)