« Modèle:Accueil/Cadre/Brouillon » : différence entre les versions

VisuelWikicode

@@ Ligne 1 : / Ligne 1 : @@
-<div class="cadre-accueil" style="
+<div class="cadre-accueil" style="background-image: url({{{image|}}}}); background-size: cover; background-position: center; border-radius: 8px; overflow: hidden; position: relative; height: 200px; margin: 10px; box-shadow: 0 4px 8px rgba(0,0,0,0.2); transition: transform 0.3s ease, box-shadow 0.3s ease;">
-    background-image: url({{{image|}}});
+[[{{{lien|}}}|<div style="display: block; height: 200px; text-decoration: none; color: white; position: relative;">
-    background-size: cover;
+<div style="position: absolute; bottom: 0; left: 0; right: 0; background: linear-gradient(transparent, rgba(0,0,0,0.8)); padding: 20px;">
-    background-position: center;
+<span style="font-size: 1.4em; font-weight: bold; color: white; display: block; margin-bottom: 5px;">{{{titre|}}}</span>
-    border-radius: 8px;
+<span style="font-size: 0.9em; opacity: 0.9; color: white;">{{{description|}}}</span>
-    overflow: hidden;
+</div>
-    position: relative;
+</div>]]
-    height: 200px;
-    margin: 10px;
-    box-shadow: 0 4px 8px rgba(0,0,0,0.2);
-    transition: transform 0.3s ease, box-shadow 0.3s ease;
-">
-  <a href="{{{lien|}}}" style="
-    display: block;
-    height: 100%;
-    text-decoration: none;
-    color: white;
-    position: relative;
-  ">
-    <div style="
-      position: absolute;
-      bottom: 0;
-      left: 0;
-      right: 0;
-      background: linear-gradient(transparent, rgba(0,0,0,0.8));
-      padding: 20px;
-    ">
-      <h3 style="margin: 0; font-size: 1.4em; font-weight: bold;">{{{titre|}}}</h3>
-      <p style="margin: 5px 0 0 0; font-size: 0.9em; opacity: 0.9;">{{{description|}}}</p>
-    </div>
-  </a>
 </div>
-<style>
-.cadre-accueil:hover {
-    transform: translateY(-5px);
-    box-shadow: 0 8px 16px rgba(0,0,0,0.3);
-}
-</style>