Index du Forum » » Modifications ou correction de thèmes existants

Auteur

[Résolu] - Rustic Portrait Blue
colonelwog
286     
 ModulesTeam (TMT)

  Posté : 16-12-2011 06:49

ok me suis inscrit et j'ai vu ^^dsl donc deux choses modifier header.html et style:

je les ai modifier :
header ligne 20




et pour la css:

/* CSS marina pour NPDS Revolution */

/************************************************************************
Parce qu'on utilise "em" en taille de font
*************************************************************************/

html {
font-size: 100%;
}
/************************************************************************
Aspect Général du site : Font, Textes, Marges, etc...
*************************************************************************/



body{
margin:0px auto;
font-size: 12px;
font-family: Verdana, Arial, Helvetica, Sans-Serif;
color000;
background000001 !url(!../images/LBlocs/bg_top.jpg) no-repeat left top;
border:0px yellow solid;
}
/************************************************************************
Règle horizontale servant de séparation
*************************************************************************/

hr {
color: #736f3c;
background-color: #736f3c;
border: 0;
height: 1px;
}
/* Aspect du Texte de votre Site lorsqu'il n'est pas redéfini ailleurs, visible dans la Partie Admin par exemple */

td {
font-family: Arial, Helvetica, "Nimbus Sans L", sans-serif;
font-size: 1.0em;
}
/************************************************************************
Les Différents LIENS Standards
*************************************************************************/

a, a:visited, a:link {
color: #000;
text-decoration: none;
}
a:hover {
colorff0000;
text-decoration: none;
}
a:active, a.box, a.box:active, a.box:visited {
color: #000;
text-decoration: none;
}
a.noir, a.noir:visited, a.noir:active {
color: #e8f4ff;
font-weight: bold;
text-decoration: underline;
}
a.noir:hover, a.box:hover, a.heada:hover {
color: #fff;
font-weight: bold;
text-decoration: none;
}
.rouge, a.rouge, a.rouge:visited, a.rouge:active {/* Annulation, suppression, avertissement...*/
color: #ff0000;
font-weight: bold;
text-decoration: none;
}
a.rouge:hover {
color: #ff0000;
font-weight: bold;
text-decoration: underline;
}
a.aideans, a.aideans:visited, a.aideans:active {/* Aide en Ligne */
background: none transparent;
cursor: help;
font-weight: bold;
text-decoration: none;
}
a.heada, a.heada:visited, a.heada:active {/* Admin (haut et bas) - Download - Annuaire */
color: #323232;
font-weight: bold;
text-decoration: none;
}
/************************************************************************
Liens Tooltip ==> Info Bulles
Initialement prévu pour Download
fonctionnel ou vous le souhaitez
*************************************************************************/

a.tooltip {
/*color: gray;*/
border-bottom: 1px dotted gray;
}
a.tooltip em {
display:none;
}
a.tooltip:hover {
border: 0;
position: absolute;
z-index: 500;
text-decoration:none;
}
a.tooltip:hover em {
font-style: normal;
display: block;
position: absolute;
top: 20px;
left: -10px;
padding: 5px;
color: #000;
border: 1px solid #bbb;
background: #cfd8e5;
width:auto;
}
a.tooltip:hover em span {
position: absolute;
top: -7px;
left: 15px;
height: 7px;
width: 11px;
margin:0;
padding: 0;
border: 0;
}
/************************************************************************
Alternance des couleurs de ligne Fonction tableaux()
*************************************************************************/

.ligna, a.ongl, a.ongl:visited, a.ongl:active {
background-color: #98afd2;
border: #ccdcf5 1px solid;
text-decoration: none;
}
.lignb {
background-color: #7d91af;
border: #ccdcf5 1px solid;
text-decoration: none;
}
/************************************************************************
Champs de Formulaires - Champs de Saisies
*************************************************************************/

.inputa {/* champ de saisie, Lnl Box, Moteur de recherche, Bloc Login notamment */
background-color: #ffffff;
border: #000000 1px solid;
color: #000000;
height: 18px;
vertical-align: middle;
width: 80px;
}
.textbox { /* Champs Formulaire - Message à  un membre - forum - Notamment */
background-color: #ffffff;
border: #000000 1px solid;
color: #000000;
width: 100%;
}
.textbox_standard {/* Champs Formulaire - Contact - forum (sauter à ) - Notamment */
background-color: #ffffff;
border: #ccdcf5 1px solid;
color: #000000;
}
.bouton_standard {/* Boutons : Prévisualiser - Valider - Annuler ....*/
background-color: #000000;
padding:1px 5px 1px 1px;
border: #000000 1px solid;
color: #ffffff;
font-weight: bold;
font-style: normal;
text-decoration: none;
}
/************************************************************************
CSS Complémentaire pour vos Formulaires
*************************************************************************/

form { /* Délimitation de votre Formulaire*/
padding: 2px;
width: 99%;
}
form p {
line-height:100%;
}
fieldset { /* Regroupe les différentes zones de votre Formulaire */
padding: 15px; /* padding in fieldset support spotty in IE *//*margin: 0;*/
border: 1px solid #ccdcf5;
}
legend { /* Titre pour identifier chaque fieldset */
font-size:1.1em;
color: #183a55;
font-weight: bold;
padding-bottom:3px;
}

label {
display: block;
float: left;
width: 180px;
margin-top: 3px;
padding-right: 10px;
text-align: right;
}
input[type=Submit], [type=Reset], [type=Return] {
background-color: #7d91af;
padding:1px 5px 1px 1px;
border: #ccdcf5 1px solid;
color: #ffffff;
text-decoration: none;
}
input[type=radio] {
background-color:transparent;
border:none;
}
input[type=Image] {
border:none;
}
input, select, textarea {
border: #ccdcf5 1px solid;
color: #000000;
background-color: #ffffff;
margin-top: 2px;
padding: 0;
}
form label span {
color: red;
}/* Utilisé dans user ! */
form br {
clear:left;
}
/************************************************************************
Les Autres Eléments Définis en "Dur" dans le code
Tableaux & Entêtes & Titres & Mise en Forme
*************************************************************************/

.forum_titre {
background:!url(!../images/LBlocs/bg_page_title.png) no-repeat;
font-size: 1.30em;
font-weight: bold;
color: #fff;
height: 60px;
line-height: 28px;
padding: 15px 0px 0px 10px;
margin: 2px 0px 0px 2px;
width:540px;
}
.ongl {/*Admin Banners - Download Gauche - Links - Top10...Ligne et Onglet Nominatif*/
color: #45445b;
font-weight: bold;
text-decoration: none;
}
.header, a.ongl:hover, .titre {/* header : Entete de Pratiquement Tous les Tableaux également dans Forum */
color: #282828;
text-decoration: none;
}
.box {/*Titre du Style BOX - Links Titres - Bas PollBoth (PollComments) - Memberlist...*/
color: #545454;
margin-left: 5px;
margin-right: 5px;
}
.titboxc {/* Haut Admin - Download */
color: #000;
font-weight: bold;
background: #6d89b3;
border: 1px solid #ccdcf5;
}
.titboxcont {/* Intitulé Bloc Sondage - Bloc Admin (les chiffres)*/
background: none transparent;
color: #0e0e0e;
font-weight: bold;
}
.titrea {/* Titres : Sondages (Poolboth) - Previews - notamment */
font-weight: bold;
text-decoration: none;
}
.titrec {/* Blocs Forums Infos - Bloc Chat Box (IP + les Chiffres) */
color: RED;
text-decoration: none;
}
.separ {/* Ligne de séparation (une Image) Haut Menu Admin - Menu Membres - Haut et Bas Section */
background: !url(!'../images/ligne.gif') left repeat-x;
height: 5px;
}
code {/*Utilisée pour mettre en évidence une portion de code - Forum Aussi dans AdminModuleInstall*/
border: 1px solid #45445b;
display: block;
font-family: monospace;
padding: 1px 1px 1px 5px;
width: 90%;
}
.quote {/* Citation dans le Forum */
border: 1px solid #183a55;
margin: 5px 5px 5px 5px;
padding: 5px 5px 5px 5px;
width: 90%;
}
h2 {/* Titre : Map - Forum - Articles (index et détail) */
color: #e8ecf0;
font-size: 1.25em;
font-weight: bold;
height: auto;
line-height: 30px;
padding: 0px 0px 0px 20px;
margin: 0px;
}
h3 { /* Map - box_article - box_pool */
color: #7d7c6c;
font-weight: bold;
text-align: left;
font-size: 1.25em;
margin: 0px;
}
h4 { /* Map */
color: #0773a3;
font-weight: bold;
font-size: 1.15em;
}
/************************************************************************
Mise en Page Globale & Mise en Forme de votre Thème
*************************************************************************/

#container {
text-align:left;
margin-left:auto;
margin-right:auto;
width:980px;
}
#header { /* Ici - Le Header Complet avec Image de Fond */
background: !url(!../images/LBlocs/bg_header.gif);
height: 140px;
width: 980px;
}

#mask_hole {
position: absolute;

left:auto;
top:200px;
width: 195px;
height:170px;
background:!url(!../images/LBlocs/mask_hole.png);
z-index:110;
}

#slogan { /* slogan du header*/
position: absolute;
color: #ffffff;
top : 50px;
left:auto;
font-size: 1.7em;
}

#mainsearch{
position:absolute;
top:410px;
left:160px;
height:12px;
width:130px;
}
#mainsearch .input {
height:12px;
width:95px;
padding:0;
margin:2px 0 0 0;
font-size:11px;
font-family: Arial, Verdana, Helvetica;
color: #a2a2a2;
border:none;
backgroundfff;
}
#mainsearch .submit{
cursor:pointer;
border:none;
backgroundccc;
position:absolute;
height:20px;
width:30px;
right:0px;
bottom: -2px;
background: transparent;
}

#backend {
position: absolute;
left:170px;
top:140px;
width: 190px;
height:170px
}

/************************************************************************
Mise en forme du menu
*************************************************************************/
#menu {
float:right;
overflow:hidden;
width:528px;
height:58px;
right:0;
top:0;
border:0px white solid;
}
#menu ul {
float:right;
margin:0;
padding:0;
height: 58px;
border:0px red solid;
}

#menu ul li {
display: inline;
font-size: 12px;
font-family:Arial,Verdana;
font-weight: bold;
height:40px;
margin:0px;

}
#menu ul li a { /*145x70*/
float: left;
display: block;
height:42px;/*58*/
width:100px; /*176*/
line-height: 15px;
color: #000000;
padding: 16px 56px 0 20px;
text-align:center;
margin:0 0 0 0;
text-decoration:none;
background:!url(!../images/LBlocs/bg_menu.gif) no-repeat top center;
border:0px red solid;
}
#menu ul li a:hover, #menu ul li.current_page_item a {
colorffffff;
cursor:pointer;
}


/************************************************************************
La Partie CENTRALE de votre Site
*************************************************************************/

#corps {/*Container Englobant toutes les colonnes*/
background:!url(!"../images/LBlocs/bg_container.png") #a2b6d5 no-repeat;
float: left;
width:980px;
z-index:80;
}
#col_princ {/* La Partie Centrale avec Pdst = -1 uni*/
float: left;
overflow:auto;
padding: 10px 0 0 8px;
}
.trio {/* La Partie Centrale avec Pdst = 1 - 3 et 4 trio*/
float: left;
width: 620px;
margin: 20px 0 0 0;
}
/************************************************************************
Edito se rapporte donc à "editorial.html"
*************************************************************************/

#editorial {
margin: 2px 2px 15px 2px;
padding:2px 4px 2px 4px;
}
#editorial .content {
width: 100%;
}
/************************************************************************
Affichage des Articles en page Index et Detail-news
*************************************************************************/

.article_bloc {/*Le contenant*/
background:!url(!"../images/LBlocs/bg_post_title.png") no-repeat;
margin: 0px;
width:100%;
padding:15px 0 10px 0;
text-align:left;
}
.article_bloc_det {/*Le contenant*/
background:!url(!"../images/LBlocs/bg_post_title.png") no-repeat;
margin: 0px;
width:100%;
padding:15px 0 10px 0;
}
.article_sujet {
float: left;
width: 90px;
height: 90px;
text-align: left;
padding: 40px 10px 10px 10px;
}
.article_texte {
min-height: 100px;
height: auto !important;
padding: 30px 5px 5px 5px;
}
.note { /* Mise en forme si Note */
border: 1px solid #ccdcf5;
width:98%;
text-align:center;
font-style: italic;
font-size: .9em;
padding: 3px;
margin: 2px;
}
.article_pied { /*Mise en forme du Pied*/
padding: 5px;
text-align: center;
}
.emetteur { /*Lien Emetteur*/
text-align:right;
width:100%;
margin: 20px 0 0 -20px;
font-size: 10px;
colora2a2a2
}
.date_head{ /*Lien Emetteur*/
float:right;
width:110px;
height:30px;
}
.n_date{ /*Lien Emetteur*/
float:right;
width:110px;
height:30px;
color: #e8ecf0;
font-size:10px;
text-align:left;
margin: 5px 37px 0 0 !important;
margin: 5px 49px 0 0;
}
.n_date_det{ /*Lien Emetteur*/
float:right;
width:120px;
height:30px;
color: #e8ecf0;
font-size:10px;
padding: 5px 38px 0 0 !important;
padding: 5px 48px 0 0;
}
#footer_articles {
height: 25px;
width: 100%;
}
/************************************************************************
"box_Article" corespond au bloc Liens Relatifs
"box_poll" lui au Bloc sondage (pollBoth)
*************************************************************************/

#box_article, #box_poll {/*les 2 Blocs seront identiques*/
width: 140px;
float: left;
margin:0px 2px 0px 2px;
padding:0;
text-align: left;
}
.bloc_title1 {
height: 30px;
width: 138px;
line-height: 30px;
}
.bloc_content1 {
padding: 0 5px 5px 5px;
text-align: left;
margin-bottom: 0px;
}
#box_poll li, #box_article li {
margin-left: 8px;
list-style-type: none;
color: #000000;
}
#box_article ul, #box_poll ul {
margin: 0 0 0 5px;
padding: 0 0 0 5px;
}
#box_article .boxc {
color: #000;
font-weight: bold;
margin: 0 0 0 5px;
}
/************************************************************************
Stats.php
*************************************************************************/

.graph {
width: 200px;
border: 1px solid #183a55;
padding: 2px;
}
.graph .bar {
display: block;
background: #6d89b3;
text-align: center;
color: #333;
height: 1em;
line-height: 1em;
}
/************************************************************************
Colonnes Gauche - Droite et Vos Blocs
*************************************************************************/

#col_LB {
width: 160px;
float: left;
position: relative;
margin: 300px 0 0 10px ;
}
.leftbloc {/* Un Bloc Gauche Global */
background:!url(!"../images/LBlocs/bg_sb2.gif") no-repeat;
text-align: left;
margin: 3px;
padding: 0 0 0 5px;/* Margin et Padding gérés dans LB_Contain */
width: 160px;
}
.leftbloc .LB_title {
text-align: left;
color: #31476a;
font-size: 14px;
font-weight: bold;
height: 24px;
line-height: 24px;
margin: 10px 0 0 0;
padding: 10px 0 0 10px;
}
.leftbloc .LB_contain {/* Bloc container pour le contenu */
padding: 5px 3px 5px 5px;
overflow:auto;
}
.leftbloc .LB_contain ul li{
line-height: 1.6em;
list-style-type: none;
margin: 0px 0px 0px -40px;
padding: 0px 3px 2px 12px;
background: !url(!'../images/LBlocs/bg_sb1.gif') no-repeat 0px 5px;
}

.leftbloc .LB_footer {/* Bloc container pour le contenu */
height:15px;
}
#col_RB { /* Là où se trouvent vos Blocs droits*/
width: 160px;
float: left;
position: relative;
padding: 0 5px 0 0;
margin: 300px 0 0 10px ;
}
.rightbloc {/* Un Bloc Droit Global */
background:!url(!"../images/LBlocs/bg_sb2.gif") no-repeat;
text-align: left;
margin: 3px;
padding: 0;/* Margin et Padding gérés dans RB_Contain */
width: 160px;
}
.rightbloc .RB_title {
color: #31476a;
font-size: 14px;
font-weight: bold;
height: 24px;
line-height: 24px;
text-align: left;
margin: 10px 0 0 0;
padding: 10px 0 0 10px;
}
.rightbloc .RB_contain {/* Ajout d'un bloc container pour le contenu */
padding: 5px 3px 5px 5px;
overflow:auto;
}
.rightbloc .RB_footer {/* Bloc container pour le contenu */
height:15px;
}
.rightbloc .RB_contain ul li{
line-height: 1.6em;
list-style-type: none;
margin: 0px 0px 0px -40px;
padding: 0px 3px 2px 12px;
background: !url(!'../images/LBlocs/bg_sb1.gif') no-repeat 0px 5px;
}
/************************************************************************
La Partie Footer de votre Site
*************************************************************************/

#footer {
background:!url(!"../images/LBlocs/bg_container_btm.jpg") no-repeat;
text-align: right;
color: #fff;
width: 980px;
height: 120px;
clear: both;
}
#footer_end {
background:!url(!"../images/LBlocs/bg_footer.jpg") no-repeat;
text-align: right;
color: #fff;
width: 980px;
height: 55px;
padding :30px 0 0 0;
font-size:11px
}
#footer_end a {
color: #fff;
text-decoration: underline;
}
#pied {
color: #ffffff;
text-align: center;
display:none;
}


voilà regarde les deux codes qui différes

d'abord container qu'on met au milieu avec des marges automatiques de chaque coté;
ensuite le mask_hole que l'on met aussi en marge gauche automatique
et pour finir le slogan on fait de même ....



Cet article provient de NPDS Thèmes

http://styles.npds.org/viewtopic.php?topic=122&forum=4