jmtrivial/agenda_culturel
4
4
Fork 0
Code Issues 70 Pull Requests 1 Projects 1 Releases Wiki Activity

Amélioration mise en forme image

Browse Source
This commit is contained in:
Jean-Marie Favreau 2024-12-22 12:37:08 +01:00
parent 4a174d30ef
commit 5343ad2cfa
3 changed files with 9 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/agenda_culturel/static/js/modal.js
View File

@ -38,7 +38,7 @@ const openModal = (modal, back=true) => {
console.log("ici"); console.log("ici");
const mask = visibleModal.querySelector(".h-mask"); const mask = visibleModal.querySelector(".h-mask");
mask.classList.add("visible"); mask.classList.add("visible");
}, 250); }, 350);
}; };
const hideModal = (modal) => { const hideModal = (modal) => {

5
src/agenda_culturel/static/style.scss
View File

@ -1708,13 +1708,14 @@ label.required::after {
} }
} }
} }
dialog {
.h-image { .h-image {
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: cover; background-size: cover;
background-position: center, center; background-position: center, center;
} }
dialog {
.h-mask { .h-mask {
background-color: var(--background-color); background-color: var(--background-color);
margin: calc(var(--spacing) * -1.5); margin: calc(var(--spacing) * -1.5);
@ -1722,7 +1723,7 @@ dialog {
} }
.h-mask.visible { .h-mask.visible {
background-color: var(--background-color-transparent); background-color: var(--background-color-transparent);
transition: background-color .8s linear; transition: background-color .8s ease-in;
} }
.h-mask.visible:hover { .h-mask.visible:hover {
background-color: var(--background-color-transparent-light); background-color: var(--background-color-transparent-light);

2
src/agenda_culturel/templates/agenda_culturel/page-week.html
View File

@ -97,7 +97,7 @@
<dialog id="event-{{ event.id }}"> <dialog id="event-{{ event.id }}">
<article> <article>
{% if event.has_image_url %} {% if event.has_image_url %}
<header style="background: url({{ event.get_image_url }});" class="h-image"> <header style="background-image: url({{ event.get_image_url }});" class="h-image">
{% else %} {% else %}
<header class="cat-{{ event.category.pk }}"> <header class="cat-{{ event.category.pk }}">
{% endif %} {% endif %}