jfmonty2/blog
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

start working on posts with placeholder content

Browse Source
This commit is contained in:
Joseph Montanaro
2026-02-28 09:26:10 -05:00
parent 95b58b5615
commit c28f340333
16 changed files with 372 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/layouts/BaseLayout.astro
View File

@@ -3,8 +3,8 @@ import '@styles/main.css';
---
<style>
.header {
background: var(--primary-color-faded);
header {
background-color: var(--primary-color-faded);
}
nav {
@@ -37,13 +37,13 @@ import '@styles/main.css';
<meta name="viewport" content="width=device-width" />
</head>
<body>
<div class="header">
<header>
<nav>
<a href="/" data-astro-prefetch>Home</a>
<a href="/posts" data-astro-prefetch>Posts</a>
<a href="/about" data-astro-prefetch>About</a>
</nav>
</div>
</header>
<main>
<slot />

50
src/layouts/PostLayout.astro
View File

@@ -2,19 +2,55 @@
import BaseLayout from '@layouts/BaseLayout.astro';
---
<style>
/* 3-column grid: left gutter, center content, and right gutter */
article {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, var(--content-width)) minmax(0, 1fr);
/* a bit of breathing room for narrow screens */
padding: 0 var(--content-padding);
}
.left-gutter {
grid-column: 1 / 2;
justify-self: end;
}
.right-gutter {
grid-column: 3 / 4;
justify-self: start;
}
.title {
grid-column: 2 / 3;
}
.subtitle {
font-size: 0.9em;
font-style: italic;
margin-top: -0.75rem;
}
.post {
grid-column: 2 / 3;
}
</style>
<BaseLayout>
<div class="page">
<h1>Working Title</h1>
<p class="subtitle">Subtitle</p>
<article>
<header class="title">
<h1>Working Title</h1>
<p class="subtitle">Subtitle</p>
</header>
<div class="left-gutter" />
<div class="post">
<section class="post">
<slot />
</div>
</section>
<div class="right-gutter" />
<div class="footer" />
</div>
<footer />
</article>
</BaseLayout>