add stuff for apl nationals
parent
2a6c843a51
commit
8337131830
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
@ -0,0 +1,148 @@
|
|||||||
|
@font-face {
|
||||||
|
src: url('assets/Acumin-RPro.woff');
|
||||||
|
font-family: 'Acumin';
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
src: url('assets/Acumin-BdPro.woff');
|
||||||
|
font-family: 'Acumin';
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn {
|
||||||
|
font-family: $text-font-stack;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nationals {
|
||||||
|
font-family: 'Acumin', sans-serif;
|
||||||
|
line-height: 1.7;
|
||||||
|
letter-spacing: 1px;
|
||||||
|
overflow: hidden;
|
||||||
|
main {
|
||||||
|
font-weight: 500;
|
||||||
|
padding: 120px 0;
|
||||||
|
.bg {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
z-index: -1;
|
||||||
|
width: 100vw;
|
||||||
|
height: 100vh;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.presenting {
|
||||||
|
font-weight: 700;
|
||||||
|
font-size: 16pt;
|
||||||
|
text-transform: uppercase;
|
||||||
|
letter-spacing: 2px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.heading {
|
||||||
|
padding: 50px 0;
|
||||||
|
font-weight: 700;
|
||||||
|
font-size: 16pt;
|
||||||
|
text-transform: uppercase;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.brand {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column-reverse;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
img {
|
||||||
|
margin-top: 50px;
|
||||||
|
display: block;
|
||||||
|
max-width: 750px;
|
||||||
|
width: 100%;
|
||||||
|
&:first-child {
|
||||||
|
max-width: 150px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.psyonix {
|
||||||
|
margin-top: 2em;
|
||||||
|
text-align: center;
|
||||||
|
img {
|
||||||
|
width: 150px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.introp {
|
||||||
|
div {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.poster {
|
||||||
|
width: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
img {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.3);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.ftier {
|
||||||
|
padding-bottom: 0;
|
||||||
|
&.ind {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
img {
|
||||||
|
width: 30px;
|
||||||
|
display: inline-block;
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.tier {
|
||||||
|
margin-top: 20px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
min-height: 300px;
|
||||||
|
max-width: 1200px;
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
ul {
|
||||||
|
max-width: 550px;
|
||||||
|
div {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
font-weight: bold;
|
||||||
|
img {
|
||||||
|
width: 30px;
|
||||||
|
display: inline-block;
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
a.btn {
|
||||||
|
margin: 0 auto;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.trailer {
|
||||||
|
width: 1280px;
|
||||||
|
height: 720px;
|
||||||
|
iframe {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.footer {
|
||||||
|
font-family: $text-font-stack;
|
||||||
|
width: 100%;
|
||||||
|
padding: 2rem 2rem;
|
||||||
|
background: lighten($bg-color, 20%);
|
||||||
|
text-align: center;
|
||||||
|
font-size: 1rem;
|
||||||
|
letter-spacing: 0.5px;
|
||||||
|
line-height: 1.5;
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,98 @@
|
|||||||
|
<template>
|
||||||
|
<div class="nationals">
|
||||||
|
<main>
|
||||||
|
<div class="bg">
|
||||||
|
<video autoplay loop muted>
|
||||||
|
<source src="/flag-bg.webm" type="video/webm">
|
||||||
|
</video>
|
||||||
|
</div>
|
||||||
|
<div class="container presenting">
|
||||||
|
Presenting
|
||||||
|
</div>
|
||||||
|
<div class="container brand">
|
||||||
|
<img src="https://cms.aplesports.com/storage/uploads/2021/02/11/6024e388e7fd9APL_Nationals_Logo-Flag-white.png" alt="APL Nationals Logo Flag">
|
||||||
|
<img src="https://cms.aplesports.com/storage/uploads/2021/02/11/6024df092c0d1APL_Nationals_Logo-Text.png" alt="APL Nationals Logo Text">
|
||||||
|
</div>
|
||||||
|
<div class="container psyonix">
|
||||||
|
<img src="https://cms.aplesports.com/storage/uploads/2020/06/03/5ed7144204020Sponsored_By_Psyonix.png" alt="Sponsored by Psyonix">
|
||||||
|
</div>
|
||||||
|
<div class="container introp">
|
||||||
|
Duis mollis mi eros, eget vehicula orci viverra ut. Sed molestie nisi magna, a tempor magna pellentesque vel. Proin lobortis tortor non ornare luctus. Quisque non accumsan neque. Vivamus convallis tortor nibh, nec imperdiet mi rutrum quis. Vivamus posuere tortor in vehicula pulvinar. Ut tristique sollicitudin mi sed gravida. Cras id purus pretium, scelerisque dui porttitor, lobortis velit. Donec ac luctus dui, iaculis lobortis mauris.
|
||||||
|
<div>
|
||||||
|
<a href="https://cms.aplesports.com/storage/uploads/2021/02/10/602424bbcbc6dAPL-NATIONALS---Official-Ruleset-v1.0.pdf" class="btn" target="_blank">Rule book</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- <div class="container heading">
|
||||||
|
Three Tiers of Competitive Rocket League®
|
||||||
|
</div> -->
|
||||||
|
<div class="container poster heading">
|
||||||
|
<img src="https://cms.aplesports.com/storage/uploads/2021/02/13/602750fe497e7APLN-Website-Banner.jpg" alt="APL Nationals Poster">
|
||||||
|
</div>
|
||||||
|
<div class="container tier t1">
|
||||||
|
<ul>
|
||||||
|
<div>
|
||||||
|
Saudi Arabia
|
||||||
|
<img src="https://upload.wikimedia.org/wikipedia/commons/0/0d/Flag_of_Saudi_Arabia.svg" alt="Saudi Arabia Flag">
|
||||||
|
</div>
|
||||||
|
<li>Qualifier 1: June 27th - 5pm AST | 3pm BST | 10am EDT | 7am PDT</li>
|
||||||
|
<li>Qualifier 2: July 4th - 5pm AST | 3pm BST | 10am EDT | 7am PDT</li>
|
||||||
|
<li>Prize Pool: $22,750</li>
|
||||||
|
<a href="/nationals" class="btn" target="_blank">Register</a>
|
||||||
|
</ul>
|
||||||
|
<ul>
|
||||||
|
<div>
|
||||||
|
Japan
|
||||||
|
<img src="https://upload.wikimedia.org/wikipedia/en/9/9e/Flag_of_Japan.svg" alt="Japan Flag">
|
||||||
|
</div>
|
||||||
|
<li>Qualifier 1: June 27th - 5pm AST | 3pm BST | 10am EDT | 7am PDT</li>
|
||||||
|
<li>Qualifier 2: July 4th - 5pm AST | 3pm BST | 10am EDT | 7am PDT</li>
|
||||||
|
<li>Prize Pool: $22,750</li>
|
||||||
|
<a href="/nationals" class="btn" target="_blank">Register</a>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div class="container tier t2">
|
||||||
|
<ul>
|
||||||
|
<div>
|
||||||
|
Indonesia
|
||||||
|
<img src="https://upload.wikimedia.org/wikipedia/commons/9/9f/Flag_of_Indonesia.svg" alt="Indonesia Flag">
|
||||||
|
</div>
|
||||||
|
<li>Qualifier 1: June 27th - 5pm AST | 3pm BST | 10am EDT | 7am PDT</li>
|
||||||
|
<li>Qualifier 2: July 4th - 5pm AST | 3pm BST | 10am EDT | 7am PDT</li>
|
||||||
|
<li>Prize Pool: $22,750</li>
|
||||||
|
<a href="/nationals" class="btn" target="_blank">Register</a>
|
||||||
|
</ul>
|
||||||
|
<ul>
|
||||||
|
<div>
|
||||||
|
Singapore
|
||||||
|
<img src="https://upload.wikimedia.org/wikipedia/commons/4/48/Flag_of_Singapore.svg" alt="Singapore Flag">
|
||||||
|
</div>
|
||||||
|
<li>Qualifier 1: June 27th - 5pm AST | 3pm BST | 10am EDT | 7am PDT</li>
|
||||||
|
<li>Qualifier 2: July 4th - 5pm AST | 3pm BST | 10am EDT | 7am PDT</li>
|
||||||
|
<li>Prize Pool: $22,750</li>
|
||||||
|
<a href="/nationals" class="btn" target="_blank">Register</a>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<!-- <div class="container heading ftier ind">
|
||||||
|
India <img src="https://upload.wikimedia.org/wikipedia/en/thumb/4/41/Flag_of_India.svg/1200px-Flag_of_India.svg.png" alt="India Flag">
|
||||||
|
</div> -->
|
||||||
|
<div class="container tier t3">
|
||||||
|
<ul>
|
||||||
|
<div>
|
||||||
|
India
|
||||||
|
<img src="https://upload.wikimedia.org/wikipedia/en/thumb/4/41/Flag_of_India.svg/1200px-Flag_of_India.svg.png" alt="India Flag">
|
||||||
|
</div>
|
||||||
|
<li>Qualifier 1: June 27th - 5pm AST | 3pm BST | 10am EDT | 7am PDT</li>
|
||||||
|
<li>Qualifier 2: July 4th - 5pm AST | 3pm BST | 10am EDT | 7am PDT</li>
|
||||||
|
<li>Prize Pool: $22,750</li>
|
||||||
|
<a href="/nationals" class="btn" target="_blank">Register</a>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div class="container trailer">
|
||||||
|
<iframe src="https://www.youtube.com/embed/7mZzs6-4_Nw" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
<div class="footer">
|
||||||
|
Rocket League, Psyonix, and all related marks and logos are trademarks or registered trademarks of Psyonix LLC and used under license. © 2015-2020 Licensed by Psyonix LLC, All rights reserved. All other trademarks are property of their respective owners.
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
Loading…
Reference in New Issue