24-1: public design foundation (stylesheet, script, fonts, layout) — implemented, QA Review
Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,13 @@
|
||||
import * as reveal from './site/reveal.js';
|
||||
import * as progress from './site/progress.js';
|
||||
|
||||
const modules = [reveal, progress];
|
||||
|
||||
document.addEventListener('livewire:navigated', () => {
|
||||
document.body.classList.add('js');
|
||||
modules.forEach((m) => m.init());
|
||||
});
|
||||
|
||||
document.addEventListener('livewire:navigating', () => {
|
||||
modules.forEach((m) => m.destroy());
|
||||
});
|
||||
@@ -0,0 +1,22 @@
|
||||
let onScroll = null;
|
||||
|
||||
export function init() {
|
||||
const bar = document.querySelector('.site-progress');
|
||||
const nav = document.getElementById('site-nav');
|
||||
|
||||
onScroll = () => {
|
||||
const max = document.documentElement.scrollHeight - window.innerHeight;
|
||||
const p = max > 0 ? window.scrollY / max : 1;
|
||||
|
||||
if (bar) bar.style.transform = `scaleX(${p})`;
|
||||
nav?.classList.toggle('scrolled', window.scrollY > 8);
|
||||
};
|
||||
|
||||
window.addEventListener('scroll', onScroll, { passive: true });
|
||||
onScroll();
|
||||
}
|
||||
|
||||
export function destroy() {
|
||||
if (onScroll) window.removeEventListener('scroll', onScroll);
|
||||
onScroll = null;
|
||||
}
|
||||
@@ -0,0 +1,26 @@
|
||||
let observer = null;
|
||||
|
||||
export function init() {
|
||||
const items = document.querySelectorAll('[data-reveal]');
|
||||
|
||||
if (window.matchMedia('(prefers-reduced-motion: reduce)').matches) {
|
||||
items.forEach((el) => el.classList.add('in'));
|
||||
return;
|
||||
}
|
||||
|
||||
observer = new IntersectionObserver((entries) => {
|
||||
entries.forEach((entry) => {
|
||||
if (entry.isIntersecting) {
|
||||
entry.target.classList.add('in');
|
||||
observer.unobserve(entry.target);
|
||||
}
|
||||
});
|
||||
}, { rootMargin: '0px 0px -8% 0px' });
|
||||
|
||||
items.forEach((el) => observer.observe(el));
|
||||
}
|
||||
|
||||
export function destroy() {
|
||||
observer?.disconnect();
|
||||
observer = null;
|
||||
}
|
||||
Reference in New Issue
Block a user