replace colors by variables in chillperson.scss

This commit is contained in:
Mathieu Jaumotte 2021-08-01 16:09:43 +02:00
parent 48873d15c9
commit 96e979f92d

View File

@ -7,14 +7,14 @@
div#header-person-name { div#header-person-name {
background: none repeat scroll 0 0 $chill-green-dark; background: none repeat scroll 0 0 $chill-green-dark;
color: #FFF; color: $white;
padding-top: 1em; padding-top: 1em;
padding-bottom: 1em; padding-bottom: 1em;
} }
div#header-person-details { div#header-person-details {
background: none repeat scroll 0 0 $chill-green; background: none repeat scroll 0 0 $chill-green;
color: #FFF; color: $white;
padding-top: 1em; padding-top: 1em;
padding-bottom: 1em; padding-bottom: 1em;
div.contact { div.contact {
@ -83,27 +83,28 @@ div.person-view {
* ACCOMPANYING_COURSE CONTEXT * ACCOMPANYING_COURSE CONTEXT
* Header custom for Accompanying Course * Header custom for Accompanying Course
*/ */
$chill-accourse: #718596;
div#header-accompanying_course-name { div#header-accompanying_course-name {
background: none repeat scroll 0 0 #718596; background: none repeat scroll 0 0 $chill-accourse;
color: #FFF; color: $white;
h1 { h1 {
margin: 0.4em 0; margin: 0.4em 0;
}
span {
a {
color: white;
} }
a:hover { span {
text-decoration: underline; a {
color: $white;
}
a:hover {
text-decoration: underline;
}
} }
}
} }
div#header-accompanying_course-details { div#header-accompanying_course-details {
background: none repeat scroll 0 0 #718596ab; background: none repeat scroll 0 0 tint-color($chill-accourse, 20%);
color: #FFF; color: $white;
padding-top: 1em; padding-top: 1em;
padding-bottom: 1em; padding-bottom: 1em;
} }
// flex-table precision // flex-table precision
@ -118,26 +119,43 @@ div.accompanyingcourse-resume {
* HOUSEHOLD CONTEXT * HOUSEHOLD CONTEXT
* Header custom for Household * Header custom for Household
*/ */
$chill-household: #929d69;
div#header-household-name { div#header-household-name {
background: none repeat scroll 0 0 #929d69; //#b97a7a; background: none repeat scroll 0 0 $chill-household;
color: #FFF; color: $white;
h1 {
h1 { margin: 0.4em 0;
margin: 0.4em 0; }
} span {
span { a {
a { color: $white;
color: white; }
} a:hover {
a:hover { text-decoration: underline;
text-decoration: underline; }
} }
} div.household-members {
display: flex;
flex-direction: row;
flex-wrap: wrap;
span.badge-member {
flex-shrink: 0; flex-grow: 0; flex-basis: auto;
color: $white;
border: 1px solid #ffffff3b;
border-radius: 8px;
padding: 0.4em 0.8em;
margin-bottom: 0.2em;
margin-right: 0.3em;
&.holder { order: -1; }
&.child { order: 2; }
}
}
} }
div#header-household-details { div#header-household-details {
background: none repeat scroll 0 0 #b0b984; //#d29791; background: none repeat scroll 0 0 tint-color($chill-household, 15%);
color: #FFF; color: $white;
padding-top: 1em; padding-top: 1em;
padding-bottom: 1em; padding-bottom: 1em;
span.current-members-explain { span.current-members-explain {
@ -145,26 +163,3 @@ div#header-household-details {
} }
} }
div.household-members {
display: flex;
flex-direction: row;
flex-wrap: wrap;
//justify-content: flex-end;
span.badge-member {
flex-shrink: 0; flex-grow: 0; flex-basis: auto;
border: 1px solid #ffffff3b;
color: #ffffff;
padding: 0.4em 0.8em;
margin-bottom: 0.2em;
margin-right: 0.3em;
border-radius: 8px;
&.holder {
order: -1;
}
&.child {
order: 2;
}
}
}