imio-publik-themes/static/liege/_custom.scss

943 lines
18 KiB
SCSS
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

@charset "UTF-8";
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800);
/* First for IE 48 */
@font-face {
font-family: DINWeb;
src: url("fonts/DINWeb.eot");
}
/* Then for WOFF-capable browsers */
@font-face {
font-family: DINWeb;
src: url("fonts/DINWeb.woff") format("woff");
}
#toplinks {
background: white;
box-shadow: none;
border-color: $primary-color;
}
#receipt-intro a {
color: $href-color;
font-weight: bold;
text-decoration: underline;
}
div#content a#disclose-dataview {
display: none;
}
div.dataview {
display: block;
}
.wcs-forms-of-category-affaires-citoyennes,
.wcs-forms-of-category-population,
.wcs-forms-of-category-urbanisme,
.wcs-forms-of-category-recherche-genealogique,
.wcs-forms-of-category-interet-general,
.wcs-forms-of-category-environnement,
.wcs-forms-of-category-mobilite,
.wcs-forms-of-category-organisation-d-evenements,
.wcs-forms-of-category-travaux,
.wcs-forms-of-category-logement {
background-repeat: no-repeat;
background-size: 35px 35px;
padding-left: 40px !important;
}
.wcs-forms-of-category-affaires-citoyennes {
background-image: url("images/ic_population.png");
}
.wcs-forms-of-category-population {
background-image: url("images/ic_etatcivil.png");
}
.wcs-forms-of-category-urbanisme {
background-image: url("images/ic_urbanisme.png");
}
.wcs-forms-of-category-recherche-genealogique {
background-image: url("images/ic_genealogie.png");
}
.wcs-forms-of-category-interet-general {
background-image: url("images/ic_interetgeneral.png");
}
.wcs-forms-of-category-environnement {
background-image: url("images/ic_environnement.png");
}
.wcs-forms-of-category-mobilite {
background-image: url("images/ic_mobilite.png");
}
.wcs-forms-of-category-organisation-d-evenements {
background-image: url("images/ic_manifestation.png");
}
.wcs-forms-of-category-travaux {
background-image: url("images/ic_travaux.png");
}
.wcs-forms-of-category-logement {
background-image: url("images/ic_logement.png");
}
/* Make bulleted list*/
#columns .wcsformsofcategorycell ul li {
background-image: url("images/form_puce.png");
background-size: 10px 10px;
background-attachement: fixed;
background-position: left center;
background-repeat: no-repeat;
}
/* Print a lock behind required authentication forms*/
#columns .wcsformsofcategorycell ul li.required-authentication a {
width: auto;
display: inline-block;
background-image: url("images/form_lock.svg");
background-size: 10px 10px;
background-attachement: fixed;
background-position: right center;
background-repeat: no-repeat;
}
/* Print underline if required FEDICT authentication forms*/
#columns .wcsformsofcategorycell ul li.required-fedict-authentication a {
width: auto;
display: inline-block;
background-image: url("images/form_lock.svg");
background-size: 10px 10px;
background-attachment: fixed;
background-position: right center;
background-repeat: no-repeat;
text-decoration: underline;
}
/* Nouvelle class*/
#main-content ul li a:hover {
color: $highlight-text-color !important;
}
a {
text-decoration: none;
}
/* surcharge*/
div#services > ul > li,
div.a2-block,
#content div.cell,
div.block {
text-align: left;
background: white;
border-radius: 3px;
border: 0px;
}
/* resize text input for "nb_exemplaire" field*/
.nb_exemplaire input {
width: 60px;
}
/* surcharge*/
div#rub_service div.category ul a,
div#services > ul > li > ul a,
div#account-management ul a,
div.categoriescell ul a,
div.wcsformsofcategorycell ul a,
div.wcscurrentdraftscell ul a,
div.wcscurrentformscell ul a {
padding: 1em;
display: block;
border-bottom: 0px !important;
position: relative;
}
/* surcharge*/
div#rub_service div.category h3,
#content div.a2-block h2,
#content div.block h2,
div#services > ul > li > strong > a,
#content div.textcell h2:first-child,
#content div.cell h2:first-child,
div#rub_service h2 {
background: transparent url("images/hr.png") left bottom no-repeat;
background-size: 100% 2px;
display: block;
position: relative;
text-transform: none;
color: $highlight-text-color;
padding: 1ex;
border-radius: 3px;
margin: 0;
text-decoration: none;
font-weight: normal;
font-size: 14.3px;
font-family: sans-serif;
border: 0;
}
div#tracking-code h3 {
border: 0;
background: none;
display: inline-block;
text-transform: uppercase;
font-size: 100%;
font-weight: bold;
color: #666;
padding-bottom: 0;
&::after {
content: " :";
}
}
div#tracking-code a {
display: inline-block;
font-size: 130%;
}
label[for="id_username"]::before,
label[for="id_email"]::before {
content: url("images/icone_user.png");
visibility: visible;
}
label[for="id_username"] {
visibility: hidden;
width: 54px;
height: 1px;
}
[for="id_username"],
#id_username {
float: left;
}
label[for="id_password"]::before {
content: url("images/icone_cadenas.png");
visibility: visible;
}
label[for="id_password"],
label[for="id_email"] {
visibility: hidden;
width: 54px;
height: 1px;
}
[for="id_password"],
#id_password,
[for="id_email"],
#id_username {
float: left;
}
input[value="Connexion"] {
background: url("images/fleche_epaisse_droite.png") no-repeat top center
transparent;
color: #ed226c;
font-size: 70%;
box-shadow: none;
border: none;
float: right;
padding-top: 35px;
text-transform: uppercase;
position: absolute;
right: 0;
bottom: 1ex;
height: auto;
}
input[value="Connexion"]:hover {
box-shadow: none;
}
label[for="id_username"]::before,
label[for="id_password"]::before,
label[for="id_email"]::before {
margin-left: 31px;
margin-top: 8px;
position: relative;
visibility: visible;
z-index: 1;
}
.form-field-required label:after {
content: "*";
color: #d90024;
padding-left: 1ex;
font-size: 80%;
}
div#rub_service div.form-validation div.page {
background: transparent;
padding-left: 0;
> h3 {
color: #be0d67;
border-bottom: 2px solid #e2e2e2;
font-size: 120%;
margin-bottom: 0.5em;
}
}
#messages li,
div.infonotice,
div.warningnotice,
div.errornotice {
background: #e6f5fc;
color: #f2f2f2;
}
#messages li,
div.infonotice,
div.warningnotice,
div.errornotice {
background: #e6f5fc;
color: #666768;
}
#messages li::before,
div.infonotice::before,
div.warningnotice::before,
div.errornotice::before {
font-family: FontAwesome;
font-size: 2em;
left: 0.5em;
position: absolute;
top: 0.25em;
color: $highlight-text-color;
}
div#rub_service h2 {
text-align: left;
font-weight: bold;
text-transform: uppercase;
border-radius: 0px 0px 0px 10px;
background: linear-gradient(to right, #f6f6f6, white);
}
/* Remove border on fields validate form page */
input[readonly],
select[readonly],
textarea[readonly] {
border-width: 0;
padding-left: 0;
padding-top: 0;
}
label {
font-size: 1.2em;
margin-bottom: 0;
}
/* profile page */
.page-profil ul#id_title > li {
list-style-type: none;
}
.page-profil #content {
.column:first-child {
float: right;
width: 73%;
}
.column:last-child {
float: left;
width: 25%;
}
.column {
#a2-profile {
background: linear-gradient(to bottom, #f6f6f6, #f6f6f6 30%, white);
margin-right: 0;
border-radius: 10px;
}
#account-management {
border-radius: 10px;
background: linear-gradient(to bottom, #f6f6f6, #f6f6f6 30%, white);
h2 {
color: $font-color;
}
a::after {
content: " ";
display: block;
height: 1px;
margin-left: 5%;
width: 90%;
top: auto;
bottom: 0;
}
}
h2 {
text-transform: uppercase;
background: transparent;
font-weight: bold;
}
}
}
.page-profil .form-field-required {
margin: 0 auto;
padding-bottom: 1ex;
}
.page-profil .a2-block p {
display: block;
margin: 1em auto;
}
/* Libellé du profile (auth) et valeur alignée*/
#profile dt {
color: #666666;
float: left;
font-size: 100%;
width: 40%;
}
#profile dd {
font-weight: bold;
}
/*Boutton "commander un autre document"*/
a#workflow-button-command,
a#new-command {
vertical-align: middle;
float: left;
display: block;
font-size: 1.2em;
font-weight: normal;
color: #be0d67;
background-color: white;
width: 200px;
height: 3em;
line-height: 1.5em;
padding: 1px;
border: solid #be0d67 1px;
border-radius: 10px;
text-align: center;
text-decoration: None;
}
/*Bouton "Valider votre commande"*/
a#workflow-button-paid,
input#pay {
vertical-align: middle;
float: left;
margin-right: 20px;
margin-left: 24%;
display: block;
font-size: 1.2em;
font-weight: normal;
color: white;
background-color: #be0d67;
width: 200px;
height: 3em;
line-height: 2.5em;
padding: 1px;
border: solid #be0d67 1px;
border-radius: 10px;
text-align: center;
text-decoration: None;
}
/* Keep border style solid for table presentation in last forms validation page*/
.form-validation .TableListRowsWidget table td {
border: 1px solid black;
}
/* Align label for error connexion*/
.page-profil input[type="submit"]:hover {
box-shadow: none;
opacity: 0.7;
}
/* When a profile data is empty, we create a new line for next "print field"*/
#profile dl > dd > ul {
display: inline;
}
/* In forms title*/
div.widget div.title {
font-weight: bold;
}
/* In forms h4 style (see first word "Traitement" in certif cohab legale)*/
h4 {
font-weight: normal;
text-transform: uppercase;
}
#footer {
border-top: 1px solid #eee;
text-align: center;
}
/* Change size for button => usefull for "delete" draft form button*/
.fargo-pick-popup button,
div#content button {
height: 100%;
}
/* Class css qui peut servir à rendre invisible un champs en fonciton d'une valeur testée dans extra.js*/
.invisible {
display: None;
}
/*Style for new undo BUTTON with 'submit' class*/
div.a2-block .submit {
background: #be0d67 none repeat scroll 0 0;
border: 1px solid transparent;
box-shadow: 1px 0 5px rgba(0, 0, 0, 0.21);
color: white;
cursor: pointer;
height: 2.5em;
margin-right: 2ex;
padding: 5px 15px;
transition: all 0.2s ease 0s;
vertical-align: middle;
width: 12em;
}
.page-index .column {
border-collapse: separate;
display: table;
float: none;
margin-bottom: 20px;
width: 100%;
}
/* Cells' title in index page*/
.page-index #content div.textcell h2:first-child,
.page-index #content div.cell h2:first-child {
background-image: none;
font-weight: bold;
text-align: center;
text-transform: uppercase;
}
/* Cells in index page*/
.page-index #main-content > #content .cell {
background-image: linear-gradient(#f6f6f6, white);
border-radius: 10px 10px 0px 0px;
border-bottom: 2px solid #dcdcdc;
margin-bottom: 2em;
border-left: 10px solid #fcfcfc;
border-right: 10px solid #fcfcfc;
width: 50%;
display: table-cell;
vertical-align: top;
}
.page-index div#population,
.page-index div#archives,
.page-index div#etat-civil,
.page-index div#urbanisme {
background-repeat: no-repeat;
background-size: 2em 2em;
margin-left: 0;
line-height: 1em;
padding-bottom: 1em;
padding-left: 3em;
}
.page-index #content div.textcell div#population h2,
.page-index #content div.textcell div#archives h2,
.page-index #content div.textcell div#etat-civil h2,
.page-index #content div.textcell div#urbanisme h2 {
text-align: left;
}
.page-index div#population {
background-image: url("images/ic_population.png");
}
.page-index div#archives {
background-image: url("images/ic_population.png");
/*background-image: url("images/ic_archives.png");*/
}
.page-index div#etat-civil {
background-image: url("images/ic_etatcivil.png");
}
.page-index div#urbanisme {
background-image: url("images/ic_population.png");
/*background-image: url("images/ic_urbanisme.png");*/
}
.page-index div#content div.column div#colleft,
.page-index div#content div.column div#colright {
max-width: 48%;
}
.page-index div#content div.column div#colleft h2,
.page-index div#content div.column div#colright h2 {
text-align: left;
}
.page-index div#content div.column div#colleft {
float: left;
}
.page-index div#content div.column div#colright {
float: right;
padding: 1em;
}
.page-index #content .column:last-child .cell.wcscurrentformscell,
.page-index #content .column:last-child .cell.wcscurrentdraftscell {
display: block;
margin-bottom: 0;
width: 100%;
}
.page-index #content .column:last-child .cell.wcscurrentformscell {
background: #f6f6f6 none repeat scroll 0 0;
border-bottom: medium none;
padding-bottom: 2em;
}
.page-index #content .column:last-child .cell.wcscurrentdraftscell {
min-height: 165px;
}
/* in forms' page : format word "TRAITEMENT" */
form.quixote > div > p > u:first-child {
text-transform: uppercase;
text-decoration: none;
}
.page-profil #Mot_de_passe input[name="cancel"] {
display: None;
}
/*Formulaire*/
div.a2-block form input[type="submit"] {
margin-top: 1.5em;
}
div#gauche {
width: 25.5%;
}
div#gauche + div#rub_service {
padding-left: 2em;
width: 74.5%;
}
.comment-field {
margin-bottom: 2em;
}
.comment-field li {
line-height: 1.5em;
margin-bottom: 1em;
}
#var_rb_concerne .content {
margin-top: 0.75em;
}
.title > label {
display: inline-block;
padding-bottom: 0em;
}
#content #columns {
max-width: 100%;
}
/* correct a bug in first eId connexion with profile form */
.form-field-required label[for="id_email"]::before {
content: None;
visibility: hidden;
}
.form-field-required #id_email {
border: 1px solid #aaa;
border-radius: 0px;
margin-top: 6px;
padding-left: 2em;
width: 100%;
}
.form-field-required label[for="id_email"] {
height: 20px;
visibility: visible;
width: 100%;
}
/* END correct a bug in first eId connexion with profile form */
/* Skin page d'accueil */
.page-index #main-content > #content .column:first-child .cell:nth-child(2) {
border: 1px solid #be0d67;
border-radius: 10px;
}
.page-index #main-content > #content .column:first-child .cell:nth-child(2) h2 {
/*background: #be0d67 none repeat scroll 0 0;*/
border-radius: 0;
/*box-shadow: 1px 0 5px rgba(0, 0, 0, 0.21);*/
display: block;
font-size: 1em;
/*color:white;*/
margin: 1ex auto 2.5ex;
max-width: 52%;
text-align: center;
}
.page-index
#main-content
> #content
.column:first-child
div.following_code_connected
h2 {
color: #be0d67;
background: transparent;
display: inherit;
text-transform: uppercase;
box-shadow: inherit;
margin: 0 auto;
margin-bottom: 0;
}
/*
.page-index #main-content > #content .column:first-child .cell:nth-child(2) .wcs-tracking-code-input h2{
background: transparent;
display: inherit;
text-transform: uppercase;
box-shadow: inherit;
margin:0 auto;
margin-bottom:0;
}*/
.page-index
#main-content
> #content
.column:first-child
.cell:nth-child(2)
.wcs-tracking-code-input
p:nth-child(2n + 1) {
margin: 2ex 0;
}
.page-index
#main-content
> #content
.column:first-child
.cell:nth-child(2)
.wcs-tracking-code-input {
border: none;
border-radius: 0;
}
.page-index
#main-content
> #content
.column:first-child
.cell:nth-child(2)
.wcs-tracking-code-input
h2:hover {
box-shadow: inherit;
}
.page-index
#main-content
> #content
.column:first-child
.cell:nth-child(2)
h2:hover {
box-shadow: 0px 0px 5px #777;
}
.page-index
#main-content
> #content
.column:first-child
.cell:nth-child(2)
h2
a {
color: #fff;
}
.page-index
#main-content
> #content
.column:first-child
.cell:nth-child(2)
p:first-child {
margin-bottom: 2ex;
}
.page-index
#main-content
> #content
.column:first-child
.cell:nth-child(2)
p:nth-child(2n + 2)::after {
content: "";
display: block;
font-size: 127%;
}
/*No ↳ in lists' last child */
.page-index
#main-content
> #content
.column:first-child
.cell:nth-child(2)
p:last-child::after {
content: inherit;
}
/*END No ↳ in lists' last child */
.page-index
#main-content
> #content
.column:first-child
.cell:nth-child(2)
p:nth-child(2n + 1) {
margin: -3ex 0ex 2ex 4ex;
}
/* END Skin page d'accueil*/
/* Style alert if error on field*/
.form_field_alert {
background: url("images/alert.jpg") no-repeat left top;
background-size: 13px 13px;
padding-left: 18px;
color: red;
}
/* END Style alert if error on field*/
/* New link color to highlight them.*/
a {
color: #be0d67;
}
a:hover {
text-decoration: underline;
}
/* END of highlight links*/
/*Mise en apge "porte-documents" sur page d'acceuil*/
a.icone-porte-documents {
background-image: url("images/icone_porte-documents.png");
background-repeat: no-repeat;
background-position: center;
display: block;
width: 100%;
height: 125px;
}
/*END Mise en page "porte-doc..."*/
/*Print eID mini picture next to "demarche" name*/
#columns .wcsformsofcategorycell ul li.required-fedict-authentication a::after {
background-color: Transparent;
content: url("images/beid_image_mini.png");
display: inline-block;
height: 22px;
margin-left: 105%;
margin-top: 0.7em;
text-align: right;
width: 34px;
}
/* End Print eID...*/
/*Index page*/
div#columns > div.column:first-child div.jq_txt_connexion > div > div > h2 {
background-color: transparent !important;
box-shadow: None !important;
}
/* Form validation page : reduce margin between page*/
div.form-validation div.page {
margin-bottom: -1.7em;
}
/* End of Form validation page ... */
div#tracking-code {
display: none;
}
div#tracking-code h3 {
display: none;
}
div#tracking-code a {
display: none;
}
div#receipt-intro > p#tracking-code {
display: none;
}
div.list-of-forms span.form-status {
position: relative;
right: 1ex;
display: block;
text-align: right;
}
select {
-moz-appearance: menulist !important;
-webkit-appearance: menulist !important;
}
/*End Index page*/
a#publik-portal-agent {
top: 30px;
right: 6%;
border: None;
}
div.widget table input,
div.widget table select {
width: 100%;
}
/* Rentre un champs invisible grace aux styles complementaires*/
form.quixote div.hidden,
div.invisible {
display: none;
}
// Steps
.wcs-steps {
border-radius: 0 0 0 10px;
font-size: 1.2em;
@include desktop-vertical-steps() {
min-height: 400px;
font-size: 1.5em;
background: linear-gradient(to bottom, #f6f6f6, #f6f6f6 30%, white);
border-radius: 10px 10px 0 0;
}
}
.wcs-step {
&--marker {
font-weight: bold;
border: 1px solid;
}
&--label {
font-weight: normal;
}
@include desktop-vertical-steps() {
border-bottom: 1px solid #ccc !important;
margin-bottom: $wcs-steps-spacing;
padding-bottom: $wcs-steps-spacing;
&--marker {
border: none;
}
}
}
// Fix login button
input[value="Connexion"]:hover {
box-shadow: none;
background: url("images/fleche_epaisse_droite.png") no-repeat top center transparent;
color: white;
background-color: #3a001d;
}