mirror of
https://gitlab.com/Chill-Projet/chill-bundles.git
synced 2025-06-12 13:24:25 +00:00
#258 apply assets to lists of suggestion, adapt item-title case
This commit is contained in:
parent
33c7a495c7
commit
d274ba3823
@ -14,6 +14,7 @@ and this project adheres to
|
||||
* Use the user.label in accompanying course banner, instead of username;
|
||||
* fix: show validation message when closing accompanying course;
|
||||
* [thirdparty] link from modal to thirdparty detail page fixed (https://gitlab.com/champs-libres/departement-de-la-vendee/accent-suivi-developpement/-/issues/228)
|
||||
* [assets] new asset to style suggestions lists (with add/remove item link) (https://gitlab.com/champs-libres/departement-de-la-vendee/chill/-/issues/258)
|
||||
|
||||
## Test releases
|
||||
|
||||
@ -45,7 +46,7 @@ and this project adheres to
|
||||
* [accompanyingCourse] Ability to close accompanying course (https://gitlab.com/champs-libres/departement-de-la-vendee/chill/-/issues/296)
|
||||
* [task] Select2 field in task form to allow search for a user (https://gitlab.com/champs-libres/departement-de-la-vendee/accent-suivi-developpement/-/issues/167)
|
||||
* [list result] show all courses, except ones with period closed
|
||||
|
||||
* [accompanyingCourse] improve banner with small carousel to display slide social-issues or slide associated persons
|
||||
|
||||
### Test release 2021-11-15
|
||||
|
||||
|
||||
@ -98,7 +98,7 @@ Finalement, il importe ici de définir ce qu'est un bloc, ce qu'est une zone d'a
|
||||
|
||||
Par exemple pour mettre un style au titre on précise juste h3 dans la cascade bloc.
|
||||
|
||||
```sass
|
||||
```scss
|
||||
div.bloc {
|
||||
// un bloc générique, utilisé à plusieurs endroits
|
||||
&.bloc-dark {
|
||||
@ -381,3 +381,31 @@ A chaque fois qu'un lien est indiqué, vérifier si on ne doit pas utiliser la f
|
||||
* utiliser `chill_return_path_or` dans le bouton "Cancel";
|
||||
* pour les boutons "enregistrer et voir" et "Enregistrer et fermer" => ?
|
||||
|
||||
### Assets pour les listes de suggestion
|
||||
|
||||
Créer une liste de suggestions à ajouter (tout l'item est cliquable)
|
||||
```html
|
||||
<ul class="list-suggest add-items">
|
||||
<li>
|
||||
<span>item</span>
|
||||
</li>
|
||||
</ul>
|
||||
```
|
||||
Créer une liste de suggestions à enlever (avec une croix rouge cliquable, l'ancre a est vide)
|
||||
```html
|
||||
<ul class="list-suggest remove-items">
|
||||
<li>
|
||||
<span>
|
||||
item
|
||||
<a></a>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
```
|
||||
Créer un titre enlevable (avec une croix rouge cliquable, l'ancre a est vide)
|
||||
```html
|
||||
<div class="item-title">
|
||||
title
|
||||
<a></a>
|
||||
</div>
|
||||
```
|
||||
|
||||
@ -1,8 +1,19 @@
|
||||
|
||||
///
|
||||
/// A specific list of badges used to manage suggestions
|
||||
/// A specific list of badges used to manage suggestions (with add/remove link)
|
||||
/// use bootstrap badge styles, cfr. src/Bundle/ChillMainBundle/Resources/public/module/bootstrap/_custom.scss
|
||||
///
|
||||
@mixin remove_link {
|
||||
cursor: pointer;
|
||||
&:before {
|
||||
font: normal normal normal 14px/1 ForkAwesome;
|
||||
margin-left: 0.5em;
|
||||
content: "\f00d"; // fa-times
|
||||
color: var(--bs-danger);
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
ul.list-suggest {
|
||||
list-style-type: none;
|
||||
padding-left: 0;
|
||||
@ -20,15 +31,16 @@ ul.list-suggest {
|
||||
&.remove-items {
|
||||
li {
|
||||
a {
|
||||
cursor: pointer;
|
||||
&:before {
|
||||
font: normal normal normal 14px/1 ForkAwesome;
|
||||
margin-left: 0.5em;
|
||||
content: "\f00d"; // fa-times
|
||||
color: var(--bs-danger);
|
||||
text-decoration: none;
|
||||
@include remove_link;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/// manage remove link if it isn't a list but a title
|
||||
/// (cfr. in Vue AccompanyingCourseWorkEdit)
|
||||
div.item-title {
|
||||
a {
|
||||
@include remove_link;
|
||||
}
|
||||
}
|
||||
|
||||
@ -20,10 +20,9 @@
|
||||
</VueMultiselect>
|
||||
|
||||
<template v-if="referrersSuggested.length > 0">
|
||||
<ul class="list-unstyled">
|
||||
<ul class="list-suggest add-items">
|
||||
<li v-for="u in referrersSuggested" @click="updateReferrer(u)">
|
||||
<span class="badge bg-primary" style="cursor: pointer">
|
||||
<i class="fa fa-plus fa-fw text-success"></i>
|
||||
<span>
|
||||
<user-render-box-badge :user="u"></user-render-box-badge>
|
||||
</span>
|
||||
</li>
|
||||
|
||||
@ -44,9 +44,9 @@
|
||||
<!-- results which **are** attached to an objective -->
|
||||
<div v-for="g in goalsPicked">
|
||||
<div>
|
||||
<div class="item-title" @click="removeGoal(g)">
|
||||
<i class="fa fa-times"></i>
|
||||
<div class="item-title">
|
||||
{{ g.goal.title.fr }}
|
||||
<a @click="removeGoal(g)"></a>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
@ -61,10 +61,9 @@
|
||||
|
||||
<p>{{ $t('available_goals_text') }}</p>
|
||||
|
||||
<ul class="list-objectives">
|
||||
<li v-for="g in availableForCheckGoal" class="badge bg-primary" @click="addGoal(g)">
|
||||
<i class="fa fa-plus"></i>
|
||||
{{ g.title.fr }}
|
||||
<ul class="list-suggest add-items">
|
||||
<li v-for="g in availableForCheckGoal" @click="addGoal(g)">
|
||||
<span>{{ g.title.fr }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@ -98,10 +97,9 @@
|
||||
<div class="add_evaluation">
|
||||
<div v-if="showAddEvaluation">
|
||||
<p>{{ $t('available_evaluations_text') }}</p>
|
||||
<ul class="list-evaluations">
|
||||
<li v-for="e in evaluationsForAction" class="badge bg-primary" @click="addEvaluation(e)">
|
||||
<i class="fa fa-plus"></i>
|
||||
{{ e.title.fr }}
|
||||
<ul class="list-suggest add-items">
|
||||
<li v-for="e in evaluationsForAction" @click="addEvaluation(e)">
|
||||
<span>{{ e.title.fr }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
@ -497,8 +495,8 @@ div#workEditor {
|
||||
& > div.results_without_objective {
|
||||
background: repeating-linear-gradient(
|
||||
45deg,
|
||||
$gray-500,
|
||||
$gray-500 10px,
|
||||
$gray-200,
|
||||
$gray-200 10px,
|
||||
$gray-100 10px,
|
||||
$gray-100 20px
|
||||
);
|
||||
@ -537,31 +535,11 @@ div#workEditor {
|
||||
font-size: 85%;
|
||||
}
|
||||
|
||||
ul.list-evaluations,
|
||||
ul.list-objectives,
|
||||
ul.list-results {
|
||||
|
||||
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; }
|
||||
&.fa-times { color: $red; }
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -1,9 +1,10 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="item-title" @click="removeEvaluation(evaluation)">
|
||||
<i class="fa fa-fw fa-times"></i>
|
||||
<div class="item-title">
|
||||
{{ evaluation.evaluation.title.fr }}
|
||||
<a @click="removeEvaluation(evaluation)"></a>
|
||||
</div>
|
||||
|
||||
<div v-if="!evaluation.editEvaluation">
|
||||
<dl class="item-details definition-inline">
|
||||
|
||||
|
||||
@ -3,18 +3,21 @@
|
||||
<p v-if="pickedResults.length ===0" class="chill-no-data-statement">
|
||||
Aucun résultat associé
|
||||
</p>
|
||||
<ul class="list-results">
|
||||
<li v-for="r in pickedResults" class="badge bg-primary" @click="removeResult(r)">
|
||||
<i class="fa fa-times"></i>
|
||||
<ul class="list-suggest remove-items">
|
||||
<li v-for="r in pickedResults">
|
||||
<span>
|
||||
{{ r.title.fr }}
|
||||
<a @click="removeResult(r)"></a>
|
||||
</span>
|
||||
</li>
|
||||
<template v-if="isExpanded">
|
||||
<li v-for="r in availableForCheckResults" class="badge bg-primary" @click="addResult(r)">
|
||||
<i class="fa fa-plus"></i>
|
||||
{{ r.title.fr }}
|
||||
</li>
|
||||
</template>
|
||||
</ul>
|
||||
<template v-if="isExpanded">
|
||||
<ul class="list-suggest add-items">
|
||||
<li v-for="r in availableForCheckResults" @click="addResult(r)">
|
||||
<span>{{ r.title.fr }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</template>
|
||||
<ul class="record_actions">
|
||||
<li v-if="isExpanded">
|
||||
<button class="btn btn-hide" @click="toggleSelect">
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user