diff --git a/assets/css/src/callout.css b/assets/css/src/callout.css new file mode 100644 index 0000000..46ff74c --- /dev/null +++ b/assets/css/src/callout.css @@ -0,0 +1,20 @@ +section.callout { + --padding-vertical: var(--space-m); + background-color: var(--color-salmon); + display: flex; + flex-direction: column; + align-items: center; +} + +section.callout h4 { + margin-bottom: 2rem; +} + +section.callout a { + display: flex; + align-items: center; +} + +section.callout .ticket { + margin-right: 1rem; +} diff --git a/assets/css/src/events-grid.css b/assets/css/src/events-grid.css index b211c59..d51fdb7 100644 --- a/assets/css/src/events-grid.css +++ b/assets/css/src/events-grid.css @@ -10,8 +10,8 @@ margin-bottom: calc(var(--space-m) / 2); } -.event-card__infos h5 { - max-width: 95%; +.event-card__infos > div a { + max-width: 85%; } .event-card__infos .ticket { @@ -25,7 +25,3 @@ .event-card__infos > div:first-child { margin-bottom: calc(var(--space-m) / 2); } - -.event-card__infos > div > *:not(h5):last-child { - /* place-self: end; */ -} diff --git a/assets/css/src/footer.css b/assets/css/src/footer.css new file mode 100644 index 0000000..edaace1 --- /dev/null +++ b/assets/css/src/footer.css @@ -0,0 +1,9 @@ +.main-footer { + background-color: var(--color-yellow-fluo); + display: grid; + grid-template-columns: repeat(4, 1fr); +} + +.main-footer p { + margin-bottom: 1rem; +} diff --git a/assets/css/src/generic.css b/assets/css/src/generic.css index 0932752..8042df1 100644 --- a/assets/css/src/generic.css +++ b/assets/css/src/generic.css @@ -29,53 +29,16 @@ body.progress * { object-fit: cover; } -@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); - } +.logo { + font-weight: normal; + transition: opacity 0.2s ease-in-out; + font-size: var(--font-size-h2); } -.ticket { - display: inline-flex; +.logo > * { + display: block; } -.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; +.logo > *:not(:first-child) { + margin-left: 2.4ch; } diff --git a/assets/css/src/nav.css b/assets/css/src/nav.css index 4b33e99..80c9882 100644 --- a/assets/css/src/nav.css +++ b/assets/css/src/nav.css @@ -7,20 +7,6 @@ padding: 1rem; } -.main-nav .logo { - font-weight: normal; - transition: opacity 0.2s ease-in-out; - font-size: var(--font-size-h2); -} - -.main-nav .logo > * { - display: block; -} - -.main-nav .logo > *:not(:first-child) { - margin-left: 2.4ch; -} - .main-nav__right { display: flex; } diff --git a/assets/css/src/reset.css b/assets/css/src/reset.css index b6020a3..4620a36 100644 --- a/assets/css/src/reset.css +++ b/assets/css/src/reset.css @@ -76,8 +76,17 @@ input { ::placeholder { color: #000; opacity: 1; /* Firefox */ + transition: all 0.2s ease-in-out; } ::-ms-input-placeholder { /* Edge 12 -18 */ color: #000; + transition: color 0.2s ease-in-out; +} +:focus::placeholder { + opacity: 0.5; /* Firefox */ +} +::-ms-input-placeholder { + /* Edge 12 -18 */ + color: rgba(0, 0, 0, 125); } diff --git a/assets/css/src/ticket.css b/assets/css/src/ticket.css new file mode 100644 index 0000000..62e6a32 --- /dev/null +++ b/assets/css/src/ticket.css @@ -0,0 +1,58 @@ +@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 { + display: inline-flex; +} + +a:hover .ticket svg, +.ticket:hover svg { + animation: vibrate 0.5s forwards; +} + +.ticket:hover svg path:not(.dot) { + fill: var(--color-salmon); + stroke: var(--color-salmon); +} +a:hover .ticket svg path:not(.dot) { + fill: #fff; + stroke: #fff; +} + +.ticket:hover svg path.dot { + fill: #fff; +} +a:hover .ticket svg path.dot { + fill: var(--color-salmon); +} diff --git a/assets/css/src/vanilla.css b/assets/css/src/vanilla.css index d39aca5..b4c22a3 100644 --- a/assets/css/src/vanilla.css +++ b/assets/css/src/vanilla.css @@ -1,4 +1,5 @@ -section { +section, +footer { padding: var(--padding-vertical) var(--space-m); } picture { diff --git a/assets/css/src/variables.css b/assets/css/src/variables.css index 57b26bd..80ee4ef 100644 --- a/assets/css/src/variables.css +++ b/assets/css/src/variables.css @@ -9,6 +9,7 @@ --font-size-h1: 2.8125rem; --curve-quick-slow: cubic-bezier(0.175, 0.885, 0.32, 1.275); + --padding-vertical: 2rem; --space-m: 4vw; --color-pink: #ed268f; diff --git a/assets/css/style.css b/assets/css/style.css index 66cb6ec..59e24aa 100644 --- a/assets/css/style.css +++ b/assets/css/style.css @@ -6,5 +6,8 @@ @import url("src/nav.css"); @import url("src/hero.css"); @import url("src/calendar-strip.css"); +@import url("src/ticket.css"); @import url("src/events-grid.css"); +@import url("src/callout.css"); @import url("src/newsletter.css"); +@import url("src/footer.css"); diff --git a/assets/images/icons/facebook.svg b/assets/images/icons/facebook.svg new file mode 100644 index 0000000..b3ae80d --- /dev/null +++ b/assets/images/icons/facebook.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/assets/images/icons/instagram.svg b/assets/images/icons/instagram.svg new file mode 100644 index 0000000..c78e400 --- /dev/null +++ b/assets/images/icons/instagram.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + diff --git a/site/config/config.php b/site/config/config.php index 66dfed1..cdcfd79 100644 --- a/site/config/config.php +++ b/site/config/config.php @@ -42,5 +42,6 @@ return [ 'date' => [ 'handler' => 'intl' ], - 'locale' => 'fr_FR.UTF-8' + 'locale' => 'fr_FR.UTF-8', + 'ticketingUrl' => 'https://cdn-besancon.mapado.com/' ]; \ No newline at end of file diff --git a/site/config/hooks/update-mapado-event.php b/site/config/hooks/update-mapado-event.php index ad7ff1f..95d9440 100644 --- a/site/config/hooks/update-mapado-event.php +++ b/site/config/hooks/update-mapado-event.php @@ -45,7 +45,7 @@ return function($newPage, $oldPage) { $startTime = substr($session->startDate, 11, 5); $eventDateId = explode('/', $session->{'@id'}); $eventDateId = $eventDateId[count($eventDateId) - 1]; - $ticketingUrl = 'https://cdn-besancon.mapado.com/event/' . $mapadoEvent->slug . '?eventDate=' . $eventDateId; + $ticketingUrl = option('ticketingUrl') . 'event/' . $mapadoEvent->slug . '?eventDate=' . $eventDateId; if (isset($session->endDate) && !$duration) { $endTime = substr($session->endDate, 11 , 5); diff --git a/site/config/routes/month-dates.php b/site/config/routes/month-dates.php index fd716e3..20b57b4 100644 --- a/site/config/routes/month-dates.php +++ b/site/config/routes/month-dates.php @@ -85,7 +85,7 @@ return [ $startTime = substr($session->startDate, 11, 5); $eventDateId = explode('/', $session->{'@id'}); $eventDateId = $eventDateId[count($eventDateId) - 1]; - $ticketingUrl = 'https://cdn-besancon.mapado.com/event/' . $mapadoEvent->slug . '?eventDate=' . $eventDateId; + $ticketingUrl = option('ticketingUrl') . 'event/' . $mapadoEvent->slug . '?eventDate=' . $eventDateId; if (isset($session->endDate) && !$duration) { $endTime = substr($session->endDate, 11 , 5); diff --git a/site/config/routes/update-mapado-event.php b/site/config/routes/update-mapado-event.php index 95f0142..e9bc046 100644 --- a/site/config/routes/update-mapado-event.php +++ b/site/config/routes/update-mapado-event.php @@ -51,7 +51,7 @@ return [ "day" => $day, "time" => str_replace(':', 'h', $startTime), "duration" => $duration, - "ticketingUrl" => 'https://cdn-besancon.mapado.com/event/' . $mapadoEvent->slug . '?eventDate=' . $eventDateId + "ticketingUrl" => option('ticketingUrl') . 'event/' . $mapadoEvent->slug . '?eventDate=' . $eventDateId ]); $sessionsToSave[] = [ diff --git a/site/snippets/event-card.php b/site/snippets/event-card.php index 54c1726..1833cd0 100644 --- a/site/snippets/event-card.php +++ b/site/snippets/event-card.php @@ -8,7 +8,7 @@
title() ?>
isMapadoEvent() == 'true'): ?> - 'https://cdn-besancon.mapado.com/event/' . $event->mapadoSlug()]) ?> + option('ticketingUrl') . 'event/' . $event->mapadoSlug()]) ?>
diff --git a/site/snippets/footer.php b/site/snippets/footer.php index 691287b..de828c5 100644 --- a/site/snippets/footer.php +++ b/site/snippets/footer.php @@ -1,2 +1,43 @@ + \ No newline at end of file diff --git a/site/snippets/nav.php b/site/snippets/nav.php index 8a25de2..cbb4501 100644 --- a/site/snippets/nav.php +++ b/site/snippets/nav.php @@ -22,9 +22,7 @@ - + option('ticketingUrl')]) ?> diff --git a/site/snippets/ticket.php b/site/snippets/ticket.php index 9e55c88..b532ff1 100644 --- a/site/snippets/ticket.php +++ b/site/snippets/ticket.php @@ -1,3 +1,9 @@ - - - \ No newline at end of file + + + + + +
+ +
+ \ No newline at end of file diff --git a/site/templates/home.php b/site/templates/home.php index 1fccca1..3685cd7 100644 --- a/site/templates/home.php +++ b/site/templates/home.php @@ -30,4 +30,9 @@ $orderedEvents->slice(2, 5)]) ?> +
+

callout() ?>

+ Billetterie +
+ \ No newline at end of file