/* scroll-to-top for dev.css v6, a lightweight CSS framework - https://tangled.org/devins.page/dev.css */
/* about: shows a "scroll to top" button in the bottom right corner of the screen when scrolling */

if (!document.querySelector(".dc-scroll-to-top")) {
	const style = document.createElement("style");
	style.textContent = `
		.dc-scroll-to-top {
			transition: opacity 0.25s;
			opacity: 0;
			pointer-events: none;
			padding: 0;
			position: fixed;
			bottom: 1rem;
			right: 1rem;
			width: 2.5rem;
			height: 2.5rem;
			border-radius: 50%;
		}
		.dc-scroll-to-top.visible {
			opacity: 0.5;
			pointer-events: auto;
		}
	`;
	document.head.appendChild(style);

	const scrollToTopButton = document.createElement("button");
	scrollToTopButton.textContent = "▲";
	scrollToTopButton.classList.add("dc-scroll-to-top");
	document.body.appendChild(scrollToTopButton);

	let scrolled = false;
	window.addEventListener("scroll", () => {
		const nowScrolled = window.scrollY > 0;
		if (nowScrolled !== scrolled) {
			scrolled = nowScrolled;
			scrollToTopButton.classList.toggle("visible", scrolled);
		}
	});

	scrollToTopButton.addEventListener("click", () => {
		window.scrollTo({ top: 0, behavior: "smooth" });
	});
}