Skip to content

Tackl 5.2.1

Latest

Choose a tag to compare

@joebentaylor1995 joebentaylor1995 released this 11 Oct 12:53
· 9 commits to main since this release
86b3cae

Tackl 5.2.1: touch scrolling fix

Upgrade if your site is on 5.x. Before this fix, pages couldn't be scrolled on phones or tablets.

Fixes

  • Touch scrolling works on phones again. The Lenis scroll wrapper (.lenis in src/css/global.scss) was set to overflow: hidden. Lenis smooths mouse-wheel scrolling but leaves touch to the browser, so on touch devices the page couldn't scroll at all. The wrapper is now overflow-y: auto, and its scrollbar stays hidden as before. The nested-wrapper setup that keeps the iOS toolbar stable is unchanged, and desktop smooth scrolling works as before.

Landing page

  • New hero for the demo landing page (DeleteMe). The hero background is now "Spotlight": the 12-column grid drawn as a blueprint in the dark. A torch follows the pointer and lights the grid around it. A click or tap sends a wave of light rolling out across the grid.

    The shader is fed the real grid columns measured from the page, so it lines up at every breakpoint. It keeps the existing performance safeguards:

    • it runs on GSAP's shared ticker;
    • it only animates after the visitor's first interaction, and pauses off-screen;
    • it stops itself on slow devices;
    • it shows a still frame with reduced motion turned on.

    As before, delete src/components/DeleteMe to start your own site.

Upgrading from 5.2.0

In src/css/global.scss, replace the .lenis rule with:

.lenis {
	position: relative;
	width: 100%;
	height: 100dvh;
	overflow-y: auto;
	overscroll-behavior: none;
	scrollbar-width: none;

	&::-webkit-scrollbar {
		display: none;
	}
}

The CLI is unchanged at 2.5.0. bunx tackl scaffolds from the latest release, so new projects get 5.2.1 automatically.

Full changes: #27 · 5.2.0…5.2.1