Rev 3171 | Rev 3179 | Go to most recent revision | Blame | Compare with Previous | Last modification | View Log | RSS feed
@CHARSET "UTF-8";
body {
font-family: Ubuntu,Verdana,sans-serif !important;
}
div.widget-blocks {
box-sizing: border-box;
padding: 3rem;
margin-bottom: 5rem;
}
#zone-appli #register-page .widget-blocks .clear {
clear: both;
height: 0;
/* Précaution pour IE 7 */
overflow: hidden;
}
h1#widget-titre::before {
content: "";
display: block;
height: 100%;
position: absolute;
left: -5rem;
width: 0.4rem;
}
h1#widget-titre {
font-size: 3rem;
font-weight: 700;
line-height: 3.2rem;
margin: 0;
position: relative;
color: #232323;
}
#zone-appli #register-page .widget-blocks h2 {
font-size: 2.3rem;
line-height: 1.15;
}
#zone-appli #register-page .widget-blocks h3 {
font-size: 2rem;
margin-top: 0.5rem;
}
#zone-appli #register-page #group-settings-form .widget-blocks button,
#group-settings-form .button {
font-size: 1.6rem;
}
#zone-appli #register-page #group-settings-form .widget-blocks input,
#zone-appli #register-page #group-settings-form .widget-blocks select,
#zone-appli #register-page #group-settings-form .widget-blocks textarea {
font-size: 1.3rem;
}
#zone-appli #register-page #group-settings-form .widget-blocks .message {
background-color: #f8f5ef;
color: #232323;
padding: 1rem;
border-radius: 0.3rem;
font-size: 1.3rem;
}
#zone-appli #register-page #group-settings-form .widget-blocks .hidden {
display: none;
}
/* Aperçu du widget */
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer {
border-radius: 0.3rem;
padding: 0 3rem 3rem 3rem;
min-height: 100%;
width: 100%;
/*pointer-events: none;*/
overflow: hidden;
/*background: rgba(248, 245, 239, 0.6);*/
}
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer h1 {
font-size: 3rem;
line-height: 3.2rem;
width: 100%;
color: #232323;
margin: 1rem;
}
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer h1,
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer h2 span,
#zone-appli #register-page #group-settings-form .widget-blocks h3 .field-title,
#zone-appli #register-page #group-settings-form .widget-blocks .list-label,
#zone-appli #register-page #group-settings-form .widget-blocks label {
text-transform: capitalize;
}
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer h2 {
width: 100%;
color: #232323;
margin: 1rem;
}
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer .and-help {
width: 80%;
}
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer .and-help.input-file-container {
width: 73.8%;
}
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer label.and-help,
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer .list-label.and-help {
margin-bottom:1.5rem;
}
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer label.and-help,
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer .list-label.and-help,
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer .select-wrapper.and-help,
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer .multiselect.and-help {
display:inline-block;
}
#zone-appli #register-page #group-settings-form .widget-blocks form {
margin-bottom: 2rem;
}
#zone-appli #register-page #group-settings-form .widget-blocks .list-label,
#zone-appli #register-page #group-settings-form .widget-blocks label {
color: #606060;
display: block;
font-size: 1.5rem;
margin-bottom: 0.4rem;
margin-top: 2rem;
font-weight: 300;
}
#zone-appli #register-page #group-settings-form .widget-blocks .checkbox,
#zone-appli #register-page #group-settings-form .widget-blocks .radio {
padding-left: 0;
}
#zone-appli #register-page #group-settings-form .widget-blocks .checkbox label,
#zone-appli #register-page #group-settings-form .widget-blocks .radio label{
padding-left: 1rem;
}
#preview-formulaire,
#preview-header,
#preview-messages {
padding: 2rem;
border-radius: 0.3rem;
background-color: rgba(255, 255, 255, 0.8);
margin-top: 2rem;
}
.register-section{
margin-bottom: 1rem;
}
/* Formulaires du nouveau widget*/
#group-settings-form {
float: none;
}
#group-settings-form #langue{
width: 100%;
border: 0.1rem solid #ddd;
border-radius: 0.3rem;
padding: 1rem;
overflow: hidden;
}
/* Styles des champs required*/
#group-settings-form .register-section input:required,
#group-settings-form .register-section select:required,
#group-settings-form #new-fields input:required,
#group-settings-form #new-fields select:required {
border: 0.2rem solid #F8DFD3;
}
/**** Styles des boutons ****/
/* Positionnement visuel du bouton submit pour qu'il reste
sous les nouveaux champs alors que dans le dom
il est positionné avant les nouveaux champs */
#zone-appli #register-page #group-settings-form .widget-blocks #submit-button {
position: absolute;
bottom: -20px;
}
#zone-appli #register-page #group-settings-form .widget-blocks #add-fields.button,
#zone-appli #register-page #group-settings-form .widget-blocks .add-value-button.button {
background-color: #009fb8;
}
#zone-appli #register-page #group-settings-form .widget-blocks #add-fields.button:hover,
#zone-appli #register-page #group-settings-form .widget-blocks #add-fields.button:focus,
#zone-appli #register-page #group-settings-form .widget-blocks .add-value-button.button:hover,
#zone-appli #register-page #group-settings-form .widget-blocks .add-value-button.button:focus {
background-color: rgba(0, 159, 184, 0.7);
}
#zone-appli #register-page #group-settings-form .widget-blocks .remove-field.button,
#zone-appli #register-page #group-settings-form .widget-blocks .remove-value.button,
#zone-appli #register-page #group-settings-form .widget-blocks .remove-file {
background-color: #ff5d55;
}
#zone-appli #register-page #group-settings-form .widget-blocks .remove-field.button:hover,
#zone-appli #register-page #group-settings-form .widget-blocks .remove-field.button:focus,
#zone-appli #register-page #group-settings-form .widget-blocks .remove-value.button:hover,
#zone-appli #register-page #group-settings-form .widget-blocks .remove-value.button:focus,
#zone-appli #register-page #group-settings-form .widget-blocks .remove-file:hover,
#zone-appli #register-page #group-settings-form .widget-blocks .remove-file:focus {
background-color: rgba(255, 93, 85, 0.7);
}
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer .help-button {
background-color: #ea9973;
}
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer .help-button,
#zone-appli #register-page #group-settings-form .widget-blocks .remove-file {
margin-left: 0.5rem;
}
#zone-appli #register-page #group-settings-form .widget-blocks .remove-file,
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer .help-button {
border-radius: 0.2rem;
padding: 1.1rem 1rem;
}
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer .help-button:hover,
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer .help-button:focus,
#zone-appli #register-page #group-settings-form .widget-blocks .fichier-type:hover,
#zone-appli #register-page #group-settings-form .widget-blocks .fichier-type:focus {
background-color: rgba(234, 153, 115, 0.7);
}
/*
#zone-appli #register-page #group-settings-form .widget-blocks .remove-file i {
font-size: 1.6rem;
}*/
#zone-appli #register-page #group-settings-form .widget-blocks .fichier-type {
text-transform: capitalize;
font-size: 1.5rem;
margin-left: 0;
padding: 0.8rem;
background-color: #ea9973;
text-decoration: none;
color: #ffffff;
border-radius: 0.2rem;
}
/**** style du formulaire des nouveaux champs après validation ****/
#zone-appli #register-page #group-settings-form .widget-blocks .disabled,
#zone-appli #register-page #group-settings-form .widget-blocks .validated {
background-color: #eeeeee;
cursor: default;
pointer-events: none;
}
#zone-appli #register-page #group-settings-form .widget-blocks .invalid {
box-shadow : 0 0 1.5px 1px red;
}
/* Le picto validation apparait en vert */
#group-settings-form .validated i {
color: #c3d45d;
cursor: default;
}
/* La couleur de fond du formulaire lui-même ne change pas */
#zone-appli #register-page #group-settings-form .widget-blocks #new-fields.disabled{
background-color: initial;
}
/*************************************************/
/**** Style des select ****/
#group-settings-form select,
#group-settings-form .selectBox select {
background-color: rgba(0, 159, 184, 0.5);
border: 0.1rem solid #ddd;
}
#group-settings-form select {
font-size: 3rem;
font-weight: 900;
}
#group-settings-form select,
#group-settings-form select:required,
#group-settings-form .selectBox select,
#group-settings-form .selectBox select:required {
width: 100%;
color:#fff;
border-radius: 0.3rem;
padding: 0.8rem;
line-height: 1.15;
}
#group-settings-form select,
#group-settings-form select:required {
text-transform:none;
/* On retire la 'flèche' par defaut */
-webkit-appearance: none;
-moz-appearance: none;
-ms-appearance: none;
-o-appearance: none;
appearance: none;
}
#group-settings-form .select-wrapper,
#group-settings-form #new-fields .select-wrapper,
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer .selectBox {
position: relative;
border: 0.1rem solid #ddd;
border-radius: 0.3rem;
}
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer .overSelect {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
}
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer .checkboxes {
border: 0.1rem solid #ddd;
border-radius: 0 0.3rem;
}
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer .label label,
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer .checkboxes label {
display: block;
padding: 0.5rem;
line-height: 1.15;
}
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer #checkboxes label:hover {
background-color: #1e90ff;
}
#group-settings-form .select-wrapper::after,
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer .selectBox::after {
/* Ajout et style d'une "flèche bas" */
content: '⌄';
pointer-events: none;
position: absolute;
top: 0;
right: 0.5rem;
font-size: 3rem;
font-weight: 900;
color: #fff;
}
#group-settings-form #new-fields .select-wrapper::after,
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer .selectBox::after,
#zone-appli #register-page #group-settings-form .widget-blocks .widget-renderer .select-wrapper::after {
/* correction de la position de la flèche
dans le formulaire des champs ajoutés*/
top: -10px;
}
/**************************/
/**** Affichage des nouveaux champs ****/
/* Mieux distinguer les différentes strates */
#group-settings-form fieldset.new-field,
#group-settings-form .new-value {
position: static;
margin: 1rem 0;
padding: 2rem;
border-radius: 0.3rem;
background-color: #F8F5EF;
}
/* Mieux distinguer les différentes strates */
#group-settings-form .field-details {
margin: 1rem 0;
padding: 2rem;
border-radius: 0.3rem;
background-color: #fcfbf9;
}
/********************************************/
/**** Style des input type "file" ****/
/* styles de base */
#group-settings-form .input-file-container,
#group-settings-form #new-fields .input-file-container {
position: relative;
width: 86.9%;
display: inline-block;
}
#group-settings-form .label-file,
#group-settings-form #new-fields .label-file {
display: block;
padding: 0.7rem;
background: #009FB8;
color: #fff !important;
font-size: 1.5rem;
cursor: pointer;
border-radius: 0.3rem;
}
#group-settings-form .input-file,
#group-settings-form #new-fields .input-file {
position: absolute;
top: 0; left: 0;
width: 80%;
padding: 1rem;
margin: auto;
opacity: 0;
cursor: pointer;
}
/* quelques styles d'interactions */
#group-settings-form .input-file:hover + .label-file,
#group-settings-form .input-file:focus + .label-file,
#group-settings-form .label-file:hover,
#group-settings-form .label-file:focus,
#group-settings-form #new-fields .input-file:hover + .label-file,
#group-settings-form #new-fields .input-file:focus + .label-file,
#group-settings-form #new-fields .label-file:hover,
#group-settings-form #new-fields .label-file:focus {
background: rgba(0, 159, 184, 0.7);
color: #fff;
}
/* styles du retour visuel */
#group-settings-form .file-return:not(:empty)::before,
#group-settings-form #new-fields .file-return:not(:empty)::before {
content:'Nom du fichier: ';
font-size: 1rem;
}
#group-settings-form .file-return:not(:empty) img,
#group-settings-form #new-fields .file-return:not(:empty) img {
margin: 1rem auto;
display: block;
}
#group-settings-form .file-return,
#group-settings-form #new-fields .file-return {
font-style: italic;
font-size: 1rem;
font-weight: bold;
background-color: #fff;
padding: 2rem;
border-radius: 0.3rem;
}
#zone-appli #register-page #group-settings-form .widget-blocks input[type="date"],
#zone-appli #register-page #group-settings-form .widget-blocks input[type="number"],
#zone-appli #register-page #group-settings-form .widget-blocks input[type="email"] {
line-height: 1.15;
margin: 0;
padding: 1rem;
border: 0.1rem solid #ddd;
border-radius: 0.3rem;
width: 100%;
box-sizing: inherit;
}
/*************************************/
#signup_submit {
font-weight: 700;
}
.modal-header .close {
margin-top: -2rem !important;
}
@media screen and (min-width: 992px) {
div.widget-blocks {
position: sticky;
top: 20px;
}
}