added embedded eventbrite checkout, altered the display of events

This commit is contained in:
Peter Molnar 2021-09-06 16:56:35 +01:00
parent f5ff4b6456
commit 6cfda2fd3a
2 changed files with 340 additions and 298 deletions

View file

@ -147,7 +147,7 @@
</h3>
<img class="u-photo photo" property="image" src="archery-event-header.jpg" hidden="hidden" />
<div>
<strong>When</strong>:
<strong>When:</strong>
<time class="dt-start" property="startDate" datetime="2021-09-06T19:00:00+01:00">
6<sup>th</sup> September, 2021, 7pm
</time>
@ -157,7 +157,7 @@
</time>
</div>
<div>
<strong>Where</strong>:
<strong>Where:</strong>
<span property="location" typeof="Place" class="p-location">
<span property="name">
Fenners Gallery, Kelsey Kerridge Sports Centre
@ -205,25 +205,26 @@
-- /event template with rdfa and microformats -->
<div class="h-feed">
<div class="h-event" vocab="https://schema.org/" typeof="Event">
<h3 class="p-name" property="name">
Pa-Kua Archery
</h3>
<img class="u-photo photo" property="image" src="archery-event-header.jpg" hidden="hidden" />
<div>
<strong>When</strong>:
<strong>When:</strong>
<time class="dt-start" property="startDate" datetime="2021-10-02T17:00:00+01:00">
2<sup>nd</sup> October, 2021, 5pm
</time>
to
<span class="to">to</span>
<time class="dt-end" property="endDate" datetime="2021-10-02T19:00:00+01:00">
7 pm
</time>
</div>
<div>
<strong>Where</strong>:
<div class="addr">
<strong>Where:</strong>
<span property="location" typeof="Place" class="p-location">
<a href="https://www.kelseykerridge.co.uk/contact/" property="url">
<span property="name">
Fenners Gallery, Kelsey Kerridge Sports Centre
</span>,
@ -238,6 +239,7 @@
CB1 1NA
</span>
</span>
</a>
</span>
</div>
<p class="p-summary" property="description">
@ -289,7 +291,7 @@
</h3>
<img class="u-photo photo" property="image" src="archery-event-header.jpg" hidden="hidden" />
<div>
<strong>When</strong>:
<strong>When:</strong>
<time class="dt-start" property="startDate" datetime="2021-11-06T17:00:00+00:00">
Sat, 6<sup>th</sup> November, 2021, 5pm
</time>
@ -298,9 +300,10 @@
7 pm
</time>
</div>
<div>
<strong>Where</strong>:
<div class="addr">
<strong>Where:</strong>
<span property="location" typeof="Place" class="p-location">
<a href="https://www.kelseykerridge.co.uk/contact/" property="url">
<span property="name">
Fenners Gallery, Kelsey Kerridge Sports Centre
</span>,
@ -315,6 +318,7 @@
CB1 1NA
</span>
</span>
</a>
</span>
</div>
<p class="p-summary" property="description">
@ -365,7 +369,7 @@
</h3>
<img class="u-photo photo" property="image" src="archery-event-header.jpg" hidden="hidden" />
<div>
<strong>When</strong>:
<strong>When:</strong>
<time class="dt-start" property="startDate" datetime="2021-12-04T17:00:00+00:00">
Sat, 4<sup>th</sup> December, 2021, 5pm
</time>
@ -374,9 +378,10 @@
7 pm
</time>
</div>
<div>
<strong>Where</strong>:
<div class="addr">
<strong>Where:</strong>
<span property="location" typeof="Place" class="p-location">
<a href="https://www.kelseykerridge.co.uk/contact/" property="url">
<span property="name">
Fenners Gallery, Kelsey Kerridge Sports Centre
</span>,
@ -391,6 +396,7 @@
CB1 1NA
</span>
</span>
</a>
</span>
</div>
<p class="p-summary" property="description">
@ -442,7 +448,7 @@
</h3>
<img class="u-photo photo" property="image" src="archery-event-header.jpg" hidden="hidden" />
<div>
<strong>When</strong>:
<strong>When:</strong>
<time class="dt-start" property="startDate" datetime="2022-01-08T17:00:00+00:00">
Sat, 8<sup>th</sup> January, 2022, 5pm
</time>
@ -451,9 +457,10 @@
7 pm
</time>
</div>
<div>
<strong>Where</strong>:
<div class="addr">
<strong>Where:</strong>
<span property="location" typeof="Place" class="p-location">
<a href="https://www.kelseykerridge.co.uk/contact/" property="url">
<span property="name">
Fenners Gallery, Kelsey Kerridge Sports Centre
</span>,
@ -468,6 +475,7 @@
CB1 1NA
</span>
</span>
</a>
</span>
</div>
<p class="p-summary" property="description">
@ -511,7 +519,7 @@
<span property="availability" content="https://schema.org/InStock"></span>
</p>
</div>
</div>
<!--
<h3>Monthly classes</h3>
<h3>Weekly classes</h3>
@ -519,7 +527,24 @@
<h2><a id="payments" name="payments">Payments</a></h2>
At the moment payment is handled through event tickets. Please use the links above.
<div id="eventbrite-widget-container-169252373405"></div>
<script src="https://www.eventbrite.co.uk/static/widgets/eb_widgets.js"></script>
<script type="text/javascript">
var exampleCallback = function() {
console.log('Order complete!');
};
window.EBWidgets.createWidget({
// Required
widgetType: 'checkout',
eventId: '169252373405',
iframeContainerId: 'eventbrite-widget-container-169252373405',
// Optional
//iframeContainerHeight: 425, // Widget height in pixels. Defaults to a minimum of 425px if not provided
//onOrderComplete: exampleCallback // Method called when an order has successfully completed
});
</script>
<!--
<h3>Drop-in fees</h3>
<h3>Membership fees</h3>

View file

@ -281,6 +281,23 @@ label.wide {
max-width: 50%;
}
.h-feed {
display: flex;
align-items:baseline;
flex-grow: 1;
flex-wrap: wrap;
justify-content:flex-start;
}
.h-feed .h-event {
max-width: 50%;
padding: 0 1%;
}
.h-event strong, .h-event .p-summary, .h-event .offer {
display: none;
}
@media screen and (max-width: 54em) {
.grid > div {
max-width: 48%;