Compare commits
3 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 89fd0eb7ce | |||
| 95ea235f9f | |||
| fe6604a5d9 |
@@ -22,7 +22,7 @@ WORKDIR /app
|
|||||||
COPY --from=prod-deps /app/node_modules /app/node_modules
|
COPY --from=prod-deps /app/node_modules /app/node_modules
|
||||||
COPY --from=build /app/dist /app/dist
|
COPY --from=build /app/dist /app/dist
|
||||||
|
|
||||||
LABEL version="2.20.0"
|
LABEL version="2.21.0"
|
||||||
LABEL description="Astro based personal website"
|
LABEL description="Astro based personal website"
|
||||||
|
|
||||||
ENV HOST=0.0.0.0
|
ENV HOST=0.0.0.0
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
{
|
{
|
||||||
"name": "site-profile",
|
"name": "site-profile",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"version": "2.20.0",
|
"version": "2.21.0",
|
||||||
"homepage": "https://www.alexlebens.dev",
|
"homepage": "https://www.alexlebens.dev",
|
||||||
"bugs": {
|
"bugs": {
|
||||||
"url": "https://gitea.alexlebens.dev/alexlebens/site-profile/issues",
|
"url": "https://gitea.alexlebens.dev/alexlebens/site-profile/issues",
|
||||||
|
|||||||
@@ -68,67 +68,51 @@ const normalizeTitle = !title ? global.name : `${title} | ${global.name}`;
|
|||||||
/>
|
/>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body class="bg-background selection:bg-yellow-400 m-0 p-0 overflow-x-hidden">
|
<body class="bg-background selection:bg-yellow-400 m-0 p-0 overflow-hidden">
|
||||||
|
|
||||||
<!-- Sliding backgrounds -->
|
<!-- Sliding backgrounds -->
|
||||||
<div class="bg"/>
|
<div class="bg"/>
|
||||||
<div class="bg bg2"/>
|
<div class="bg bg2"/>
|
||||||
<div class="bg bg3"/>
|
<div class="bg bg3"/>
|
||||||
|
|
||||||
<!-- Layout -->
|
<!-- Fixed header -->
|
||||||
<div class="grow w-full max-w-(--breakpoint-2xl) px-4 sm:px-6 lg:px-8 py-20 mx-auto">
|
|
||||||
|
|
||||||
<Header />
|
<Header />
|
||||||
|
|
||||||
<main class="has-js scroll-fade-container min-h-screen">
|
<!-- Content -->
|
||||||
<slot />
|
<div class="mask-container w-screen h-screen overflow-y-auto overflow-x-hidden">
|
||||||
</main>
|
<main class="pt-20">
|
||||||
|
|
||||||
</div>
|
<slot />
|
||||||
|
|
||||||
<Footer />
|
<Footer />
|
||||||
|
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
||||||
<script>
|
|
||||||
document.addEventListener('astro:page-load', () => {
|
|
||||||
const onScroll = () => {
|
|
||||||
document.documentElement.style.setProperty('--scroll-offset', `${window.scrollY}px`);
|
|
||||||
document.documentElement.classList.add('has-js');
|
|
||||||
};
|
|
||||||
|
|
||||||
window.removeEventListener('scroll', onScroll);
|
|
||||||
window.addEventListener('scroll', onScroll, { passive: true });
|
|
||||||
|
|
||||||
onScroll();
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
/* Fade away content below header when scrolling */
|
/* Fade away content below header when scrolling */
|
||||||
.has-js .scroll-fade-container {
|
.mask-container {
|
||||||
-webkit-mask-image: linear-gradient(
|
-webkit-mask-image: linear-gradient(
|
||||||
to bottom,
|
to bottom,
|
||||||
transparent 0px,
|
transparent 0px,
|
||||||
transparent 16px,
|
transparent 90px,
|
||||||
black 80px,
|
black 140px,
|
||||||
black 100%
|
black 100%
|
||||||
);
|
);
|
||||||
|
|
||||||
mask-image: linear-gradient(
|
mask-image: linear-gradient(
|
||||||
to bottom,
|
to bottom,
|
||||||
transparent 0px,
|
transparent 0px,
|
||||||
transparent 16px,
|
transparent 90px,
|
||||||
black 60px,
|
black 140px,
|
||||||
black 100%
|
black 100%
|
||||||
);
|
);
|
||||||
|
|
||||||
-webkit-mask-size: 100vw 100vh;
|
-webkit-mask-size: 100vw 100vh;
|
||||||
-webkit-mask-repeat: no-repeat;
|
-webkit-mask-repeat: no-repeat;
|
||||||
|
|
||||||
-webkit-mask-position-y: var(--scroll-offset);
|
|
||||||
mask-position-y: var(--scroll-offset);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Background that creates the "glimmer" effect */
|
/* Background that creates the "glimmer" effect */
|
||||||
|
|||||||
Reference in New Issue
Block a user