Skip to content

Commit

Permalink
Add photos
Browse files Browse the repository at this point in the history
  • Loading branch information
@lpil
lpil committed Apr 2, 2024
1 parent 66a6421 commit 5fe4c88
Show file tree
Hide file tree
Showing 10 changed files with 161 additions and 100 deletions.
36 changes: 36 additions & 0 deletions priv/static/assets/index.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -60,6 +60,14 @@ h1 {
margin-bottom: var(--space-xl);
}

hgroup > * {
margin: var(--space);
}

.center {
text-align: center;
}

.content {
margin: auto;
width: 700px;
Expand Down Expand Up @@ -204,3 +212,31 @@ th {
display: inline-block;
margin: 0 var(--space-s);
}

.image-grid {
display: flex;
flex-wrap: wrap;
justify-content: center;
margin: var(--space-l) -5px; /* Negative margin to counteract spacing */
}

.image-grid a {
flex: 1 0 240px;
margin: 5px;
box-sizing: border-box;
}

.image-grid img {
max-width: 100%;
height: auto;
max-height: 200px;
width: 100%;
display: block;
object-fit: cover;
}

@media (max-width: 600px) {
.image-grid a {
flex: 1 0 200px;
}
}
Binary file added priv/static/photos/belltent.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added priv/static/photos/boat.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added priv/static/photos/entrance.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added priv/static/photos/firepit.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added priv/static/photos/flag.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added priv/static/photos/roundhouse.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added priv/static/photos/tea.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added priv/static/photos/tipi.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
225 changes: 125 additions & 100 deletions src/puck/web/event.gleam
View file
Original file line number Diff line number Diff line change
Expand Up @@ -337,133 +337,146 @@ fn attendance_form(ctx: Context) -> Response {
}

fn attendance_html(ctx: Context) -> html.Node(a) {
html.main([Attr("role", "main"), attrs.class("content")], [
web.flamingo(),
html.h1_text([], "Midsummer Night's Tea Party 2024"),
html.h2_text([], "What is it?"),
p(
"Midsummer is a delightful little festival in a wonderful wooded
html.main([Attr("role", "main")], [
html.div([attrs.class("content")], [
web.flamingo(),
html.Element("hgroup", [], [
html.h1_text([], "Midsummer Night's Tea Party 2024"),
html.p_text([attrs.class("center")], "Welcome, friend!"),
]),
]),
image_grid([
"entrance", "firepit", "roundhouse", "tea", "tipi", "flag", "belltent",
"boat",
]),
html.div([attrs.class("content")], [
html.h2_text([], "What is it?"),
p(
"Midsummer is a delightful little festival in a wonderful wooded
location. Expect fun and joy with a delightful group of people, and
luxuries you might not expect from a little festival, such as communal
hot meals and hot showers.
If you're here you should know someone who has been before, so ask
them!",
),
html.h2_text([], "When is it?"),
p("5pm Thursday the 6th June to 10am Monday the 10th June"),
html.h2_text([], "Where is it?"),
p(
"A wonderful little woodland festival site, 20 minutes drive from King's
),
html.h2_text([], "When is it?"),
p("5pm Thursday the 6th June to 10am Monday the 10th June"),
html.h2_text([], "Where is it?"),
p(
"A wonderful little woodland festival site, 20 minutes drive from King's
Lynn in Norfolk.",
),
html.h2_text([], "How much does it cost?"),
p(
"This is a collaborative event where people contribute what they can
),
html.h2_text([], "How much does it cost?"),
p(
"This is a collaborative event where people contribute what they can
afford. We don't make any money off this event. Please contribute what
you can.
Recommended contributions:",
),
costs_table(),
p(
"If you cannot afford this much please get in touch. No one is excluded
),
costs_table(),
p(
"If you cannot afford this much please get in touch. No one is excluded
from Midsummer.",
),
html.h2_text([], "How many people will there be?"),
p("We are aiming for 100 people."),
html.h2_text([], "Will meals be included?"),
p(
"Yes! We will be providing the breakfast buffet, and a delicious hot
),
html.h2_text([], "How many people will there be?"),
p("We are aiming for 100 people."),
html.h2_text([], "Will meals be included?"),
p(
"Yes! We will be providing the breakfast buffet, and a delicious hot
dinner on Friday, Saturday, and Sunday.",
),
p(
"We are hoping to do lunch too, just so long as we can get enough
),
p(
"We are hoping to do lunch too, just so long as we can get enough
kitchen volunteers.",
),
html.h2_text([], "What facilities are there on site?"),
p(
"There are flushing toilets, running water, hot showers, and a dreamy
),
html.h2_text([], "What facilities are there on site?"),
p(
"There are flushing toilets, running water, hot showers, and a dreamy
outdoor bath. There is no mains electricity and the kitchen cannot be
used by people other than kitchen crew.",
),
html.h2_text([], "Where will people be sleeping?"),
p(
"Most people will be camping (so bring your tent), but there are a
),
html.h2_text([], "Where will people be sleeping?"),
p(
"Most people will be camping (so bring your tent), but there are a
limited number of sleeping structures. These structures will be
allocated with priority going to people with accessibility
requirements.",
),
html.h2_text([], "Can I refund or sell my ticket?"),
p(
"Tickets can not be sold for safety reasons. We need to know who
),
html.h2_text([], "Can I refund or sell my ticket?"),
p(
"Tickets can not be sold for safety reasons. We need to know who
everyone is on site, any unexpected guests will be asked to leave. If we
get enough contributions to cover our costs then we be able to offer
refunds.",
),
html.h2_text([], "Can I come?"),
html.p([], [
html.Text("Yes! So long as you are with someone who has attended before."),
html.ol([], [
html.li_text(
[],
"You submit your details using the form on the next page.",
),
html.li_text(
[],
"We give you a reference number and bank details on the next page.",
),
html.li_text([], "You make a bank transfer to us with these details."),
html.li_text(
[],
"We send you an email confirmation and get everything ready.",
),
html.li_text([], "We all have a delightful time in the woods ✨"),
]),
),
html.h2_text([], "Can I come?"),
html.p([], [
html.Text("If you've any questions before or after payment "),
html.a_text(
[attrs.href("mailto:" <> ctx.config.help_email)],
"email us",
html.Text(
"Yes! So long as you are with someone who has attended before.",
),
html.Text(" and we'll help you out."),
]),
]),
html.div([attrs.class("heart-rule")], [html.Text("Alright, here we go")]),
case ctx.current_user {
Some(_) ->
html.div([attrs.class("center form-group")], [
html.ol([], [
html.li_text(
[],
"You submit your details using the form on the next page.",
),
html.li_text(
[],
"We give you a reference number and bank details on the next page.",
),
html.li_text([], "You make a bank transfer to us with these details."),
html.li_text(
[],
"We send you an email confirmation and get everything ready.",
),
html.li_text([], "We all have a delightful time in the woods ✨"),
]),
html.p([], [
html.Text("If you've any questions before or after payment "),
html.a_text(
[attrs.class("button"), attrs.href("/")],
"Continue to your account",
[attrs.href("mailto:" <> ctx.config.help_email)],
"email us",
),
])
None ->
html.form(
[
attrs.class("attendee-form"),
attrs.action("/sign-up/" <> ctx.config.attend_secret),
Attr("method", "post"),
Attr("onsubmit", "this.disable = true"),
],
[
web.form_group(
"What's your name?",
web.text_input("name", [Attr("required", "")]),
html.Text(" and we'll help you out."),
]),
]),
html.div([attrs.class("heart-rule")], [html.Text("Alright, here we go")]),
case ctx.current_user {
Some(_) ->
html.div([attrs.class("center form-group")], [
html.a_text(
[attrs.class("button"), attrs.href("/")],
"Continue to your account",
),
web.form_group(
"What's your email?",
div([
p(
"We will use this to send you an email with additional
])
None ->
html.form(
[
attrs.class("attendee-form"),
attrs.action("/sign-up/" <> ctx.config.attend_secret),
Attr("method", "post"),
Attr("onsubmit", "this.disable = true"),
],
[
web.form_group(
"What's your name?",
web.text_input("name", [Attr("required", "")]),
),
web.form_group(
"What's your email?",
div([
p(
"We will use this to send you an email with additional
information closer to the date. Your email will be viewable
by the organisers and will not be shared with anyone else.",
),
web.email_input("email", []),
]),
),
web.submit_input_group("Let's go"),
],
)
},
),
web.email_input("email", []),
]),
),
web.submit_input_group("Let's go"),
],
)
},
]),
])
}

Expand Down Expand Up @@ -503,3 +516,15 @@ fn slug(text: String) {
|> list.filter(string.contains("abcdefghijklmnopqrstuvwxyz-", _))
|> string.concat
}

fn image_grid(images: List(String)) -> html.Node(a) {
html.div(
[attrs.class("image-grid")],
list.map(images, fn(image) {
let image = "/photos/" <> image <> ".jpg"
html.a([attrs.href(image), Attr("target", "_blank")], [
html.img([attrs.src(image)]),
])
}),
)
}

0 comments on commit 5fe4c88

Please sign in to comment.