Add files via upload

css/styles.css

@@ -791,7 +791,9 @@ section.CM .container{
     flex-wrap: wrap;
     align-items: center;
     justify-content: center;
-    background-color: #000000;
+    background-color: #ffffff;
+    box-shadow: rgba(255, 255, 255, 0.2) 0px 12px 28px 0px, rgba(255, 255, 255, 0.1) 0px 2px 4px 0px, rgba(255, 255, 255, 0.05) 0px 0px 0px 1px inset;
+
 }
 
 section.CM .resaux{
@@ -817,12 +819,12 @@ section.CM h1{
     display: inline-block;
     height: 60px;
     width: 60px;
-    margin: 0 5px;
+    margin: 15px;
     overflow: hidden;
     background: #fff;
     border-radius: 50px;
     cursor: pointer;
-    box-shadow: rgba(255, 255, 255, 0.2) 0px 12px 28px 0px, rgba(255, 255, 255, 0.1) 0px 2px 4px 0px, rgba(255, 255, 255, 0.05) 0px 0px 0px 1px inset;
+    box-shadow: rgba(0, 0, 0, 0.2) 0px 12px 28px 0px, rgba(0, 0, 0, 0.1) 0px 2px 4px 0px, rgba(0, 0, 0, 0.05) 0px 0px 0px 1px inset;
     transition: all 0.3s ease-out;
 }
 
@@ -905,3 +907,49 @@ section.CM h1{
     color: #0d6b10;
 }
 
+footer {
+    min-height: 150px;
+    height: auto;
+    background-color: #000000;
+    display: flex;
+    flex-direction: column;
+    padding: 50px 50px 10px 50px;
+    border-top: 5px solid #fff;
+    width: 100%;
+    justify-content: center;
+    text-align: center;
+}
+
+footer div{
+    width: 100%;
+    text-align: left;
+}
+
+footer div span.lettre{
+    font-size: 100px;
+    font-style: italic;
+    font-weight: bold;
+    font-family: JFont;
+}
+
+footer p{
+    font-family: 'Roboto', sans-serif;
+    text-decoration: underline;
+    margin-top: 25px;
+}
+
+footer div span.lettre:nth-child(1){
+    animation-delay: 0.1s;
+}
+footer div span.lettre:nth-child(2){
+    animation-delay: 0.2s;
+}
+footer div span.lettre:nth-child(3){
+    animation-delay: 0.3s;
+}
+footer div span.lettre:nth-child(4){
+    animation-delay: 0.4s;
+}
+footer div span.lettre:nth-child(5){
+    animation-delay: 0.5s;
+}

index.html

@@ -120,7 +120,7 @@ <h1>Skills</h1>
     <section id="Pr", class="Pr">
         <h1>Project</h1>
         <div class="project-container">
-            <div class="box">
+            <div data-aos="fade-right" class="box">
                 <h1>AnimeBot</h1>
                 <p>AnimeBot est un bot Discord développé en Python axé sur l'univers de l'anime, conçu pour simplifier la découverte et l'exploration d'une variété de séries animées. Adapté aux novices comme aux passionnés, AnimeBot utilise l'API "Jikan" pour offrir une recherche facile par mots-clés ou genres, fournissant ainsi une liste d'anime correspondants. Explorez le monde de l'anime sans tracas avec AnimeBot.</p>
                 <a href="src/soon.html">
@@ -130,7 +130,7 @@ <h1>AnimeBot</h1>
                     </svg>
                 </a>
             </div>
-            <div class="box">
+            <div data-aos="fade-left" class="box">
                 <h1>Mon Premier site web serieux</h1>
                 <p>Ce site a été créé dans le cadre de mon projet final d'anglais en classe de seconde. L'objectif était de concevoir un site comportant une barre de navigation et plusieurs sections pour présenter notre association de défense de l'environnement. Il est à noter que tous les éléments du site ne fonctionnent pas nécessairement, car ce site était simplement un support pour notre projet final.</p>
                 <a href="src/Anglais-main/index.html">
@@ -190,8 +190,14 @@ <h1>Contact me</h1>
     </div>
     </section>
     <footer>
-        <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Earum reiciendis corrupti quia aut cumque ullam labore sequi, veniam perspiciatis nihil odit porro tempore eaque dignissimos rerum id ea impedit assumenda.</p>
-
+        <div data-aos="fade-up">
+            <span class="lettre">J</span>
+            <span class="lettre">O</span>
+            <span class="lettre">N</span>
+            <span class="lettre">A</span>
+            <span class="lettre">S</span>
+        </div>
+        <p>&copy; 2024, Tout droits réservés.</p>
     </footer>
     <script src="https://unpkg.com/[email protected]/dist/aos.js"></script>
     <script>