Updates files - v.1.3.0-beta.9

src/assets/components/hero/hero.tsx

@@ -20,7 +20,7 @@ const Hero = () => {
         </div>
         <div className="col-lg-6">
           <div className="alert alert-light ms-5 me-5" role="alert">
-          <i className="fa-solid fa-circle-info"></i>&nbsp;&nbsp;Annonce d'une nouvelle version 1.3.0 | <a href="#" className="alert-link decoration-none">En savoir plus&nbsp;&nbsp;<i className="fa-solid fa-arrow-right"></i></a>
+          <i className="fa-solid fa-circle-info"></i>&nbsp;&nbsp;Annonce d'une nouvelle version 1.3.0 | <a href="https://github.com/mpcgt/levetica/releases/tag/v.1.3.0" target="_blank" className="alert-link decoration-none">En savoir plus&nbsp;&nbsp;<i className="fa-solid fa-arrow-right"></i></a>
           </div>
           <h1 className="display-5 fw-bold text-start lh-1 mb-3 ahsing">
             Fini les hésitations, trouve les outils adaptés à tes besoins.

src/assets/components/tools/pages/profile.tsx

@@ -10,7 +10,8 @@ function Profile() {
   <div className="modal-dialog" role="document">
     <div className="modal-content rounded-4 shadow">
       <div className="modal-header p-5 pb-4 border-bottom-0">
-        <h1 className="fw-bold mb-0 fs-2 text-dark">S'inscrire gratuitement</h1>
+        <h2 className="fw-bold mb-0 fs-2 text-dark">S'inscrire gratuitement</h2>
+        <h4 className="italic mb-0 text-danger">Bientôt disponible</h4>
       </div>
 
       <div className="modal-body p-5 pt-0">
@@ -23,20 +24,17 @@ function Profile() {
             <input type="password" className="form-control rounded-3" id="floatingPassword" placeholder="Password" />
             <label className="text-dark" htmlFor="floatingPassword">Mot de passe</label>
           </div>
-          <button className="w-100 mb-2 btn btn-lg rounded-3 btn-primary" type="submit">S'incrire</button>
+          <button className="w-100 mb-2 btn btn-lg rounded-3 btn-primary" type="submit" disabled>S'incrire</button>
           <small className="text-body-secondary">En cliquant sur "S'inscrire", vous acceptez les conditions d'utilisation.</small>
           <hr className="my-4" />
-          <h2 className="fs-5 fw-bold mb-3 text-dark">Ou utiliser un tiersy</h2>
-          <button className="w-100 py-2 mb-2 btn btn-outline-danger rounded-3" type="submit">
-            <svg className="bi me-1" width="16" height="16"><use xlinkHref="#twitter"/></svg>
+          <h2 className="fs-5 fw-bold mb-3 text-dark">Ou utiliser un application tiers</h2>
+          <button className="w-100 py-2 mb-2 btn btn-outline-danger rounded-3" type="submit" disabled>
             <i className="fa-brands fa-google fs-4"></i>&nbsp;&nbsp;<span className="fw-bold">S'inscrire avec Google</span>
           </button>
-          <button className="w-100 py-2 mb-2 btn btn-outline-primary rounded-3" type="submit">
-            <svg className="bi me-1" width="16" height="16"><use xlinkHref="#facebook"/></svg>
+          <button className="w-100 py-2 mb-2 btn btn-outline-primary rounded-3" type="submit" disabled>
             <i className="fa-brands fa-facebook fs-4"></i>&nbsp;&nbsp;<span className="fw-bold">S'inscrire avec Facebook</span>
           </button>
-          <button className="w-100 py-2 mb-2 btn btn-outline-secondary rounded-3" type="submit">
-            <svg className="bi me-1" width="16" height="16"><use xlinkHref="#github"/></svg>
+          <button className="w-100 py-2 mb-2 btn btn-outline-secondary rounded-3" type="submit" disabled>
             <i className="fa-brands fa-github fs-4"></i>&nbsp;&nbsp;<span className="fw-bold">S'inscrire avec GitHub</span>
           </button>
         </form>

src/assets/components/tools/tools.tsx

@@ -1,6 +1,11 @@
 import NavbarTools from "./NavBarTools"
 import Logo from "/src/assets/lvtcw.png"
 import transitionTools from "./pages/transitionTools"
+
+import React from './images/react.png'
+import Angular from './images/angular.png'
+import Vue from './images/vue.png'
+
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" integrity="sha512-SnH5WK+bZxgPHs44uWIX+LLJAJ9/2PkPKZ5QiAj6Ta86w+fsb2TkcmfRyVX3pBnMFcV7oQPJkl9QevSCWr3W6A==" crossOrigin="anonymous" referrerPolicy="no-referrer" />
 
 // eslint-disable-next-line react-refresh/only-export-components
@@ -13,31 +18,30 @@ function Tools() {
     <img className="me-3" src={Logo} alt="" width="48" height="38" />
     <div className="lh-1">
       <h1 className="h6 mb-0 text-white lh-1">Levetica</h1>
-      <small>v.1.3.0-beta-7</small>
+      <small>v.1.3.0-beta-9</small>
     </div>
   </div>
 
   <div className="my-3 p-3 bg-success bg-opacity-25 rounded shadow-sm">
-    <h6 className="border-bottom pb-2 text-start text-dark fw-bold">Recent updates</h6>
+    <h6 className="border-bottom pb-2 text-start text-dark fw-bold">Dernières mises à jour</h6>
     <div className="d-flex text-body-secondary pt-3">
-      <svg className="bd-placeholder-img flex-shrink-0 me-2 rounded" width="32" height="32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Placeholder: 32x32" preserveAspectRatio="xMidYMid slice" focusable="false"><title>Placeholder</title><rect width="100%" height="100%" fill="#007bff"/><text x="50%" y="50%" fill="#007bff" dy=".3em">32x32</text></svg>
-      <p className="pb-3 mb-0 small lh-sm border-bottom text-dark">
-        <strong className="d-block text-gray-dark text-start text-dark">@username</strong>
-        Some representative placeholder content, with some information about this user. Imagine this being some sort of status update, perhaps?
-      </p>
+      <img src={React} width={50} />
+      <p className="pb-3 ms-3 mb-0 small lh-sm border-bottom text-dark">
+        <strong className="d-block text-gray-dark text-start text-dark">React</strong>
+        Le but principal de cette bibliothèque est de faciliter la création d'application web monopage, via la création de composants dépendant d'un état et générant une page (ou portion) HTML à chaque changement d'état.      </p>
     </div>
     <div className="d-flex text-body-secondary pt-3">
-      <svg className="bd-placeholder-img flex-shrink-0 me-2 rounded" width="32" height="32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Placeholder: 32x32" preserveAspectRatio="xMidYMid slice" focusable="false"><title>Placeholder</title><rect width="100%" height="100%" fill="#e83e8c"/><text x="50%" y="50%" fill="#e83e8c" dy=".3em">32x32</text></svg>
-      <p className="pb-3 mb-0 small lh-sm border-bottom text-dark">
-        <strong className="d-block text-gray-dark text-start text-dark">@username</strong>
-        Some more representative placeholder content, related to this other user. Another status update, perhaps.
+      <img src={Angular} width={50} />
+      <p className="pb-3 ms-3 mb-0 small lh-sm border-bottom text-dark">
+        <strong className="d-block text-gray-dark text-start text-dark">Angular</strong>
+        Angular est un framework open source écrit en TypeScript qui permet de créer des applications web modernes et performantes.
       </p>
     </div>
     <div className="d-flex text-body-secondary pt-3">
-      <svg className="bd-placeholder-img flex-shrink-0 me-2 rounded" width="32" height="32" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Placeholder: 32x32" preserveAspectRatio="xMidYMid slice" focusable="false"><title>Placeholder</title><rect width="100%" height="100%" fill="#6f42c1"/><text x="50%" y="50%" fill="#6f42c1" dy=".3em">32x32</text></svg>
-      <p className="pb-3 mb-0 small lh-sm border-bottom text-dark">
-        <strong className="d-block text-start text-dark">@username</strong>
-        This user also gets some representative placeholder content. Maybe they did something interesting, and you really want to highlight this in the recent updates.
+      <img src={Vue} width={50} />
+      <p className="pb-3 ms-3 mb-0 small lh-sm border-bottom text-dark">
+        <strong className="d-block text-start text-dark">Vue</strong>
+        Vue.js est un framework JavaScript populaire qui facilite la création d'interfaces utilisateur interactives et d'applications web modernes.
       </p>
     </div>
     <small className="d-block text-end mt-3">

src/index.tsx

@@ -16,6 +16,7 @@ function Text() {
         <div className="margin">
           {" "}
           {/* Décale le texte en 15px */}
+          <h3 className='center mb-5 fw-bold fs-3 italic'>Modification prévu dans quelques jours</h3>
           <h2>Bonjour ! 👋🏼</h2>
           <h4>
             <b>