A bit of style for index and categories pages
This commit is contained in:
parent
e5eacb660a
commit
3be34b3f6e
|
|
@ -13,6 +13,7 @@
|
|||
--dark-green: #32ada9;
|
||||
--green: #ebff32;
|
||||
--grey: #c9c9c9;
|
||||
--light-orange: #ff6f3255;
|
||||
--orange: #ff6f32;
|
||||
--purple: #84326b;
|
||||
--white: #ffffff;
|
||||
|
|
@ -37,17 +38,28 @@ body {
|
|||
min-height: 100vh;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
a, a:visited {
|
||||
color: var(--dark-green);
|
||||
transition: 0.2s;
|
||||
}
|
||||
|
||||
a:hover,
|
||||
.active {
|
||||
background: var(--green);
|
||||
}
|
||||
|
||||
img {
|
||||
display: block;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
li {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
img {
|
||||
display: block;
|
||||
max-width: 100%;
|
||||
ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/* Header and Footer */
|
||||
|
|
@ -72,8 +84,10 @@ header h1 {
|
|||
}
|
||||
|
||||
header a,
|
||||
footer a {
|
||||
color: inherit;
|
||||
footer a,
|
||||
header a:visited,
|
||||
footer a:visited {
|
||||
color: var(--black);
|
||||
text-decoration: inherit;
|
||||
}
|
||||
|
||||
|
|
@ -86,7 +100,6 @@ footer ul {
|
|||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
header nav li,
|
||||
|
|
@ -113,5 +126,58 @@ main {
|
|||
}
|
||||
|
||||
main > section {
|
||||
padding: 2rem 20rem;
|
||||
padding: 2rem 25rem;
|
||||
}
|
||||
|
||||
/* Page Index */
|
||||
|
||||
#page-index h2 {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#introduction section {
|
||||
display: grid;
|
||||
gap: 3em;
|
||||
grid-auto-columns: 45%;
|
||||
grid-template-areas: "a a";
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
#introduction section article {
|
||||
border: var(--grey) 1px solid;
|
||||
padding: 1em;
|
||||
}
|
||||
|
||||
#introduction section + p {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.news-jobs > article {
|
||||
border: var(--grey) 1px solid;
|
||||
margin: 3em auto;
|
||||
}
|
||||
|
||||
.news-jobs > article section:first-of-type {
|
||||
background: var(--light-orange);
|
||||
padding: 1em;
|
||||
}
|
||||
|
||||
.news-jobs h3 {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.news-jobs h3 a {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.news-jobs time {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.news-jobs div {
|
||||
padding: 1em;
|
||||
}
|
||||
|
||||
.news-jobs section {
|
||||
padding: 1em;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,19 +12,20 @@
|
|||
{% endblock head %}
|
||||
</head>
|
||||
|
||||
<body id="page-{{ output_file.split('/')[-1].split('.')[0] }}">
|
||||
{% set name = output_file.split('/')[-1].split('.')[0] %}
|
||||
<body id="page-{{ name }}">
|
||||
<header>
|
||||
<img src="/static/img/logo.svg" alt="AFPy logo">
|
||||
<h1><a href="/">AFPy</a></h1>
|
||||
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="/">Accueil</a></li>
|
||||
<li><a href="/pages/qui-sommes-nous">Qui sommes-nous ?</a></li>
|
||||
<li><a href="/category/news">Actualités</a></li>
|
||||
<li><a href="/category/jobs">Offres d'emploi</a></li>
|
||||
<li><a href="/pages/communaute">Communauté</a></li>
|
||||
<li><a href="/pages/adhesions">Adhésion</a></li>
|
||||
<li><a href="/" {% if name == "index" %}class="active"{% endif %}>Accueil</a></li>
|
||||
<li><a href="/pages/qui-sommes-nous" {% if name == "qui-sommes-nous" %}class="active"{% endif %}>Qui sommes-nous ?</a></li>
|
||||
<li><a href="/category/news" {% if name == "news" %}class="active"{% endif %}>Actualités</a></li>
|
||||
<li><a href="/category/jobs" {% if name == "jobs" %}class="active"{% endif %}>Offres d'emploi</a></li>
|
||||
<li><a href="/pages/communaute" {% if name == "communaute" %}class="active"{% endif %}>Communauté</a></li>
|
||||
<li><a href="/pages/adhesions" {% if name == "adhesions" %}class="active"{% endif %}>Adhésion</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
{% block title %}{{ SITENAME }} - {{ category }}{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<section>
|
||||
<section class="news-jobs">
|
||||
<h2>{{ "Actualités" if category=="news" else "Offres d'emploi" }}</h2>
|
||||
{% for article in articles_page.object_list if article.category == category %}
|
||||
<article>
|
||||
|
|
@ -11,7 +11,7 @@
|
|||
<time datetime="{{ article.date.isoformat() }}"> {{ article.locale_date }} </time>
|
||||
<h3><a href="{{ SITEURL }}/{{ article.url }}" rel="bookmark" title="Permalink to {{ article.title|striptags }}">{{ article.title }}</a></h3>
|
||||
</section>
|
||||
<p>{{ article.summary }}</p>
|
||||
<div>{{ article.summary }}</div>
|
||||
<section>
|
||||
<p>Par</p>
|
||||
<ul>
|
||||
|
|
|
|||
|
|
@ -1,47 +1,49 @@
|
|||
{% extends "base.html" %}
|
||||
{% block content %}
|
||||
<section>
|
||||
<section id="introduction">
|
||||
<h2>l'AFPy c'est</h2>
|
||||
<article>
|
||||
<h3>Une communauté</h3>
|
||||
<ul>
|
||||
<li>Un forum dynamique (Discourse)</li>
|
||||
<li>Des salons de discussion en temps réel (IRC & Discord)</li>
|
||||
<li> </li>
|
||||
</ul>
|
||||
</article>
|
||||
<section>
|
||||
<article>
|
||||
<h3>Une communauté</h3>
|
||||
<ul>
|
||||
<li>Un forum dynamique (Discourse)</li>
|
||||
<li>Des salons de discussion en temps réel (IRC & Discord)</li>
|
||||
<li> </li>
|
||||
</ul>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<h3>Des événements</h3>
|
||||
<ul>
|
||||
<li>L'organisation annuelle de la <a href="https://pycon.fr/">PyConFr</a></li>
|
||||
<li>Les <a href="https://discuss.afpy.org/c/meetups/12">Meetups</a></li>
|
||||
<li>Les ateliers de traduction</li>
|
||||
</ul>
|
||||
</article>
|
||||
<article>
|
||||
<h3>Des événements</h3>
|
||||
<ul>
|
||||
<li>L'organisation annuelle de la <a href="https://pycon.fr/">PyConFr</a></li>
|
||||
<li>Les <a href="https://discuss.afpy.org/c/meetups/12">Meetups</a></li>
|
||||
<li>Les ateliers de traduction</li>
|
||||
</ul>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<h3>Des outils</h3>
|
||||
<ul>
|
||||
<li>Une plateforme de Visio-conférence (Big Blue Button)</li>
|
||||
<li>Un gestionnaire de dépôts (Gitea)</li>
|
||||
<li>Un site d'apprentissage par exercices : <a href="https://hackinscience.org/">Hackinscience</a> (Licence CC0)</li>
|
||||
</ul>
|
||||
</article>
|
||||
<article>
|
||||
<h3>Des outils</h3>
|
||||
<ul>
|
||||
<li>Une plateforme de Visio-conférence (Big Blue Button)</li>
|
||||
<li>Un gestionnaire de dépôts (Gitea)</li>
|
||||
<li>Un site d'apprentissage par exercices : <a href="https://hackinscience.org/">Hackinscience</a> (Licence CC0)</li>
|
||||
</ul>
|
||||
</article>
|
||||
|
||||
<article>
|
||||
<h3>Du contenu</h3>
|
||||
<ul>
|
||||
<li>Des offres d'emploi</li>
|
||||
<li>La traduction de <a href="https://docs.python.org/fr">la documentation de Python</a> (Licence MIT)</li>
|
||||
<li> </li>
|
||||
</ul>
|
||||
</article>
|
||||
<article>
|
||||
<h3>Du contenu</h3>
|
||||
<ul>
|
||||
<li>Des offres d'emploi</li>
|
||||
<li>La traduction de <a href="https://docs.python.org/fr">la documentation de Python</a> (Licence MIT)</li>
|
||||
<li> </li>
|
||||
</ul>
|
||||
</article>
|
||||
</section>
|
||||
|
||||
<p>Il est possible de soutenir les projets de l'AFPy <a href="/pages/adhesions">en cotisant ou en effectuant un don.</a></p>
|
||||
<p>Il est possible de soutenir les projets de l'AFPy <a href="/pages/adhesions">en cotisant ou en effectuant un don</a>.</p>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<section class="news-jobs">
|
||||
<h2>Dernières actualités</h2>
|
||||
{% for article in articles if article.category == "news" %}
|
||||
{% if loop.index < 4 %}
|
||||
|
|
@ -50,7 +52,7 @@
|
|||
<time datetime="{{ article.date.isoformat() }}"> {{ article.locale_date }} </time>
|
||||
<h3><a href="{{ SITEURL }}/{{ article.url }}" rel="bookmark" title="Permalink to {{ article.title|striptags }}">{{ article.title }}</a></h3>
|
||||
</section>
|
||||
<p>{{ article.summary }}</p>
|
||||
<div>{{ article.summary }}</div>
|
||||
<section>
|
||||
<p>Par</p>
|
||||
<ul>
|
||||
|
|
|
|||
Loading…
Reference in New Issue