Skip to content

Commit

Permalink
Add files via upload
Browse files Browse the repository at this point in the history
  • Loading branch information
@WeLeBro
WeLeBro authored Sep 26, 2024
1 parent ec5d5e9 commit 5c5f2cd
Show file tree
Hide file tree
Showing 3 changed files with 82 additions and 34 deletions.
9 changes: 4 additions & 5 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@
Menu
</button>

<img src="./images/search.svg" alt="search icon"></img>
<img src="./images/search.svg" alt="search icon">

<a href="https://auth.paradiso.nl/authorize?response_type=id_token%20token&response_mode=query&prompt=login&redirect_uri=https://www.paradiso.nl/en/account/profile&client_id=paradiso&state=3kTW3arfPQJ&ui_locales=en">My Paradiso</a>
</section>
Expand Down Expand Up @@ -266,7 +266,7 @@ <h3>
<li class="top">
<img src="./images/aarde-aan-daan.webp" alt="Portrait of two men and two women with crystals on their face looking away from the camera sitting in front of a pink background">

<div class="gradient"></div>"
<div class="gradient"></div>

<h3>Aarde aan Daan</h3>

Expand All @@ -277,7 +277,7 @@ <h4>Start 19:30</h4>
<li class="top">
<img src="./images/junglebynight.webp" alt="Group of men and their instruments in front of a dark wall">

<div class="gradient"></div>"
<div class="gradient"></div>

<section>
<p>Sold out</p>
Expand All @@ -292,7 +292,7 @@ <h4>Starts 20:30</h4>
<li class="top">
<img src="./images/sadie.webp" alt="Sepia image of a woman with dark eye-makeup and black hair">

<div class="gradient"></div>"
<div class="gradient"></div>

<section>
<p>Sold out</p>
Expand Down Expand Up @@ -351,7 +351,6 @@ <h4>Sadie Jean</h4>
<p>Singer-songwriter makes honest pop ...</p>
</section>
</section>
</section>

<section class="agenda">
<h3>Fri 13 Sep</h3>
Expand Down
79 changes: 64 additions & 15 deletions style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -193,13 +193,13 @@ li.top.active {
}

a.top {
color: inherit; /* Inherit color from parent */
text-decoration: none; /* Remove underline */
color: inherit;
text-decoration: none;
}

.gradient {
grid-row: 2 / 6;
grid-column: 1 / -1;
grid-column: 1 / 1;
background: rgb(0,0,0);
background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 12%, rgba(0,0,0,0) 63%);
}
Expand Down Expand Up @@ -302,6 +302,19 @@ hr {

/* ARTIST HEADER */

.artist-page > header > a {
display: flex;
z-index: 1;
position: absolute;
right: 0;
margin: 15px;
}

.artist-page > header > a > img {
width: 2.5em;
height: 2.5em;
}

.artist-page {
background-color: white;
color: black;
Expand All @@ -319,18 +332,18 @@ hr {
height: 400px;
width: 100%;
grid-template-rows: auto auto 80px;
position: relative; /* Add this to position h1 absolutely */
position: relative;
overflow: hidden;
}

.artist-header img {
justify-self: center; /* Center the image horizontally */
align-self: center; /* Center the image vertically */
justify-self: center;
align-self: center;
object-fit: cover;
grid-row: 1 / 4;
grid-column: 1 / -1;
width: 100%; /* Ensure the image stays inside the section */
height: 100%; /* Ensure the image fills the section */
width: 100%;
height: 100%;
overflow-x: hidden;
}

Expand All @@ -351,8 +364,8 @@ hr {
margin-top: 2px;
letter-spacing: -.9px;
grid-row: 3;
position: absolute; /* Position h1 absolutely */
width: 100%; /* Ensure h1 spans the full width */
position: absolute;
width: 100%;
}

.artist-page h2 {
Expand Down Expand Up @@ -388,6 +401,8 @@ hr {
height: 1.5em;
}

/* ARTIST PAGE */

p.disclaimer {
margin: 20px 15px;
color: #a5a5a5;
Expand Down Expand Up @@ -494,14 +509,44 @@ iframe:last-of-type {

.ssj-lineup {
display: flex;
margin: 15px 0px 50px 15px;
overflow-x: scroll;
}

.top2 {
display: grid;
width: 257px;
height: 320.75px;
grid-template-rows: 1fr auto auto;
scroll-snap-align: center;
transition: transform 0.3s ease;
overflow: hidden;
margin-right: 20px;
}

.ssj-lineup img {
width: 200px;
height: 200px;
.top2 img {
height: 100%;
width: auto;
object-fit: cover;
margin: 0 10px;
grid-row: 1 / -1;
grid-column: 1 / -1;
}

.top2 h4 {
margin: 0px 20px 5px 10px;
color: white;
font-size: 20px;
grid-row: 2;
grid-column: 1 / -1;
}

.top2 h3 {
margin: 0px 20px 5px 10px;
font-family: Paradiso-Bold;
color: white;
font-size: 20px;
grid-row: 3;
grid-column: 1;
}

.howtoget img {
Expand All @@ -511,6 +556,7 @@ iframe:last-of-type {
}

.howtoget a {
/* how do I get a margin on the top */
margin-left: 15px;
color: black;
text-decoration: none;
Expand All @@ -528,4 +574,7 @@ footer a {
img#refresh {
width: 16px;
margin-right: 10px;
}
}

/* menu */

28 changes: 14 additions & 14 deletions thee-sacred-souls.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
<body class="artist-page">

<header>
<a href="index.html"></a>
<a href="index.html"><img src="./images/icon-close.svg" alt="close button"></a>
</header>

<main>
Expand All @@ -32,7 +32,7 @@ <h3>Waiting List</h3>
<h4>Ticket €34.30</h4>
</div>

<img src="./images/arrow-r.svg"></img>
<img src="./images/arrow-r.svg" alt="arrow pointing to the right">
</a>
</section>

Expand All @@ -53,14 +53,14 @@ <h3>Doors: 19:00, Support: 13:30, Main programme: 20:30</h3>
</section>

<section class="limited">
<img src="./images/moon.svg" alt="reversed moon icon"></img>
<img src="./images/moon.svg" alt="reversed moon icon">
<p>Limited tickets per person</p>
</section>

<section class="reg-text">
<p>Thee Sacred Souls bestaat uit drummer Alex Garcia, bassist Sal Samano en zanger Josh Lane, die in 2019 samen een band vormden en binnen een jaar een platencontract in de wacht sleepten bij het iconische funk- en soullabel Daptone Records, ooit thuisbasis van onder andere Sharon Jones & The Dap-Kings en Charles Bradley. Bij Thee Sacred Souls draait alles om het brengen van een zo mooi en authentiek mogelijk geluid; om deze reden kiest het trio er voor om al hun muziek analoog op te nemen in plaats van digitaal. Hun eerste singles werden ruim tien miljoen keer gestreamd, en trokken de aandacht van mainstream media zoals Rolling Stone maar ook van artiesten zoals Timbaland en Gary Clark Jr. Met lyrische recensies en een groeiende fanbase lijkt de aandacht voor deze jonge band uit San Diego de komende jaren als een lopend vuurtje te zullen verspreiden. Op 10 september speelt de band in de Tolhuistuin, waar de kaarten binnen een mum van tijd waren uitverkocht. Gelukkig krijgen degenen die achter het net visten een nieuwe kans: op 15 februari keren ze terug naar Amsterdam, ditmaal voor een optreden in Paradiso.</p>

<a href="https://www.facebook.com/events/502869522486706" id="facebook">View event on Facebook <img src="./images/arrow-r.svg" alt="arrow that points to the right"></img></a>
<a href="https://www.facebook.com/events/502869522486706" id="facebook">View event on Facebook <img src="./images/arrow-r.svg" alt="arrow that points to the right"></a>
</section>

<section>
Expand All @@ -69,11 +69,11 @@ <h2>Line-up</h2>
<h3 id="mainhall">Main Hall</h3>

<section class="about">
<img src="./images/moon.svg" alt="reversed moon icon"></img>
<img src="./images/moon.svg" alt="reversed moon icon">
<p>Thee Sacred Souls</p>
</section>

<iframe style="border-radius:12px" src="https://open.spotify.com/embed/artist/0oK5D6uPhGu4Jk2dbZfodU?utm_source=generator" width="100%" height="352" frameBorder="0" allowfullscreen="" allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture" loading="lazy"></iframe>
<iframe style="border-radius:12px" src="https://open.spotify.com/embed/artist/0oK5D6uPhGu4Jk2dbZfodU?utm_source=generator" width="100" height="352" frameBorder="0" allowfullscreen="" allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture" loading="lazy"></iframe>

<iframe width="560" height="315" src="https://www.youtube.com/embed/-4J-f5lkCLo?si=P91GZ73NZ_0DQraf" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>

Expand All @@ -94,39 +94,39 @@ <h2>Super-Sonic Jazz</h2>

<p class="reg-text">Super-Sonic Jazz is an Amsterdam-based non-profit platform for exciting artists who move within the universe of jazz. We release music on our independent record label, and in collaboration with Paradiso, we organize concerts, jams, and the annual Super-Sonic Jazz Festival. This year Super-Sonic Jazz Festival 2024 will take place from Wednesday, November 13th to Sunday, November 17th, 2024, at Paradiso, de Duif and the Vondelkerk in Amsterdam.</p>

<img src="./images/SSJ-logo-banner.webp" alt="Super-Sonic Jazz logo."></img>
<img src="./images/SSJ-logo-banner.webp" alt="Super-Sonic Jazz logo.">

<img src="./images/ssj-scheme.webp" alt="Super-Sonic Jazz Festival 2024 poster."></img>
<img src="./images/ssj-scheme.webp" alt="Super-Sonic Jazz Festival 2024 poster.">

</section>

<section class="ssj-lineup">
<ul>
<li>
<li class="top2">
<img src="./images/b.cool-aid.webp" alt="Two men standing in front of a white wall, one with glasses and a colorful jacket looking straight in the camera and the other one looking away with a colorful hat covering his eyes">

<h4>15 Nov 2024</h4>

<h3>B. Cool-Aid, Venna and more · Super-Sonic Jazz Festival 2024</h3>
</li>

<li>
<li class="top2">
<img src="./images/landeradriaan.webp" alt="Two men looking away from the camera">

<h4>17 Nov 2024</h4>

<h3>Lander & Adriaan, Super-Sonic Jam and more · Super-Sonic Jazz Festival 2024</h3>
</li>

<li>
<li class="top2">
<img src="./images/butcherbrown.webp" alt="Woman in a glittery 70s disco outfit with big matching earrings and a matching headband holding up a saxophone">

<h4>16 Nov 2024</h4>

<h3>Butcher Brown, Lakecia Benjamin, Emma-Jean Thackray and more · Super-Sonic Jazz Festival 2024</h3>
</li>

<li>
<li class="top2">
<img src="./images/brandee-younger.webp" alt="Group of young adult standing close together in a launderette">

<h4>14 Nov 2024</h4>
Expand All @@ -141,13 +141,13 @@ <h2>How to get to Paradiso</h2>

<p class="reg-text">Paradiso is on the Weteringschans 6-8 in Amsterdam. That is very close to Leidseplein. From every part of the city there are trams heading towards Leidseplein. From there on out you can walk to Paradiso. Free and secured underground bike parking is available on the opposite side of Paradiso. Travelling by car is difficult, since there are only a few busy parking lots nearby. </p>

<a href="https://www.google.com/maps/search/?api=1&query=Paradiso,18,%20Weteringschans,%20Centrum,%20Amsterdam,%20North%20Holland,%20Netherlands,%201017%20SG,%20Netherlands">Google Maps<img src="./images/arrow-r.svg" alt="arrow that points to the right"></img></a>
<a href="https://www.google.com/maps/search/?api=1&query=Paradiso,18,%20Weteringschans,%20Centrum,%20Amsterdam,%20North%20Holland,%20Netherlands,%201017%20SG,%20Netherlands">Google Maps<img src="./images/arrow-r.svg" alt="arrow that points to the right"></a>
</section>

</main>

<footer>
<a href="#"><img id="refresh" src="./images/refresh.svg" alt="refresh icon"></img>Bekijk in het Nederlands</a>
<a href="#"><img id="refresh" src="./images/refresh.svg" alt="refresh icon">Bekijk in het Nederlands</a>
</footer>

</body>
Expand Down

0 comments on commit 5c5f2cd

Please sign in to comment.