Skip to content

Commit 2ff6cb2

Browse files
committed
Starting to implement the layout for blog posts
1 parent 92fec30 commit 2ff6cb2

File tree

4 files changed

+49
-11
lines changed

4 files changed

+49
-11
lines changed

src/layouts/BlogPostLayout.astro

+37-9
Original file line numberDiff line numberDiff line change
@@ -6,16 +6,44 @@ import Footer from "../components/Footer.astro";
66
---
77

88
<BaseLayout>
9-
<div>
10-
<Header />
11-
<slot />
12-
<Footer />
13-
</div>
9+
<div>
10+
<Header />
11+
<section>
12+
<slot />
13+
</section>
14+
<Footer />
15+
</div>
1416
</BaseLayout>
1517

1618
<style>
17-
div {
18-
padding-left: 1.5rem;
19-
padding-bottom: 1.5rem;
20-
}
19+
div {
20+
padding-top: 1.5rem;
21+
padding-bottom: 1.5rem;
22+
}
23+
24+
section {
25+
width: 90%;
26+
max-inline-size: 66ch;
27+
margin-left: auto;
28+
margin-right: auto;
29+
}
30+
</style>
31+
32+
<style is:global>
33+
h1 {
34+
font-size: clamp(2.5rem, 0.75rem + 1.5vw, 4rem);
35+
margin-top: 0;
36+
margin-bottom: 1rem;
37+
}
38+
39+
h2 {
40+
font-size: 1.75rem;
41+
margin-bottom: 1rem;
42+
}
43+
44+
img {
45+
width: 100%;
46+
margin-bottom: 1rem;
47+
border-radius: 8px;
48+
}
2149
</style>
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
# Découvrez les fiches techniques
2+

src/pages/blog/new-welcome-v2.md

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
---
2+
layout: ../../layouts/BlogPostLayout.astro
3+
---
4+
5+
# Bienvenue sur la V2
6+
7+
![Quelqu'un assis dans un jardin au printemps, pixel art](/jardin-printemps.webp)
8+
9+
10+
## Comme un parfum de printemps.

src/pages/blog/welcome-v2.astro

-2
Original file line numberDiff line numberDiff line change
@@ -121,7 +121,6 @@ import ContentLayout from "../../layouts/ContentLayout.astro";
121121

122122
<style>
123123
h1 {
124-
/* font-size: 2.5rem; */
125124
font-size: clamp(2.5rem, 0.75rem + 1.5vw, 4rem);
126125
margin-top: 0;
127126
margin-bottom: 1rem;
@@ -140,7 +139,6 @@ import ContentLayout from "../../layouts/ContentLayout.astro";
140139

141140
section {
142141
width: 90%;
143-
/* max-width: 680px; */
144142
max-inline-size: 66ch;
145143
margin-left: auto;
146144
margin-right: auto;

0 commit comments

Comments
 (0)