wip(Home Design)
All checks were successful
Deploy Roxane to Preprod / deploy (push) Successful in 2m32s
All checks were successful
Deploy Roxane to Preprod / deploy (push) Successful in 2m32s
This commit is contained in:
@@ -1,38 +1,40 @@
|
||||
import {SectionHeading} from "@/components/common/SectionHeading";
|
||||
import {Button} from '@/components/ui/button';
|
||||
|
||||
export function AboutSection() {
|
||||
return (
|
||||
<section className="w-full py-16">
|
||||
<div className="max-w-7xl mx-auto px-4">
|
||||
<SectionHeading title="Qui sommes-nous ?" color="secondary" subtitle="Le Retzien Libre, c’est une association qui promeut l’auto-hébergement et la décentralisation des services en ligne depuis 2017." align='left' />
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-8 mt-5">
|
||||
<div className="flex flex-col gap-3">
|
||||
<h3 className="text-xl font-semibold">Une association locale</h3>
|
||||
<p>
|
||||
Le Retzien Libre est une association engagée pour la promotion du logiciel libre
|
||||
et la protection de vos données personnelles sur le territoire du Pays de Retz.
|
||||
</p>
|
||||
<SectionHeading title="Qui sommes-nous ?" color="secondary"
|
||||
subtitle="Le Retzien Libre, c’est une association qui promeut l’auto-hébergement et la décentralisation des services en ligne depuis 2017."
|
||||
align='left'/>
|
||||
<div
|
||||
className="bg-white rounded-4xl border-3 border-black mt-10 px-10 pt-20 pb-10 shadow-[4px_4px_0px_rgba(0,0,0,1)]">
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-8">
|
||||
<div className="flex flex-col gap-3 lg:border-r-2 border-black lg:pr-10 border-0">
|
||||
<h3 className="text-xl text-primary font-semibold">Une association locale</h3>
|
||||
<p>
|
||||
Nous voulons vous proposer à travers des outils libres, ouverts et solidaires, de
|
||||
quitter l'industrie du G.A.F.A.M.
|
||||
</p>
|
||||
</div>
|
||||
<div className="flex flex-col gap-3 border-r-2 border-black pr-10">
|
||||
<h3 className="text-xl text-primary font-semibold">Notre mission</h3>
|
||||
<p>
|
||||
Nous nous positionnons comme "A.M.A.P. informatique", délivrant des services "bio",
|
||||
"éthiques" et "locaux" dans le Pays de Retz et Nantes.
|
||||
</p>
|
||||
</div>
|
||||
<div className="flex flex-col gap-3">
|
||||
<h3 className="text-xl text-primary font-semibold">Notre solution</h3>
|
||||
<p>
|
||||
Pour seulement 12€/an, adhérez au Retzien Libre pour bénéficier des services de
|
||||
l'association et reprenez le contrôle de vos données.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex flex-col gap-3">
|
||||
<h3 className="text-xl font-semibold">Notre mission</h3>
|
||||
<p>
|
||||
Nous sensibilisons et accompagnons les citoyens vers des pratiques numériques
|
||||
plus respectueuses, libres et indépendantes des grandes plateformes commerciales.
|
||||
</p>
|
||||
</div>
|
||||
<div className="flex flex-col gap-3">
|
||||
<h3 className="text-xl font-semibold">Surveillance massive</h3>
|
||||
<p>
|
||||
Les GAFAM collectent et exploitent vos données personnelles à des fins commerciales,
|
||||
sans transparence sur l'usage qui en est fait.
|
||||
</p>
|
||||
</div>
|
||||
<div className="flex flex-col gap-3">
|
||||
<h3 className="text-xl font-semibold">Monopole numérique</h3>
|
||||
<p>
|
||||
Concentration excessive du pouvoir et dépendance aux services centralisés.
|
||||
Il existe des alternatives libres, locales et respectueuses.
|
||||
</p>
|
||||
<div className="w-full flex justify-center mt-20">
|
||||
<Button variant="default">En savoir plus en lisant notre Blog</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -2,22 +2,29 @@ import { Link, usePage } from '@inertiajs/react';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { dashboard, register } from '@/routes';
|
||||
import { type SharedData } from '@/types';
|
||||
import illustrationImage from '@/img/utils/lrl-illustration.png';
|
||||
import IllustrationLogo from '@/img/utils/lrl-logo-full.svg';
|
||||
|
||||
export function AlternativeSection() {
|
||||
const { auth } = usePage<SharedData>().props;
|
||||
|
||||
return (
|
||||
<section className="w-full py-16">
|
||||
<div className="max-w-7xl mx-auto px-4">
|
||||
<div className="bg-gray-100 rounded-4xl max-w-7xl mx-auto px-4">
|
||||
<div className="flex flex-col lg:flex-row items-center gap-12">
|
||||
<div className="lg:w-1/2 flex justify-center">
|
||||
<img
|
||||
src={IllustrationLogo}
|
||||
alt="Le Retzien Libre"
|
||||
className="rounded-lg max-w-md w-full"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col gap-6 lg:w-1/2">
|
||||
<h2 className="text-3xl font-bold">
|
||||
<h2 className="text-3xl text-black font-medium">
|
||||
Notre alternative : Le Retzien Libre
|
||||
</h2>
|
||||
<p>
|
||||
Une association locale engagée pour la promotion du logiciel libre
|
||||
et la protection de vos données personnelles.
|
||||
Ici, pas d’exploitation des vos données personnelles à des fins commerciales, ni de dépense aux services centralisés.<br/>
|
||||
Le Retzien Libre, c’est une association locale engagée pour la promotion du logiciel libre et la protection de vos données personnelles.
|
||||
</p>
|
||||
{auth.user ? (
|
||||
<Link href={dashboard()}>
|
||||
@@ -25,17 +32,10 @@ export function AlternativeSection() {
|
||||
</Link>
|
||||
) : (
|
||||
<Link href={register()}>
|
||||
<Button variant="default">Rejoignez-nous</Button>
|
||||
<Button variant="secondary">Rejoignez-nous</Button>
|
||||
</Link>
|
||||
)}
|
||||
</div>
|
||||
<div className="lg:w-1/2 flex justify-center">
|
||||
<img
|
||||
src={illustrationImage}
|
||||
alt="Le Retzien Libre"
|
||||
className="rounded-lg max-w-md w-full"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
@@ -3,7 +3,7 @@ import {Service} from "@/types";
|
||||
export function ServiceCard({title, colorTitle, bgColor, bgTitle, description, link, illustration}: Service) {
|
||||
return (
|
||||
<div
|
||||
className={`flex gap-1 items-center bg-${bgColor} justify-center gap-4 rounded-3xl p-10 border-3 border-black shadow-[4px_4px_0px_rgba(0,0,0,1)] hover:shadow-none hover:translate-2 transition delay-50 duration-200 ease-in-out`}>
|
||||
className={`flex gap-1 items-center bg-${bgColor} justify-center gap-4 rounded-4xl p-10 border-3 border-black shadow-[4px_4px_0px_rgba(0,0,0,1)] hover:shadow-none hover:translate-2 transition delay-50 duration-200 ease-in-out`}>
|
||||
<div>
|
||||
<div className="max-w-[150px]">
|
||||
<h3 className={`inline text-2xl font-semibold text-${colorTitle} font-medium bg-${bgTitle} rounded p-1 line-clamp-2`}>{title}</h3>
|
||||
|
||||
Reference in New Issue
Block a user