Basculer le menu
Changer de menu des préférences
Basculer le menu personnel
Non connecté(e)
Votre adresse IP sera visible au public si vous faites des modifications.

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

De Nefald Wiki
Hiob (discussion | contributions)
création
 
Hiob (discussion | contributions)
m MediaWiki compatible
 
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>
</div>
<style>
.cadre-accueil:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 16px rgba(0,0,0,0.3);
}
</style>

Dernière version du 7 septembre 2025 à 15:33

[[|

]]