diff --git a/aep-schedule-website/src/frontend/app.rs b/aep-schedule-website/src/frontend/app.rs index 5d48149121fe65fa94bb455d67ad6c2e626a5300..5189198d75ca76d708ff110a0728eac6343549c9 100644 --- a/aep-schedule-website/src/frontend/app.rs +++ b/aep-schedule-website/src/frontend/app.rs @@ -56,7 +56,7 @@ pub fn App() -> impl IntoView { <span class="hamburger-bar"></span> </div> </header> - <main> + <main class="h-full"> <Routes> <Route path="/" view=GeneratorPage/> <Route path="/apropos" view=HomePage/> diff --git a/aep-schedule-website/src/frontend/components/options/personal.rs b/aep-schedule-website/src/frontend/components/options/personal.rs index c11fe0083896a4070009c72cf423c37ea7d7cc7c..308490e6d6cad4590d1230058ccce79a80adf602 100644 --- a/aep-schedule-website/src/frontend/components/options/personal.rs +++ b/aep-schedule-website/src/frontend/components/options/personal.rs @@ -79,7 +79,7 @@ where } }; view! { - <div class="remove-touch" style=style class=class + <div class="pointer-events-none touch-none" style=style class=class on:pointerdown=move |e| { set_initial.set(Some((i, j))); set_positive.set((week[i].get() & (1 << j)) == 0); @@ -87,8 +87,8 @@ where } on:pointerover=move |_| { set_destination.set((i, j)); - } - ></div> + }> + </div> } }).collect_view() }).collect_view()} diff --git a/aep-schedule-website/src/frontend/pages/apropos.rs b/aep-schedule-website/src/frontend/pages/apropos.rs index c130124789317fea8bbddfd2f69191e17320185d..913f4087913637b0c56fecef69e0a2ae19261fc4 100644 --- a/aep-schedule-website/src/frontend/pages/apropos.rs +++ b/aep-schedule-website/src/frontend/pages/apropos.rs @@ -4,21 +4,28 @@ use leptos::*; pub fn HomePage() -> impl IntoView { view! { <section class="p-1 w-full h-full"> - <h2>"Auteurs"</h2> - <ul> - <li>"Marc-Antoine Manningham - Création du frontend et du backend entièrement en Rust"</li> - <li>"Raphael Salvas, Achille Saint-Hillier, Sunnee Chevalier et Gabriel Billard - Inspiration de leur TP3 de LOG2420 pour le design du générateur"</li> - </ul> - <div class="container mx-auto flex flex-col items-center text-center lg:px-32 xl:max-w-1/2"> - <h1 class="text-5xl font-bold leading-none sm:text-6xl">"Générateur d'horaire de l'AEP" - <span class="text-amber-600">"v2"</span> - </h1> - <p class="px-8 mt-8 mb-12 text-lg"> - "Vous en avez assez d'avoir des horaires horribles fait pas le registrariat? Vous êtes au bon endroit. Le générateur d'horaire v2 est une réécriture plus performante, intuive et moderne du générateur d'horaire. Il vous aidera à trouver un horaire parfait." - </p> - <div class="flex flex-col space-y-4 sm:items-center sm:justify-center sm:flex-row sm:space-y-0 sm:space-x-4 lg:justify-start"> - <a rel="noopener noreferrer" href="#" class="px-8 py-3 text-lg font-semibold rounded dark:bg-amber-600 dark:text-gray-50">"Générer un horaire"</a> - <a rel="noopener noreferrer" href="#" class="px-8 py-3 text-lg font-semibold border rounded dark:border-gray-800">"Horaire d'un local"</a> + <div class="container flex flex-col justify-center p-4 mx-auto md:p-8"> + <p class="p-2 text-sm font-medium tracking-wider text-center uppercase">"Comment ça marche?"</p> + <h2 class="mb-12 text-4xl font-bold leading-none text-center sm:text-5xl">"Foires aux questions"</h2> + <div class="grid gap-10 md:gap-8 sm:p-3 md:grid-cols-2 lg:px-12"> + <div> + <h3 class="font-semibold">"Pourquoi avoir refait l'ancien générateur?"</h3> + <p class="mt-1 dark:text-gray-600"> + "L'ancien générateur d'horaire était en mode maintenance depuis au moins 15 ans et changer l'architecture aurait été très difficile, en effet la vénérable base de code contenait littéralement 5 langages de programmation différents!"<br/> "- Marc-Antoine Manningham" + </p> + </div> + <div> + <h3 class="font-semibold">"Qui sont les auteurs de la refonte du générateur d'horaire?"</h3> + <p class="mt-1 dark:text-gray-600">"Marc-Antoine Manningham - Création du frontend et du backend entièrement en Rust. Raphael Salvas, Achille Saint-Hillier, Sunnee Chevalier et Gabriel Billard - Inspiration de leur TP3 de LOG2420 pour l'interface la refonte du générateur"</p> + </div> + <div> + <h3 class="font-semibold">"Comment le générateur génère aussi vite?"</h3> + <p class="mt-1 dark:text-gray-600">"D'abord, les horaires sont généré directement dans le navigateur de l'utilisateur en WebAssembly plutôt que sur le serveur. Aussi, plutôt que de générer tout les horaires, juste le top des horaires sont générés. Plusieurs techniques pour couper l'espace de combinaisons sont utilisées pour éliminer les branches qui ne respectent pas les contraintes ou qui sont sous-optimales. (branch and bound)"</p> + </div> + <div> + <h3 class="font-semibold">"Si j'ai des suggestions où aller les mettre?"</h3> + <p class="mt-1 dark:text-gray-600">"Le bouton signaler un bug peut aussi être utilisé pour soumettre une fonctionnalité sur le GitLab. Sinon, les contributions sont aussi les bienvenues si vous êtes prêt à faire un peu de Rust!"</p> + </div> </div> </div> </section> diff --git a/aep-schedule-website/style/main.scss b/aep-schedule-website/style/main.scss index e73437710f437b584fe78b6e30f46ad9994e6da7..8674d583d7714562e6c13e3a1a105d37af3cc845 100644 --- a/aep-schedule-website/style/main.scss +++ b/aep-schedule-website/style/main.scss @@ -6,7 +6,7 @@ body { font-family: lato, sans-serif; margin: 0; - min-height: calc(100vh - 3em); + height: auto; $background-color: $light-background; } @@ -65,14 +65,15 @@ nav>a { main { display: flex; justify-content: flex-end; - min-height: calc(100vh - 3em); background-color: $light-background; @media screen and (max-width: 1000px) { + min-height: calc(100vh); margin-top: 0; } @media screen and (min-width: 1000px) { + min-height: calc(100vh - 3em); margin-top: 3em; } } diff --git a/aep-schedule-website/style/schedule.scss b/aep-schedule-website/style/schedule.scss index 1aedaf2985d1633a8131681bdbe312e48cca70c1..9bc7da7008d09394da6b985d255215fb2623c45c 100644 --- a/aep-schedule-website/style/schedule.scss +++ b/aep-schedule-website/style/schedule.scss @@ -116,10 +116,6 @@ $days: $time-width 10px repeat(5, 1fr); cursor: pointer; } -.remove-touch { - touch-action: none; -} - .color1 { background-color: #41AAE6; }