Refactor CSS styles and update HTML structure for improved layout and responsiveness

- Updated padding values for sections in custom CSS files to enhance spacing.
- Introduced new card styles with hover effects for better user interaction.
- Added new gradient card layout in the chill theme for a visually appealing design.
- Removed obsolete sector layout and replaced it with a more flexible gradient card layout.
- Enhanced feature list layout with improved pagination and sidebar integration.
- Created a new shortcode for gradient card sections to streamline feature presentation.
This commit is contained in:
Boris Waaub
2026-02-24 15:32:06 +01:00
parent 923b4c4d7f
commit c350ea3dcd
15 changed files with 622 additions and 635 deletions

View File

@@ -62,7 +62,7 @@ layout: "simple"
"description": "Pour les structures qui souhaitent déléguer totalement la configuration.",
"featured": true,
"features": [
"Tout les avantages du pack initial *",
"Tous les avantages du pack initial *",
"1 journée de paramétrage supplémentaire"
],
"additional_description": "* A partir du 4ème utilisateur: 40€ supplémentaire/an.",

View File

@@ -1,32 +1,51 @@
---
title: Installation
layout: "simple-card"
developers:
title: "Échanger avec les développeurs"
description: "Il existe un salon sur la messagerie Matrix, pour échanger avec les développeurs de Chill."
linkDescription: "Pour le rejoindre cliquez sur le lien ci-dessous :"
linkLabel: "#chill-social-admin:matrix.org"
linkUrl: "https://matrix.to/#/#chill-social-admin:matrix.org"
qrLabel: "ou scannez le code QR :"
qrImg: "/images/chill-admin.png"
description: Installation et hébergement de Chill
card: "Chill est un logiciel open-source disponible sous licence libre AGPL. Vous pouvez l'auto-héberger ou faire appel à un prestataire pour son installation et sa maintenance."
bgColor: "activity-sector"
layout: "gradient-card"
---
<h3 class="content-subtitle bord-1 mb-2 mt-5">Auto-hébergé</h3>
{{< gradient-card-section title="Auto-hébergé" description="Installez Chill sur votre propre serveur à partir des images Docker." >}}
<div class="space-y-4">
<p>Chill est un logiciel open-source disponible sous licence libre AGPL, dont le code source est hébergé sur <a href="https://gitlab.com/Chill-Projet" target="_blank" class="nav-link">son dépôt gitlab</a>.</p>
<p>Avant de l'installer, n'hésitez pas à tester <a href="http://demo.chill.social/" target="_blank" class="nav-link">la démo</a>.</p>
<p>Chill est une application web à installer sur un serveur dédié. L'application est alors disponible pour plusieurs utilisateurs sur une adresse internet, par exemple un sous-domaine du site web de votre organisation.</p>
<p>Chill est installable à partir d'images Docker. Moyennant des ressources internes en informatique, vous pouvez installer vous-même Chill en vous référant à la documentation d'installation.</p>
<p>La plupart des organisations utilisant Chill passent par un prestataire informatique pour son installation, son hébergement et sa maintenance.</p>
<a href="https://chill.readthedocs.io/en/latest/installation/index.html" target="_blank" class="btn btn-primary mt-4">
Consulter la documentation d'installation
</a>
</div>
{{< /gradient-card-section >}}
Chill est un logiciel open-source disponible sous licence libre AGPL, dont le code source est hébergé sur <a href="https://gitlab.com/Chill-Projet" target="_blank" class="nav-link">son dépôt gitlab</a>.
{{< gradient-card-section title="Par Champs Libres coopérative" description="Faites appel à Champs Libres pour l'installation, l'hébergement et la maintenance de Chill." >}}
<div class="space-y-4">
<ul class="list-disc list-inside">
<li>Localisé en Belgique, à Namur</li>
<li>Hébergement sécurisé et maintenance</li>
<li>Support technique professionnel</li>
</ul>
<a href="https://www.champs-libres.coop/page/social/" target="_blank" class="btn btn-primary mt-4">
Visiter le site de Champs-Libres
</a>
</div>
{{< /gradient-card-section >}}
Avant de l'installer, n'hésitez pas à tester <a href="http://demo.chill.social/" target="_blank" class="nav-link">la démo</a>.
<br>
<br>
Chill est une application web à installer sur un serveur dédié. L'application est alors disponible pour plusieurs utilisateurs sur une adresse internet, par exemple un sous-domaine du site web de votre organisation.
<br>
<br>
Chill est installable à partir d'images Docker. Moyennant des ressources internes en informatique, vous pouvez installer vous-même Chill en vous référant à la <a href="https://chill.readthedocs.io/en/latest/installation/index.html" target="_blank" class="nav-link"><strong>documentation d'installation</strong></a>.
La plupart des organisations utilisant Chill passent par un prestataire informatique pour son installation, son hébergement et sa maintenance.
<h3 class="content-subtitle bord-2 mb-2 mt-5">Par Champs Libres coopérative</h3>
- Localisé en Belgique, à Namur
- Site web: <a href="https://www.champs-libres.coop/page/social/" target="_blank" class="nav-link">Champs-Libres</a>
{{< gradient-card-section title="Échanger avec les développeurs" description="Il existe un salon sur la messagerie Matrix, pour échanger avec les développeurs de Chill." >}}
<div class="flex flex-col items-center gap-4">
<p>Pour le rejoindre cliquez sur le lien ci-dessous :</p>
<a href="https://matrix.to/#/#chill-social-admin:matrix.org" target="_blank" class="btn btn-primary">
#chill-social-admin:matrix.org
</a>
<p>ou scannez le code QR :</p>
<img src="/images/chill-admin.png" alt="QR Code Matrix" class="w-48 h-48">
</div>
{{< /gradient-card-section >}}

View File

@@ -1,29 +1,26 @@
---
title: Manuels
layout: "simple-card"
description: Manuels d'utilisation de Chill
card: "Il existe un manuel d'utilisation à l'usage des utilisateurs et un autre à l'usage des administrateurs.<br><br>
- L'**utilisateur** est le travailleur social qui **utilise Chill dans son quotidien**.<br>
- L'**administrateur** est un rôle spécifique, qui peut accéder à une interface d'administration de l'application, lui permettant de régler la **configuration de Chill**"
bgColor: "activity-sector"
layout: "gradient-card"
---
<h5 class="content-subtitle bord-1 mb-2 mt-5">Manuels d'utilisation de Chill</h5>
<div class="mb-4">
Il existe un manuel d'utilisation à l'usage des utilisateurs et un autre à l'usage des administrateurs.
L'utilisateur est le travailleur social qui utilise Chill dans son quotidien.
{{< gradient-card-section title="Téléchargement des manuels" description="Accédez aux manuels d'utilisation de Chill pour les administrateurs et les utilisateurs." >}}
<div class="flex flex-col gap-4 items-center">
<a href="https://gitea.champs-libres.be/Chill-project/manuals/releases/download/latest/Manuel%20administrateur.pdf" target="blank" class="btn btn-primary">
Télécharger le manuel administrateur
</a>
<a href="https://gitea.champs-libres.be/Chill-project/manuals/releases/download/latest/Manuel%20utilisateur.pdf" target="blank" class="btn btn-primary">
Télécharger le manuel utilisateur
</a>
</div>
{{< /gradient-card-section >}}
L'administrateur est un rôle spécifique, qui peut accèder à une interface d'administration de l'application, lui permettant de régler la configuration de Chill.
</div>
<div class="flex flex-col gap-4 items-center">
<a href="https://gitea.champs-libres.be/Chill-project/manuals/releases/download/latest/Manuel%20administrateur.pdf" target="blank" class="col text-center px-5 py-3 rounded-lg bg-primary-400 text-white hover:bg-primary-700 font-medium transition duration-300">
Télecharger le manuel administrateur
</a>
<a href="https://gitea.champs-libres.be/Chill-project/manuals/releases/download/latest/Manuel%20utilisateur.pdf" target="blank" class="text-center px-5 py-3 rounded-lg bg-primary-400 text-white hover:bg-primary-700 font-medium transition duration-300">
Télecharger le manuel utilisateur
</a>
</div>
<h5 class="content-subtitle bord-2 mb-2 mt-5">Formation des utilisateurs</h5>
<div class="mb-4">
Renseignez-vous pour organiser une journée de formation à l'utilisation de Chill depuis la <a href="/contact" class="nav-link">page contact</a>
</div>
{{< gradient-card-section title="Formation des utilisateurs" description="Organisez une journée de formation à l'utilisation de Chill." >}}
<a href="/contact" class="btn btn-primary mt-4">Contactez-nous</a>
{{< /gradient-card-section >}}

View File

@@ -1,32 +1,51 @@
---
title: Documentation technique
layout: "simple"
developers:
title: "Échanger avec les développeurs"
description: "Il existe un salon sur la messagerie Matrix, pour échanger avec les développeurs de Chill."
linkDescription: "Pour le rejoindre cliquez sur le lien ci-dessous :"
linkLabel: "#chill-social-admin:matrix.org"
linkUrl: "https://matrix.to/#/#chill-social-admin:matrix.org"
qrLabel: "ou scannez le code QR :"
qrImg: "/images/chill-admin.png"
description: Ressources techniques pour développeurs Chill
card: "Accédez au code source, à la documentation technique et aux outils de développement de Chill."
bgColor: "activity-sector"
layout: "gradient-card"
---
<div class="max-w-xxl mx-auto p-6 bg-white rounded shadow" >
<h3 class="content-subtitle bord-1 mb-2 mt-5">Code source de Chill</h3>
Le code source de CHILL est hébergé sur GitLab.
Le dépôt <a class="nav-link" href="https://gitlab.com/Chill-Projet/chill-bundles" target="blank">chill-bundles</a> comporte les fonctionnalités principales de Chill. Ce dépôt est un ensemble de bundles Symfony.
{{< gradient-card-section title="Code source de Chill" description="Le code source de Chill est hébergé sur GitLab." >}}
<div class="space-y-4">
<p>Le dépôt <a class="nav-link" href="https://gitlab.com/Chill-Projet/chill-bundles" target="_blank">chill-bundles</a> comporte les fonctionnalités principales de Chill. Ce dépôt est un ensemble de bundles Symfony.</p>
<p>Pour être déployées, il est préférable de les inclure dans une application Symfony en les incluant dans les dépendances Composer. De cette manière, il est aussi possible de personnaliser la configuration et l'exécution de l'application.</p>
<a href="https://gitlab.com/Chill-Projet/chill-bundles" target="_blank" class="btn btn-primary mt-4">
Accéder au dépôt GitLab
</a>
</div>
{{< /gradient-card-section >}}
{{< gradient-card-section title="Issues et tickets" description="Signalez des bugs ou proposez des améliorations." >}}
<div class="space-y-4">
<p>Les tickets concernant le code de Chill se situent dans le dépôt chill-bundles.</p>
<a href="https://gitlab.com/Chill-Projet/chill-bundles/-/issues" target="_blank" class="btn btn-primary mt-4">
Consulter les tickets
</a>
</div>
{{< /gradient-card-section >}}
Pour être déployées, il est préférable de les inclure dans une application Symfony en les incluant dans les dépendances Composer. De cette manière, il est aussi possible de personnaliser la configuration et l'exécution de l'application. La procédure est expliquée dans la <a class="nav-link" href="https://docs.chill.social/en/latest" target="blank"> documentation</a>.
{{< gradient-card-section title="Documentation technique" description="Consultez la documentation complète pour développeurs." >}}
<div class="space-y-4">
<p>La documentation technique de Chill explique la procédure d'installation, la configuration et le développement de modules personnalisés.</p>
<a href="https://docs.chill.social/en/latest/" target="_blank" class="btn btn-primary mt-4">
Consulter la documentation
</a>
</div>
{{< /gradient-card-section >}}
<h5 class="content-subtitle bord-2 mb-2 mt-5">Issues</h5>
Les tickets concernant le code de Chill se situent par conséquent dans ce dépôt chill-bundles, voir <a class="nav-link" href="https://gitlab.com/Chill-Projet/chill-bundles/-/issues" target="blank"> tickets CHILL</a>.
<h5 class="content-subtitle bord-3 mb-2 mt-5">Documentation technique</h5>
La documentation technique de Chill se trouve à l'adresse suivante: <a class="nav-link" href="https://docs.chill.social/en/latest/" target="blank">documentation CHILL</a>
</div>
{{< gradient-card-section title="Échanger avec les développeurs" description="Il existe un salon sur la messagerie Matrix, pour échanger avec les développeurs de Chill." >}}
<div class="flex flex-col items-center gap-4">
<p>Pour le rejoindre cliquez sur le lien ci-dessous :</p>
<a href="https://matrix.to/#/#chill-social-admin:matrix.org" target="_blank" class="btn btn-primary">
#chill-social-admin:matrix.org
</a>
<p>ou scannez le code QR :</p>
<img src="/images/chill-admin.png" alt="QR Code Matrix" class="w-48 h-48">
</div>
{{< /gradient-card-section >}}

View File

@@ -1,6 +1,9 @@
---
title: "Secteur d'activités"
layout: "sector"
description: "Une solution pensée pour le secteur social, dans toute sa diversité"
card: "CHILL est une solution complète conçue pour s'adapter aux réalités nombreuses du secteur social. Grâce à sa grande flexibilité, elle répond aux besoins de structures très différentes, quels que soient leur taille ou le public accompagné."
layout: "gradient-card"
bgColor: "activity-sector"
client_logos:
- name: "amli"
logo: "/images/logos/amli.png"
@@ -50,23 +53,13 @@ client_logos:
logo: "/images/logos/vendée.png"
---
{{< section-container class="bg-gradient-to-b from-secondary-50 via-secondary-50 to-white pt-20 pb-32" >}}
<div class="text-center">
<h1 class="text-4xl md:text-5xl font-bold mb-6">Secteur d'activités</h1>
<p class="text-xl text-gray-600 mb-16">Une solution pensée pour le secteur social, dans toute sa diversité</p>
<div class="max-w-3xl mx-auto bg-white rounded-xl shadow-sm p-8">
<p class="text-xl text-gray-600">
CHILL est une solution complète conçue pour sadapter aux réalités nombreuses du secteur social. Grâce à sa grande flexibilité, elle répond aux besoins de structures très différentes, quels que soient leur taille ou le public accompagné.
</p>
</div>
</div>
{{< /section-container >}}
{{< sector-section title="CHILL, un logiciel ancré dans les valeurs du social" description="CHILL est édité par **Champs Libres**, une **coopérative belge à finalité sociale** active depuis plusieurs années dans le développement de solutions numériques orientées vers lutilité sociale et collective. Champs Libres promeut le **logiciel libre** et travaille régulièrement avec des organisations du secteur non marchand, des pouvoirs publics et des associations, en développant des outils qui répondent aux besoins réels des utilisateurs et favorisent le partage et la réutilisation du code pour le bien commun.">}}
{{< gradient-card-section title="CHILL, un logiciel ancré dans les valeurs du social" gradient-card="CHILL est édité par **Champs Libres**, une **coopérative belge à finalité sociale** active depuis plusieurs années dans le développement de solutions numériques orientées vers lutilité sociale et collective. Champs Libres promeut le **logiciel libre** et travaille régulièrement avec des organisations du secteur non marchand, des pouvoirs publics et des associations, en développant des outils qui répondent aux besoins réels des utilisateurs et favorisent le partage et la réutilisation du code pour le bien commun.">}}
Cette approche pragmatique et éthique signifie que CHILL nest pas seulement un outil : cest un projet qui sest construit <b>avec et pour les travailleurs sociaux</b>, en sappuyant sur une compréhension profonde des pratiques professionnelles et des défis du terrain.
{{< /sector-section >}}
{{< /gradient-card-section >}}
{{< sector-section title="Des domaines daction variés" description="CHILL est aujourdhui utilisé dans de nombreux secteurs de laction sociale">}}
{{< gradient-card-section title="Des domaines daction variés" description="CHILL est aujourdhui utilisé dans de nombreux secteurs de laction sociale">}}
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
{{< value-card
@@ -94,11 +87,11 @@ Cette approche pragmatique et éthique signifie que CHILL nest pas seulement
icon="/images/sectors/home-heart.svg"
>}}
</div>
{{< /sector-section >}}
{{< /gradient-card-section >}}
{{< sector-section title="Une solution adaptée à toutes les organisations" description="Que vous soyez une petite structure locale ou une organisation plus large regroupant plusieurs dizaines, voire centaines de travailleurs sociaux, CHILL sadapte à votre fonctionnement et à vos pratiques de terrain.">}}
{{< gradient-card-section title="Une solution adaptée à toutes les organisations" description="Que vous soyez une petite structure locale ou une organisation plus large regroupant plusieurs dizaines, voire centaines de travailleurs sociaux, CHILL sadapte à votre fonctionnement et à vos pratiques de terrain.">}}
{{< client-logos title="Ils font déjà confiance à CHILL" >}}
{{< /sector-section >}}
{{< /gradient-card-section >}}