-
THÈME EN LIBRE SERVICE #13 - EMSIHPARG V.8
Les Codes
@font-face {font-family: "Renzo";
src:url('http://ekladata.com/drmdn2_Za9Tl4XKo-HYEMfFYvPQ/renzo.otf');}
@font-face {font-family: "Roboto";
src:url('http://ekladata.com/oY3L-ZyNIyXC-_IqZOjMKKDPTTs/Roboto-Regular.ttf');}
/*--nom de couleur--*/
:root {
--pink: #f77294;
--blue: #1fe1fc;
}
/*---- fond de fenêtre ----*/#body {margin: 0;
color: #666666;
text-decoration: none;
background-color: #050505;
background-image:url("http://ekladata.com/JFkc8fCi0hkbVVxKSZ2reqkSeEk.jpg");
background-attachment: scroll;
background-position: center top;
background-repeat: no-repeat;}
#body a:hover {text-decoration: none;}
/*---- fond de page ----*/
#background {width: 1000px;
overflow: hidden;
background: url("http://ekladata.com/wD4NXCbpREoGIcr1tDaDuCjGRz0.jpg");
background-position: center top;
background-attachment: scroll;
margin: 0px auto;
background-repeat: no-repeat;
background-color: #0f0f0f;}
/*---- header ----*/
#header {height: 280px;
position: relative;
margin-top: 0;
margin-left: 0;
margin-right: 0;
background: url("http://ekladata.com/8UKPUk1BrUfrY_-8P8YGZz11mjU.jpg");
background-repeat: no-repeat;
background-position: center top;
background-attachment: scroll;}
#titre_header a {display: flex;
align-items: center;
justify-content: center;
font-family: Renzo;
font-size: 45pt;
letter-spacing: 10pt;
color: var(--blue);
text-shadow: 0 0 3px var(--blue);
width: 1000px;
height: 250px;}
/*---- menu du header ----*/
#menu {z-index: 15;
list-style-type: none;
margin: 0;
padding: 0;
position: absolute;
top: 247px;
left: 10px;
font-family: 'Roboto'!important;}
#menu a {display: inline;
padding: 5px 10px 5px 10px;
color: var(--pink);
font-family: 'Roboto';
letter-spacing: 3.5pt;
text-shadow: 0px 0px 4px var(--pink);}
#menu a:hover {text-decoration: none;}
#menu ul a, #menu ul a {letter-spacing: -0.5pt;
text-shadow: none;
background:rgba(3,3,3,.80);
line-height: 12pt;
display: inline-block;
width: 150px;
height: 100%;
padding: 5px 10px 5px 10px;}
#menu ul a:hover, #menu ul a:hover {box-shadow: inset 2px 1px 3px black;
background:rgba(48,53,54,.80);
text-shadow: 0px 0px 3px black;
width: 150px;
height: 100%;}
/*---- menu principal ----*/
#menu1 {width: 267px;
margin-top: 20px;
margin-left: 5px;}
#menu1 a {color: var(--pink);}
#menu1 a:hover {color: white;
text-decoration: none;}
#menu1_top {overflow: hidden;
height: 125px;
background-image:url("http://ekladata.com/jeIZB1-VdR7IKtbmjQIV7Jj-bPY.png");}
#menu1_bottom {overflow: hidden;
height: 132px;
background-image:url("http://ekladata.com/Em-GmUV1fn3pGLej-TqHnFutt-4.png");}
#menu1 .module_menu_titre {width: 175px;
height: 100%;
font-weight: normal;
font-style: normal;
text-decoration: none;
font-variant: small-caps;
margin-right: 0px;
color: var(--blue);
font-family: 'Renzo';
font-size: 13.3pt;
text-align: left;
background: rgba(0,0,0,0.7);
margin-left: 18px;
padding-left: 30px;
padding-right: 25px;
text-shadow: 0px 0px 7px var(--blue);
letter-spacing: 0.8pt;}
#menu1 .module_menu_contenu {
width: 210px;
margin-bottom: 0px;
margin-left: 18px;
text-align: left;
background: rgba(0,0,0,0.7);
background-repeat: repeat-y;
font-family: 'Roboto';
font-size: 9.7pt;
color: #9e9e9e;
padding: 5px 10px 25px 10px;}
/*---- derniers visiteurs ----*/
.module_menu_type_lastvisitors .module_menu_contenu {background: none!important;}
.module_menu_type_lastvisitors .module_menu_titre {background: none!important;}
.module_menu_type_lastvisitors {position: absolute;
top: 385px;}
.module_menu_type_lastvisitors img {height: 30px; width: 30px;
-webkit-transition-duration: 0.3s;
-moz-transition-duration: 0.3s;
transition-duration: 0.3s;
opacity: 0.2;}
.module_menu_type_lastvisitors img:hover { -webkit-filter: hue-rotate(180deg);
-moz-filter: hue-rotate(180deg);
-o-filter: hue-rotate(180deg);
filter: hue-rotate(180deg);
-webkit-transition-duration: 0.7s;
-moz-transition-duration: 0.7s;
transition-duration: 0.7s;
opacity: 1;}
.module_menu_type_lastvisitors a {color: #060606;}
#content {margin: 70px 10px 30px 300px;
width: 700px}
/*---- titre article ----*/
.module_titre_contenu {background: url('http://ekladata.com/Y2x63JY6NPSg4iMFAmbrk76NMPc.png') 100% 100% no-repeat;}
.module_titre_contenu, .module_titre_contenu a {font-weight: normal;
font-size: 24px;
font-family: Renzo;
font-style: normal;
text-decoration: none;
text-transform: uppercase;
color: #f77294;
text-align: right;
padding-right: 10px;}
.module_titre_contenu {height: 30px;}
/*---- info article ----*/
.article_info {color: #585858;
font-family: 'Roboto';
font-size: 9pt;
margin: 0px 0px 15px 0px!important;
padding: 0px;}
.article_info a {text-shadow: 0px 0px 2px black;}
/*---- contenu article ----*/
.module_contenu_block {}
.module_contenu {padding: 5px 12px 10px 12px;
font-family: 'Roboto';
font-size: 10pt;
color: #9e9e9e;
line-height: 130%;
margin: 0px;
text-align: justify;}
.module_contenu a {color: #1fc7de;
font-weight: normal;
font-style: normal;
text-decoration: none;
font-variant: normal;
text-shadow: 0px 0px 1px var(--blue);}
.module_contenu a:hover {color: #acacac;
text-shadow: 0px 0px 1px #acacac;}
/*---- recherche ----*/
.module_menu_type_search .module_menu_contenu {background: none!important;}
.module_menu_type_search .module_menu_titre {background: none!important;}
.module_menu_type_search { position: absolute;
top: 298px;
margin-left: 200px;}
.module_menu_type_search input[type="text"]:nth-child(1) {background: #202425;
width: 190px; height: 25px;
border: none;
box-shadow: inset 1px 1px 4px black;
border-radius: 4px 4px 4px 4px;}
.module_menu_type_search input[type="submit"]:nth-child(3) {
display: none;}
.module_menu_type_search input[type=text] {background: url('http://ekladata.com/MARdyOayMxSPGSb7urGdls_hAO8.png') no-repeat 2% 50%!important;
background-size: 8%!important;}
/*--module de la shoutbox--*/
.menu_shoutbox {height: 350px;
background: rgba(50,50,50,0.8);
box-shadow: inset 1px 2px 7px rgba(0,0,0,0.9);
padding: 7px;
color: #717171;}
.menu_shoutbox hr {width: 0px;
height:0px;
padding:0px;
margin: 11px;}
.module_menu_type_shoutbox input[type="text"], .module_menu_type_shoutbox select, .module_menu_type_shoutbox textarea {
background: rgba(50,50,50,0.8);
box-shadow: inset 1px 2px 7px rgba(0,0,0,0.8);
color: #717171;
border: none;
margin-top: 4px;
height: 20px;
width: 95%;
padding: 5px;
margin-bottom: 5px;}
.module_menu_type_shoutbox [type="submit"] {width: 90%;
background: linear-gradient(var(--pink), #c25054);
color: #ededed;
height: 30px;
border: none;
border-radius: 3px;
font-family: 'roboto';
letter-spacing: 3pt;
text-transform: uppercase;
font-weight: bold;
text-shadow: 1px 2px 0px #c25054;}
.module_menu_type_shoutbox [type="submit"]:hover {opacity: 0.9;
box-shadow: inset 1px 2px 3px rgba(0,0,0,0.5);}
.menu_shoutbox strong {color: var(--blue);}
/*---- boutons ----*/
input[type=button],input[type=submit], button {width: 90%;
background: linear-gradient(var(--pink), #c25054);
color: #ededed;
height: 30px;
border: none;
border-radius: 3px;
font-family: 'roboto';
letter-spacing: 3pt;
text-transform: uppercase;
font-weight: bold;
text-shadow: 1px 2px 0px #c25054;}
input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover, button:hover, .button:hover {opacity: 0.9;
box-shadow: inset 1px 2px 3px rgba(0,0,0,0.5);}
/*---- forum ----*/
.tag-ontop {background-color:#f23b5f;
border: 1px solid black;}
.tag-resolved {background-color:#f4f4f4;
border: 1px solid black;
color: #3a3a3a;}
.post_table_head {background: #060606;
text-align: right;
padding-right: 10px;
color: #323232;
font-family: arial;
padding-top: 3px; padding-bottom: 3px;}
.post_table_profile {font-size: 10pt;
font-weight: bold;
text-align: center;
line-height: 220%;
background: #060606;
padding-bottom: 13px;
width: 100px;}
.post_table_profile img {border-radius: 15px 35px / 25px 9px;
background-color: #d8d8d8;
box-shadow: 0px 0px 3px #d8d8d8;
border: 3px solid #d8d8d8;
}
.post_table_msg {background: #595959;
box-shadow: inset -3px -4px 0px #060606, inset -1px -1px 10px black;
padding: 5px 9px 7px 9px;
text-align: justify;
color: black;}
/*---- footer ----*/
#footer {text-shadow: 0px 0px 4px black;}
#footer a {color: #424242;
font-weight: normal;
font-style: normal;
text-decoration: none;
font-variant: small-caps;}
#footer {
text-shadow: 0px 0px 4px black;}
#footer {clear: both;
overflow: hidden;
text-align: center;
height: 25px;
margin-top: 0;
color: #424242;
font-family: 'Roboto';
font-size: 12pt;
font-weight: bold;
font-style: normal;
text-decoration: none;
font-variant: small-caps;}#footer:after {content: "- Design by Elinae - © 2015 - 2021";}
/*---- commentaire article ----*/
.comment_normal, .comment_admin {background: black;
width: 93%;
margin-left: 5%; margin-right: 5%;
margin-top: 10px; margin-bottom: 15px;
border-radius: 7px 7px 5px 5px;}
.commentdate {color: #333;
font-family: helvetica;}
.commentbody {background: #060606;
margin-left : 3px; margin-right: 3px;
margin-bottom: 0px; margin-top: 5px;
border-radius: 4px;
text-align: justify;
border-bottom: 3px solid black;}
.commentavatar {border: 3px solid #d8d8d8;
padding: 0px;
margin-left: 8px; margin-bottom: 4px;
border-radius: 15px 35px / 25px 9px;
background-color: #d8d8d8;
box-shadow: 0px 0px 3px #d8d8d8;}
.commentavatar img {border-radius: 15px 35px / 25px 9px;}
.comment_admin .commentpseudo a {color: #e93a5b;
text-shadow: 0px 0px 1px #e93a5b;}
.commentnumber {color: white;
font-family: arial;
opacity: 0.3;}
.comment_admin .commentnumber {color: white;
font-family: arial;
opacity: 0.3;}
ul.block-reply {border: none;
margin-top: 40px;}
/*---- MENUBAR ----*/
#menubar_hide{display:none;}
#menubar_logo{position : absolute;
right: -2px;}
#menubar_favorites{background-image: none}
.menubar_separation{display: none;}
.menubar_section{background: none;}
.menubar_section:hover{background: none;}
#menubar{background: black;
box-shadow: 0px 0px 5px black;
border-bottom:0px solid #bac84b;
color:#fc5e87;
font-size: 8pt;
font-family: arial;
text-transform: none;}
.menubar_section img{opacity:0.7;
-o-filter:grayscale(1%);
-moz-filter:grayscale(1%);
-webkit-filter:grayscale(1%)}
.menubar_section li {
margin-bottom:0px;
border-bottom: 1px dashed #111111;
font-size: 9pt;
color: grey;
font-family: arial;
background:black; }
.menubar_section li:last-child{
margin-bottom:2px;
border: 0px solid #111111;
font-size: 9pt;
color: grey;
font-family: arial;
background:black;
border-radius: 0px 0px 10px 10px;}
.menubar_section li:hover {color:#17d7f2;;
transition-duration:0.4s;
-moz-transition-duration:0.4s;
-webkit-transition-duration:0.4s;}
.menubar_section li:last-child:hover {
box-shadow:inset 0px 0px 20px #111111;
transition-duration:0.5s;
-moz-transition-duration:0.5s;
-webkit-transition-duration:0.5s;}
#notifications_panel{background: none;}
#notifications_panel a{
font-weight:normal;
font-size:10px;
text-transform:uppercase}
#notifications_panel a,
#notifications_panel div {
color:#ddd;
font-size:11px;
background:#030303;
transition-duration:0.5s;
-moz-transition-duration:0.5s;
-webkit-transition-duration:0.5s;}
#notifications_panel a:hover,
#notifications_panel div:hover {
color:#17d7f2;
box-shadow:inset 0px 0px 20px black;}
#notifications_panel
.new_notification {color: #fc3367;}
#menubar_section_account img {border-radius: 20px 20px 20px 20px;}
#menubar_section_account a {color: white;}
#menubar{padding-left: 15px;}
Pour installer le thème
1. Mettre à zéro toutes les valeurs de votre blog et décocher tout ce que vous pouvez.
2. Choisir un seul menu à gauche.
3. Copier, coller et appliquer les codes CSS du thème proposé.
4. Utilisez le menu de l'en-tête.
Ce que vous devez faire et savoir en plus de copier le code
1. Il faut utiliser le menu de l'en-tête.
2. Le menu du header et le menu déroulant ont été codé. La shoutbox et les forums aussi.
3. Choisir d'afficher 6 derniers visiteurs dans le module derniers visiteurs.
En cas de bug dans l'affichage du thème, vérifiez que toutes les valeurs du thème sont à zéro. Si le problème ne vient pas de là, n'hésitez pas à me prévenir et j'essaierai de voir où ça coince.
J'ai décidé de mettre en libre service mes anciens thèmes. Je ne les utilise plus mais je les aime toujours alors autant qu'ils servent à d'autres personne ! Enjoy.
Il s'agit du design #33 réalisé en février 2015
22 septembre 2021. Le codage du thème a été mis à jour et adapté pour être mis en LS. Il est adapté aux grands écrans (au moins de 1000px de large) - Idée du thème en Mai 2015
-
Commentaires
Ah mince! :o Tu n'as pas une petite idée de ce qui peut clocher? (sinon tente de demander dans les forum d'eklablog? certaines personnes répondent souvent et semblent s'y connaître en codage, donc même si ils/elles ne sont pas capables de résoudre le problème il pourraient au moins le localiser précisément, peut être?)
Après c'est pas le pire problème que j'ai vu en terme de codage "pas géré". x) J'ai vu des trucs bien plus handicapants chez des blogs d'adolescentes qui font des copiés collés en oubliant que NON les menus SUR le contenu de blog ou dans les menus d'en-tête c'est NI design, ni pratique. xD
Quoiqu'il en soi, bonne chance pour régler le soucis! :) (et désolé de la participation inutile du coup.)
-
Vendredi 15 Octobre 2021 à 10:50
-
J'ai l'impression que ça dépend plus des types de pc et leur résolution différente, qui fait que le soucis est plus récurrent. :o Ca empêche juste de lire les débuts de post/rubriques donc c'est encore gérable pour moi. Ca reste juste dommage en fait. Ceci dit, encore bonne chance pour régler ça! o/
-
Vendredi 15 Octobre 2021 à 20:12
-
Vous devez être connecté pour commenter
Ton post tombe bien, parce que je ne savais pas comment t'en faire part (en mp y'avait pas moyen malheureusement):
Ton thème à l'air de buguer 2 chargements sur 3, depuis le pc de mon meilleur ami. :/ Ca donne régulièrement ça:
Ouais je suis tristement au courant :/
C'est Nagalia qui m'a permis de faire le codage du header : au début ça le faisait à chaque fois et il fallait refresh la page pour régler le problème et maintenant ça arrive aléatoirement chez moi (et deux fois sur trois chez ton meilleur ami du coup). Nagalia avait réglé le problème initial mais il semble persister...
Malheureusement c'est du javascript et je maîtrise pas du tout et j'ose pas déranger Nagalia pour ça :'(
Je vais sûrement devoir repenser le design du blog pour éviter le bug