jalil/jalil.arfaoui.net
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Correction affichage dates et style minimaliste sur /photo/blog

Browse source
This commit is contained in:
Jalil Arfaoui 2026-02-17 23:18:32 +01:00
parent d82e51c4c9
commit 3566488a0a
4 changed files with 12 additions and 45 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
src/content/photoBlogPosts/waiting-for-the-bride.ar.md
View file

@ -1,12 +0,0 @@
---
title: "في انتظار العروس"
description: "تحضيرات زفاف."
date: 2014-10-25
coverImage: "../../assets/images/photos/blog/waiting-for-the-bride/01-.jpg"
tags: []
featured: false
draft: false
lang: ar
---
تحضيرات زفاف.

12
src/content/photoBlogPosts/waiting-for-the-bride.en.md
View file

@ -1,12 +0,0 @@
---
title: "Waiting for the Bride"
description: "Wedding preparations."
date: 2014-10-25
coverImage: "../../assets/images/photos/blog/waiting-for-the-bride/01-.jpg"
tags: []
featured: false
draft: false
lang: en
---
Wedding preparations.

11
src/content/photoBlogPosts/waiting-for-the-bride.md
View file

@ -1,11 +0,0 @@
---
title: "En attendant la mariée"
description: "Préparatifs d'un mariage"
date: 2014-10-25
coverImage: "../../assets/images/photos/blog/waiting-for-the-bride/01-.jpg"
tags: []
featured: false
draft: false
---
Préparatifs d'un mariage.

22
src/pages/photo/blog/index.astro
View file

@ -41,7 +41,6 @@ const regularPosts = postsWithImages.filter(post => !post.data.featured);
<div class="post-content">
<span class="post-badge">À la une</span>
<h2 class="post-title">{post.data.title}</h2>
<p class="post-description">{post.data.description}</p>
<time class="post-date">
{new Date(post.data.date).toLocaleDateString('fr-FR', {
year: 'numeric',
@ -69,7 +68,6 @@ const regularPosts = postsWithImages.filter(post => !post.data.featured);
<div class="post-overlay">
<div class="overlay-content">
<h3 class="post-title">{post.data.title}</h3>
<p class="post-subtitle">{post.data.description}</p>
<time class="post-date">
{new Date(post.data.date).toLocaleDateString('fr-FR', {
year: 'numeric',
@ -141,13 +139,10 @@ const regularPosts = postsWithImages.filter(post => !post.data.featured);
display: flex;
align-items: flex-end;
padding: 40px;
overflow: hidden;
}
.featured-post .post-content {
color: white;
max-height: 100%;
overflow: hidden;
}
.post-badge {
@ -165,7 +160,7 @@ const regularPosts = postsWithImages.filter(post => !post.data.featured);
.featured-post .post-title {
font-size: 28px;
font-weight: 600;
margin: 0 0 12px 0;
margin: 0 0 4px 0;
line-height: 1.2;
}
@ -182,6 +177,7 @@ const regularPosts = postsWithImages.filter(post => !post.data.featured);
}
.featured-post .post-date {
display: block;
font-size: 14px;
opacity: 0.8;
}
@ -211,6 +207,11 @@ const regularPosts = postsWithImages.filter(post => !post.data.featured);
aspect-ratio: 3/2;
}
.featured-post .post-link {
aspect-ratio: auto;
height: 100%;
}
.post-link img {
width: 100%;
height: 100%;
@ -221,18 +222,19 @@ const regularPosts = postsWithImages.filter(post => !post.data.featured);
.post-item .post-overlay {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: linear-gradient(to top, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0) 100%);
background: linear-gradient(to top, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.5) 25%, rgba(0,0,0,0) 50%);
display: flex;
align-items: flex-end;
padding: 20px;
padding: 12px 16px;
transition: background 0.3s ease;
}
.post-item:hover .post-overlay {
background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.2) 100%);
background: linear-gradient(to top, rgba(0,0,0,0.95) 0%, rgba(0,0,0,0.7) 25%, rgba(0,0,0,0) 50%);
}
.post-item:hover img {
@ -246,7 +248,7 @@ const regularPosts = postsWithImages.filter(post => !post.data.featured);
.post-item .post-title {
font-size: 20px;
font-weight: 600;
margin: 0 0 4px 0;
margin: 0 0 2px 0;
line-height: 1.3;
text-shadow: 0 1px 3px rgba(0,0,0,0.8);
}