146 lines
2.7 KiB
SCSS
Executable File
146 lines
2.7 KiB
SCSS
Executable File
/* ---------------------------------- */
|
|
/* Variables
|
|
/* ---------------------------------- */
|
|
@import "_commonVars.scss";
|
|
|
|
/* ---------------------------------- */
|
|
/* Styles
|
|
/* ---------------------------------- */
|
|
|
|
#toolbar>btn{background-color:red;}
|
|
|
|
/* ---------------------------------- */
|
|
/* Form
|
|
/* ---------------------------------- */
|
|
|
|
.blocContenu {
|
|
display:grid;
|
|
grid-template-columns: 70% 30%;
|
|
margin:auto;
|
|
margin-top:10px;
|
|
/*border-bottom:4px solid #D5D0CF;*/
|
|
box-shadow: 2px 2px 8px grey;
|
|
text-align:left;
|
|
width:99%;
|
|
border-top-left-radius: 7px;
|
|
border-top-right-radius: 7px;
|
|
}
|
|
|
|
.zoneDesc {
|
|
grid-column:1 / span 2;
|
|
grid-row:1;
|
|
color:black;
|
|
padding-top:5px;
|
|
width:100%;
|
|
border-top-left-radius: 7px;
|
|
border-top-right-radius: 7px;
|
|
}
|
|
|
|
/* Chaque lignes du form */
|
|
.contenu {
|
|
grid-column:1;
|
|
text-align: left;
|
|
padding:0px;
|
|
margin:0px;
|
|
}
|
|
|
|
.zonePreviewCont {
|
|
grid-column:2;
|
|
display:block;
|
|
text-align:center;
|
|
grid-row: 2 / span 8;
|
|
margin:1px;
|
|
padding-top:20px;
|
|
border:1px solid #f3eeee;
|
|
min-width: 80%;
|
|
|
|
}
|
|
|
|
.prevText{
|
|
border-radius: 5px;
|
|
text-align:center;
|
|
/*padding:10px;*/
|
|
margin:10px;
|
|
transform: translate(-50%, -50%);
|
|
text-decoration:underline;
|
|
font-style: italic;
|
|
color: #755033;
|
|
}
|
|
|
|
.previewItem{
|
|
border-radius: 5px;
|
|
display:block;
|
|
padding:2px;
|
|
margin:8px;
|
|
/*border:1px solid #FFCD87;*/
|
|
/*box-shadow : 2px 2px 0px 0px #FFCD87;*/
|
|
background:white;
|
|
font-size:0.9rem;
|
|
}
|
|
|
|
/* ------------------------------ */
|
|
/* toogle button */
|
|
/* ------------------------------ */
|
|
input[type="checkbox"].afficherMsg {
|
|
display: none;
|
|
padding:2px;
|
|
font-size:0.9rem;
|
|
}
|
|
|
|
input[type="checkbox"].afficherMsg + label {
|
|
box-sizing: border-box;
|
|
display: inline-block;
|
|
width: 7rem;
|
|
height: 1.6rem;
|
|
border-radius: 1.5rem;
|
|
line-height:1rem;
|
|
background-color: white ;
|
|
transition: all 0.5s ;
|
|
cursor:pointer;
|
|
padding:2px;
|
|
font-size:0.9rem;
|
|
margin-bottom:8px;
|
|
}
|
|
|
|
.afficherMsg :hover{
|
|
box-shadow:2px 2px 4px #D8D8D8;
|
|
}
|
|
|
|
input[type="checkbox"].afficherMsg + label::before {
|
|
box-sizing: border-box;
|
|
display: block;
|
|
height: calc(1.5rem - 4px);
|
|
width: calc(1.5rem - 4px);
|
|
border-radius: 50%;
|
|
background-color: grey;
|
|
line-height:1rem;
|
|
white-space: pre;
|
|
transition: all 0.5s ;
|
|
content: ' Masqué';
|
|
font-weight:bold;
|
|
color:grey;
|
|
padding:2px;
|
|
font-size:0.9rem;
|
|
}
|
|
|
|
input[type="checkbox"].afficherMsg:checked + label {
|
|
background-color: white ;
|
|
border:1px solid grey;
|
|
color:green;
|
|
padding:2px;
|
|
font-size:0.9rem;
|
|
}
|
|
|
|
input[type="checkbox"].afficherMsg:checked + label::before {
|
|
margin-left: 1.2rem ;
|
|
white-space: pre;
|
|
content: ' Affiché';
|
|
font-weight:bold;
|
|
font-size:0.9rem;
|
|
color:green;
|
|
text-align:left;
|
|
background-color: lightgreen;
|
|
padding-bottom:2px;
|
|
}
|
|
|