sid/css/global.css

134 lines
2.8 KiB
CSS
Executable File

.no-select{
user-select: none;
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
-o-user-select: none;
}
/**********************/
/*** TABLEAU .BASIC ***/
/**********************/
/* STYLE "BASIC" DES TABLEAUX */
table.basic{
/* position */
/*width: calc( 100% - 2*1em );*/
margin: 2em 1em;
/* border */
border-radius: 5px;
border-spacing: 0;
box-shadow: 0 0 4px #e3e3e3;
}
/* affichage du corps si tête activée */
table.basic thead + tbody td{ display: none; }
table.basic thead + tbody td.more{ display: block; }
table.basic thead.active + tbody td{ display: table-cell; }
table.basic tr td,
table.basic tr th,
#DRAGNDROP td,
#DRAGNDROP th{
/* position */
padding: 1em 1.5em;
/* border */
border-width: 1px 1px 0 0;
border-style: solid;
border-color: #e0e1e3;
/* backgroud */
background-color: #fff;
/* foreground */
color: #4e4e4e;
/* animation */
transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-webkit-transition: all .2s ease-in-out;
-ms-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
/* extra */
cursor: default;
}
/* la ligne "Voir plus" */
table.basic tr td.more{
/* background */
background: #f7f8fc url(../src/more.svg) right 1em center no-repeat;
background-size: auto 1.5em;
/* foreground */
color: #b7b7b7;
text-align: right;
padding-right: 3em;
/* extra */
cursor: pointer;
}
table.basic tr td.more:before{ content: 'Voir plus'; }
table.basic thead.active + tbody tr td.more:before{ content: 'Voir moins'; }
/* on cache "voir plus" quand le tableau est déroulé */
table.basic thead.active + td.more{ display: none; }
/* différence avec <thead> */
table.basic tr th{ background-color: #f7f8fc; font-size: 1.05em; }
table.basic tr th:first-letter{ text-transform: uppercase; }
/* on ajoute les rebords pour ceux à gauche */
table.basic tr td:first-child,
table.basic tr th:first-child{ border-left-width: 1px; }
/* on ajoute les rebords pour ceux en bas */
table.basic tr:last-child td { border-bottom-width: 1px; }
/* angle haut gauche */
table.basic tr:first-child th:first-child{ border-radius: 5px 0 0 0; }
/* angle haut droit */
table.basic tr:first-child th:last-child { border-radius: 0 5px 0 0; }
/* angle bas gauche */
table.basic tr:last-child td:first-child { border-radius: 0 0 0 5px; }
/* angle bas droit */
table.basic tr:last-child td:last-child { border-radius: 0 0 5px 0; }
/* @hover */
table.basic tr:hover td{
/*background-color: #f7f8fc;*/
color: #333;
}
/******************/
/*** PARAGRAPHS ***/
/******************/
#CONTAINER section > p{
/* position */
padding: 1em;
margin: 1em;
/* border */
border-radius: 3px;
border: 1px solid #ddd;
/* background */
background-color: #fff;
}
#CONTAINER section > p:hover{
box-shadow: 1px 1px 3px #ddd;
}