Merge pull request #3783 from Mahamadou-dev/master

Ajout des commentaires de Gremah

Author: w3schools-test

index.html

@@ -110,6 +110,112 @@ <h3 style="color: rgba(32, 105, 173, 0.933);">I want to thank our mothers for ta
             <h6 style="font-style: italic;"> Hello from Ukraine  </h6>
             </div>
             <!--End of REFRAZ1's message-->  
+        <!--Amadou Habou Gremah Mahamadou : Farkon ayki(start) -->
+            <div class="container-DLL">
+            <div class="flip-card-DLL">
+                <div class="flip-card-inner-DLL" style="width: 100%; height: 100%; text-align: center; transition: transform 0.8s; transform-style: preserve-3d; position: relative;">
+                    <div class="flip-card-front-DLL">
+                        <h1 class="flip-card-front-DLL-h1">
+                            A big thank you to W3Schools for the invaluable resources, 
+                            and to the creator of this brilliant card flip idea!
+                            from <b>Niger</b>, "Mun gode" !
+                            
+                        </h1>
+                        <p style="font-size: small;">Survoler pour retourner</p>
+                    </div>
+                    <div class="flip-card-back-DLL">
+                        <h1 class="flip-card-back-DLL-h1">
+                            GREMAH &#128076;
+                        </h1>
+                        <p>Gremah Mahamadou</p>
+                        <p style="font-size: medium;">vive le Niger/AES</p>
+                        <img src="../Drapeaux_pays_AES.jpg" alt="Aliance des Etats du Sahel" width="50%" height="100px">
+                        <p style="font-size: medium;">Monastir, le 01-31-2025</p>
+                    </div>
+                </div>
+            </div>
+            </div>
+
+            <style>
+            .flip-card-DLL:hover .flip-card-inner-DLL {
+                transform: rotateX(-180deg);
+            }
+
+            .flip-card-DLL {
+                font-family: 'Roboto', sans-serif;
+                width: 350px;
+                height: 400px;
+                perspective: 1100px;
+            }
+
+            .flip-card-back-DLL {
+                position: absolute;
+                width: 100%;
+                height: 100%;
+                display: flex;
+                flex-direction: column;
+                justify-content: center;
+                align-items: center;
+                border:ridge 2px #f3431c;
+                border-radius: 2rem;
+                background: #fff;
+                color: blue;
+                box-shadow: 2px 10px 50px 10px blue;
+                backface-visibility: hidden;
+                transform: rotateX(-180deg);
+            }
+
+            .flip-card-back-DLL-h1 {
+                font-family: 'Roboto', sans-serif;
+                font-size: 22px;
+                background-color: black;
+                color: lightblue;
+                padding: 0.5rem 1rem;
+                border: 0.25rem solid blue;
+                box-shadow: 5px 5px 50px 10px blue;
+                border-radius: 8px;
+                margin: 0 0 0.5rem 0;
+            }
+
+            .flip-card-front-DLL {
+                position: absolute;
+                width: 100%;
+                height: 100%;
+                display: flex;
+                flex-direction: column;
+                justify-content: center;
+                align-items: center;
+                border: 1px solid black;
+                border-radius: 1rem;
+                background: linear-gradient(to bottom,rgb(255, 94, 0),white, green) !important ;
+                color: #000000;
+                box-shadow: -2px 10px 50px 10px black;
+                backface-visibility: hidden;
+            }
+
+            .flip-card-front-DLL-h1 {
+                font-family: 'Roboto', sans-serif;
+                font-size: 22px;
+                background-color: rgba(255, 94, 0, 0.785);
+                color: black;
+                padding: 0.5rem 1rem;
+                margin: 40px;
+                border: 0.25rem double black;
+                box-shadow: 15px 10px 40px 10px white;
+                border-radius: 100px;
+            }
+
+            .container-DLL {
+                display: flex;
+                margin: 2rem 0.5rem;
+                justify-content: center;
+                gap: 1rem;
+                flex-wrap: wrap;
+            }
+
+            </style>
+        <!--Amadou Habou Gremah Mahamadou : karshen ayki(end) -->
+
 
             <!-- Logan Swain's Start -->
             <div class="container-DL">