mirror of
https://gitlab.com/Chill-Projet/chill-bundles.git
synced 2025-07-03 07:26:12 +00:00
suggest-list: picto is managedby css
This commit is contained in:
parent
a6cc6221d6
commit
395920bd51
@ -7,6 +7,7 @@ and this project adheres to
|
||||
|
||||
* [Semantic Versioning](https://semver.org/spec/v2.0.0.html) for stable releases;
|
||||
* date versioning for test releases
|
||||
* [accompanyingCourse_work] fix styles conflicts
|
||||
|
||||
## Unreleased
|
||||
|
||||
|
||||
@ -397,7 +397,6 @@ Créer une liste de suggestions à enlever (avec une croix rouge cliquable, l'an
|
||||
<li>
|
||||
<span>
|
||||
item
|
||||
<a></a>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
@ -405,8 +404,8 @@ Créer une liste de suggestions à enlever (avec une croix rouge cliquable, l'an
|
||||
Créer un titre enlevable (avec une croix rouge cliquable, l'ancre a est vide)
|
||||
```html
|
||||
<div class="item-title">
|
||||
title
|
||||
<a></a>
|
||||
<span>title</span>
|
||||
</div>
|
||||
```
|
||||
Les classes `cols` ou `inline` peuvent être ajoutées à côté de `list-suggest` pour modifier la disposition de la liste.
|
||||
Dans le dernier exemple, on met une classe `removable` sur le span, si on veut pouvoir enlever l'élément.
|
||||
|
||||
@ -8,6 +8,10 @@
|
||||
content: "\f00d"; // fa-times
|
||||
color: var(--bs-danger);
|
||||
text-decoration: none;
|
||||
position: absolute;
|
||||
display: block;
|
||||
top: calc(50% - 7px);
|
||||
right: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -36,12 +40,24 @@ ul.list-suggest {
|
||||
}
|
||||
&.add-items {
|
||||
li {
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
span {
|
||||
cursor: pointer;
|
||||
padding-left: 2rem;
|
||||
}
|
||||
& > span:before {
|
||||
font: normal normal normal 14px/1 ForkAwesome;
|
||||
margin-right: 0.5em;
|
||||
content: "\f067"; // fa-plus
|
||||
color: var(--bs-success);
|
||||
position: absolute;
|
||||
display: block;
|
||||
top: 50%;
|
||||
left: .75rem;
|
||||
-webkit-transform: translateY(-50%);
|
||||
-moz-transform: translateY(-50%);
|
||||
-ms-transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
& span:hover {
|
||||
color: $chill-l-gray;
|
||||
@ -50,7 +66,10 @@ ul.list-suggest {
|
||||
}
|
||||
&.remove-items {
|
||||
li {
|
||||
a {
|
||||
position: relative;
|
||||
span {
|
||||
display: block;
|
||||
padding-right: .75rem;
|
||||
@include remove_link;
|
||||
}
|
||||
}
|
||||
@ -60,7 +79,14 @@ ul.list-suggest {
|
||||
/// manage remove link if it isn't a list but a title
|
||||
/// (cfr. in Vue AccompanyingCourseWorkEdit)
|
||||
div.item-title {
|
||||
a {
|
||||
@include remove_link;
|
||||
span {
|
||||
display: block;
|
||||
position: relative;
|
||||
padding: 0.5em 0.8em;
|
||||
background-color: $chill-llight-gray;
|
||||
border-radius: .25rem;
|
||||
&.removable {
|
||||
@include remove_link;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -52,7 +52,7 @@
|
||||
<!-- results which **are** attached to an objective -->
|
||||
<div v-for="g in goalsPicked" :key="g.id">
|
||||
<div class="item-title" @click="removeGoal(g)">
|
||||
<span>{{ g.goal.title.fr }}</span>
|
||||
<span class="removable">{{ g.goal.title.fr }}</span>
|
||||
</div>
|
||||
<div>
|
||||
<add-result :goal="g.goal" destination="goal"></add-result>
|
||||
|
||||
@ -1,63 +1,14 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="item-title">
|
||||
<span class="evaluation-title">{{ evaluation.evaluation.title.fr }}</span>
|
||||
<span>{{ evaluation.evaluation.title.fr }}</span>
|
||||
</div>
|
||||
|
||||
<div v-if="!evaluation.editEvaluation">
|
||||
<dl class="item-details definition-inline">
|
||||
|
||||
<dt v-if="evaluation.startDate">{{ $t('startDate') }} :</dt>
|
||||
<dd v-if="evaluation.startDate">{{ $d(evaluation.startDate, 'short') }}</dd>
|
||||
|
||||
<dt v-if="evaluation.endDate">{{ $t('endDate') }} :</dt>
|
||||
<dd v-if="evaluation.endDate">{{ $d(evaluation.endDate, 'short') }}</dd>
|
||||
|
||||
<dt v-if="evaluation.maxDate">{{ $t('maxDate') }} :</dt>
|
||||
<dd v-if="evaluation.maxDate">{{ $d(evaluation.maxDate, 'short') }}</dd>
|
||||
|
||||
<dt v-if="evaluation.warningInterval">{{ $t('warningInterval') }} :</dt>
|
||||
<dd v-if="evaluation.warningInterval">{{ evaluation.warningInterval }}</dd>
|
||||
|
||||
<template v-if="evaluation.documents.length > 0">
|
||||
<dt>{{ $t('documents') }} :</dt>
|
||||
<dd>
|
||||
<ul>
|
||||
<li v-for="d in evaluation.documents" :key="d.id">
|
||||
{{ d.template.name.fr }}
|
||||
<a :href="buildEditLink(d.storedObject)" class="btn btn-action btn-sm">
|
||||
<i class="fa fa-edit"></i>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</dd>
|
||||
</template>
|
||||
|
||||
</dl>
|
||||
<dl class="item-details">
|
||||
|
||||
<dt v-if="evaluation.comment">{{ $t('comment') }} :</dt>
|
||||
<dd v-if="evaluation.comment">
|
||||
<blockquote class="chill-user-quote">
|
||||
{{ evaluation.comment }}
|
||||
</blockquote>
|
||||
</dd>
|
||||
|
||||
</dl>
|
||||
<ul class="record_actions">
|
||||
<li>
|
||||
<a class="btn btn-sm btn-update" @click="toggleEditEvaluation(e)">{{ $t('action.edit') }}</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="btn btn-sm btn-delete" @click="modal.showModal = true">{{ $t('action.delete') }}</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div v-if="evaluation.editEvaluation">
|
||||
<div>
|
||||
<form-evaluation ref="FormEvaluation" :key="evaluation.key" :evaluation="evaluation"></form-evaluation>
|
||||
<ul class="record_actions">
|
||||
<li>
|
||||
<button class="btn btn-sm btn-update" @click="submitForm">{{ $t('action.save') }}</button>
|
||||
<a class="btn btn-delete" @click="modal.showModal = true" :title="$t('action.delete')"></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
@ -60,6 +60,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
const i18n = {
|
||||
messages: {
|
||||
fr: {
|
||||
@ -149,4 +150,4 @@ export default {
|
||||
padding: .25rem;
|
||||
}
|
||||
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@ -50,8 +50,8 @@
|
||||
</div>
|
||||
|
||||
<div class="row mb-3">
|
||||
<label class="col-sm-4 col-form-label">{{ $t('evaluation_public_comment') }}</label>
|
||||
<div class="col-sm-8">
|
||||
<label class="col-sm-4 col-form-label visually-hidden">{{ $t('evaluation_public_comment') }}</label>
|
||||
<div class="col-sm-12">
|
||||
<ckeditor
|
||||
:editor="editor"
|
||||
:placeholder="$t('evaluation_comment_placeholder')"
|
||||
|
||||
@ -192,7 +192,7 @@ const store = createStore({
|
||||
type: "accompanying_period_work_evaluation",
|
||||
key: state.evaluationsPicked.length + 1,
|
||||
evaluation: evaluation,
|
||||
startDate: null,
|
||||
startDate: new Date(),
|
||||
endDate: null,
|
||||
maxDate: null,
|
||||
warningInterval: null,
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user