From 41c794ebc63d5c0fd9d477fadb100dec8aa91b3e Mon Sep 17 00:00:00 2001
From: Agathe <agathe.baez@live.fr>
Date: Sat, 18 Dec 2021 21:36:02 +0100
Subject: [PATCH] Blog-index
---
src/layouts/_partials/footer.njk | 37 +++++++++++++++++---------------
src/layouts/blog-index.njk | 28 +++---------------------
src/layouts/blogpost.njk | 37 +++++++++++++++++++++-----------
static/css/theme-coko/main.css | 20 +++++++++++++----
4 files changed, 63 insertions(+), 59 deletions(-)
diff --git a/src/layouts/_partials/footer.njk b/src/layouts/_partials/footer.njk
index a0e82c4..a99c7e7 100644
--- a/src/layouts/_partials/footer.njk
+++ b/src/layouts/_partials/footer.njk
@@ -1,19 +1,22 @@
-<footer>
+ <div class="footer">
+ <footer>
+
- <section class="logo">
- {% include "_partials/logo.njk" %}
+ <section class="logo">
+ {% include "_partials/logo.njk" %}
- <section class="links">
- {% include "_partials/socialMedia.njk" %}
- </section>
- </section>
-
- <section class="contact">
- {% include "_partials/contact.njk" %}
- </section>
-
- <section class="infos">
- {% include "_partials/footerInfosSupp.njk" %}
- </section>
-
- </footer>
+ <section class="links">
+ {% include "_partials/socialMedia.njk" %}
+ </section>
+ </section>
+
+ <section class="contact">
+ {% include "_partials/contact.njk" %}
+ </section>
+
+ <section class="infos">
+ {% include "_partials/footerInfosSupp.njk" %}
+ </section>
+
+</footer>
+ </div>
\ No newline at end of file
diff --git a/src/layouts/blog-index.njk b/src/layouts/blog-index.njk
index f5dfe20..1092474 100644
--- a/src/layouts/blog-index.njk
+++ b/src/layouts/blog-index.njk
@@ -1,38 +1,16 @@
-
- {# <div class="grid">
- {% for item in team.people %}
- <div class="grid-item {{item.cardWidth}}">
- <figure><img src="{{item.portrait}}" alt=""></figure>
- <h3>{{item.name}}</h3>
- <h4>{{item.fonction}}</h4>
- <p>{{item.description | markdownify | safe}}</p>
- </div>
- {% endfor %}
- </div> #}
-
-
{% extends "base.njk" %}
{% block content %}
- {# {% for article in collections.blog %}
- <div class="posts">
- <h3><a href="{{article.url}}">{{article.data.title}}</a></h3>
- {% if article.data.intro %}
- {{article.data.intro | markdownify | safe }}
- {% endif %}
- </div>
- {% endfor %} #}
-
<div class="grid">
{% for post in collections.blog -%}
- <div class="posts grid-item {{post.class}}">
+ <div class="posts grid-item {{post.data.class}}">
<p class="meta">
<time datetime="{{post.date}}">{{post.data.date | postDate}}</time>
<span>#{{post.data.tags}}</span>
</p>
- <figure>
- <img src="{{post.data.icon}}" alt="{{post.data.title}}">
+ <figure><a href="{{post.url}}">
+ <img src="{{post.data.icon}}" alt="{{post.data.title}}"></a>
</figure>
<h3 id="{{post.data.title | slug}}"><a href="{{post.url}}">{{post.data.title}}</a></h3>
{{ post.data.intro | safe }}
diff --git a/src/layouts/blogpost.njk b/src/layouts/blogpost.njk
index a465574..f4e5650 100644
--- a/src/layouts/blogpost.njk
+++ b/src/layouts/blogpost.njk
@@ -4,20 +4,31 @@
{% block content %}
- <main>
- {# <header>
- <h1>{{title}}</h1>
- </header> #}
+ {% block header %}
+ <header>
+ <h1>{{title}}</h1>
+ </header>
+ {% endblock %}
+
<article class="post-content">
- <header>
- <h1>{{title}}</h1>
+ <p class="meta">
<time>{{date | postDate}}</time>
- {% if intro %}
- <section class="intro">{{intro | markdownify | safe }}</section>
- {% endif %}
- </header>
-
+ <span>#{{tags}}</span>
+ </p>
+ {% if intro %}
+ <section class="intro">{{intro | markdownify | safe }}</section>
+ {% endif %}
+ {% if image %}
+ <figure>
+ <img src="{{image}}" alt="{{title}}">
+ </figure>
+ {% endif %}
+ {% if video %}
+ <video controls>
+ <source src="{{video}}" type="video/mp4">
+ </video>
+ {% endif %}
<section class="content">
{{ content | safe }}
</section>
@@ -27,7 +38,7 @@
{% set previousPost = collections.blog | getPreviousCollectionItem(page) %}
{% set nextPost = collections.blog | getNextCollectionItem(page) %}
- <aside class="paginator
+ <div class="paginator
{% if previousPost and nextPost %} both {% endif %}">
{% if previousPost %}
@@ -38,7 +49,7 @@
{% endif %}
{# <a class="next" href="https://www.pagedjs.org/search/">Looking for something?</a>
<a class="next" href="https://www.pagedjs.org/search/">Looking for something?</a> #}
- </aside>
+ </div>
</main>
{% endblock %}
\ No newline at end of file
diff --git a/static/css/theme-coko/main.css b/static/css/theme-coko/main.css
index fdef944..04816db 100644
--- a/static/css/theme-coko/main.css
+++ b/static/css/theme-coko/main.css
@@ -34,6 +34,10 @@
.news h4,
.news p.tags,
.news a,
+.blog-post h1,
+.blog-post h2,
+.blog-post h3,
+.blog-post a,
.articles h1,
.articles h2,
.articles h3,
@@ -95,7 +99,8 @@ a:hover {
background: rgb(255,255,255); }
.home aside,
.articles aside,
- .news aside {
+ .news aside,
+ .blog-post aside {
background: linear-gradient(6deg, rgba(255,255,255,1) 58%, rgba(150,208,206,1) 100%);
filter: drop-shadow(700px -15px 15px #62C8C4);
}
@@ -251,7 +256,8 @@ a:hover {
column-gap: 40px;
margin-bottom: 3em;
}
- .home section.section-blog .posts img{
+ .home section.section-blog .posts img,
+ .news .grid-item img{
height: 250px;
margin: 1em auto;
object-fit: cover;
@@ -262,7 +268,10 @@ a:hover {
width: 100%;
max-height: 500px;
}
-
+ /* NEWS ------------------ */
+ .news .grid {
+ margin-top: 0px;
+ }
/* PRODUCT --------------------*/
ul.filter {
grid-column: 1/end;
@@ -329,7 +338,8 @@ a:hover {
/* Footer ----------------------- */
-footer {
+
+ footer {
background-color: var(--color-primary);
display: flex;
flex-direction: row;
@@ -338,7 +348,9 @@ footer {
align-items: center;
color: white;
font-family: var(--font-title);
+
}
+
footer section.logo svg,
footer section.logo svg .flower,
footer section.logo svg .coko-text {
--
GitLab