Filter skills by tags

This commit is contained in:
Yves Gatesoupe 2021-11-09 19:24:23 +01:00
parent 778c6a5e11
commit b8951d45ce
21 changed files with 132 additions and 5 deletions

View File

@ -74,6 +74,28 @@ module.exports = function(config) {
.slice(0, site.maxProfilePreview)
;
});
config.addCollection("tagsList", function(collectionApi) {
const tagsList = new Set();
collectionApi.getAll().map( item => {
if (item.data.tags) { // handle pages that don't have tags
item.data.tags.map( tag => tagsList.add(tag))
}
});
return tagsList;
});
config.addCollection("skillsList", function(collectionApi) {
const skillsList = new Set();
collectionApi.getFilteredByGlob("./src/members/*.md").map( item => {
if (item.data.tags) { // handle pages that don't have skills
item.data.tags.map( skill => { // exclude non related tags
if (['post', 'news', 'event'].indexOf(skill) == -1) {
skillsList.add(skill)
}
})
}
});
return skillsList;
});
config.addCollection('customers', collection => {
return [...collection.getFilteredByGlob("./src/customers/*.md")]
.reverse()

View File

@ -29,9 +29,22 @@
{% if socialLinkedin %}
<a href="{{ socialLinkedin }}" class="social" title="linkedin"><svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.98 2.5A2.49 2.49 0 012.5 5 2.49 2.49 0 01.02 2.5C.02 1.12 1.13 0 2.5 0a2.49 2.49 0 012.48 2.5zM5 7H0v16h5V7zm7.982 0H8.014v16h4.969v-8.399c0-4.67 6.029-5.052 6.029 0V23H24V12.869c0-7.88-8.922-7.593-11.018-3.714V7z" fill="#282156"/></svg></a>
{% endif %}
<div class="[ nav ] [ box-flex align-center ]">
</div>
</div>
<div class="member__bio">
{{ content | safe }}
{% if tags %}
<h2 class="font-base weight-mid mt-2">Mots-clés</h2>
<ul class="tag-list mt-1">
{% for item in tags %}
<li class="tag-item">
<a href="/equipe/{{ item }}">{{ item }}</a>
</li>
{% endfor %}
</ul>
{% endif %}
</div>
</div>
</article>

View File

@ -7,6 +7,12 @@
<div class="[ wrapper ]">
<h1 class="[ member-list__heading ]">{{ teamListHeading }}</h1>
{{ content | safe }}
<h2 class="[ gap-top-700 ]">{{ tagSearchHeading }}</h2>
<ul class="tag-list mt-1">
{% for skill in collections.skillsList %}
<li class="tag-item"><a href="/equipe/{{ skill }}">{{ skill }}</a></li>
{% endfor %}
</ul>
</div>
{% include "partials/components/member-list.njk" %}
{% include "partials/components/contact-form.njk" %}

View File

@ -4,9 +4,7 @@
<ol class="[ member-list__items ]" reversed>
{% for item in teamListItems %}
<li class="member-list__item">
{# <div class="img-wrapper"> #}
<img src=" {{ item.data.profile }}" alt="photo de {{ item.data.name }}">
{# </div> #}
<a role="button" href="{{ item.data.url }}" class="btn btn-primary">{{ item.data.name }}&nbsp;
<svg width="18" height="14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M17.602 5.823L12.05.376a1.357 1.357 0 00-1.875 0 1.295 1.295 0 000 1.84l3.278 3.235H1.326C.587 5.451 0 6.027 0 6.752s.587 1.302 1.326 1.302h12.127l-3.278 3.215a1.295 1.295 0 000 1.84 1.349 1.349 0 001.894 0l5.533-5.427c.246-.242.398-.576.398-.93 0-.353-.133-.687-.398-.93z" fill="#111"></path></svg>
</a>

View File

@ -9,6 +9,11 @@ socialTwitter: 'https://twitter.com/AstrolabeCae'
socialLinkedin: 'https://www.linkedin.com/company/astrolabe-cae'
socialMastodon: 'https://framapiaf.org/@AstrolabeCAE'
url: '/members/florent-le-saout'
tags:
- linux
- dev
skills:
- C++
---
Je suis co-fondateur et co-gérant de la SCOP CAE Astrolabe.

View File

@ -9,6 +9,7 @@ socialTwitter: 'https://twitter.com/AstrolabeCae'
socialLinkedin: 'https://www.linkedin.com/in/vincent-g%C3%A9nieux-4223982/'
socialMastodon: 'https://framapiaf.org/@AstrolabeCAE'
url: '/members/vincent-genieux'
tags: [ linux, dev ]
---
### Co-fondateur et co-gérant d'Astrolabe

View File

@ -8,6 +8,13 @@ personalSite: 'https://www.behance.net/ygates'
socialTwitter: 'https://twitter.com/YGdsgn'
socialLinkedin: 'https://www.linkedin.com/in/yves-gatesoupe-05990b17a/'
url: '/members/yves-gatesoupe'
tags:
- html
- design
- dev
skills:
- dev
- Vue.js
---
Je suis designer web indépendant depuis janvier 2020.

View File

@ -1,6 +1,7 @@
---
title: 'Comprendre la CAE'
permalink: '/comprendre-la-cae/index.html'
eleventyExcludeFromCollections: true
---
# Une entreprise partagée

View File

@ -2,6 +2,7 @@
title: 'Contact'
permalink: '/contact/index.html'
layout: 'layouts/contact.njk'
eleventyExcludeFromCollections: true
---
You can have a contact page which uses a basic form. The [code with the form fields lives here](https://github.com/hankchizljaw/hylia/blob/master/src/_includes/layouts/contact.njk).

View File

@ -3,6 +3,8 @@ title: 'L''équipe Astrolabe'
permalink: '/equipe/index.html'
layout: 'layouts/team.njk'
teamListHeading: 'L''équipe Astrolabe'
tagSearchHeading: 'Filter par mots-clés :'
eleventyExcludeFromCollections: true
---
Astrolabe CAE est confondée par Florent Le Saout et Vincent Génieux en 2019.<br>

View File

@ -1,6 +1,7 @@
---
title: 'Nous rejoindre'
permalink: '/nous-rejoindre/index.html'
eleventyExcludeFromCollections: true
---
# Comment rejoindre Astrolabe

View File

@ -3,6 +3,7 @@ title: 'Actualité & Évènements'
permalink: '/posts-events/index.html'
layout: 'layouts/posts-events.njk'
pageHeading: 'Actualité & Évènements'
eleventyExcludeFromCollections: true
---

View File

@ -3,6 +3,7 @@ title: 'Actualité & Évènements'
permalink: '/posts-news/index.html'
layout: 'layouts/posts-news.njk'
pageHeading: 'Actualité & Évènements'
eleventyExcludeFromCollections: true
---

View File

@ -3,6 +3,7 @@ title: 'Actualité & Évènements'
permalink: '/posts/index.html'
layout: 'layouts/posts.njk'
pageHeading: 'Actualité & Évènements'
eleventyExcludeFromCollections: true
---

View File

@ -1,6 +1,7 @@
---
title: 'Thank you'
permalink: '/thank-you/index.html'
eleventyExcludeFromCollections: true
---
# Merci !

View File

@ -60,3 +60,15 @@ a:not([class]):visited {
color: inherit;
}
}
.justify-end {
justify-content: flex-end;
}
.mt-1 {
margin-top: 1rem;
}
.mt-2 {
margin-top: 2rem;
}

View File

@ -5,6 +5,7 @@
}
.form-container {
margin-top: 8rem;
padding: 0 0 6rem;
background-color: var(--color-primary);
color: var(--color-dark);

View File

@ -1,6 +1,4 @@
.member-list {
margin-bottom: 8rem;
&__heading {
margin: 8rem 0 4rem;
}

View File

@ -0,0 +1,21 @@
.tag-list {
list-style: none;
display: flex;
.tag-item + .tag-item {
margin-left: 1rem;
}
}
.tag-item {
padding: .5rem 1rem;
background-color: var(--color-light-gray);
a {
text-decoration: none;
&:hover {
text-decoration: underline;
}
}
}

View File

@ -75,4 +75,5 @@ img {
@import 'components/partner';
@import 'components/skip-link';
@import 'components/video-player';
@import 'components/tags';
@import 'utilities/responsive';

33
src/team-skills.njk Normal file
View File

@ -0,0 +1,33 @@
---
title: 'L''équipe Astrolabe'
pagination:
data: collections
size: 1
alias: tag
filter:
- post
- news
- event
- customer
- partner
permalink: /equipe/{{ tag }}/
---
{% extends 'layouts/base.njk' %}
{% set teamListItems = collections[tag] %}
{% block content %}
<main id="main-content" tabindex="-1">
<div class="[ wrapper ]">
<h1 class="[ member-list__heading ]">{{ teamListHeading }}</h1>
{{ content | safe }}
<h2 class="[ gap-top-700 ]">Profils par mot-clé : <span class="tag-item">{{ tag }}</span></h2>
</div>
{% include "partials/components/member-list.njk" %}
<div class="wrapper box-flex justify-end">
<a class="return-link" href="/equipe">Voir tous les membres</a>
</div>
{% include "partials/components/contact-form.njk" %}
</main>
{% endblock %}