chore: update site layout and styles

This commit is contained in:
kbe
2025-08-19 16:54:09 +02:00
parent bd803eda00
commit 851547b87d
8 changed files with 138 additions and 79 deletions

View File

@@ -0,0 +1,51 @@
.author-card-item {
margin-bottom: 2rem;
border: 1px solid #eee;
padding: 1rem;
display: flex;
align-items: center;
.author-card-image {
flex: 0 0 33.333333%;
max-width: 33.333333%;
padding-right: 1rem;
img {
border-radius: 50%;
width: 100%;
height: auto;
display: block;
}
}
.author-card-info {
flex: 0 0 66.666667%;
max-width: 66.666667%;
padding-left: 1rem;
.author-card-name {
font-size: 1.25rem;
font-weight: bold;
margin-bottom: 0.5rem;
}
.author-card-title {
font-size: 0.9rem;
color: #666;
margin-bottom: 1rem;
}
.author-card-buttons {
.author-button-link {
display: inline-flex;
align-items: center;
color: #007bff;
text-decoration: none;
svg {
margin-left: 0.5rem;
}
}
}
}
}

View File

@@ -57,6 +57,7 @@
@import "components/preloader";
@import "components/section";
@import "components/_ez-toc";
@import "components/author-card";
//

View File

@@ -1,10 +1,9 @@
{{ define "main" }}
{{ $defaultCategory := "General" }}
{{ if .Site.Params.defaultCategory }}{{ $defaultCategory = .Site.Params.defaultCategory }}{{ end }}
<div class="section-sm bg-gray-lighter">
<div class="container text-center">
<h3 class="font-family-playfair">{{ .Title }}</h3>
<h1 class="font-family-playfair">{{ .Site.Title }}</h1>
<p class="mt-3">{{ .Site.Params.seo.description }}</p>
</div><!-- end container -->
</div>
@@ -39,15 +38,9 @@
{{ else if and (eq (printf "%T" $category) "map") }}
{{ if $category.name }}
<a class="font-family-poppins font-small fw-medium uppercase" href="/categories/{{ $category.name | urlize }}">{{ $category.name }}</a>
{{ else }}
<a class="font-family-poppins font-small fw-medium uppercase" href="#">{{ $defaultCategory }}</a>
{{ end }}
{{ else }}
<a class="font-family-poppins font-small fw-medium uppercase" href="#">{{ $defaultCategory }}</a>
{{ end }}
{{ end }}
{{ else }}
<a class="font-family-poppins font-small fw-medium uppercase" href="#">{{ $defaultCategory }}</a>
{{ end }}
</div>
<div class="d-inline-flex">
@@ -78,3 +71,4 @@
</div>
<!-- end Blog section -->
{{ end }}

View File

@@ -44,6 +44,7 @@
</div>
<!-- end Post Content -->
{{/*
<!-- Tags and Share -->
<div class="section-xs border-top">
<div class="container">
@@ -69,6 +70,7 @@
</div><!-- end row -->
</div><!-- end container -->
</div>
*/}}
<!-- Comments section -->
{{ if .Site.Params.comments.enable }}

View File

@@ -1,84 +1,49 @@
{{ define "main" }}
{{ $authorName := .Params.author }}
{{ $authorSlug := .Params.author_slug }}
{{ $authorPosts := where .Site.RegularPages "Params.author" $authorName }}
{{ $authors := site.Data.wordpress.authors }}
<div class="section-sm bg-gray-lighter">
<div class="container text-center">
<h3 class="font-family-playfair">{{ .Title }}</h3>
<p class="mt-2">Tous les articles écrits par {{ $authorName }}</p>
<p class="mt-2">Liste de tous les auteurs</p>
</div><!-- end container -->
</div>
<!-- Blog section -->
<div class="section">
<div class="container">
<div class="row g-4">
<div class="col-12 col-sm-10 offset-sm-1 col-md-8 offset-md-2">
{{ $paginationLimit := 10 }}
{{ if .Site.Params.paginationLimit }}{{ $paginationLimit = .Site.Params.paginationLimit }}{{ end }}
{{ $paginator := .Paginate $authorPosts $paginationLimit }}
{{ if gt (len $authorPosts) 0 }}
{{ range $paginator.Pages }}
<!-- Blog Post box -->
<div class="mb-5">
<div class="img-link-box">
<a href="{{ .RelPermalink }}">
{{ if .Params.featured_image }}
<img src="{{ .Params.featured_image }}" alt="{{ .Title }}">
<div class="author-list">
<div class="row">
{{ range $author := $authors }}
<div class="col-md-6 mb-4">
<article class="author-card-item h-100 card" data-author-name="{{ $author.name }}">
<div class="row g-0 align-items-center">
<div class="author-card-image col-md-4 p-2">
{{ with index $author.avatar_urls "96" }}
<img decoding="async" src="{{ . }}" alt="{{ $author.name }}" class="author-image img-fluid" loading="lazy">
{{ else }}
<img src="/assets/images/col-1.jpg" alt="{{ .Title }}">
<img decoding="async" src="/assets/images/img-avatar-md@2x.jpg" alt="{{ $author.name }}" class="author-image img-fluid" loading="lazy">
{{ end }}
</a>
</div>
<div class="mt-4">
<div class="d-flex justify-content-between mb-2">
<div class="d-inline-flex">
{{ if .Params.categories }}
{{ range $index, $category := .Params.categories }}
{{ if $index }}, {{ end }}
{{ if and (eq (printf "%T" $category) "string") }}
<a class="font-family-poppins font-small fw-medium uppercase" href="/categories/{{ $category | urlize }}">{{ $category }}</a>
{{ else if and (eq (printf "%T" $category) "map") }}
{{ if $category.name }}
<a class="font-family-poppins font-small fw-medium uppercase" href="/categories/{{ $category.name | urlize }}">{{ $category.name }}</a>
{{ end }}
{{ end }}
{{ end }}
</div>
<div class="author-card-info col-md-8">
<div class="card-body">
<h5 class="card-title author-card-name">{{ $author.name }}</h5>
{{ with $author.description }}
<p class="card-text author-card-title">
<small class="text-muted author-card-title-text">{{ . }}</small>
</p>
{{ end }}
<div class="author-card-buttons mt-3">
<div class="author-card-button">
<a href="/author/{{ $author.slug | urlize }}" class="author-button-link" aria-label="Voir les articles de {{ $author.name }}">Voir les articles<svg class="uikit-icon" style="width: 1em;" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><path fill="var(--c-svg, currentColor)" d="M7.5 4.5V6h9.442L4.5 18.442 5.558 19.5 18 7.058V16.5h1.5v-12z"></path></svg></a>
</div>
</div>
</div>
<div class="d-inline-flex">
<span class="font-small">{{ .Date.Format "02/07/2006" }}</span>
</div>
</div>
<h4><a class="text-link-1" href="{{ .RelPermalink }}">{{ .Title }}</a></h4>
{{ if .Params.excerpt }}
<p>{{ .Params.excerpt }}</p>
{{ else if .Summary }}
<p>{{ .Summary }}</p>
{{ else }}
<p>{{ truncate 200 .Content }}</p>
{{ end }}
<div class="mt-3">
<a class="button-text-1" href="{{ .RelPermalink }}">Lire la suite</a>
</div>
</div>
</div>
<!-- End Blog Post box -->
{{ end }}
<!-- Pagination -->
{{ partial "pagination.html" (dict "Paginator" .Paginator "Page" .) }}
{{ else }}
<div class="text-center py-5">
<h4>Aucun article trouvé</h4>
<p>Aucun article n'a été trouvé pour cet auteur.</p>
</div>
</article>
</div>
{{ end }}
</div>
</div><!-- end row -->
</div>
</div><!-- end container -->
</div>
<!-- end Blog section -->
{{ end }}

View File

@@ -35,6 +35,7 @@
</ul>
</div>
{{/*
<div class="col-6 col-sm-6 col-lg-3">
<h6 class="font-small fw-medium uppercase">Contact Info</h6>
<ul class="list-unstyled">
@@ -43,6 +44,8 @@
<li>+(123) 456 789 01</li>
</ul>
</div>
*/}}
</div><!-- end row -->
</div><!-- end container -->
</div>
@@ -54,10 +57,10 @@
</div>
<div class="col-12 col-md-6 text-center text-md-end">
<ul class="list-inline-sm">
<li><a class="button-circle button-circle-sm button-circle-social-facebook" href="#"><i class="bi bi-facebook"></i></a></li>
<li><a class="button-circle button-circle-sm button-circle-social-twitter" href="#"><i class="bi bi-twitter-x"></i></a></li>
<li><a class="button-circle button-circle-sm button-circle-social-pinterest" href="#"><i class="bi bi-pinterest"></i></a></li>
<li><a class="button-circle button-circle-sm button-circle-social-instagram" href="#"><i class="bi bi-instagram"></i></a></li>
<li><a class="button-circle button-circle-sm button-circle-social-facebook" href="https://www.facebook.com/mistergeekfrance"><i class="bi bi-facebook"></i></a></li>
<!-- <li><a class="button-circle button-circle-sm button-circle-social-twitter" href="#"><i class="bi bi-twitter-x"></i></a></li> -->
<!-- <li><a class="button-circle button-circle-sm button-circle-social-pinterest" href="#"><i class="bi bi-pinterest"></i></a></li> -->
<!-- <li><a class="button-circle button-circle-sm button-circle-social-instagram" href="#"><i class="bi bi-instagram"></i></a></li> -->
</ul>
</div>
</div><!-- end row -->

View File

@@ -8494,6 +8494,49 @@ body.loaded:after {
}
}
.author-card-item {
margin-bottom: 2rem;
border: 1px solid #eee;
padding: 1rem;
display: flex;
align-items: center;
}
.author-card-item .author-card-image {
flex: 0 0 33.333333%;
max-width: 33.333333%;
padding-right: 1rem;
}
.author-card-item .author-card-image img {
border-radius: 50%;
width: 100%;
height: auto;
display: block;
}
.author-card-item .author-card-info {
flex: 0 0 66.666667%;
max-width: 66.666667%;
padding-left: 1rem;
}
.author-card-item .author-card-info .author-card-name {
font-size: 1.25rem;
font-weight: bold;
margin-bottom: 0.5rem;
}
.author-card-item .author-card-info .author-card-title {
font-size: 0.9rem;
color: #666;
margin-bottom: 1rem;
}
.author-card-item .author-card-info .author-card-buttons .author-button-link {
display: inline-flex;
align-items: center;
color: #007bff;
text-decoration: none;
}
.author-card-item .author-card-info .author-card-buttons .author-button-link svg {
margin-left: 0.5rem;
}
:root {
--bs-dark-rgb: 24, 28, 32;
--bs-border-color: get-color("dark", 0.1);

File diff suppressed because one or more lines are too long