Chill-project/chill-bundles
6
0
Fork 0
mirror of https://gitlab.com/Chill-Projet/chill-bundles.git synced 2025-06-07 18:44:08 +00:00
Code Issues Actions Projects Releases Wiki Activity

simplify styles cascade

Browse Source
This commit is contained in:
Mathieu Jaumotte 2021-08-11 12:13:16 +02:00 committed by Marc Ducobu
parent 190549180b
commit 71b54622e2
1 changed files with 77 additions and 121 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

198
src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourseWorkEdit/App.vue
View File

@ -1,9 +1,9 @@
<template>
<div id="workEditor" class="my-4">
<div id="title">
<label class="action_title_label">{{ $t('action_title') }}</label>
<p class="action_title">{{ work.socialAction.text }}</p>
<div id="title" class="action-title">
<label>{{ $t('action_title') }}</label>
<p>{{ work.socialAction.text }}</p>
</div>
<div id="startDate">
@ -25,7 +25,7 @@
></ckeditor>
</div>
<div id="objectives" class="objectives_list">
<div id="objectives">
<div aria="hidden" class="title">
<div><h3>{{ $t('goals_title') }}</h3></div>
<div><h3>{{ $t('results_title') }}</h3></div>
@ -44,7 +44,7 @@
<!-- results which **are** attached to an objective -->
<div v-for="g in goalsPicked">
<div>
<div class="objective-title" @click="removeGoal(g)">
<div class="item-title" @click="removeGoal(g)">
<i class="fa fa-times"></i>
{{ g.goal.title.fr }}
</div>
@ -416,56 +416,60 @@ export default {
@import '~ChillMainAssets/module/bootstrap/shared';
@import '~ChillMainAssets/chill/scss/mixins';
#workEditor {
div#workEditor {
display: grid;
grid-template-areas:
"title title"
"startDate endDate"
"comment comment"
"objectives objectives"
"evaluations evaluations"
"persons persons"
"handling handling"
"tparties tparties"
"errors errors";
grid-template-columns: 50%;
column-gap: 0rem;
grid-template-areas:
"title title"
"startDate endDate"
"comment comment"
"objectives objectives"
"evaluations evaluations"
"persons persons"
"handling handling"
"tparties tparties"
"errors errors";
#title {
grid-area: title; }
#startDate {
grid-area: startDate; }
#endDate {
grid-area: endDate; }
#comment {
grid-area: comment; }
#objectives {
grid-area: objectives; }
#evaluations {
grid-area: evaluations; }
#persons {
grid-area: persons; }
#handlingThirdParty {
grid-area: handling; }
#thirdParties {
grid-area: tparties; }
#errors {
grid-area: errors; }
& > div {
@include border-collapse;
padding: 1em;
}
#title {
grid-area: title;
.action_title_label {
div.action-title {
label {
margin-bottom: 0;
}
.action_title {
p {
margin-top: 0;
font-weight: bold;
font-size: 1.5rem;
}
}
#startDate {
grid-area: startDate;
}
#endDate {
grid-area: endDate;
}
#comment {
grid-area: comment;
}
#objectives {
grid-area: objectives;
div#objectives {
& > div {
display: grid;
grid-template-areas: "obj res";
@ -477,12 +481,10 @@ export default {
padding: 1em;
&:nth-child(1) {
grid-area: obj;
}
grid-area: obj; }
&:nth-child(2) {
grid-area: res;
}
grid-area: res; }
}
& > div.results_without_objective {
@ -498,48 +500,17 @@ export default {
padding-top: 1.5rem;
}
}
li.badge, div.badge {
padding-bottom: 0;
padding-top: 0;
padding-left: 0;
i.fa {
padding: 0.25rem;
}
i.fa-plus {
background-color: $green;
}
}
}
#evaluations {
grid-area: evaluations;
div#evaluations {
& > div {
@include border-collapse;
padding: 1em;
}
}
#persons {
grid-area: persons;
}
#handlingThirdParty {
grid-area: handling;
}
#thirdParties {
grid-area: tparties;
}
#errors {
grid-area: errors;
}
#objectives, #evaluations {
div#objectives,
div#evaluations {
padding: 0;
& > div.title {
@ -551,57 +522,42 @@ export default {
}
}
ul.list-evaluations, ul.list-results {
list-style-type: none;
padding: 0;
li {
margin: 0.5rem;
}
li.badge {
padding-bottom: 0;
padding-top: 0;
padding-left: 0;
i.fa {
/*border-radius: 0.25rem; */
padding: 0.25rem;
}
i.fa-plus {
background-color: $green;
}
i.fa-times {
background-color: $red;
color: $white;
}
}
}
ul.list-evaluations, ul.list-objectives {
list-style-type: none;
padding: 0;
li {
margin: 0.5rem;
}
}
div.evaluation-title, div.objective-title {
div.item-title {
font-weight: bold;
}
i.fa {
padding: 0.25rem;
}
ul.list-evaluations,
ul.list-objectives,
ul.list-results {
i.fa-times {
background-color: $red;
color: $white;
list-style-type: none;
padding: 0;
li {
margin: 0.5rem;
&.badge {
padding-bottom: 0;
padding-top: 0;
padding-left: 0;
}
}
}
i.fa {
padding: 0.25rem;
color: $white;
&.fa-plus { background-color: $green; }
&.fa-times { background-color: $red; }
&.fa-pencil { background-color: $orange; }
}
}
div#persons {
margin-top: 1.5em;
}
}
</style>