Welcome

Halloween Administration

Academy Waverly

Halloween, LS codage Forumactif Fiches & Messages Administration Academy Waverly

Toutes versions

Optimisé Une page d'accueil, une liste des sujets, un profil & message ainsi que des fiches de présentation, de présentation du staff et de publicité sont disponibles

Retour

Codage fiche administrative Academy Waverly Halloween Forumactif

HTML

<div class="fiche_wa"><div class="entete"><h2>Titre du sujet</h2><h3>Waverly Academy</h3></div>
<div class="contenu_fiche"><h4>Titre niveau 1</h4>
<p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec maximus nisl nec mi laoreet convallis. Nulla ornare ligula quis egestas ullamcorper. Ut eu mauris libero. Phasellus accumsan maximus mi, non bibendum nisl pellentesque at.</p>

<h5>Titre niveau 2</h5>
<p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec maximus nisl nec mi laoreet convallis. Nulla ornare ligula quis egestas ullamcorper. Ut eu mauris libero. Phasellus accumsan maximus mi, non bibendum nisl pellentesque at. Maecenas at quam nisl. Phasellus finibus quam orci, consectetur tempus ligula lacinia eu. Sed porta, sem vitae molestie dapibus, libero magna scelerisque felis, nec rutrum dolor ex sed sem. Etiam consectetur malesuada magna, at luctus augue sollicitudin eget. Nam eu varius nulla. Nulla feugiat ut velit vel fermentum. Aenean feugiat ligula id urna rutrum, ac egestas elit euismod.

Donec mattis est elit, quis semper eros lobortis eu. Aenean dui orci, tempus vel urna bibendum, hendrerit lobortis odio. Proin sed neque non dui laoreet tincidunt. Proin faucibus vitae arcu nec venenatis. Vestibulum quis rhoncus mi. Suspendisse eget quam vehicula, feugiat urna scelerisque, lacinia odio. Donec ut nulla et ipsum hendrerit rhoncus id in metus. Ut eleifend est quis pharetra commodo. Maecenas in eros lacus. </p>

[quote]Citation Donec mattis est elit, quis semper eros lobortis eu. Aenean dui orci, tempus vel urna bibendum, hendrerit lobortis odio. Proin sed neque non dui laoreet tincidunt. Proin faucibus vitae arcu nec venenatis. Vestibulum quis rhoncus mi. Suspendisse eget quam vehicula, feugiat urna scelerisque, lacinia odio. Donec ut nulla et ipsum hendrerit rhoncus id in metus. Ut eleifend est quis pharetra commodo. Maecenas in eros lacus.[/quote]

<h4>Titre niveau 1</h4>
<p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec maximus nisl nec mi laoreet convallis. Nulla ornare ligula quis egestas ullamcorper. Ut eu mauris libero. Phasellus accumsan maximus mi, non bibendum nisl pellentesque at. Maecenas at quam nisl. Phasellus finibus quam orci, consectetur tempus ligula lacinia eu. Sed porta, sem vitae molestie dapibus, libero magna scelerisque felis, nec rutrum dolor ex sed sem. Etiam consectetur malesuada magna, at luctus augue sollicitudin eget. Nam eu varius nulla. Nulla feugiat ut velit vel fermentum. Aenean feugiat ligula id urna rutrum, ac egestas elit euismod.

[spoiler]Donec mattis est elit, quis semper eros lobortis eu. Aenean dui orci, tempus vel urna bibendum, hendrerit lobortis odio. Proin sed neque non dui laoreet tincidunt. Proin faucibus vitae arcu nec venenatis. Vestibulum quis rhoncus mi. Suspendisse eget quam vehicula, feugiat urna scelerisque, lacinia odio. Donec ut nulla et ipsum hendrerit rhoncus id in metus. Ut eleifend est quis pharetra commodo. Maecenas in eros lacus.[/spoiler]

<div class="conclusion"><p>Citation Donec mattis est elit, quis semper eros lobortis eu. Aenean dui orci, tempus vel urna bibendum, hendrerit lobortis odio. Proin sed neque non dui laoreet tincidunt. Proin faucibus vitae arcu nec venenatis. Vestibulum quis rhoncus mi. Suspendisse eget quam vehicula, feugiat urna scelerisque, lacinia odio. Donec ut nulla et ipsum hendrerit rhoncus id in metus. Ut eleifend est quis pharetra commodo. Maecenas in eros lacus.</p></div>

<a href="http://ls-halloween.fr/" target="_blank" class="credits">Halloween</a></div></div>

CSS

/********************************************************* FICHES *********************************************************/
.credits {
    color: #d89d95 !important;
    text-align: center;
    display: block;
    text-transform: uppercase;
    font-size: 10px;
}

.fiche_wa {
    background: #fff;
    margin: auto;
    width: 500px;
    border: 1px solid #98aebc;
}

.fiche_wa .entete {
    background: url('https://i.imgur.com/KnaSp5u.jpg');
    width: 100%;
    height: 285px;
    color: #fff;
}

.fiche_wa .entete h2 {
    font-family: 'Dancing Script', cursive;
    text-align: center;
    font-size: 35px;
    padding-top: 25%;
    margin: 0;
}

.fiche_wa .entete h3 {
    padding-top: 2%;
    margin: 0;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 10px;
}

.contenu_fiche {
    padding: 10px 40px;
}

.fiche_wa h4 {
    background: #d4e5de;
    padding: 5%;
    color: #fff;
    text-transform: uppercase;
    font-size: 18px;
    margin: 0;
}

.fiche_wa h5 {
    border-bottom: 2px solid #f7cca5;
    color: #f7cca5;
    text-transform: uppercase;
    font-size: 18px;
    margin: 0;
    padding-bottom: 2%;
}

dd.quote {
    border-left: 5px solid #eba48f !important;
    background: none;
    border: 0;
    padding: 0 5%;
    font-size: 13px;
    line-height: 1.5;
}

.codebox dt {
    display: none;
}

.codebox.spoiler dt, .spoiler dd {
    background: #eba48f;
    border: 0;
    text-transform: uppercase;
    color: #fff;
    display: block;
    padding: 2% 0 0 2%;
}

.spoiler_content {
    text-transform: initial;
    padding: 2%;
    border: 0;
    font-size: 13px;
    color: #6c676e;
    border: 2px solid #eba48f;
}

.conclusion {
    background: #e2efe1;
    padding: 4%;
}

.conclusion p {
    border: 1px solid #fff;
    padding: 5%;
    background: #fff;
}

.conclusion p::before {
    color: #eba48f;
    content: "▶";
    font-size: 20px;
    float: left;
    padding-right: 2%;
}

dd.code {
    background: #fff;
    padding: 2%;
    border-bottom: 5px solid #98aebc;
    color: #6c676e;
    font-size: 12px;
    font-family: Courier;
}

.fiche_wa .imp {
    color: #98aebc;
    font-weight: 700;
}

.contenu_fiche p {
    margin-top: -3%;
}

.conclusion p {
  margin: 0 !important;
}

#academywaverly #Annonces #forumactif #codage #libreservice

Halloween