barrett/barrettruth.com
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #36 from barrett-ruth/feat/death-formatting

Browse source 
improve death stlying
This commit is contained in:
Barrett Ruth 2025-12-30 15:58:57 -06:00 • committed by GitHub
commit 10cfafce65
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 20 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

36
src/pages/death.astro
View file

@ -1,24 +1,20 @@
---
import BaseLayout from "../layouts/BaseLayout.astro";
const title = "my father";
---
<BaseLayout title={title} useHeader={false}>
<div class="death-container">
<img id="death-image" src="/death/death.webp" alt="Philip Matthew Ruth" />
<div id="tribute-text" class="tribute">
rip philip matthew ruth<br />
february 8, 1967 – c. december 2, 2025
</div>
<div class="credit">
gary wray<br />
<em>waiting in line</em>, 2021
</div>
</div>
<style>
html,
body {
@ -28,37 +24,45 @@ const title = "my father";
width: 100%;
overflow: hidden;
background: black;
color: white !important;
}
.death-container {
position: relative;
width: 100vw;
height: 100vh;
display: grid;
grid-template-rows: 1fr auto;
grid-template-columns: 1fr 1fr;
}
img {
grid-row: 1 / -1;
grid-column: 1 / -1;
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.tribute {
position: fixed;
bottom: 1.5rem;
right: 1.5rem;
font-size: 3em;
grid-row: 2;
grid-column: 2;
justify-self: end;
align-self: end;
padding: 1.5rem;
font-size: clamp(1.5rem, 4vmin, 3em);
z-index: 10;
text-align: right;
color: white;
}
.credit {
position: fixed;
bottom: 1.5rem;
left: 1.5rem;
grid-row: 2;
grid-column: 1;
justify-self: start;
align-self: end;
padding: 1.5rem;
z-index: 10;
font-size: 2em;
font-size: clamp(1.2rem, 3vmin, 2em);
text-align: left;
color: white;
}
</style>
</BaseLayout>