Sulley
/
FlyAcrobatics_Landing_Page
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Rajout de photo

This commit is contained in:
Gregory Trullemans 2023-10-01 12:30:22 +02:00
parent e5ba027ea8
commit 788057ca77
11 changed files with 199 additions and 685 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
.gitignore vendored
View File

@ -1,3 +1,8 @@
.htaccess
./blog/*
./CowGirl/*
blog/*
CowGirl/*
font-awesome/*
fonts/*
routines/*
img/20*
README.md

738
css/output.css
View File

File diff suppressed because it is too large Load Diff

0
img/bg.jpg → img/background/bg.jpg
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 333 KiB

After

Width:  |  Height:  |  Size: 333 KiB

BIN
img/callout.jpg
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 280 KiB

0
img/logo.min.png → img/logo/logo.min.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 83 KiB

After

Width:  |  Height:  |  Size: 83 KiB

0
img/logo.png → img/logo/logo.png
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 792 KiB

After

Width:  |  Height:  |  Size: 792 KiB

BIN
img/portfolio-1.jpg
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 109 KiB

BIN
img/portfolio-2.jpg
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 75 KiB

BIN
img/portfolio-3.jpg
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 104 KiB

BIN
img/portfolio-4.jpg
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 52 KiB

137
index_new.html
View File

@ -13,7 +13,6 @@
<meta name="author" content="">
<title>Flying Acrobatics Trampoline Club</title>
<!-- <title>Trampoline | La Vaillante Tubize</title> -->
<link href="css/output.css" rel="stylesheet">
</head>
@ -22,20 +21,20 @@
<div class="dark:bg-sky-950">
<div class="mx-auto">
<div class="relative isolate overflow-hidden bg-sky-700 px-6 pt-16 shadow-2xl sm:rounded-3xl sm:px-16 md:pt-24 lg:flex lg:gap-x-20 lg:px-18 lg:pt-0">
<div class="mx-auto max-w-md text-center lg:mx-0 lg:flex-auto lg:py-[12.8rem] lg:text-left">
<h1 class="text-3xl font-bold tracking-tight sm:text-3xl text-slate-200">Flying Acrobatics Trampoline</h1>
<div class="relative isolate overflow-hidden bg-sky-700 px-6 pt-14 shadow-2xl sm:rounded-3xl sm:px-16 md:pt-24 lg:flex lg:gap-x-20 lg:px-18 lg:pt-0">
<div class="mx-auto max-w-md text-center lg:mx-0 lg:flex-auto lg:py-[10.9rem] lg:text-left">
<h1 class="text-3xl font-bold tracking-tight sm:text-3xl"><font color="#fddd0c">F</font><font color="#fbd50d">l</font><font color="#f8cd0e">y</font><font color="#f6c510">i</font><font color="#f3bd11">n</font><font color="#f1b412">g</font><font color="#eeac13"> </font><font color="#eca414">A</font><font color="#e99c15">c</font><font color="#e79417">r</font><font color="#e58c18">o</font><font color="#e28419">b</font><font color="#e07c1a">a</font><font color="#dd741b">t</font><font color="#db6b1d">i</font><font color="#d8631e">c</font><font color="#d65b1f">s</font><font color="#d35320"> </font><font color="#d14b21">T</font><font color="#cf4323">r</font><font color="#cc3b24">a</font><font color="#ca3325">m</font><font color="#c72b26">p</font><font color="#c52227">o</font><font color="#c21a28">l</font><font color="#c0122a">i</font><font color="#bd0a2b">n</font><font color="#bb022c">e</font></h1>
<h2 class="text-lg font-bold tracking-tight sm:text-lg text-gray-200">Spirit in the sky</h2>
<p class="mt-6 text-lg leading-8 text-gray-300">
Discipline exclusivement acrobatique mélangeant audace, performances physiques, force, souplesse et maîtrise technique, le <i>trampoline</i> peut se pratiquer en individuel ou en synchronisé, tant en compétition qu’en loisir. Conjuguant l'aspect acrobatique à l’adrénaline des sensations verticales, il peut être considéré à la fois comme un sport et une attraction.
<p class="mt-6 text-lg leading-8 text-gray-300 text-justify">
Le <i>trampoline</i>, vous connaissez ? Une discipline exclusivement acrobatique mélangeant audace, performances physiques, force, souplesse et maîtrise technique, le trampoline peut se pratiquer tant en compétition qu’en loisir. Conjuguant l'aspect acrobatique à l’adrénaline des sensations verticales, c’est autant un sport qu’une attraction où chacun y trouve son compte.
</p>
<div class="mt-10 flex items-center justify-center gap-x-6 lg:justify-start">
<div class="mt-10 flex items-center justify-center gap-x-6 lg:justify-start mb-6">
<a href="https://www.flyingacrobaticstrampoline.be/blog/" class="rounded-md bg-white px-3.5 py-2.5 text-sm font-semibold text-gray-900 shadow-sm hover:bg-gray-100 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-white">C'est parti</a>
<a href="#" class="text-sm font-semibold leading-6 text-white">Plus d'information <span aria-hidden="true">→</span></a>
<a href="#about" class="text-sm font-semibold leading-6 text-white">Plus d'information <span aria-hidden="true">→</span></a>
</div>
</div>
<div class="relative">
<img class="absolute left-0 top-0 w-[75rem] max-w-none rounded-md bg-white/5 ring-1 ring-white/10" src="./img/bg.jpg" alt="App screenshot">
<img class="absolute left-0 top-0 w-[75rem] max-w-none rounded-md bg-white/5 ring-1 ring-white/10" src="./img/background/bg.jpg" alt="App screenshot">
<svg class="absolute inset-y-0 h-full fill-current text-sky-700 w-32 -ml-16" preserveAspectRatio="none" viewBox="0 0 100 100">
<polygon points="50,0 100,0 50,100, 0,100"></polygon>
</svg>
@ -45,14 +44,14 @@
</div>
<!-- About -->
<div class="dark:bg-sky-950">
<div id="about" class="dark:bg-sky-950">
<div class="mx-auto max-w-7xl py-12 sm:px-6 sm:py-32 md:py-24 lg:py-32 lg:px-8">
<div class="relative isolate overflow-hidden bg-sky-700 px-6 pt-16 shadow-2xl sm:rounded-3xl sm:px-16 md:pt-24 lg:flex lg:gap-x-20 lg:px-18 lg:pt-0">
<div class="mx-auto text-center lg:mx-0 lg:flex-auto lg:py-12">
<h2 class="text-3xl">Envie de découvrir un sport extra-ordinaire ?</h2>
<p class="lead">Le club <a href="http://www.flyingacrobaticstrampoline.be">Flying Acrobatics Trampoline</a> vous invite à découvrir le Trampoline. Nous vous proposons des cours de tous niveaux et pour tous, dès 6 ans, où chacun peut y trouver bonheur et épanouissement.</p>
<div class="relative isolate overflow-hidden bg-sky-700 px-6 py-16 shadow-2xl sm:rounded-3xl sm:px-16 md:pt-24 lg:flex lg:gap-x-20 lg:px-18 lg:py-12">
<div class="mx-auto text-center lg:mx-0 lg:flex-auto">
<h2 class="text-3xl mb-6">Envie de découvrir un sport extra-ordinaire ?</h2>
<p class="lead">Le club Flying Acrobatics Trampoline vous invite à découvrir le Trampoline. Nous accompagnons nos élèves dès l’âge de 6 ans et proposons des cours pour tous où chacun peut trouver bonheur et épanouissement selon ses attentes.</p>
<br />
<p class="lead">Nous proposons également des cours de psychomotricité dès l'âge de 3 ans (si l'enfant est propre) où les surfaces élastiques prendront petit à petit leur place.</p>
<p class="lead">Nous proposons également des cours de psychomotricité (Acrokids) dès l'âge de 3 ans (si l'enfant est propre).</p>
</div>
</div>
</div>
@ -61,29 +60,26 @@
<div class="dark:bg-sky-950">
<div class="mx-auto max-w-7xl px-6 lg:px-8">
<dl class="grid grid-cols-1 gap-x-8 gap-y-16 text-center lg:grid-cols-3">
<div class="mx-auto flex max-w-xs flex-col gap-y-4 dark:bg-slate-800 rounded-lg p-6">
<dt class="text-base leading-7 text-gray-300 text-justify">Psychomotricité sortant de l’ordinaire afin d’offrir aux enfants un plus large éventail de sensations. Tout en restant orientés vers le développement moteur global de l’enfant, les moniteurs introduisent progressivement des surfaces élastiques et les jeux d’équilibre.</dt>
<dd class="order-first text-3xl font-semibold tracking-tight text-sky-700 sm:text-5xl">Acrokids</dd>
<dl class="grid grid-cols-1 gap-x-16 gap-y-20 text-center lg:grid-cols-3">
<div class="mx-auto flex max-w-xs flex-col gap-y-4 dark:bg-sky-700 rounded-3xl p-6">
<dt class="text-base leading-7 text-gray-300 text-justify">Psychomotricité sortant de l’ordinaire afin d’offrir aux enfants un plus large éventail de sensations. Tout en restant orientés vers le développement moteur global de l’enfant, les moniteurs introduisent progressivement des surfaces élastiques et des jeux d’équilibre pour tendre vers les disciplines acrobatiques. Cette activité vise à offrir aux enfants un éventail de sensations le plus large possible.</dt>
<dd class="order-first text-3xl font-semibold tracking-tight text-slate-50 sm:text-5xl">AcroKids</dd>
</div>
<div class="mx-auto flex max-w-xs flex-col gap-y-4 dark:bg-slate-800 rounded-lg p-6">
<dt class="text-base leading-7 text-gray-300 text-justify">Cours sans compétition, orienté spécifiquement vers l'évolution de chaque élève en suivant son rythme et ses envies. L'élève peut participer à un cours par semaine d'une heure et demi pour les plus petits (-11 ans) ou 2h pour les plus grands (12 ans et plus).</dt>
<dd class="order-first text-3xl font-semibold tracking-tight text-sky-700 sm:text-5xl">AcroFun</dd>
<div class="mx-auto flex max-w-xs flex-col gap-y-4 dark:bg-sky-700 rounded-3xl p-6">
<dt class="text-base leading-7 text-gray-300 text-justify">Pas de compétition. Une séance orientée spécifiquement vers l’évolution de chaque élève en suivant son rythme et ses envies. L’élève peut participer à un cours par semaine d’une heure et demi pour les plus petits (-11 ans) ou 2h pour les plus grands (12 ans et plus).</dt>
<dd class="order-first text-3xl font-semibold tracking-tight text-slate-50 sm:text-5xl">AcroFun</dd>
</div>
<div class="mx-auto flex max-w-xs flex-col gap-y-4 dark:bg-slate-800 rounded-lg p-6">
<dt class="text-base leading-7 text-gray-300 text-justify">Sur sélection des entraîneurs, cours destiné aux enfants ayant entre 8 ans et 10 ans à haut potentiel. Les membres de ce groupe ont cours deux fois par semaine, avec en sus une heure gymnique destinée à accroître la maîtrise du corps dans l’espace.</dt>
<dd class="order-first text-3xl font-semibold tracking-tight text-sky-700 sm:text-5xl">AcroSchool</dd>
<div class="mx-auto flex max-w-xs flex-col gap-y-4 dark:bg-sky-700 rounded-3xl p-6">
<dt class="text-base leading-7 text-gray-300 text-justify">Sur sélection des entraîneurs et après consultation des parents et de l’élève, un cours destiné aux enfants à haut potentiel ayant entre 8 ans et 10 ans. Les membres de ce groupe ont cours deux fois par semaine, avec en sus une heure gymnique destinée à accroître la maîtrise du corps dans l’espace.</dt>
<dd class="order-first text-3xl font-semibold tracking-tight text-slate-50 sm:text-5xl">AcroSchool</dd>
</div>
</dl>
<br />
<dl class="grid grid-cols-1 gap-x-8 gap-y-16 text-center lg:grid-cols-3">
<div class="mx-auto flex max-w-xs flex-col gap-y-4">
<dt class="text-base leading-7 text-gray-600"></dt>
<dd class="order-first text-3xl font-semibold tracking-tight text-sky-700 sm:text-5xl"></dd>
</div>
<div class="mx-auto flex max-w-xs flex-col gap-y-4 dark:bg-slate-800 rounded-lg p-6">
<dt class="text-base leading-7 text-gray-300 text-justify">Sur sélection des entraîneurs, cours pour les élèves capable de rencontrer les exigences de la Division 1 et Division 2. La rigueur et l’assiduité sont essentielles pour le bon fonctionnement et développement de ce groupe.</dt>
<dd class="order-first text-3xl font-semibold tracking-tight text-sky-700 sm:text-5xl">AcroTeam</dd>
<div class="mx-auto flex max-w-xs flex-col gap-y-4 dark:bg-sky-700 rounded-3xl p-6">
<dt class="text-base leading-7 text-gray-300 text-justify">Sur sélection des entraineurs, cours pour les élèves capables de rencontrer les exigences de la Division 1 (niveau international) et Division 2 (niveau national). La rigueur et l’assiduité sont essentielles pour le bon fonctionnement et le développement de ce groupe.</dt>
<dd class="order-first text-3xl font-semibold tracking-tight text-slate-50 sm:text-5xl">AcroTeam</dd>
</div>
</dl>
</div>
@ -94,43 +90,92 @@
<div class="mx-auto max-w-7xl py-12 sm:px-6 sm:py-32 md:py-24 lg:py-32 lg:px-8 ">
<div class="relative isolate overflow-hidden pt-16 shadow-2xl sm:rounded-3xl md:pt-24 lg:flex lg:pt-0">
<div class="mx-auto text-center lg:mx-0 lg:flex-auto flex items-center">
<img src="./img/callout.jpg" alt="Un amusement de haut vol" />
<h1 class="text-white font-semibold absolute text-5xl top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2">Un amusement de haut vol !</h1>
<img src="./img/callout/callout.jpg" alt="Un amusement de haut vol" />
<h1 class="text-white font-semibold absolute text-5xl top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2">Un amusement de haut vol…</h1>
</div>
</div>
</div>
</div>
<!-- Notre travail -->
<div class="dark:bg-sky-950">
<div class="mx-auto max-w-7xl py-12 sm:px-6 sm:py-32 md:py-24 lg:py-32 lg:px-8 ">
<div class="relative isolate overflow-hidden pt-16 shadow-2xl sm:rounded-3xl md:pt-24 lg:flex lg:pt-0">
<div class="mx-auto text-center lg:mx-0 lg:flex-auto flex items-center">
<img src="./img/callout.jpg" alt="Un amusement de haut vol" />
<h1 class="text-white font-semibold absolute text-5xl top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2">NOTRE TRAVAIL !</h1>
<div class="mx-auto max-w-7xl py-12 sm:px-6 lg:px-8 ">
<div class="grid grid-cols-2 md:grid-cols-4 gap-4">
<div class="grid gap-4">
<div>
<img class="h-auto max-w-full rounded-lg" src="./img/portfolio/2023-03-01 18.31.46.jpg" alt="">
</div>
<div>
<img class="h-auto max-w-full rounded-lg" src="./img/portfolio/portfolio-1.jpg" alt="">
</div>
<div>
<img class="h-auto max-w-full rounded-lg" src="./img/portfolio/2022-10-26 10.15.01.jpg" alt="">
</div>
<div>
<img class="h-auto max-w-full rounded-lg" src="./img/portfolio/2021-05-27 12.59.51.jpg" alt="">
</div>
</div>
<div class="grid gap-4">
<div>
<img class="h-auto max-w-full rounded-lg" src="./img/portfolio/portfolio-2.jpg" alt="">
</div>
<div>
<img class="h-auto max-w-full rounded-lg" src="./img/portfolio/2022-05-28 22.13.46.jpg" alt="">
</div>
<div>
<img class="h-auto max-w-full rounded-lg" src="./img/portfolio/safwane_scalabiscup.jpg" alt="">
</div>
</div>
<div class="grid gap-4">
<div>
<img class="h-auto max-w-full rounded-lg" src="./img/portfolio/2017-07-21 18.49.37.jpg" alt="">
</div>
<div>
<img class="h-auto max-w-full rounded-lg" src="./img/portfolio/2022-07-29 17.28.57.jpg" alt="">
</div>
<div>
<img class="h-auto max-w-full rounded-lg" src="./img/portfolio/portfolio-3.jpg" alt="">
</div>
<div>
<img class="h-auto max-w-full rounded-lg" src="./img/portfolio/F32AFFBB-B445-44AB-81CB-217AA76EE561.jpeg" alt="">
</div>
</div>
<div class="grid gap-4">
<div>
<img class="h-auto max-w-full rounded-lg" src="./img/portfolio/portfolio-4.jpg" alt="">
</div>
<div>
<img class="h-auto max-w-full rounded-lg" src="./img/portfolio/8E87DF44-E3B1-4FEB-BBC4-A8996FE1B8FF.jpeg" alt="">
</div>
<div>
<img class="h-auto max-w-full rounded-lg" src="./img/portfolio/portfolio-5.jpg" alt="">
</div>
<div>
<img class="h-auto max-w-full rounded-lg" src="./img/portfolio/2023-02-26 18.53.07.jpg" alt="">
</div>
</div>
</div>
</div>
</div>
<!-- Notre travail -->
<!-- Google Map -->
<div class="dark:bg-sky-950">
<div class="mx-auto max-w-7xl py-12 sm:px-6 sm:py-32 md:py-24 lg:py-32 lg:px-8 ">
<div class="relative isolate overflow-hidden pt-16 shadow-2xl sm:rounded-3xl md:pt-24 lg:flex lg:pt-0">
<div class="mx-auto text-center lg:mx-0 lg:flex-auto flex items-center">
<img src="./img/callout.jpg" alt="Un amusement de haut vol" />
<h1 class="text-white font-semibold absolute text-5xl top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2">GOOGLE MAP !</h1>
<div class="relative isolate overflow-hidden h-40 pt-16 shadow-2xl sm:rounded-3xl md:pt-24 lg:flex lg:pt-0">
<div class="mx-auto h-1/2 text-center lg:mx-0 lg:flex-auto flex items-center">
<iframe width="100%" height="100%" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2530.040653747835!2d4.362269693321058!3d50.64493612442071!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47c3cd9b55068c99%3A0x37580cc7386a4393!2sEcole+communale+de+Lillois!5e0!3m2!1sfr!2sbe!4v1530468171311" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>
</div>
</div>
</div>
</div>
<!-- Notre travail -->
<!-- Adresse et résaux sociaux -->
<div class="dark:bg-sky-950">
<div class="mx-auto max-w-7xl py-12 sm:px-6 sm:py-32 md:py-24 lg:py-32 lg:px-8 ">
<div class="relative isolate overflow-hidden pt-16 shadow-2xl sm:rounded-3xl md:pt-24 lg:flex lg:pt-0">
<div class="mx-auto text-center lg:mx-0 lg:flex-auto flex items-center">
<img src="./img/callout.jpg" alt="Un amusement de haut vol" />
<img src="./img/callout/callout.jpg" alt="Un amusement de haut vol" />
<h1 class="text-white font-semibold absolute text-5xl top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2">Adresse + logo réseaux sociaux !</h1>
</div>
</div>