studio-variable/nouveau-theatre-de-besancon
5
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

add ticket animation / link

Browse source
This commit is contained in:
isUnknown 2024-07-31 07:59:51 +02:00
parent be549bba16
commit 8a1f9370dd
11 changed files with 89 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

16
assets/css/src/events-grid.css
View file

@ -5,3 +5,19 @@
.events-grid h4 {
margin-bottom: 1rem;
}
.event-card picture {
margin-bottom: calc(var(--space-m) / 2);
}
.event-card__infos > div {
display: grid;
grid-template-columns: repeat(2, 1fr);
}
.event-card__infos > div:first-child {
margin-bottom: calc(var(--space-m) / 2);
}
.event-card__infos > div > *:not(h5):last-child {
place-self: end;
}

47
assets/css/src/generic.css
View file

@ -12,3 +12,50 @@ body.progress * {
.grid__item {
grid-column: span var(--span);
}
@keyframes vibrate {
0%,
100% {
scale: 1;
transform: rotate(0deg);
}
20%,
40%,
60%,
80% {
transform: rotate(5deg);
}
20% {
scale: 0.95;
}
50% {
scale: 1.05;
}
80% {
scale: 0.95;
}
10%,
30%,
50%,
70%,
90% {
transform: rotate(-5deg);
}
}
.ticket:hover svg {
animation: vibrate 0.5s forwards;
}
.ticket:hover svg path:not(.dot) {
fill: var(--color-salmon);
stroke: var(--color-salmon);
}
.ticket:hover svg path.dot {
fill: #fff;
}

3
assets/css/src/reset.css
View file

@ -24,8 +24,11 @@ figure {
}
a {
margin: 0;
padding: 0;
text-decoration: none;
color: inherit;
cursor: pointer;
}
a:visited {

8
assets/css/src/text.css
View file

@ -34,5 +34,11 @@ h3,
h4,
.h4 {
font-size: var(--font-size-h4);
font-weight: bold;
font-weight: 500;
}
h5,
.h5 {
font-size: var(--font-size-h5);
font-weight: 600;
}

1
assets/css/src/variables.css
View file

@ -2,6 +2,7 @@
--border: 1px solid #000;
--font-size-body: 1.25rem;
--font-size-h5: 1.5625rem;
--font-size-h4: 1.5625rem;
--font-size-h3: 1.5625rem;
--font-size-h2: 1.875rem;

8
assets/images/icons/ticket.svg
View file

@ -1,10 +1,10 @@
<svg width="36" height="23" viewBox="0 0 36 23" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_1125_1428)">
<path d="M30.7411 11.4703C30.7411 9.52004 32.3278 7.93341 34.278 7.93341V0.82666H0.82666V7.93341C2.77689 7.93341 4.36351 9.52004 4.36351 11.4703C4.36351 13.4205 2.77689 15.0071 0.82666 15.0071V22.1139H34.278V15.0071C32.3278 15.0071 30.7411 13.4205 30.7411 11.4703Z" stroke="black" stroke-width="2" stroke-miterlimit="10"/>
<path d="M13.9822 5.15583C14.5481 5.15583 15.0069 4.69706 15.0069 4.13114C15.0069 3.56522 14.5481 3.10645 13.9822 3.10645C13.4163 3.10645 12.9575 3.56522 12.9575 4.13114C12.9575 4.69706 13.4163 5.15583 13.9822 5.15583Z" fill="black"/>
<path d="M13.9822 10.2149C14.5481 10.2149 15.0069 9.75615 15.0069 9.19022C15.0069 8.6243 14.5481 8.16553 13.9822 8.16553C13.4163 8.16553 12.9575 8.6243 12.9575 9.19022C12.9575 9.75615 13.4163 10.2149 13.9822 10.2149Z" fill="black"/>
<path d="M13.9822 15.3038C14.5481 15.3038 15.0069 14.845 15.0069 14.2791C15.0069 13.7132 14.5481 13.2544 13.9822 13.2544C13.4163 13.2544 12.9575 13.7132 12.9575 14.2791C12.9575 14.845 13.4163 15.3038 13.9822 15.3038Z" fill="black"/>
<path d="M13.9822 20.3941C14.5481 20.3941 15.0069 19.9353 15.0069 19.3694C15.0069 18.8035 14.5481 18.3447 13.9822 18.3447C13.4163 18.3447 12.9575 18.8035 12.9575 19.3694C12.9575 19.9353 13.4163 20.3941 13.9822 20.3941Z" fill="black"/>
<path class="dot" d="M13.9822 5.15583C14.5481 5.15583 15.0069 4.69706 15.0069 4.13114C15.0069 3.56522 14.5481 3.10645 13.9822 3.10645C13.4163 3.10645 12.9575 3.56522 12.9575 4.13114C12.9575 4.69706 13.4163 5.15583 13.9822 5.15583Z" fill="black"/>
<path class="dot" d="M13.9822 10.2149C14.5481 10.2149 15.0069 9.75615 15.0069 9.19022C15.0069 8.6243 14.5481 8.16553 13.9822 8.16553C13.4163 8.16553 12.9575 8.6243 12.9575 9.19022C12.9575 9.75615 13.4163 10.2149 13.9822 10.2149Z" fill="black"/>
<path class="dot" d="M13.9822 15.3038C14.5481 15.3038 15.0069 14.845 15.0069 14.2791C15.0069 13.7132 14.5481 13.2544 13.9822 13.2544C13.4163 13.2544 12.9575 13.7132 12.9575 14.2791C12.9575 14.845 13.4163 15.3038 13.9822 15.3038Z" fill="black"/>
<path class="dot" d="M13.9822 20.3941C14.5481 20.3941 15.0069 19.9353 15.0069 19.3694C15.0069 18.8035 14.5481 18.3447 13.9822 18.3447C13.4163 18.3447 12.9575 18.8035 12.9575 19.3694C12.9575 19.9353 13.4163 20.3941 13.9822 20.3941Z" fill="black"/>
</g>
<defs>
<clipPath id="clip0_1125_1428">

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.5 KiB

After

Width:  |  Height:  |  Size: 1.5 KiB

Before After
Before After

2
site/blueprints/pages/event.yml
View file

@ -18,6 +18,8 @@ tabs:
Enregistrez (touches ⌘ / ctrl + s) et rechargez la page.
when:
isMapadoEvent: true
mapadoSlug:
type: hidden
duration:
label: Durée
type: text

1
site/config/hooks/update-mapado-event.php
View file

@ -60,6 +60,7 @@ return function($newPage, $oldPage) {
}
$newPage->update([
"mapadoSlug" => $mapadoEvent->slug,
"remoteDuration" => $duration,
"remoteSessions" => $sessionsToSave
]);

1
site/config/routes/month-dates.php
View file

@ -107,6 +107,7 @@ return [
}
}
$event->update([
"mapadoSlug" => $mapadoEvent->slug,
"remoteDuration" => $duration,
"remoteSessions" => $sessionsToSave
]);

6
site/snippets/event-card.php
View file

@ -3,10 +3,12 @@
<div class="event-card__infos">
<div>
<h5><?= $event->title() ?></h5>
<?= svg('assets/images/icons/ticket.svg') ?>
<?php if ($event->isMapadoEvent() == 'true'): ?>
<?php snippet('ticket', ['link' => 'https://cdn-besancon.mapado.com/event/' . $event->mapadoSlug()]) ?>
<?php endif ?>
</div>
<div>
<p class="event-card__authors"><?= $event->authors() ?></p>
<div class="event-card__authors"><?= $event->authors() ?></div>
<p><?= $event->schedule() ?></p>
</div>
</div>

3
site/snippets/ticket.php Normal file
View file

@ -0,0 +1,3 @@
<a class="ticket" href="<?= $link ?>" target="_blank" title="Aller à la billetterie">
<?= svg('assets/images/icons/ticket.svg') ?>
</a>