From 3be34b3f6e294c278ecbe7bff4fb55c0e37e2023 Mon Sep 17 00:00:00 2001 From: Lucie Anglade Date: Sat, 5 Aug 2023 16:39:33 +0200 Subject: [PATCH] A bit of style for index and categories pages --- themes/afpy/static/css/website.css | 82 ++++++++++++++++++++++++++--- themes/afpy/templates/base.html | 15 +++--- themes/afpy/templates/category.html | 4 +- themes/afpy/templates/index.html | 74 +++++++++++++------------- 4 files changed, 122 insertions(+), 53 deletions(-) diff --git a/themes/afpy/static/css/website.css b/themes/afpy/static/css/website.css index e2b77b6..350fa7f 100644 --- a/themes/afpy/static/css/website.css +++ b/themes/afpy/static/css/website.css @@ -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; } diff --git a/themes/afpy/templates/base.html b/themes/afpy/templates/base.html index f5c20f1..7e44956 100644 --- a/themes/afpy/templates/base.html +++ b/themes/afpy/templates/base.html @@ -12,19 +12,20 @@ {% endblock head %} - + {% set name = output_file.split('/')[-1].split('.')[0] %} +
AFPy logo

AFPy

diff --git a/themes/afpy/templates/category.html b/themes/afpy/templates/category.html index 0a9896c..0dbb70b 100644 --- a/themes/afpy/templates/category.html +++ b/themes/afpy/templates/category.html @@ -3,7 +3,7 @@ {% block title %}{{ SITENAME }} - {{ category }}{% endblock %} {% block content %} -
+

{{ "Actualités" if category=="news" else "Offres d'emploi" }}

{% for article in articles_page.object_list if article.category == category %}
-

{{ article.summary }}

+
{{ article.summary }}

Par

    diff --git a/themes/afpy/templates/index.html b/themes/afpy/templates/index.html index 425b94d..a4560fc 100644 --- a/themes/afpy/templates/index.html +++ b/themes/afpy/templates/index.html @@ -1,47 +1,49 @@ {% extends "base.html" %} {% block content %} -
    +

    l'AFPy c'est

    -
    -

    Une communauté

    -
      -
    • Un forum dynamique (Discourse)
      • -
    • Des salons de discussion en temps réel (IRC & Discord)
      • -
    •  
      • -
    -
    +
    +
    +

    Une communauté

    +
      +
    • Un forum dynamique (Discourse)
      • +
    • Des salons de discussion en temps réel (IRC & Discord)
      • +
    •  
      • +
    +
    -
    -

    Des événements

    -
      -
    • L'organisation annuelle de la PyConFr
      • -
    • Les Meetups
      • -
    • Les ateliers de traduction
      • -
    -
    +
    +

    Des événements

    +
      +
    • L'organisation annuelle de la PyConFr
      • +
    • Les Meetups
      • +
    • Les ateliers de traduction
      • +
    +
    -
    -

    Des outils

    -
      -
    • Une plateforme de Visio-conférence (Big Blue Button)
      • -
    • Un gestionnaire de dépôts (Gitea)
      • -
    • Un site d'apprentissage par exercices : Hackinscience (Licence CC0)
      • -
    -
    +
    +

    Des outils

    +
      +
    • Une plateforme de Visio-conférence (Big Blue Button)
      • +
    • Un gestionnaire de dépôts (Gitea)
      • +
    • Un site d'apprentissage par exercices : Hackinscience (Licence CC0)
      • +
    +
    - + +
    -

    Il est possible de soutenir les projets de l'AFPy en cotisant ou en effectuant un don.

    +

    Il est possible de soutenir les projets de l'AFPy en cotisant ou en effectuant un don.

    -
    +

    Dernières actualités

    {% for article in articles if article.category == "news" %} {% if loop.index < 4 %} @@ -50,7 +52,7 @@

    {{ article.title }}

    -

    {{ article.summary }}

    +
    {{ article.summary }}

    Par