.no-select{ user-select: none; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; -o-user-select: none; } .hidden{ display: none !important; } /* .unstressed */ span.unstressed{ color: #aaa; } tr:hover > td > span.unstressed{ color: #ddd; } span.stressed{ font-weight: bold; } /**********************/ /*** TABLEAU .BASIC ***/ /**********************/ /* STYLE "BASIC" DES TABLEAUX */ table.basic{ /* position */ width: 100%; margin-bottom: 0; /* border */ border-radius: 5px; border-spacing: 0; /*box-shadow: 0 0 4px #e3e3e3;*/ } table.basic.margin{ margin-bottom: 1em; } table.basic tr td, table.basic tr th, #DRAGNDROP td, #DRAGNDROP th{ /* position */ padding: 1.5em 1.5em; width: 25%; /* border */ /*border-width: 1px 0 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; } /* définition de la répartition des éléments en fonction du nombre de colonnes */ table.basic.col1 tr td, table.basic.col1 tr th{ width: 100%; } table.basic.col2 tr td, table.basic.col2 tr th{ width: 50%; } table.basic.col3 tr td, table.basic.col3 tr th{ width: 33%; } table.basic.col4 tr td, table.basic.col4 tr th{ width: 25%; } table.basic.col5 tr td, table.basic.col5 tr th{ width: 20%; } table.basic.col5 tr td, table.basic.col6 tr th{ width: 16%; } /* titre aligné à gauche */ table.basic th{ text-align: left; } /* sans background */ table.basic thead tr th{ background-color: transparent; } table.basic:nth-child(4n+0) tr > td:first-child { border-left: 10px solid #e63c54; } table.basic:nth-child(4n+1) tr > td:first-child { border-left: 10px solid #3c73e6; } table.basic:nth-child(4n+2) tr > td:first-child { border-left: 10px solid #e6983c; } table.basic:nth-child(4n+3) tr > td:first-child { border-left: 10px solid #2dcc70; } table.basic table.basic tr > td:first-child { border-left: 10px solid #9e9e9e; } /* @hover */ table.basic tr:hover > td{ color: #fff; } table.basic:nth-child(4n+0) tr:hover > td { background-color: #e63c54; } table.basic:nth-child(4n+1) tr:hover > td { background-color: #3c73e6; } table.basic:nth-child(4n+2) tr:hover > td { background-color: #e6983c; } table.basic:nth-child(4n+3) tr:hover > td { background-color: #2dcc70; } table.basic table.basic tr:hover > td { background-color: #9e9e9e; } /* .noborder */ table.basic tr.noborder > td:first-child{ border-left: 1px solid transparent; } table.basic tr:hover td{ background-color: #fff; } /* .transparentbg */ table.basic tr.transparentbg > td{ background-color: transparent; } table.basic tr.transparentbg:hover > td{ background-color: transparent; } table.basic tr.transparentbg > td{ color: inherit; } /******************/ /*** 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; } /*********************/ /*** LIENS BOUTONS ***/ /*********************/ span.link{ /* position */ padding: .3em .8em; /* border */ border-radius: 5px; border: 1px solid #ddd; box-shadow: inset 0 0 1px #f5f5f5; /* background */ background: #fff; /* foreground */ color: #333; /* extra */ cursor: pointer; } table.basic td > span.link{ background: #eee; } span.link:hover{ color: #000; } /*********************/ /*** SELECT/OPTION ***/ /*********************/ select{ /* position */ margin: 2em 0; padding: 0 1em; /* border */ border-radius: 5px; border: 1px solid #ddd; /* background */ background-color: #fff; /* foreground */ color: #233342; /* select */ -webkit-appearance:none; -moz-appearance:none; appearance:none; } /* pour déplacement d'élève */ td select{ margin: -1em; padding: .5em; } select > option{ /* position */ padding: 1em 0; /* background */ background-color: #fff; /* foreground */ color: #233342; text-indent: 1em; } /* pour déplacement d'élève */ td select > option{ padding: 0; } .valider_action{ /* position */ /*display: inline-block;*/ display: none; position: absolute; margin-left: 2em; margin-top: -.2em; width: 1.5em; height: 1.5em; /* background */ background: transparent center center no-repeat; background-size: 90% auto; /* extra */ cursor: pointer; } /* bouton validation */ select.active + .valider_action{ display: inline-block; background-image: url(../src/validate.svg); } tr:hover td select.active + .valider_action{ background-image: url(../src/validate@hover.svg); } /* saisie note */ .saisie_note{ /* position */ margin: -.5em; width: 4em; padding: .5em 1em; /* border */ border-radius: 3px; border: 1px solid #bdbdbd; } /* @focus */ .saisie_note:focus{ border-color: #999; } /* bouton validation */ input.saisie_note.active + .valider_action{ display: inline-block; background-image: url(../src/validate.svg); } tr:hover td input.saisie_note.active + .valider_action{ background-image: url(../src/validate@hover.svg); }