mirror of
https://gitlab.com/Chill-Projet/chill-bundles.git
synced 2025-06-12 13:24:25 +00:00
household banner context colors
This commit is contained in:
parent
4c3c67344a
commit
07ffdfab86
@ -45,33 +45,6 @@ table {
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* ACCOMPANYING_COURSE
|
||||
* Header custom for Accompanying Course
|
||||
*/
|
||||
|
||||
div#header-accompanying_course-name {
|
||||
background: none repeat scroll 0 0 #718596;
|
||||
color: #FFF;
|
||||
h1 {
|
||||
margin: 0.4em 0;
|
||||
}
|
||||
span {
|
||||
a {
|
||||
color: white;
|
||||
}
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
div#header-accompanying_course-details {
|
||||
background: none repeat scroll 0 0 #718596ab;
|
||||
color: #FFF;
|
||||
padding-top: 1em;
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
|
||||
/*
|
||||
* FLEX RESPONSIVE TABLE/BLOCK PRESENTATION
|
||||
*/
|
||||
@ -216,8 +189,6 @@ div.flex-table {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/*
|
||||
* Address form
|
||||
*/
|
||||
|
@ -1,2 +1,2 @@
|
||||
require('./sass/person.scss');
|
||||
require('./sass/chillperson.scss');
|
||||
require('./sass/person_with_period.scss');
|
||||
|
@ -0,0 +1,218 @@
|
||||
@import '~ChillMainSass/custom/config/colors';
|
||||
|
||||
/*
|
||||
* PERSON CONTEXT
|
||||
*/
|
||||
|
||||
div#header-person-name {
|
||||
background: none repeat scroll 0 0 $chill-green-dark;
|
||||
color: #FFF;
|
||||
padding-top: 1em;
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
|
||||
div#header-person-details {
|
||||
background: none repeat scroll 0 0 $chill-green;
|
||||
color: #FFF;
|
||||
padding-top: 1em;
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
|
||||
div#person_details_container {
|
||||
padding-top: 20px;
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
div.person-view {
|
||||
figure.person-details {
|
||||
h2 {
|
||||
font-family: 'Open Sans';
|
||||
font-weight: 600;
|
||||
margin-bottom: 0.3em;
|
||||
font-variant: small-caps;
|
||||
}
|
||||
dl {
|
||||
margin-top: 0.3em;
|
||||
}
|
||||
dt {
|
||||
font-family: 'Open Sans';
|
||||
font-weight: 600;
|
||||
}
|
||||
dd {
|
||||
margin-left: 0;
|
||||
}
|
||||
/*
|
||||
a.sc-button { background-color: $black; padding-top: 0.2em; padding-bottom: 0.2em; }
|
||||
*/
|
||||
}
|
||||
/* custom fields on the home page */
|
||||
div.custom-fields {
|
||||
figure.person-details {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
div.cf_title_box:nth-child(4n+1) h2 {
|
||||
@extend .chill-red;
|
||||
}
|
||||
div.cf_title_box:nth-child(4n+2) h2 {
|
||||
@extend .chill-green;
|
||||
}
|
||||
div.cf_title_box:nth-child(4n+3) h2 {
|
||||
@extend .chill-orange;
|
||||
}
|
||||
div.cf_title_box:nth-child(4n+4) h2 {
|
||||
@extend .chill-blue;
|
||||
}
|
||||
div.cf_title_box:nth-child(2n+1) {
|
||||
width: 50%;
|
||||
margin-right: 40px;
|
||||
}
|
||||
div.cf_title_box:nth-child(2n+2) {
|
||||
width: calc(50% - 40px);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* ACCOMPANYING_COURSE CONTEXT
|
||||
* Header custom for Accompanying Course
|
||||
*/
|
||||
|
||||
div#header-accompanying_course-name {
|
||||
background: none repeat scroll 0 0 #718596;
|
||||
color: #FFF;
|
||||
h1 {
|
||||
margin: 0.4em 0;
|
||||
}
|
||||
span {
|
||||
a {
|
||||
color: white;
|
||||
}
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
div#header-accompanying_course-details {
|
||||
background: none repeat scroll 0 0 #718596ab;
|
||||
color: #FFF;
|
||||
padding-top: 1em;
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
|
||||
/*
|
||||
* HOUSEHOLD CONTEXT
|
||||
* Header custom for Household
|
||||
*/
|
||||
|
||||
div#header-household-name {
|
||||
background: none repeat scroll 0 0 #929d69; //#b97a7a;
|
||||
color: #FFF;
|
||||
h1 {
|
||||
margin: 0.4em 0;
|
||||
}
|
||||
span {
|
||||
a {
|
||||
color: white;
|
||||
}
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
div#header-household-details {
|
||||
background: none repeat scroll 0 0 #b0b984; //#d29791;
|
||||
color: #FFF;
|
||||
padding-top: 1em;
|
||||
padding-bottom: 1em;
|
||||
span.current-members-explain {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
div.household__address,
|
||||
div.person__address {
|
||||
div.row {
|
||||
height: 100px;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
|
||||
& > div {
|
||||
position: absolute;
|
||||
display: table;
|
||||
height: 100%;
|
||||
border: 1px dotted #c3c3c3;
|
||||
}
|
||||
|
||||
div.household__address--date,
|
||||
div.person__address--date {
|
||||
width: 30%;
|
||||
background-color: #c3c3c3;
|
||||
height: 100%;
|
||||
|
||||
div.cell {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
margin-left: 50%;
|
||||
|
||||
div.pill {
|
||||
position: absolute;
|
||||
box-sizing: border-box;
|
||||
width: 120px;
|
||||
height: 40px;
|
||||
bottom: -20px;
|
||||
background-color: white;
|
||||
padding: 10px;
|
||||
border-radius: 30px;
|
||||
left: -60px;
|
||||
text-align: center;
|
||||
z-index: 10;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
div.household__address--content,
|
||||
div.person__address--content {
|
||||
width: 70%;
|
||||
left: 30%;
|
||||
text-align: left;
|
||||
background-color: #ececec;
|
||||
border: 1px solid #888;
|
||||
|
||||
div.cell {
|
||||
display: table-cell;
|
||||
padding: 5px 30px;
|
||||
vertical-align: middle;
|
||||
|
||||
& > div {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
i.dot::after,
|
||||
i.dot::before {
|
||||
position: absolute;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
content: '';
|
||||
border: 0;
|
||||
background-color: white;
|
||||
border-radius: 50%;
|
||||
border: 5px solid #c3c3c3;
|
||||
z-index: 10;
|
||||
left: -15px;
|
||||
bottom: -15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
div.household__address-move {
|
||||
div.household__address-move__create {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
@ -1,168 +0,0 @@
|
||||
|
||||
@import '~ChillMainSass/custom/config/colors';
|
||||
|
||||
div#header-person-name {
|
||||
background: none repeat scroll 0 0 $chill-green-dark;
|
||||
color: #FFF;
|
||||
padding-top: 1em;
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
|
||||
div#header-person-details {
|
||||
background: none repeat scroll 0 0 $chill-green;
|
||||
color: #FFF;
|
||||
padding-top: 1em;
|
||||
padding-bottom: 1em;
|
||||
}
|
||||
|
||||
div#person_details_container {
|
||||
padding-top: 20px;
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
div.person-view {
|
||||
figure.person-details {
|
||||
h2 {
|
||||
font-family: 'Open Sans';
|
||||
font-weight: 600;
|
||||
margin-bottom: 0.3em;
|
||||
font-variant: small-caps;
|
||||
}
|
||||
|
||||
dl {
|
||||
margin-top: 0.3em;
|
||||
}
|
||||
|
||||
dt {
|
||||
font-family: 'Open Sans';
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
dd {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
// a.sc-button {
|
||||
/* background-color: $black;
|
||||
padding-top: 0.2em;
|
||||
padding-bottom: 0.2em;
|
||||
}*/
|
||||
}
|
||||
|
||||
/* custom fields on the home page */
|
||||
div.custom-fields {
|
||||
figure.person-details {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
|
||||
div.cf_title_box:nth-child(4n+1) h2 {
|
||||
@extend .chill-red;
|
||||
}
|
||||
|
||||
div.cf_title_box:nth-child(4n+2) h2 {
|
||||
@extend .chill-green;
|
||||
}
|
||||
|
||||
div.cf_title_box:nth-child(4n+3) h2 {
|
||||
@extend .chill-orange;
|
||||
}
|
||||
|
||||
div.cf_title_box:nth-child(4n+4) h2 {
|
||||
@extend .chill-blue;
|
||||
}
|
||||
|
||||
div.cf_title_box:nth-child(2n+1){
|
||||
width: 50%;
|
||||
margin-right: 40px;
|
||||
}
|
||||
|
||||
iv.cf_title_box:nth-child(2n+2) {
|
||||
width: calc(50% - 40px);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* HOUSEHOLD
|
||||
*/
|
||||
|
||||
|
||||
div.household__address, div.person__address {
|
||||
div.row {
|
||||
height: 100px;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
& > div {
|
||||
position: absolute;
|
||||
display: table;
|
||||
height: 100%;
|
||||
border: 1px dotted #c3c3c3;
|
||||
}
|
||||
div.household__address--date, div.person__address--date {
|
||||
width: 30%;
|
||||
background-color: #c3c3c3;
|
||||
height: 100%;
|
||||
div.cell {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
margin-left: 50%;
|
||||
div.pill {
|
||||
position: absolute;
|
||||
box-sizing: border-box;
|
||||
width: 120px;
|
||||
height: 40px;
|
||||
bottom: -20px;
|
||||
background-color: white;
|
||||
padding: 10px;
|
||||
border-radius: 30px;
|
||||
left: -60px;
|
||||
text-align: center;
|
||||
z-index: 10;
|
||||
}
|
||||
}
|
||||
}
|
||||
div.household__address--content, div.person__address--content {
|
||||
width: 70%;
|
||||
left: 30%;
|
||||
text-align: left;
|
||||
background-color: #ececec;
|
||||
border: 1px solid #888;
|
||||
div.cell {
|
||||
display: table-cell;
|
||||
padding: 5px 30px;
|
||||
vertical-align: middle;
|
||||
& > div {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
i.dot::before, i.dot::after {
|
||||
position: absolute;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
content: '';
|
||||
border: 0;
|
||||
background-color: white;
|
||||
border-radius: 50%;
|
||||
border: 5px solid #c3c3c3;
|
||||
z-index: 10;
|
||||
left: -15px;
|
||||
bottom: -15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
div.household__address-move {
|
||||
div.household__address-move__create {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
@ -1,5 +1,5 @@
|
||||
<div class="subheader banner-household">
|
||||
<div class="grid-12 parent" id="header-accompanying_course-name" >
|
||||
<div class="grid-12 parent" id="header-household-name" >
|
||||
<div class="grid-10 push-1 grid-mobile-12 grid-tablet-12 push-mobile-0 push-tablet-0 parent">
|
||||
|
||||
<div class="grid-6">{% set title = title %}
|
||||
@ -16,7 +16,7 @@
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid-12 parent" id="header-accompanying_course-details" >
|
||||
<div class="grid-12 parent" id="header-household-details" >
|
||||
<div class="grid-10 push-1 grid-mobile-12 grid-tablet-12 push-mobile-0 push-tablet-0 parent">
|
||||
<div id="banner-misc">
|
||||
{%- set persons = household.getCurrentPersons() -%}
|
||||
|
@ -34,7 +34,7 @@ household:
|
||||
is not holder: N'est pas titulaire
|
||||
holder: Titulaire
|
||||
Edit member household: Modifier l'appartenance au ménage
|
||||
Current household members: Membres actuels du ménage
|
||||
Current household members: Membres actuels
|
||||
Household summary: Résumé
|
||||
Addresses: Adresses
|
||||
Edit household members: Modifier l'appartenance au ménage
|
||||
@ -61,4 +61,3 @@ household:
|
||||
from: Depuis
|
||||
to: Jusqu'au
|
||||
person history: Ménages
|
||||
|
||||
|
Loading…
x
Reference in New Issue
Block a user