653 lines
17 KiB
CSS
Executable File
653 lines
17 KiB
CSS
Executable File
/*
|
||
* class && id principaux
|
||
*/
|
||
|
||
/* contraint toute l'application */
|
||
#application{
|
||
width: 100%;
|
||
}
|
||
|
||
/* header */
|
||
#header{
|
||
height: 122px;
|
||
width: 100%;
|
||
background: url(../media/image/haut_fond.gif) 0 0 ;
|
||
background-position: left top;
|
||
}
|
||
/* Logo */
|
||
#logo{
|
||
height: 122px;
|
||
width: 100%;
|
||
background: url(../media/image/haut_logo_main.gif) 0 0 no-repeat;
|
||
background-position: left top;
|
||
}
|
||
/* footer */
|
||
#footer{
|
||
background: url(../media/image/bas_fond.gif) 0 0 ;
|
||
width: 100%;
|
||
height: 24px;
|
||
}
|
||
#footerlogo{
|
||
width: 710px;
|
||
height: 24px;
|
||
}
|
||
|
||
|
||
/************************************************************************
|
||
* bloc principal (data) */
|
||
#data{
|
||
margin-left: 205px;
|
||
margin-right: 10px;
|
||
}
|
||
#data .box{
|
||
width: 98%;
|
||
border: 1px solid #333366;
|
||
border-bottom: 3px solid #333366;
|
||
vertical-align: top;
|
||
}
|
||
#data .box .box{
|
||
width: 100%;
|
||
border: 0;
|
||
border-top: 1px solid #333366;
|
||
}
|
||
/*#data .box div{width:100%;}*/
|
||
#data div{
|
||
text-align: left;
|
||
width: 99%;
|
||
}
|
||
#data div div{
|
||
width: 100%;
|
||
}
|
||
#data legend{
|
||
padding: 4px;
|
||
font-weight: normal;
|
||
}
|
||
|
||
#data label{
|
||
float: left;
|
||
width: 145px;
|
||
font-weight: normal;
|
||
text-align: right;
|
||
}
|
||
#data .labelbig{
|
||
float: left;
|
||
width: 180px;
|
||
font-weight: normal;
|
||
text-align: right;
|
||
}
|
||
#data .labelverybig{
|
||
float: left;
|
||
width: 260px;
|
||
font-weight: normal;
|
||
text-align: right;
|
||
}
|
||
#data .boxcheck .labelbig{
|
||
display: block;
|
||
float: left;
|
||
width: 180px;
|
||
font-weight: normal;
|
||
text-align: right;
|
||
}
|
||
#data input{
|
||
width: 166px;
|
||
vertical-align: middle;
|
||
}
|
||
#data select{
|
||
right: 0;
|
||
width: 204px;
|
||
vertical-align: middle;
|
||
margin-bottom: 4px;
|
||
}
|
||
#data .selectsmall{
|
||
width: 180px;
|
||
}
|
||
#data .fieldshort input{
|
||
display: block;
|
||
float: left;
|
||
width: 49%;
|
||
}
|
||
#data .fieldshort input{
|
||
width: 20px;
|
||
}
|
||
#data .fieldshort select{
|
||
width: 168px;
|
||
}
|
||
#data .selectbig{
|
||
width: 190px;
|
||
}
|
||
#data textarea{
|
||
right: 0;
|
||
width: 203px;
|
||
vertical-align: middle;
|
||
}
|
||
#data .textareacomm{
|
||
width: 166px;
|
||
}
|
||
#data .textareasyndic{
|
||
right: 0;
|
||
width: 99%;
|
||
margin: 3px;
|
||
vertical-align: middle;
|
||
}
|
||
#data h1, #data h2, #data h3{
|
||
padding-left: 2px;
|
||
}
|
||
#data .selectGroup select{
|
||
width: 230px;
|
||
}
|
||
|
||
#data .box ul{padding-left:20px;}
|
||
|
||
/************************************************************************
|
||
* gestion des fieldset (-> cas a gerer: dans .box et en dehors )*/
|
||
|
||
#data .fieldsetinstall{
|
||
display: block;
|
||
width: 65%;
|
||
border: 1px solid #333366;
|
||
margin: 15px;
|
||
margin-top: 2px;
|
||
margin-bottom: 3px;
|
||
}
|
||
#data .fieldsetinstall legend{
|
||
font-weight: bold;
|
||
}
|
||
#data .fieldsetinstall .colorEtape{
|
||
background-color: #333366;
|
||
color: #FFFFFF;
|
||
}
|
||
#data .fieldsetinstall .colorEtape strong{
|
||
color: #FFFFFF;
|
||
}
|
||
|
||
|
||
#data .fieldset, #data .confirm{
|
||
display: block;
|
||
border: 1px solid #333366;
|
||
margin: 15px;
|
||
margin-top: 2px;
|
||
margin-bottom: 3px;
|
||
}
|
||
|
||
#data .fieldset fieldset{
|
||
display: block;
|
||
border: 1px solid #333366;
|
||
margin: 15px;
|
||
margin-top: 2px;
|
||
margin-bottom: 3px;
|
||
}
|
||
#data .fieldset legend, #data .confirm legend{
|
||
font-weight: bold;
|
||
}
|
||
#data .fieldset select{
|
||
margin-top: 2px;
|
||
}
|
||
/* ---> Pour les suppressions (voir aussi la classe important)*/
|
||
#data .confirm{
|
||
border: 1px solid #333366;
|
||
}
|
||
#data .confirm legend{
|
||
color: #333366;
|
||
}
|
||
#data .confirm .action {
|
||
border-top: 1px solid #333366;
|
||
background-color: #E7EAED;
|
||
width: 100%;
|
||
}
|
||
#data .confirm .action .next{
|
||
width: 50px;
|
||
height: 22px;
|
||
}
|
||
/************************************************************************
|
||
* fin gestion des fieldset
|
||
*/
|
||
|
||
|
||
|
||
/************************************************************************
|
||
* Classes utiles
|
||
*/
|
||
.important{
|
||
display: inline;
|
||
color: rgb(255, 153, 0);
|
||
padding: 4px;
|
||
font-weight: bold;
|
||
}
|
||
|
||
#data .field{
|
||
display: block;
|
||
float: left;
|
||
width: 49%;
|
||
}
|
||
|
||
#data .tabledetail .field{
|
||
height: 20px;
|
||
}
|
||
|
||
#data .field label, #data .field .label{
|
||
height: 20px;
|
||
}
|
||
#data .fieldset .field img{
|
||
padding-right: 2px;
|
||
padding-left: 1px;
|
||
}
|
||
#data .txt{
|
||
display: block;
|
||
float: left;
|
||
font-weight: bold;
|
||
width: 100%;
|
||
padding: 10px;
|
||
}
|
||
#data .txt p{
|
||
display: inline;
|
||
float: left;
|
||
width: 100%;
|
||
padding: 2px;
|
||
}
|
||
#data .boxcheckextend label{
|
||
display: block;
|
||
width: 140px;
|
||
}
|
||
#data .boxcheckextend input{
|
||
width: 13px;
|
||
border: 0;
|
||
}
|
||
#data .boxcheck{
|
||
display: block;
|
||
width: 20%;
|
||
float: left;
|
||
}
|
||
#data .boxcheck label{
|
||
width: 120px;
|
||
padding-top: 2px;
|
||
float: left;
|
||
font-weight: normal;
|
||
}
|
||
#data .boxcheck input{
|
||
width: 13px;
|
||
border: 0;
|
||
}
|
||
/************************************************************************
|
||
* fin classe utiles
|
||
*/
|
||
|
||
|
||
/************************************************************************
|
||
* Definition des .tableaux de presentation par defaut
|
||
*/
|
||
#data .table{
|
||
/* display: block; */
|
||
float: right;
|
||
border-spacing: 1px;
|
||
width: 100%;
|
||
clear: both;
|
||
}
|
||
#data .fieldset .table caption{
|
||
display: none;
|
||
}
|
||
#data .table th{
|
||
background: #333366;
|
||
color: #FFFFFF;
|
||
text-align: center;
|
||
font-weight: bold;
|
||
padding-left: 10px;
|
||
padding-right: 10px;
|
||
white-space: nowrap;
|
||
}
|
||
#data .table .thsmall{
|
||
width: 200px;
|
||
background: #FFFFFF;
|
||
color: #FF0000;
|
||
text-align: center;
|
||
font-weight: bold;
|
||
padding-left: 10px;
|
||
padding-right: 10px;
|
||
white-space: normal;
|
||
}
|
||
#data .table th a{
|
||
color: white;
|
||
}
|
||
#data .table tr{
|
||
background: #333366;
|
||
vertical-align: top;
|
||
}
|
||
#data .table tr td{
|
||
background: #E7EAED;
|
||
text-align: left;
|
||
padding: 1px 1px 1px 1px;
|
||
font-size: xx-small;
|
||
}
|
||
|
||
#data .table tr td input{width:98%}
|
||
|
||
#data .table tr td *{
|
||
font-size: xx-small;
|
||
}
|
||
#data .table tr:hover td{}
|
||
#data .table caption{
|
||
display: block;
|
||
font-weight: bold;
|
||
text-align: left;
|
||
padding: 15px 0 4px 15px;
|
||
}
|
||
#data .table tr td a{
|
||
background-position: center;
|
||
width: auto;
|
||
}
|
||
/* Si il ya un style de ligne */
|
||
#data .table .lineStyle1 td, #data .table .lineStyle1 td a,#data .tabledashboard .lineStyle1 td, #data .tabledashboard .lineStyle1 td a{
|
||
background-color: #E7EAED;
|
||
}
|
||
#data .table .lineStyle2 td,#data .table .lineStyle2 td a,#data .tabledashboard .lineStyle2 td,#data .tabledashboard .lineStyle2 td a{
|
||
background-color: #c1d2ee;
|
||
}
|
||
/* voir aussi la classe list et action!!! */
|
||
/************************************************************************
|
||
* Fin des .tableaux
|
||
*/
|
||
|
||
#data iframe{width:100%;}
|
||
|
||
/* sert pour la gestion des options d'affichage */
|
||
.option{
|
||
padding: 2px;
|
||
border-bottom: 1px solid #333366;
|
||
}
|
||
.clean{
|
||
display: block;
|
||
padding: 4px;
|
||
clear: both;
|
||
width: 100%;
|
||
}
|
||
.nodisplay{
|
||
display: none;
|
||
}
|
||
.fieldinfo{
|
||
display: inline;
|
||
position: relative;
|
||
top: 2px;
|
||
width: 100px;
|
||
padding-top: 3px;
|
||
vertical-align: bottom;
|
||
}
|
||
.preview{
|
||
border: 1px solid #333366;
|
||
width: auto;
|
||
float: right;
|
||
height: 156px;
|
||
margin: 4px 4px 4px 5px;
|
||
}
|
||
/* cahmps obligatoiress*/
|
||
#data .require{
|
||
}
|
||
/* liste simples ... */
|
||
.list{
|
||
display: block;
|
||
float: left;
|
||
width: 50%;
|
||
}
|
||
|
||
#data .table a, #data .table input{ width:90px; margin:3px;}
|
||
#data .table ul, .list{ padding-left:20px; list-style:square;}
|
||
|
||
|
||
/* D<>laration des <20><>ents par defaut d'une ligne de detail.. .*/
|
||
#data .tabledetail,#data .tabledetail td{
|
||
background-color: #E7EAED;
|
||
border: 1px solid #c1d2ee;
|
||
text-align: center;
|
||
padding-bottom: 3px;
|
||
margin-bottom: 3px;
|
||
}
|
||
#data .tabledetail .fieldset{padding:0px;margin:0px;border:0px;} /*IE 6*/
|
||
#data .tabledetail .fieldset label{text-align:left;font-weight:bold;}
|
||
#data .tabledetail .fieldset legend{display:none;}
|
||
|
||
|
||
/* style pour la legende */
|
||
#data .legendcolor {width:auto;display:block;padding: 5px 0px 10px 13px;}
|
||
#data .box .legendcolor div,#data .legendcolor div{display:inline;width:auto;border:0;}
|
||
#data .legendcolor .linkdelete,#data .legendcolor .linkview,#data .legendcolor .linkupdate,#data .legendcolor .linkadd,#data .legendcolor .linksave,#data .legendcolor .linknext,#data .legendcolor .linkback,#data .legendcolor .linkconfig{background-color:transparent;}
|
||
|
||
#data .legendcolor div{ float:left;width:auto;height:20px;}
|
||
#data .box .legendcolor .lnColor0, #data .box .legendcolor .lnColor1, #data .box .legendcolor .lnColor2, #data .box .legendcolor .lnColor3, #data .legendcolor .lnColor0, #data .legendcolor .lnColor1, #data .legendcolor .lnColor2, #data .legendcolor .lnColor3{
|
||
display: block;
|
||
margin: 0px 5px 0px 5px;
|
||
border: 1px solid #000000;
|
||
width: 10px;
|
||
height: 10px;
|
||
}
|
||
/* code de validation dans un .tableau...*/
|
||
#data .lnColor0, #data .table .lnColor0, #data .table .lineStyle1 .lnColor0, #data .table .lineStyle2 .lnColor0{background-color:#FFFFFF;} /* actif/publie */
|
||
#data .lnColor1, #data .table .lnColor1, #data .table .lineStyle1 .lnColor1, #data .table .lineStyle2 .lnColor1{background-color:rgb(255, 153, 0);} /* en attente*/
|
||
#data .lnColor2, #data .table .lnColor2, #data .table .lineStyle1 .lnColor2, #data .table .lineStyle2 .lnColor2{background-color:#FF0000;} /* archive*/
|
||
#data .lnColor3, #data .table .lnColor3, #data .table .lineStyle1 .lnColor3, #data .table .lineStyle2 .lnColor3{background-color:#98F01D;} /* archive*/
|
||
|
||
/*Style de couleur pour la gestion des quotas*/
|
||
/* style pour la legende */
|
||
#data .box .legendcolor .styleSend, #data .box .legendcolor .styleNew, #data .box .legendcolor .styleRead,#data .legendcolor .styleSend, #data .legendcolor .styleNew, #data .legendcolor .styleRead{
|
||
display: block;
|
||
margin: 0px 5px 0px 5px;
|
||
border: 1px solid #E7EAED;
|
||
width: 10px;
|
||
height: 10px;
|
||
}
|
||
#data .box .legendcolor .linkview,#data .box .legendcolor .linkdelete,#data .box .legendcolor .linksave,#data .box .legendcolor .linkupdate,#data .legendcolor .linkview,#data .legendcolor .linkdelete,#data .legendcolor .linksave,#data .legendcolor .linkupdate,#data .legendcolor .linkadd{
|
||
display: block;
|
||
margin: -5px -10px 0px 5px;
|
||
width: 10px;
|
||
height: 15px;
|
||
}
|
||
|
||
|
||
/* code de validation dans un .tableau...*/
|
||
#data .styleSend, #data .table .styleSend, #data .table .lineStyle1 .styleSend, #data .table .lineStyle2 .styleSend{background-color:#FFFFFF;} /* actif*/
|
||
#data .styleNew, #data .table .styleNew, #data .table .lineStyle1 .styleNew, #data .table .lineStyle2 .styleNew{background-color:rgb(255, 153, 0);} /* en attente*/
|
||
#data .styleRead, #data .table .styleRead, #data .table .lineStyle1 .styleRead, #data .table .lineStyle2 .styleRead{background-color:#c1d2ee;} /* actif*/
|
||
|
||
/************************************************************************
|
||
* -> Gestion des onglets
|
||
*/
|
||
.tabe{vertical-align:bottom; width:100%;height:20px;}
|
||
.tabe ul {
|
||
display: block;
|
||
height: 20px;
|
||
list-style: none;
|
||
vertical-align: bottom;
|
||
width: 100%;
|
||
}
|
||
.tabe ul li {
|
||
height: 19px;
|
||
list-style: none;
|
||
}
|
||
.box .tabe ul{
|
||
display: inline;
|
||
width: auto;
|
||
margin-left: auto;
|
||
margin-right: 0px;
|
||
padding-right: 0px;
|
||
float: right;
|
||
}
|
||
.box .tabe ul li{
|
||
/* display:inline; */
|
||
margin-right: 0px;
|
||
padding-right: 0px;
|
||
/* float:right; */
|
||
}
|
||
/* style des onglets */
|
||
.WindowTabeData, .WindowTabeDataSelected{
|
||
background-color: #E7EAED;
|
||
border: 1px solid #333366;
|
||
border-bottom: 0;
|
||
float: left;
|
||
width: 180px;
|
||
vertical-align: bottom;
|
||
}
|
||
|
||
.WindowTabeData a, .WindowTabeDataSelected a{
|
||
display: block;
|
||
font-weight: bold;
|
||
text-decoration: none;
|
||
}
|
||
.WindowTabeData{}
|
||
.WindowTabeDataSelected{}
|
||
.WindowTabeDataSelected a{background-color:#333366; color:#FFFFFF;}
|
||
/* events */
|
||
.WindowTabeData a:hover,.WindowTabeDataSelected a:hover{background-color:#c1d2ee;color:#333366;}
|
||
/************************************************************************
|
||
* -> Fin gestion des onglets
|
||
*/
|
||
|
||
|
||
|
||
|
||
|
||
/************************************************************************
|
||
* informations de l'objet
|
||
*/
|
||
/* utilise pour les headers*/
|
||
#data .header{
|
||
width: 100%;
|
||
padding: 3px 0 10px 0;
|
||
}
|
||
#data .header h1,#data .header h2,#data .header h3{
|
||
/* padding-top:5px;
|
||
padding-bottom:5px;*/
|
||
display: none;
|
||
}
|
||
#data .header p{
|
||
display: block;
|
||
background: url(../media/picto/puce.gif) 0 2px no-repeat;
|
||
padding: 0 10px 0 10px;
|
||
margin-left: 2px;
|
||
vertical-align: top;
|
||
}
|
||
/* Utilise pour les infos contextuelles*/
|
||
#data .info{
|
||
width: 99%;
|
||
border: 0;
|
||
padding: 4px;
|
||
text-align: center;
|
||
}
|
||
#data .info h1,#data .info h2,#data .info h3{
|
||
padding-top: 5px;
|
||
padding-bottom: 5px;
|
||
}
|
||
/************************************************************************
|
||
* Fin informations
|
||
*/
|
||
|
||
|
||
/************************************************************************
|
||
* legende d'un .tableau
|
||
*/
|
||
#data .legend{
|
||
/* display: block; */
|
||
float: right;
|
||
background: #FFFFFF;
|
||
width: auto;
|
||
height: 30px;
|
||
padding: 5px 10px 5px 10px;
|
||
margin: 0px;
|
||
}
|
||
#data .formNode{
|
||
display: inline;
|
||
float: left;
|
||
background: #FFFFFF;
|
||
vertical-align: middle;
|
||
padding-bottom: 20px;
|
||
width: 40%;
|
||
}
|
||
#data .formNode select{
|
||
width: 300px;
|
||
}
|
||
#data .box .legend div,#data .legend div{display:inline;width:auto; border:0; padding-left:18px;background-color:#FFFFFF;margin-left:5px;}
|
||
/************************************************************************
|
||
* Fin legende */
|
||
|
||
|
||
/************************************************************************
|
||
* barres de boutons
|
||
* action -> sert g<><67>iquement pour encadrer des boutons
|
||
* dans un .tableau il contient 2 colonne de bouton sinon utiliser actionOne
|
||
* actionOne sert dans un .tableau pour une colonne action restreinte
|
||
* actionA sert quand une barre d'action ne possede que des liens ( pas dans un .table)
|
||
*/
|
||
#data .action, #data .actionOne, #data .actionA{
|
||
text-align: center;
|
||
width: 100%;
|
||
border-top: 1px solid #333366;
|
||
background: #E7EAED;
|
||
padding: 0 0 0 0;
|
||
height: 22px;
|
||
clear: both;
|
||
vertical-align: top;
|
||
}
|
||
#data .action input, #data .action a, #data .actionOne input, #data .actionOne a, #data .actionA a{
|
||
width: 90px;
|
||
margin: 0;
|
||
}
|
||
#data .action a, #data .actionOne a, #data .actionA a{
|
||
/* font-size:100%;*/
|
||
height: 17px;
|
||
}
|
||
#data .action .buttonfreesize, #data .actionA .buttonfreesize, #data .actionOne .buttonfreesize{
|
||
width: auto;
|
||
}
|
||
#data .action input, #data .action a, #data .actionA a{display:inline;}
|
||
#data .actionA{padding-top:5px;height:17px;}
|
||
#data .actionA a{display:inline;background-position:2px 2px;width:100px;}
|
||
#data .action > a, #data .actionOne >a{padding:2px 5px 6px 26px; background-position:0 0;line-height:19px;border-top:2px solid #333366}
|
||
#data .table .action, #data .table tr .actionOne{ border-top:0; padding:0; margin:0; height:22px;width:125px;}
|
||
#data .table .actionOne{width:63px;}
|
||
#data .table .action a, #data .table tr .actionOne a{ display:block;float:left;width:25px; border:0px; padding-left:0;}
|
||
#data .action .boxcheck input, #data .actionOne .boxcheck input{width:12px; border:0; text-align:center;background-color:transparent;margin:0 20px 0 20px}
|
||
/************************************************************************
|
||
* plus d'elements dans boutton.css
|
||
*/
|
||
|
||
|
||
/************************************************************************
|
||
* <20><>ents du lexique
|
||
*/
|
||
.lexiqueLink:link {color: #333366; font-weight: bold; font-size: 10px;text-indent: 2px }
|
||
.lexiqueLink:hover {color: #333366; font-weight: bold; font-size: 10px;text-indent: 2px }
|
||
.lexiqueLink:visited {color: #333366; font-weight: bold; font-size: 10px;text-indent: 2px }
|
||
.lexiqueLink:active {color: #333366; font-weight: bold; font-size: 10px;text-indent: 2px }
|
||
|
||
.noLexiqueLink:link {color: #DDDDDD; font-weight: bold; font-size: 10px;text-indent: 2px }
|
||
.noLexiqueLink:hover {color: #DDDDDD; font-weight: bold; font-size: 10px;text-indent: 2px }
|
||
.noLexiqueLink:visited {color: #DDDDDD;font-weight: bold; font-size: 10px;text-indent: 2px }
|
||
.noLexiqueLink:active {color: #DDDDDD; font-weight: bold; font-size: 10px;text-indent: 2px }
|
||
|
||
#data .index{display:block;float:left; width:auto;}
|
||
#data .def{padding:2px; width:99%}
|
||
|
||
#data .leftlist label{
|
||
float: left;
|
||
display: block;
|
||
width: 170px;
|
||
}
|
||
#data .rigthlist ul{
|
||
float: right;
|
||
display: block;
|
||
width: 100%;
|
||
}
|
||
/*
|
||
* fin lexique
|
||
*/
|
||
|
||
/* classe pour l'<27>iteur wiziwig */
|
||
/*#data .freeStyle *, #data .freeStyle * *, #data .freeStyle * * *, #data .freeStyle .table, #data .freeStyle .table tr, #data .freeStyle .table tr td, #data .freeStyle ul, #data .freeStyle ul li, #data .freeStyle h1, #data .freeStyle h2, #data .freeStyle h3, #data .freeStyle h4{
|
||
width:auto;
|
||
font-size:auto;
|
||
padding:auto;
|
||
margin:auto;
|
||
background-color:auto;
|
||
list-style:auto;
|
||
display:auto;
|
||
}*/
|
||
|
||
/*
|
||
* Fin du main
|
||
*/ |