reorganise styles sheets in person/chill/scss

This commit is contained in:
Mathieu Jaumotte 2021-08-21 12:57:16 +02:00
parent 9c25132216
commit 6959de4e39
4 changed files with 83 additions and 80 deletions

View File

@ -7,15 +7,16 @@
@import './scss/flex_table.scss';
// Specific templates styles
@import './scss/person_with_period.scss';
@import './scss/household_banner.scss';
@import './scss/accompanying_period_work.scss';
@import './scss/person_by_phonenumber.scss';
@import './scss/address_history.scss';
/*
* PERSON CONTEXT
* Header custom for Person
*/
div.banner {
div#header-person-name {
background: none repeat scroll 0 0 $chill-green-dark;
@ -86,10 +87,12 @@ div.person-view {
}
}
/*
* ACCOMPANYING_COURSE CONTEXT
* Header custom for Accompanying Course
*/
$chill-accourse-context: #718596;
div.banner {
@ -122,16 +125,19 @@ abbr.referrer {
align-self: center; // in flex context
}
/*
* HOUSEHOLD CONTEXT
* Header custom for Household
*/
$chill-household-context: #929d69;
div.banner {
div#header-household-name {
background: none repeat scroll 0 0 $chill-household-context;
color: $white;
h1 {
margin: 0.4em 0;
}
@ -147,6 +153,7 @@ div.banner {
display: flex;
flex-direction: row;
flex-wrap: wrap;
span.badge-member {
flex-shrink: 0; flex-grow: 0; flex-basis: auto;
color: $white;
@ -165,7 +172,9 @@ div.banner {
color: $white;
padding-top: 1em;
padding-bottom: 1em;
span.current-members-explain {
font-weight: 700;
font-weight: bold;
}
}

View File

@ -1,8 +1,9 @@
/*
* flex-table overwrite: precision and exceptions
* FLEX-TABLE ASSETS OVERRIDE
* precisions, exceptions and specific styles
*/
///
/// AccompanyingCourse Resume Page
div.accompanyingcourse-resume {
div.associated-persons {
.flex-table .item-row .item-col:first-child {
@ -11,7 +12,7 @@ div.accompanyingcourse-resume {
}
}
///
/// AccompanyingPeriod list
div.accompanyingcourse-list, div.household-members {
.flex-table .item-bloc .item-row {
&:nth-child(2) {
@ -23,9 +24,76 @@ div.accompanyingcourse-list, div.household-members {
}
}
///
/// Search Page (list_with_period.html.twig)
div.list-with-period {
/// override flex-table
div.flex-table div.item-row div.item-col:first-child {
flex-basis: 33%;
}
// override wrap-list
div.wrap-list.periods-list {
div.wl-row {
flex-wrap: nowrap;
div.wl-col {
&.title {
width: 34%;
@include media-breakpoint-up(md) {
margin-left: 0;
}
}
&.list {
display: flex;
flex-wrap: wrap; //
margin: unset;
}
}
@include media-breakpoint-down(sm) {
flex-wrap: wrap;
div.wl-col {
&.title, &.list {
width: 100%;
}
&.title {
text-align: left;
div {
display: inline-block;
}
}
}
}
}
}
div.periods-list {
div.title {
text-align: right;
div.date {}
div.user {}
}
div.list {
span.more {
font-style: italic;
}
}
}
}
/// TODO
/// dans householdmembereditor/Concerned.vue
div.positions {
div.list-household-members {
div.participation-details {}
}
}
/// dans householdmembereditor/Concerned.vue et dans household/summary
div.list-household-members {
div.move_to {
p.move_hint {}
}
div.comment {}
}

View File

@ -1,5 +0,0 @@
.banner-household {
.current-members-explain {
font-weight: 700;
}
}

View File

@ -1,69 +0,0 @@
/// Search Page (list_with_period.html.twig)
div.list-with-period {
// override wrap-list
div.wrap-list.periods-list {
div.wl-row {
flex-wrap: nowrap;
div.wl-col {
&.title {
width: 34%;
@include media-breakpoint-up(md) {
margin-left: 0;
}
}
&.list {
display: flex;
flex-wrap: wrap; //
margin: unset;
}
}
@include media-breakpoint-down(sm) {
flex-wrap: wrap;
div.wl-col {
&.title, &.list {
width: 100%;
}
&.title {
text-align: left;
div {
display: inline-block;
}
}
}
}
}
}
div.periods-list {
div.title {
text-align: right;
div.date {}
div.user {}
}
div.list {
span.more {
font-style: italic;
}
}
}
}
/// TODO
/// dans householdmembereditor/Concerned.vue
div.positions {
div.list-household-members {
div.participation-details {}
}
}
/// dans householdmembereditor/Concerned.vue et dans household/summary
div.list-household-members {
div.move_to {
p.move_hint {}
}
div.comment {}
}