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

Update calendar list display for the the next calendar in search results

Browse Source 
The calendar list display in ChillPersonBundle has been revamped, including a new view and style modifications. This update enables the display of calendars as a list for easy navigation with an added authorization check. Also, a new SCSS file named "calendar-list.scss" has been created and imported to enhance the UI/UX design.
This commit is contained in:
Julien Fastré 2024-06-13 18:01:35 +02:00
parent f66ac50571
commit bca0d04201
Signed by: julienfastre
GPG Key ID: BDE2190974723FCB
4 changed files with 54 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
.changes/unreleased/Feature-20240613-180648.yaml Normal file
View File

@ -0,0 +1,9 @@
kind: Feature
body: |+
Improve the list of calendar in the search results: make all calendar clicable, and display a list of calendars
time: 2024-06-13T18:06:48.625006204+02:00
custom:
Issue: "122"

1
src/Bundle/ChillCalendarBundle/Resources/public/chill/chill.js
View File

@ -1 +1,2 @@
import './scss/badge.scss';
import './scss/calendar-list.scss';

26
src/Bundle/ChillCalendarBundle/Resources/public/chill/scss/calendar-list.scss Normal file
View File

@ -0,0 +1,26 @@
ul.calendar-list {
list-style-type: none;
padding: 0;
& > li {
display: inline-block;
}
& > li:nth-child(n+2) {
margin-left: 0.25rem;
}
}
div.calendar-list {
ul.calendar-list {
display: inline-block;
}
& > a.calendar-list__global {
display: inline-block;;
padding: 0.2rem;
min-width: 2rem;
border: 1px solid var(--bs-chill-blue);
border-radius: 0.25rem;
text-align: center;
}
}

19
src/Bundle/ChillPersonBundle/Resources/views/Person/list_with_period.html.twig
View File

@ -171,7 +171,24 @@
<h3>{{ 'chill_calendar.Next calendars'|trans }}</h3>
</div>
<div class="wl-col list">
{% for c in calendars %}<span>{{ c.startDate|format_datetime('long', 'short') }}</span>{% if not loop.last %}, {% endif %}{% endfor %}
<div class="calendar-list">
<ul class="calendar-list">
{% for c in calendars %}
<li>
{% if is_granted('CHILL_CALENDAR_CALENDAR_EDIT', c) %}
<a href="{{ chill_path_add_return_path('chill_calendar_calendar_edit', {id: c.id}) }}">
<span class="badge bg-secondary">{{ c.startDate|format_datetime('long', 'short') }}</span>
</a>
{% else %}
<span class="badge bg-secondary">{{ c.startDate|format_datetime('long', 'short') }}</span>
{% endif %}
</li>
{% endfor %}
</ul>
{% if is_granted('CHILL_CALENDAR_CALENDAR_SEE', acp) %}
<a href="{{ chill_path_add_return_path('chill_calendar_calendar_list_by_period', {'id': acp.id}) }}" class="calendar-list__global"><i class="fa fa-list"></i></a>
{% endif %}
</div>
</div>
</div>