Add upcoming section
This commit is contained in:
parent
bcd86c1ebe
commit
af606d3188
10 changed files with 172 additions and 105 deletions
|
|
@ -54,7 +54,7 @@ a {
|
||||||
color: #fff;
|
color: #fff;
|
||||||
font-family: lexend, sans-serif;
|
font-family: lexend, sans-serif;
|
||||||
font-optical-sizing: auto;
|
font-optical-sizing: auto;
|
||||||
font-weight: 500;
|
font-weight: 600;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
font-size: 24px;
|
font-size: 24px;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
|
@ -222,6 +222,8 @@ main {
|
||||||
margin: 3.8em auto;
|
margin: 3.8em auto;
|
||||||
max-width: 1000px;
|
max-width: 1000px;
|
||||||
padding: 0 4em;
|
padding: 0 4em;
|
||||||
|
display: grid;
|
||||||
|
gap: 40px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.concerts {
|
.concerts {
|
||||||
|
|
@ -233,12 +235,11 @@ main {
|
||||||
}
|
}
|
||||||
|
|
||||||
.concert-entry {
|
.concert-entry {
|
||||||
margin: 0.8em 0;
|
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
display: flex;
|
display: flex;
|
||||||
gap: 1em;
|
gap: 1em;
|
||||||
border: 2px #000 solid;
|
box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
|
||||||
border-radius: 20px;
|
border-radius: 15px;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
}
|
}
|
||||||
|
|
@ -257,7 +258,10 @@ main {
|
||||||
}
|
}
|
||||||
|
|
||||||
.concert-overview {
|
.concert-overview {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
flex-grow: 8;
|
flex-grow: 8;
|
||||||
|
padding: 0 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.concert-overview > h2,
|
.concert-overview > h2,
|
||||||
|
|
@ -269,25 +273,45 @@ main {
|
||||||
min-height: 5.5em;
|
min-height: 5.5em;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.separator {
|
||||||
|
overflow: hidden;
|
||||||
|
width: 90%;
|
||||||
|
height: 1px;
|
||||||
|
align-self: center;
|
||||||
|
margin: 20px 0;
|
||||||
|
}
|
||||||
|
|
||||||
.concert-buttons {
|
.concert-buttons {
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 10px;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
flex-direction: row;
|
||||||
flex-direction: column;
|
justify-content: space-evenly;
|
||||||
gap: 1em;
|
|
||||||
flex-grow: 1;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.concert-button {
|
.concert-button {
|
||||||
padding: 10px;
|
background-color: transparent;
|
||||||
border: 1px #000 solid;
|
border: none;
|
||||||
border-radius: 5px;
|
color: #777;
|
||||||
background-color: #f3e2c8;
|
margin: 0 5px 0 5px;
|
||||||
text-align: center;
|
}
|
||||||
text-decoration: none;
|
|
||||||
font-family: lexend, sans-serif;
|
.concert-button > span {
|
||||||
font-weight: 350;
|
text-decoration: underline;
|
||||||
font-size: 18px;
|
font-weight: bold;
|
||||||
color: #000;
|
}
|
||||||
|
|
||||||
|
.upcoming {
|
||||||
|
background-color: #fff;
|
||||||
|
box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
|
||||||
|
border-radius: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.upcoming-entry {
|
||||||
|
margin-left: 20px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 750px) {
|
@media (max-width: 750px) {
|
||||||
|
|
@ -322,18 +346,12 @@ main {
|
||||||
grid-template-columns: 3fr 8fr;
|
grid-template-columns: 3fr 8fr;
|
||||||
}
|
}
|
||||||
|
|
||||||
.concert-date {
|
.concert-entry-small .concert-date {
|
||||||
color: #777;
|
color: #777;
|
||||||
font-size: 1.1em;
|
font-size: 0.8em;
|
||||||
margin: 15px 0 15px 0;
|
margin: 15px 0 15px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.separator {
|
|
||||||
overflow: hidden;
|
|
||||||
width: 90%;
|
|
||||||
height: 1px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.concert-cover {
|
.concert-cover {
|
||||||
margin-top: 25px;
|
margin-top: 25px;
|
||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
|
|
@ -373,6 +391,10 @@ main {
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.upcoming h2 {
|
||||||
|
font-size: 1.3em;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
footer {
|
footer {
|
||||||
|
|
|
||||||
|
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 15 KiB |
|
|
@ -1,11 +0,0 @@
|
||||||
---
|
|
||||||
title: "Second post"
|
|
||||||
ConcertDate: "2026-01-08T18:00:00"
|
|
||||||
Summary: "I'm a summary"
|
|
||||||
Description: "I'm a desciption"
|
|
||||||
TicketsLink: "https://helloasso.com"
|
|
||||||
---
|
|
||||||
|
|
||||||
This line is from `content/secpost.md`.
|
|
||||||
|
|
||||||
[Go to home](/)
|
|
||||||
8
content/upcoming/2.md
Normal file
8
content/upcoming/2.md
Normal file
|
|
@ -0,0 +1,8 @@
|
||||||
|
---
|
||||||
|
title: "Fabien Parisato"
|
||||||
|
ConcertDate: "2026-01-11"
|
||||||
|
Summary: ""
|
||||||
|
Description: ""
|
||||||
|
TicketsLink: ""
|
||||||
|
draft: true
|
||||||
|
---
|
||||||
8
content/upcoming/3.md
Normal file
8
content/upcoming/3.md
Normal file
|
|
@ -0,0 +1,8 @@
|
||||||
|
---
|
||||||
|
title: "Concert des professeurs du conservatoire de Grasse"
|
||||||
|
ConcertDate: "2026-02-01"
|
||||||
|
Summary: ""
|
||||||
|
Description: ""
|
||||||
|
TicketsLink: ""
|
||||||
|
draft: true
|
||||||
|
---
|
||||||
8
content/upcoming/4.md
Normal file
8
content/upcoming/4.md
Normal file
|
|
@ -0,0 +1,8 @@
|
||||||
|
---
|
||||||
|
title: "Le reniement de Pierre par le Camera Apolonia"
|
||||||
|
ConcertDate: "2026-03-01"
|
||||||
|
Summary: ""
|
||||||
|
Description: "Mathieu Pereigne MA Charpentier"
|
||||||
|
TicketsLink: ""
|
||||||
|
draft: true
|
||||||
|
---
|
||||||
|
|
@ -1,72 +1,11 @@
|
||||||
{{ define "main" }}
|
{{ define "main" }}
|
||||||
<h2>Actualités</h2>
|
<div>
|
||||||
<div class="concerts">
|
<h2>Programme</h2>
|
||||||
{{ range where site.RegularPages "Section" "event" }}
|
{{ partial "events/program.html" . }}
|
||||||
<div class="concert-entry">
|
|
||||||
<p class="concert-date">
|
|
||||||
{{ $t := time.AsTime .Params.ConcertDate }}
|
|
||||||
{{ $format := "Monday 2 Jan 2006 15h04" }}
|
|
||||||
{{ time.Format $format $t | humanize }}
|
|
||||||
</p>
|
|
||||||
<div class="concert-cover">
|
|
||||||
{{ with .Resources.GetMatch "cover.*" }}
|
|
||||||
<img
|
|
||||||
src="{{ .RelPermalink }}"
|
|
||||||
width="{{ .Width }}"
|
|
||||||
height="{{ .Height }}"
|
|
||||||
alt="Concert cover"
|
|
||||||
/>
|
|
||||||
{{ end }}
|
|
||||||
</div>
|
|
||||||
<div class="concert-overview">
|
|
||||||
<h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2>
|
|
||||||
<h3>{{ .Summary }}</h3>
|
|
||||||
<h4>{{ .Description }}</h4>
|
|
||||||
</div>
|
|
||||||
<div class="concert-buttons">
|
|
||||||
<a class="concert-button" href="{{ .Params.TicketsLink }}"
|
|
||||||
>Billets</a
|
|
||||||
>
|
|
||||||
<a class="concert-button" href="{{ .RelPermalink }}"
|
|
||||||
>Infos</a
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="concert-entry-small">
|
<div>
|
||||||
<h4 class="concert-date">{{ .Params.ConcertDate }}</h4>
|
<h2>Évènements à venir</h2>
|
||||||
<img src="bar.png" class="separator" />
|
{{ partial "events/upcoming.html" . }}
|
||||||
<div class="concert-entry-container">
|
|
||||||
<div class="concert-cover">
|
|
||||||
{{ with .Resources.GetMatch "cover.*" }}
|
|
||||||
<img
|
|
||||||
src="{{ .RelPermalink }}"
|
|
||||||
width="{{ .Width }}"
|
|
||||||
height="{{ .Height }}"
|
|
||||||
alt="Concert cover"
|
|
||||||
/>
|
|
||||||
{{ end }}
|
|
||||||
</div>
|
|
||||||
<div class="concert-overview">
|
|
||||||
<a href="{{ .RelPermalink }}"
|
|
||||||
><h3>{{ .LinkTitle }}</h3></a
|
|
||||||
>
|
|
||||||
<h4>{{ .Description }}</h4>
|
|
||||||
<p>{{ .Summary }}</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<img src="bar.png" class="separator" />
|
|
||||||
<div class="concert-buttons">
|
|
||||||
<a class="concert-button" href="{{ .Params.TicketsLink }}">
|
|
||||||
<img src="billets.png" />
|
|
||||||
<span>Billets</span>
|
|
||||||
</a>
|
|
||||||
<a class="concert-button" href="{{ .RelPermalink }}">
|
|
||||||
<img src="info.png" />
|
|
||||||
<span>Infos</span>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{{ end }}
|
|
||||||
</div>
|
</div>
|
||||||
{{ end }}
|
{{ end }}
|
||||||
|
|
|
||||||
76
layouts/partials/events/program.html
Normal file
76
layouts/partials/events/program.html
Normal file
|
|
@ -0,0 +1,76 @@
|
||||||
|
<div class="concerts">
|
||||||
|
{{ $sites := where site.RegularPages "Section" "event" }}
|
||||||
|
{{ range sort $sites ".Params.ConcertDate" }}
|
||||||
|
<div class="concert-entry">
|
||||||
|
<p class="concert-date">
|
||||||
|
{{ $t := time.AsTime .Params.ConcertDate }}
|
||||||
|
{{ $format := "Monday 2 Jan 2006 15h04" }}
|
||||||
|
{{ time.Format $format $t | humanize }}
|
||||||
|
</p>
|
||||||
|
<div class="concert-cover">
|
||||||
|
{{ with .Resources.GetMatch "cover.*" }}
|
||||||
|
<img
|
||||||
|
src="{{ .RelPermalink }}"
|
||||||
|
width="{{ .Width }}"
|
||||||
|
height="{{ .Height }}"
|
||||||
|
alt="Concert cover"
|
||||||
|
/>
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
<div class="concert-overview">
|
||||||
|
<h2><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></h2>
|
||||||
|
<h3>{{ .Summary }}</h3>
|
||||||
|
<h4>{{ .Description }}</h4>
|
||||||
|
|
||||||
|
<img src="bar.png" class="separator" />
|
||||||
|
<div class="concert-buttons">
|
||||||
|
<a class="concert-button" href="{{ .Params.TicketsLink }}">
|
||||||
|
<img src="billets.png" />
|
||||||
|
<span>Billets</span>
|
||||||
|
</a>
|
||||||
|
<a class="concert-button" href="{{ .RelPermalink }}">
|
||||||
|
<img src="info.png" />
|
||||||
|
<span>Infos</span>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="concert-entry-small">
|
||||||
|
<h4 class="concert-date">
|
||||||
|
{{ $t := time.AsTime .Params.ConcertDate }}
|
||||||
|
{{ $format := "Monday 2 Jan 2006 15h04" }}
|
||||||
|
{{ time.Format $format $t | humanize }}
|
||||||
|
</h4>
|
||||||
|
<img src="bar.png" class="separator" />
|
||||||
|
<div class="concert-entry-container">
|
||||||
|
<div class="concert-cover">
|
||||||
|
{{ with .Resources.GetMatch "cover.*" }}
|
||||||
|
<img
|
||||||
|
src="{{ .RelPermalink }}"
|
||||||
|
width="{{ .Width }}"
|
||||||
|
height="{{ .Height }}"
|
||||||
|
alt="Concert cover"
|
||||||
|
/>
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
<div class="concert-overview">
|
||||||
|
<a href="{{ .RelPermalink }}"><h3>{{ .LinkTitle }}</h3></a>
|
||||||
|
<h4>{{ .Description }}</h4>
|
||||||
|
<p>{{ .Summary }}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<img src="bar.png" class="separator" />
|
||||||
|
<div class="concert-buttons">
|
||||||
|
<a class="concert-button" href="{{ .Params.TicketsLink }}">
|
||||||
|
<img src="billets.png" />
|
||||||
|
<span>Billets</span>
|
||||||
|
</a>
|
||||||
|
<a class="concert-button" href="{{ .RelPermalink }}">
|
||||||
|
<img src="info.png" />
|
||||||
|
<span>Infos</span>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
17
layouts/partials/events/upcoming.html
Normal file
17
layouts/partials/events/upcoming.html
Normal file
|
|
@ -0,0 +1,17 @@
|
||||||
|
<div class="upcoming">
|
||||||
|
{{ $sites := where site.RegularPages "Section" "upcoming" }}
|
||||||
|
{{ range sort $sites ".Params.ConcertDate" }}
|
||||||
|
<div class="upcoming-entry">
|
||||||
|
<p class="concert-date">
|
||||||
|
{{ $t := time.AsTime .Params.ConcertDate }}
|
||||||
|
{{ $format1 := "Monday 2 Jan 2006" }}
|
||||||
|
{{ $format2 := "Jan 2006" }}
|
||||||
|
|
||||||
|
|
||||||
|
<!-- TODO: Try format1 -->
|
||||||
|
{{ time.Format $format2 $t | humanize }}
|
||||||
|
</p>
|
||||||
|
<h2>{{ .LinkTitle }}</h2>
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
Loading…
Add table
Add a link
Reference in a new issue