diff --git a/assets/css/app.scss b/assets/css/app.scss
index 26634e8..06fc0da 100644
--- a/assets/css/app.scss
+++ b/assets/css/app.scss
@@ -35,7 +35,8 @@ body {
margin: 0;
font-size: 18px;
- background-image: linear-gradient(160deg, $blue, darken($blue, 20));
+ background-image: linear-gradient(-60deg, $blue, darken($blue, 30));
+
background-attachment: fixed;
&.error {
diff --git a/assets/css/type.scss b/assets/css/type.scss
index ea9d2c5..73dc38c 100644
--- a/assets/css/type.scss
+++ b/assets/css/type.scss
@@ -25,6 +25,13 @@ $fontName: "GrotaSansRd";
font-weight: normal;
}
+@font-face {
+ font-family: Neon;
+ src:
+ url("/fonts/Neon.ttf") format("truetype");
+ font-weight: normal;
+}
+
body {
line-height: 1.4;
color: transparentize($white, 0.2);
@@ -63,6 +70,39 @@ p {
margin-top: 5px;
}
}
+
+@keyframes pulsate {
+ 100% {
+ /* Larger blur radius */
+ text-shadow:
+ 0 0 4px #fff,
+ 0 0 11px #fff,
+ 0 0 19px #fff,
+ 0 0 40px $teal,
+ 0 0 80px $teal,
+ 0 0 90px $teal,
+ 0 0 100px $teal,
+ 0 0 150px $teal;
+ }
+ 0% {
+ /* A slightly smaller blur radius */
+ text-shadow:
+ 0 0 3px #fff,
+ 0 0 8px #fff,
+ 0 0 17px #fff,
+ 0 0 35px $teal,
+ 0 0 70px $teal,
+ 0 0 76px $teal,
+ 0 0 90px $teal,
+ 0 0 130px $teal;
+ }
+}
+
+.header--80s {
+ font-family: Neon;
+ animation: pulsate 0.11s ease-in-out infinite alternate;
+}
+
.intro {
font-size: 1.5em;
margin-bottom: 1em;
diff --git a/lib/pr_web/live/logo_live.ex b/lib/pr_web/live/logo_live.ex
index 90657c7..0786ef5 100644
--- a/lib/pr_web/live/logo_live.ex
+++ b/lib/pr_web/live/logo_live.ex
@@ -18,12 +18,20 @@ defmodule PRWeb.LogoLive do
<.link href={~p"/"} class="logo-link">
<.logo play_state={@play_state} />
- <%= installation_name() %>
+ <.logo_title name={installation_name()} />
"""
end
+ def logo_title(assigns) do
+ ~H"""
+
+ """
+ end
+
def logo(%{play_state: %PlaybackState{state: :playing}} = assigns) do
~H"""
<.logo_svg playing={true} />
diff --git a/priv/static/assets/app.css b/priv/static/assets/app.css
index 052523f..eaf87bc 100644
--- a/priv/static/assets/app.css
+++ b/priv/static/assets/app.css
@@ -1,4 +1,5 @@
@charset "UTF-8";
+
/* This file is for your main application css. */
/* ----------------------------------------------
* Generated by Animista on 2019-9-22 16:23:31
@@ -12,26 +13,34 @@
* ----------------------------------------
*/
@keyframes wobble-hor-bottom {
- 0%, 100% {
+
+ 0%,
+ 100% {
transform: translateX(0%);
transform-origin: 50% 50%;
}
+
15% {
transform: translateX(-30px) rotate(-6deg);
}
+
30% {
transform: translateX(15px) rotate(6deg);
}
+
45% {
transform: translateX(-15px) rotate(-3.6deg);
}
+
60% {
transform: translateX(9px) rotate(2.4deg);
}
+
75% {
transform: translateX(-6px) rotate(-1.2deg);
}
}
+
/**
* ----------------------------------------
* animation vibrate-1
@@ -41,22 +50,28 @@
0% {
transform: translate(0);
}
+
20% {
transform: translate(-2px, 2px);
}
+
40% {
transform: translate(-2px, -2px);
}
+
60% {
transform: translate(2px, 2px);
}
+
80% {
transform: translate(2px, -2px);
}
+
100% {
transform: translate(0);
}
}
+
/**
* ----------------------------------------
* animation bounce-in-top
@@ -68,36 +83,44 @@
animation-timing-function: ease-in;
opacity: 0;
}
+
38% {
transform: translateY(0);
animation-timing-function: ease-out;
opacity: 1;
}
+
55% {
transform: translateY(-65px);
animation-timing-function: ease-in;
}
+
72% {
transform: translateY(0);
animation-timing-function: ease-out;
}
+
81% {
transform: translateY(-28px);
animation-timing-function: ease-in;
}
+
90% {
transform: translateY(0);
animation-timing-function: ease-out;
}
+
95% {
transform: translateY(-8px);
animation-timing-function: ease-in;
}
+
100% {
transform: translateY(0);
animation-timing-function: ease-out;
}
}
+
/**
* ----------------------------------------
* animation swing-in-top-fwd
@@ -109,12 +132,14 @@
transform-origin: top;
opacity: 0;
}
+
100% {
transform: rotateX(0deg);
transform-origin: top;
opacity: 1;
}
}
+
/**
* ----------------------------------------
* animation pulsate-fwd
@@ -124,13 +149,16 @@
0% {
transform: scale(1);
}
+
50% {
transform: scale(1.05);
}
+
100% {
transform: scale(1);
}
}
+
/**
* ----------------------------------------
* animation flip-vertical-fwd
@@ -140,102 +168,143 @@
0% {
transform: translateZ(0) rotateY(0);
}
+
100% {
transform: translateZ(160px) rotateY(180deg);
}
}
+
@keyframes shake {
0% {
transform: translate(1px, 1px) rotate(0deg);
}
+
10% {
transform: translate(-1px, -2px) rotate(-1deg);
}
+
20% {
transform: translate(-3px, 0px) rotate(1deg);
}
+
30% {
transform: translate(3px, 2px) rotate(0deg);
}
+
40% {
transform: translate(1px, -1px) rotate(1deg);
}
+
50% {
transform: translate(-1px, 2px) rotate(-1deg);
}
+
60% {
transform: translate(-3px, 1px) rotate(0deg);
}
+
70% {
transform: translate(3px, 1px) rotate(-1deg);
}
+
80% {
transform: translate(-1px, -1px) rotate(1deg);
}
+
90% {
transform: translate(1px, 2px) rotate(0deg);
}
+
100% {
transform: translate(1px, -2px) rotate(-1deg);
}
}
+
@keyframes beat {
- 0%, 50%, 100% {
+
+ 0%,
+ 50%,
+ 100% {
transform: scale(1, 1);
}
- 30%, 80% {
+
+ 30%,
+ 80% {
transform: scale(0.92, 0.95);
}
}
+
@keyframes pulse {
- 0%, 50%, 100% {
+
+ 0%,
+ 50%,
+ 100% {
background: #fee;
}
- 30%, 80% {
+
+ 30%,
+ 80% {
background: #fff;
}
}
+
@keyframes pop {
0% {
transform: scale(1);
}
+
10% {
transform: translate(-1px, -2px) rotate(-1deg);
}
+
20% {
transform: translate(-3px, 0px) rotate(1deg) scale(0.92);
}
+
30% {
transform: translate(3px, 2px) rotate(0deg) scale(1.2);
}
+
40% {
transform: translate(1px, -1px) rotate(1deg);
}
+
50% {
transform: translate(-1px, 2px) rotate(-1deg);
}
+
100% {
transform: scale(1);
}
}
+
@font-face {
font-family: "GrotaBlack";
src: url("/fonts/GrotaSansRd-Bold.woff") format("woff"), url("/fonts/GrotaSansRd-Bold.ttf") format("truetype");
/* Safari, Android, iOS */
font-weight: bold;
}
+
@font-face {
font-family: "Grota";
src: url("/fonts/GrotaSansRd-SemiBold.woff") format("woff"), url("/fonts/GrotaSansRd-SemiBold.ttf") format("truetype");
/* Safari, Android, iOS */
font-weight: bold;
}
+
@font-face {
font-family: "Grota";
src: url("/fonts/GrotaSansRd-Light.woff") format("woff"), url("/fonts/GrotaSansRd-Light.ttf") format("truetype");
/* Safari, Android, iOS */
font-weight: normal;
}
+
+@font-face {
+ font-family: Neon;
+ src: url("/fonts/Neon.ttf") format("truetype");
+ font-weight: normal;
+}
+
body {
line-height: 1.4;
color: rgba(255, 255, 255, 0.8);
@@ -258,7 +327,8 @@ h1 {
font-family: "GrotaBlack", sans-serif;
font-size: 50px;
}
-h1 + p {
+
+h1+p {
margin-top: 10px;
}
@@ -273,18 +343,71 @@ h3 {
margin: 10px 0 8px;
}
-h3 + p {
+h3+p {
margin-top: 5px;
}
+@keyframes pulsate {
+ 100% {
+ /* Larger blur radius */
+ text-shadow: 0 0 4px #fff, 0 0 11px #fff, 0 0 19px #fff, 0 0 40px #32fad7, 0 0 80px #32fad7, 0 0 90px #32fad7, 0 0 100px #32fad7, 0 0 150px #32fad7;
+ }
+
+ 0% {
+ /* A slightly smaller blur radius */
+ text-shadow: 0 0 3px #fff, 0 0 8px #fff, 0 0 17px #fff, 0 0 35px #32fad7, 0 0 70px #32fad7, 0 0 76px #32fad7, 0 0 90px #32fad7, 0 0 130px #32fad7;
+ }
+}
+
+.header--80s {
+ <<<<<<< HEAD font-family: BoogieBoysRegular;
+ position: relative;
+ font-size: 1.5em;
+ bottom: -0.25em;
+}
+
+.header--80s .size {
+ position: relative;
+ visibility: hidden;
+}
+
+.header--80s span {
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ color: green;
+}
+
+.header--80s span.regular {
+ font-family: BoogieBoysRegular;
+ color: #fff;
+}
+
+.header--80s span.extrude {
+ font-family: BoogieBoysExtrude;
+ color: #2353f3;
+}
+
+.header--80s span.shadow {
+ font-family: BoogieBoysShadow;
+ color: #32fad7;
+ =======font-family: Neon;
+ animation: pulsate 0.11s ease-in-out infinite alternate;
+ >>>>>>>8a1cf87 (80s title)
+}
+
.intro {
font-size: 1.5em;
margin-bottom: 1em;
}
-.intro + p {
+
+.intro+p {
margin-top: 0;
}
-h2 + .intro {
+
+h2+.intro {
margin-top: -10px;
}
@@ -320,23 +443,29 @@ a:hover .link {
letter-spacing: 0.08ex;
border-radius: 20px;
}
+
.button:focus {
outline: none;
}
+
.button:hover {
border-color: #fff;
}
-.button + .button {
+
+.button+.button {
margin-left: 20px;
}
-h3 + .button {
+
+h3+.button {
margin-top: 10px;
}
+
.button.loading {
background: url("/images/loading.svg") no-repeat 50% 50%;
width: 80px;
text-indent: 99999px;
}
+
.button--primary {
background-color: #fff;
color: #2353f3;
@@ -345,6 +474,7 @@ h3 + .button {
transition: box-shadow 200ms ease-in;
box-shadow: 1px 0 0px rgba(0, 0, 0, 0.2);
}
+
.button--primary:hover {
box-shadow: 1px 0 20px rgba(0, 0, 0, 0.2);
}
@@ -356,6 +486,7 @@ h3 + .button {
vertical-align: bottom;
margin: 0 8px 4px 0;
}
+
.logo-link {
color: #fff;
letter-spacing: 0.06ex;
@@ -366,19 +497,23 @@ h3 + .button {
width: 40px;
margin: 0 6px 7px 0;
}
+
.logo-link {
font-size: 40px;
}
}
+
.box {
padding: 40px 30px 20px;
margin-top: 30px;
border-radius: 15px;
background: #0a0d36;
}
+
.box .shad {
box-shadow: 1px 0 20px rgba(0, 0, 0, 0.2);
}
+
.box h3 {
margin-top: 0;
}
@@ -394,6 +529,7 @@ h3 + .button {
text-transform: uppercase;
font-size: 14px;
}
+
.volume .label {
margin-right: 1ex;
}
@@ -405,6 +541,7 @@ h3 + .button {
align-items: center;
padding: 10px 6px;
}
+
.button--vol .inner {
flex: 1;
background: rgba(255, 255, 255, 0.5);
@@ -417,9 +554,11 @@ h3 + .button {
overflow: hidden;
transition: background-color 200ms ease-out, transform 200ms ease-in;
}
+
.button--vol:hover {
cursor: pointer;
}
+
.button--vol:hover .inner {
background: #fff;
transform: scale(2);
@@ -450,6 +589,7 @@ body {
grid-template-rows: auto;
grid-template-areas: "left" "right";
}
+
@media (min-width: 800px) {
.container {
padding: 20px 40px 0;
@@ -458,6 +598,7 @@ body {
grid-template-areas: "left left right right" "footer footer footer footer";
}
}
+
.container.container--middle {
grid-template-areas: "left_ main main right_";
}
@@ -470,12 +611,14 @@ body {
align-items: flex-start;
justify-content: space-between;
}
+
@media (min-width: 800px) {
.container--header {
padding: 40px 40px 0;
}
}
-.container--header > div:last-child {
+
+.container--header>div:last-child {
flex-grow: 1;
}
@@ -499,6 +642,7 @@ body {
padding: 20px 0;
max-width: min(100%, 85vw);
}
+
@media (max-width: 800px) {
.col--header {
padding: 0;
@@ -517,6 +661,7 @@ body {
flex-wrap: wrap;
gap: 10px;
}
+
.nav ul {
display: flex;
flex: 1;
@@ -525,6 +670,7 @@ body {
padding: 0;
margin: 0;
}
+
@media (min-width: 500px) {
.nav ul {
flex: 1;
@@ -533,6 +679,7 @@ body {
align-items: center;
}
}
+
.nav li {
padding: 0;
margin: 0;
@@ -540,6 +687,7 @@ body {
margin: 3px 20px 3px 0;
white-space: nowrap;
}
+
.nav .button {
margin-right: 10px;
justify-self: flex-end;
@@ -555,10 +703,12 @@ body {
display: inline-block;
box-shadow: 1px 0 20px rgba(0, 0, 0, 0.2);
}
+
.user__hearts {
vertical-align: middle;
margin-left: 1ex;
}
+
.user__hearts .heart {
animation: 1.5s ease 0s infinite beat;
}
@@ -570,15 +720,18 @@ body {
display: inline-block;
box-shadow: 1px 0 20px rgba(0, 0, 0, 0.2);
}
+
.users-container {
width: 100%;
margin-top: 10px;
justify-content: flex-end;
display: flex;
}
+
.users--title {
padding: 0 1ex;
}
+
.users .profile-image {
width: 30px;
height: 30px;
@@ -587,6 +740,7 @@ body {
background: #049077;
border: 1px solid #0a0d36;
}
+
.users .profile-image:last-of-type {
margin-right: 0;
}
@@ -638,22 +792,28 @@ body {
margin-right: 1ex;
font-size: 14px;
}
+
.chip .pie {
margin-right: 5px;
}
-.chip__number, .chip__img {
+
+.chip__number,
+.chip__img {
border-radius: 100px;
width: 21px;
height: 21px;
flex: 0 0 21px;
margin-right: 5px;
}
+
.chip--light {
background: #dfe0e0;
}
+
.chip--pink {
background: #ff1d79;
}
+
.chip--grey {
background: #5e6062;
}
@@ -669,72 +829,91 @@ body {
transition: box-shadow 200ms ease opacity 200ms ease-in;
opacity: 0;
}
+
.track.show {
opacity: 1;
animation: swing-in-top-fwd 400ms cubic-bezier(0.175, 0.885, 0.32, 1.275) both;
}
+
.track h3 {
color: #2353f3;
}
+
.track a {
color: #2353f3;
}
+
.track a:hover .link {
box-shadow: inset 0 -8px 0 0 rgba(255, 29, 121, 0.2);
}
+
.track.is-super-liked {
animation: ease-out 1s pop;
}
+
.track.is-liked {
animation: ease-out 1s beat 2;
}
+
.track__inner {
display: flex;
width: 100%;
align-items: center;
container-type: normal;
}
+
.track--light {
background: rgba(255, 255, 255, 0.2);
box-shadow: none;
color: #fff;
}
+
.track--light .novelty__container {
opacity: 0.5;
transition: opacity 200ms;
}
+
.track--light h3 {
color: #32fad7;
}
+
.track--light:hover {
box-shadow: 1px 0 20px rgba(0, 0, 0, 0.4);
}
+
.track--light:hover .novelty__container {
opacity: 1;
}
+
.track--dark {
color: #fff;
background: #0a0d36;
}
+
.track--dark h3 {
color: inherit;
}
+
.track:first-child {
margin-top: 0;
}
+
.track.playing {
box-shadow: 1px 0 30px rgba(0, 0, 0, 0.4);
}
+
.track__details {
padding: 20px 0 10px;
flex: 1;
font-size: 16px;
width: 10px;
}
+
.track__details p {
margin: 0;
padding: 0;
}
+
.track__name {
margin-top: 0;
font-weight: bold;
@@ -744,6 +923,7 @@ body {
white-space: nowrap;
min-width: 0;
}
+
.track__img__container {
position: relative;
flex: 0 0 50px;
@@ -751,6 +931,7 @@ body {
height: 50px;
margin: 10px 15px 10px 10px;
}
+
@media (min-width: 500px) {
.track__img__container {
flex: 0 0 100px;
@@ -758,7 +939,9 @@ body {
height: 100px;
}
}
-.has-super-liked .track__img__container::after, .has-voted .track__img__container::after {
+
+.has-super-liked .track__img__container::after,
+.has-voted .track__img__container::after {
content: "";
position: absolute;
z-index: 1;
@@ -768,15 +951,18 @@ body {
bottom: -3px;
right: -4px;
}
+
.has-voted .track__img__container::after {
background: url(/images/heart_pink.svg) 50% 50% no-repeat;
background-size: 16px 16px;
animation: 1.5s ease 0s infinite beat;
}
+
.has-super-liked .track__img__container::after {
background: url(/images/fire.svg) 50% 50% no-repeat;
background-size: 18px;
}
+
.is-super-liked .track__img__container::before {
content: "👑";
font-size: 50px;
@@ -787,12 +973,14 @@ body {
transform: rotate(-45deg);
z-index: 1;
}
+
.track__img {
width: 100%;
height: 100%;
display: block;
border-radius: 10px;
}
+
.track__queue {
width: 60px;
justify-self: flex-end;
@@ -805,21 +993,26 @@ body {
cursor: pointer;
transform: translate(0, 0);
}
+
.track__queue:focus {
outline: none;
}
+
.track__queue:hover {
transform: translate(4px, 0) scale(1.05);
transition-duration: 100ms;
}
+
.track__skipped-link {
opacity: 0;
transition: opacity 200ms ease;
margin-left: 10px;
}
+
.track:hover .track__skipped-link {
opacity: 1;
}
+
.track__like {
padding: 0;
margin: 0;
@@ -828,6 +1021,7 @@ body {
cursor: pointer;
flex-shrink: 0;
}
+
.track__playing {
width: 18px;
height: 18px;
@@ -841,6 +1035,7 @@ body {
box-sizing: border-box;
padding: 6px 12px 12px;
}
+
.progress__bar {
position: absolute;
height: 100%;
@@ -861,16 +1056,19 @@ body {
display: flex;
margin-right: 20px;
}
+
.novelty__score {
border-radius: 100px;
padding: 2px;
align-self: center;
}
+
.novelty__title {
font-weight: normal;
padding-top: 4px;
font-size: 10px;
}
+
.novelty__inner {
position: relative;
z-index: 1;
@@ -886,6 +1084,7 @@ body {
align-items: center;
line-height: 1;
}
+
.novelty__inner p {
padding: 0;
margin: 0;
@@ -893,9 +1092,11 @@ body {
user-select: none;
cursor: help;
}
+
.novelty__inner .track {
color: #ff1d79;
}
+
.novelty__inner .artist {
color: #2353f3;
}
@@ -908,6 +1109,7 @@ body {
margin-bottom: 2px;
display: inline-block;
}
+
.heart:first-of-type {
padding-left: 8px;
}
@@ -920,11 +1122,13 @@ body {
margin-bottom: 2px;
display: inline-block;
}
+
.fire:first-of-type {
padding-left: 8px;
}
-.flip__back, .flip__front {
+.flip__back,
+.flip__front {
position: absolute;
width: 100px;
height: 100px;
@@ -932,6 +1136,7 @@ body {
left: 0;
top: 0;
}
+
.flip__container {
border: none;
outline: none;
@@ -940,9 +1145,11 @@ body {
margin: 0;
perspective: 600px;
}
+
.flip__container.animate {
cursor: pointer;
}
+
.flip__flipper {
width: 100px;
height: 100px;
@@ -951,10 +1158,12 @@ body {
transform: translate3d(0, 0, 0);
transition: transform 400ms ease-in-out;
}
+
.flip__front {
z-index: 2;
backface-visibility: hidden;
}
+
.flip__back {
z-index: 1;
transform-style: preserve-3d;
@@ -963,21 +1172,23 @@ body {
background-size: 70% 70%;
border-radius: 11px;
}
+
.flip__container.animate:hover .flip__flipper {
transform: rotateY(180deg) scale(1.1);
}
+
.flip__container.animate:focus-visible .flip__flipper {
transition-duration: 100ms;
transform: rotateY(180deg);
}
-.track + h3,
-.track + h2 {
+.track+h3,
+.track+h2 {
margin-top: 30px;
}
-h3 + .track,
-h2 + .track {
+h3+.track,
+h2+.track {
margin-top: 10px;
}
@@ -1003,16 +1214,20 @@ button {
border: 2px solid #e4eafe;
cursor: pointer;
}
+
.like:hover {
animation: 1.5s ease 0s infinite beat;
}
+
.like.super {
background-size: 18px;
background-image: url(/images/fire.svg);
}
+
.like.super:hover {
animation: 0.5s infinite shake;
}
+
.like:hover {
border: 2px solid #b4c4fb;
}
@@ -1036,22 +1251,27 @@ input[type=text] {
font-family: inherit;
transition: background 200ms ease, box-shadow 200ms ease;
}
+
input[type=text]::placeholder {
transition: color 200ms ease;
color: rgba(255, 255, 255, 0.5);
}
+
input[type=text]:focus {
box-shadow: 1px 0 20px rgba(0, 0, 0, 0.2);
background-color: #fff;
}
+
input[type=text]:focus::placeholder {
color: rgba(66, 68, 125, 0.5);
}
+
.loading input[type=text] {
background-image: url("/images/loading_pink.svg");
background-position: 98% 0;
background-repeat: no-repeat;
}
+
.active input[type=text] {
background-color: #fff;
}
@@ -1060,6 +1280,7 @@ input[type=text]:focus::placeholder {
margin: 30px 0 0;
padding: 0;
}
+
.setup-list li {
margin: 0;
padding: 0;
@@ -1091,6 +1312,7 @@ input[type=text]:focus::placeholder {
margin: 30px 0 0;
padding: 0;
}
+
.setup-list li {
margin: 0;
padding: 0;
@@ -1121,6 +1343,7 @@ input[type=text]:focus::placeholder {
.alert-container {
padding: 0 40px 0;
}
+
@media (min-width: 800px) {
.alert-container {
display: grid;
@@ -1137,20 +1360,24 @@ input[type=text]:focus::placeholder {
display: flex;
flex: 1;
}
+
.alert .title {
font-weight: bold;
display: block;
margin: 0;
padding: 0;
}
+
.alert .message {
margin: 0;
padding: 0;
}
+
.alert .inner {
flex: 1;
margin-right: 20px;
}
+
.alert .close {
color: currentColor;
}
@@ -1217,21 +1444,26 @@ input[type=text]:focus::placeholder {
place-content: center;
font-weight: bold;
}
+
.chip .pie {
background: #919395;
border-radius: 50%;
-webkit-mask: radial-gradient(farthest-side, #0000 calc(99% - var(--b)), #000 calc(100% - var(--b)));
mask: radial-gradient(farthest-side, #0000 calc(99% - var(--b)), #000 calc(100% - var(--b)));
}
+
.pie.blue {
--c: #2353f3;
}
+
.pie.pink {
--c: #ff1d79;
}
+
.pie.teal {
--c: #32fad7;
}
+
.pie.tealDark {
--c: #049077;
}
@@ -1276,6 +1508,7 @@ input[type=text]:focus::placeholder {
--p: 0;
}
}
+
.fire_container {
filter: blur(0.02em);
-webkit-filter: blur(0.02em);
@@ -1294,204 +1527,501 @@ input[type=text]:focus::placeholder {
height: 5em;
z-index: 10;
}
+
.particle:nth-of-type(1) {
- animation-delay: 0.645199067s;
+ <<<<<<< HEAD animation-delay: 0.645199067s;
left: calc((100% - 5em) * 0);
}
+
.particle:nth-of-type(2) {
animation-delay: 0.2870944654s;
left: calc((100% - 5em) * 0.02);
}
+
.particle:nth-of-type(3) {
animation-delay: 0.019304819s;
left: calc((100% - 5em) * 0.04);
}
+
.particle:nth-of-type(4) {
animation-delay: 0.145596353s;
left: calc((100% - 5em) * 0.06);
}
+
.particle:nth-of-type(5) {
animation-delay: 0.0036225901s;
left: calc((100% - 5em) * 0.08);
}
+
.particle:nth-of-type(6) {
animation-delay: 0.8874084889s;
left: calc((100% - 5em) * 0.1);
}
+
.particle:nth-of-type(7) {
animation-delay: 0.6585552144s;
left: calc((100% - 5em) * 0.12);
}
+
.particle:nth-of-type(8) {
animation-delay: 0.2420491685s;
left: calc((100% - 5em) * 0.14);
}
+
.particle:nth-of-type(9) {
animation-delay: 0.2077308283s;
left: calc((100% - 5em) * 0.16);
}
+
.particle:nth-of-type(10) {
animation-delay: 0.4973972244s;
left: calc((100% - 5em) * 0.18);
}
+
.particle:nth-of-type(11) {
animation-delay: 0.5529445407s;
left: calc((100% - 5em) * 0.2);
}
+
.particle:nth-of-type(12) {
animation-delay: 0.0732833235s;
left: calc((100% - 5em) * 0.22);
}
+
.particle:nth-of-type(13) {
animation-delay: 0.9124946813s;
left: calc((100% - 5em) * 0.24);
}
+
.particle:nth-of-type(14) {
animation-delay: 0.6938863853s;
left: calc((100% - 5em) * 0.26);
}
+
.particle:nth-of-type(15) {
animation-delay: 0.1116560009s;
left: calc((100% - 5em) * 0.28);
}
+
.particle:nth-of-type(16) {
animation-delay: 0.8678880567s;
left: calc((100% - 5em) * 0.3);
}
+
.particle:nth-of-type(17) {
animation-delay: 0.2210342016s;
left: calc((100% - 5em) * 0.32);
}
+
.particle:nth-of-type(18) {
animation-delay: 0.1249896554s;
left: calc((100% - 5em) * 0.34);
}
+
.particle:nth-of-type(19) {
animation-delay: 0.8525997712s;
left: calc((100% - 5em) * 0.36);
}
+
.particle:nth-of-type(20) {
animation-delay: 0.3491900052s;
left: calc((100% - 5em) * 0.38);
}
+
.particle:nth-of-type(21) {
animation-delay: 0.5778933797s;
left: calc((100% - 5em) * 0.4);
}
+
.particle:nth-of-type(22) {
animation-delay: 0.882218054s;
left: calc((100% - 5em) * 0.42);
}
+
.particle:nth-of-type(23) {
animation-delay: 0.5712439727s;
left: calc((100% - 5em) * 0.44);
}
+
.particle:nth-of-type(24) {
animation-delay: 0.7242884229s;
left: calc((100% - 5em) * 0.46);
}
+
.particle:nth-of-type(25) {
animation-delay: 0.4191228372s;
left: calc((100% - 5em) * 0.48);
}
+
.particle:nth-of-type(26) {
animation-delay: 0.4747025751s;
left: calc((100% - 5em) * 0.5);
}
+
.particle:nth-of-type(27) {
animation-delay: 0.8315142377s;
left: calc((100% - 5em) * 0.52);
}
+
.particle:nth-of-type(28) {
animation-delay: 0.917186628s;
left: calc((100% - 5em) * 0.54);
}
+
.particle:nth-of-type(29) {
animation-delay: 0.6705334965s;
left: calc((100% - 5em) * 0.56);
}
+
.particle:nth-of-type(30) {
animation-delay: 0.3600116088s;
left: calc((100% - 5em) * 0.58);
}
+
.particle:nth-of-type(31) {
animation-delay: 0.9737410775s;
left: calc((100% - 5em) * 0.6);
}
+
.particle:nth-of-type(32) {
animation-delay: 0.0003313787s;
left: calc((100% - 5em) * 0.62);
}
+
.particle:nth-of-type(33) {
animation-delay: 0.1925150661s;
left: calc((100% - 5em) * 0.64);
}
+
.particle:nth-of-type(34) {
animation-delay: 0.9372631833s;
left: calc((100% - 5em) * 0.66);
}
+
.particle:nth-of-type(35) {
animation-delay: 0.6007346237s;
left: calc((100% - 5em) * 0.68);
}
+
.particle:nth-of-type(36) {
animation-delay: 0.6158588006s;
left: calc((100% - 5em) * 0.7);
}
+
.particle:nth-of-type(37) {
animation-delay: 0.6665750906s;
left: calc((100% - 5em) * 0.72);
}
+
.particle:nth-of-type(38) {
animation-delay: 0.7557133878s;
left: calc((100% - 5em) * 0.74);
}
+
.particle:nth-of-type(39) {
animation-delay: 0.3072312547s;
left: calc((100% - 5em) * 0.76);
}
+
.particle:nth-of-type(40) {
animation-delay: 0.1169118658s;
left: calc((100% - 5em) * 0.78);
}
+
.particle:nth-of-type(41) {
animation-delay: 0.0079741195s;
left: calc((100% - 5em) * 0.8);
}
+
.particle:nth-of-type(42) {
animation-delay: 0.8387323944s;
left: calc((100% - 5em) * 0.82);
}
+
.particle:nth-of-type(43) {
animation-delay: 0.4180961749s;
left: calc((100% - 5em) * 0.84);
}
+
.particle:nth-of-type(44) {
animation-delay: 0.0363947687s;
left: calc((100% - 5em) * 0.86);
}
+
.particle:nth-of-type(45) {
animation-delay: 0.9320148672s;
left: calc((100% - 5em) * 0.88);
}
+
.particle:nth-of-type(46) {
animation-delay: 0.7563004941s;
left: calc((100% - 5em) * 0.9);
}
+
.particle:nth-of-type(47) {
animation-delay: 0.0517701388s;
left: calc((100% - 5em) * 0.92);
}
+
.particle:nth-of-type(48) {
animation-delay: 0.8700217323s;
left: calc((100% - 5em) * 0.94);
}
+
.particle:nth-of-type(49) {
animation-delay: 0.6789192152s;
left: calc((100% - 5em) * 0.96);
}
+
.particle:nth-of-type(50) {
animation-delay: 0.1801907356s;
+ animation-delay: 0.2171608412s;
+ =======animation-delay: 0.6308356631s;
+ >>>>>>>8a1cf87 (80s title) left: calc((100% - 5em) * 0);
+}
+
+.particle:nth-of-type(2) {
+ animation-delay: 0.3886991581s;
+ left: calc((100% - 5em) * 0.02);
+}
+
+.particle:nth-of-type(3) {
+ animation-delay: 0.3049153107s;
+ left: calc((100% - 5em) * 0.04);
+}
+
+.particle:nth-of-type(4) {
+ animation-delay: 0.0027967937s;
+ left: calc((100% - 5em) * 0.06);
+}
+
+.particle:nth-of-type(5) {
+ animation-delay: 0.9957790893s;
+ left: calc((100% - 5em) * 0.08);
+}
+
+.particle:nth-of-type(6) {
+ animation-delay: 0.2726268938s;
+ left: calc((100% - 5em) * 0.1);
+}
+
+.particle:nth-of-type(7) {
+ animation-delay: 0.3827337561s;
+ left: calc((100% - 5em) * 0.12);
+}
+
+.particle:nth-of-type(8) {
+ animation-delay: 0.669316627s;
+ left: calc((100% - 5em) * 0.14);
+}
+
+.particle:nth-of-type(9) {
+ animation-delay: 0.8031461826s;
+ left: calc((100% - 5em) * 0.16);
+}
+
+.particle:nth-of-type(10) {
+ animation-delay: 0.8831908991s;
+ left: calc((100% - 5em) * 0.18);
+}
+
+.particle:nth-of-type(11) {
+ animation-delay: 0.4191250524s;
+ left: calc((100% - 5em) * 0.2);
+}
+
+.particle:nth-of-type(12) {
+ animation-delay: 0.9366500035s;
+ left: calc((100% - 5em) * 0.22);
+}
+
+.particle:nth-of-type(13) {
+ animation-delay: 0.3131151854s;
+ left: calc((100% - 5em) * 0.24);
+}
+
+.particle:nth-of-type(14) {
+ animation-delay: 0.1998527125s;
+ left: calc((100% - 5em) * 0.26);
+}
+
+.particle:nth-of-type(15) {
+ animation-delay: 0.1306564857s;
+ left: calc((100% - 5em) * 0.28);
+}
+
+.particle:nth-of-type(16) {
+ animation-delay: 0.1693581236s;
+ left: calc((100% - 5em) * 0.3);
+}
+
+.particle:nth-of-type(17) {
+ animation-delay: 0.3752682608s;
+ left: calc((100% - 5em) * 0.32);
+}
+
+.particle:nth-of-type(18) {
+ animation-delay: 0.16972596s;
+ left: calc((100% - 5em) * 0.34);
+}
+
+.particle:nth-of-type(19) {
+ animation-delay: 0.4331908648s;
+ left: calc((100% - 5em) * 0.36);
+}
+
+.particle:nth-of-type(20) {
+ animation-delay: 0.327901547s;
+ left: calc((100% - 5em) * 0.38);
+}
+
+.particle:nth-of-type(21) {
+ animation-delay: 0.8002151681s;
+ left: calc((100% - 5em) * 0.4);
+}
+
+.particle:nth-of-type(22) {
+ animation-delay: 0.8916635526s;
+ left: calc((100% - 5em) * 0.42);
+}
+
+.particle:nth-of-type(23) {
+ animation-delay: 0.5512257092s;
+ left: calc((100% - 5em) * 0.44);
+}
+
+.particle:nth-of-type(24) {
+ animation-delay: 0.5411899247s;
+ left: calc((100% - 5em) * 0.46);
+}
+
+.particle:nth-of-type(25) {
+ animation-delay: 0.8969589956s;
+ left: calc((100% - 5em) * 0.48);
+}
+
+.particle:nth-of-type(26) {
+ animation-delay: 0.1327576854s;
+ left: calc((100% - 5em) * 0.5);
+}
+
+.particle:nth-of-type(27) {
+ animation-delay: 0.6399954938s;
+ left: calc((100% - 5em) * 0.52);
+}
+
+.particle:nth-of-type(28) {
+ animation-delay: 0.0247661888s;
+ left: calc((100% - 5em) * 0.54);
+}
+
+.particle:nth-of-type(29) {
+ animation-delay: 0.2745960426s;
+ left: calc((100% - 5em) * 0.56);
+}
+
+.particle:nth-of-type(30) {
+ animation-delay: 0.8516873669s;
+ left: calc((100% - 5em) * 0.58);
+}
+
+.particle:nth-of-type(31) {
+ animation-delay: 0.1707164286s;
+ left: calc((100% - 5em) * 0.6);
+}
+
+.particle:nth-of-type(32) {
+ animation-delay: 0.4999234112s;
+ left: calc((100% - 5em) * 0.62);
+}
+
+.particle:nth-of-type(33) {
+ animation-delay: 0.1439288426s;
+ left: calc((100% - 5em) * 0.64);
+}
+
+.particle:nth-of-type(34) {
+ animation-delay: 0.5593976504s;
+ left: calc((100% - 5em) * 0.66);
+}
+
+.particle:nth-of-type(35) {
+ animation-delay: 0.2460302425s;
+ left: calc((100% - 5em) * 0.68);
+}
+
+.particle:nth-of-type(36) {
+ animation-delay: 0.6739917021s;
+ left: calc((100% - 5em) * 0.7);
+}
+
+.particle:nth-of-type(37) {
+ animation-delay: 0.2839246055s;
+ left: calc((100% - 5em) * 0.72);
+}
+
+.particle:nth-of-type(38) {
+ animation-delay: 0.4819222024s;
+ left: calc((100% - 5em) * 0.74);
+}
+
+.particle:nth-of-type(39) {
+ animation-delay: 0.0525255144s;
+ left: calc((100% - 5em) * 0.76);
+}
+
+.particle:nth-of-type(40) {
+ animation-delay: 0.9705385115s;
+ left: calc((100% - 5em) * 0.78);
+}
+
+.particle:nth-of-type(41) {
+ animation-delay: 0.1259729542s;
+ left: calc((100% - 5em) * 0.8);
+}
+
+.particle:nth-of-type(42) {
+ animation-delay: 0.1141745678s;
+ left: calc((100% - 5em) * 0.82);
+}
+
+.particle:nth-of-type(43) {
+ animation-delay: 0.7594892565s;
+ left: calc((100% - 5em) * 0.84);
+}
+
+.particle:nth-of-type(44) {
+ animation-delay: 0.4772574602s;
+ left: calc((100% - 5em) * 0.86);
+}
+
+.particle:nth-of-type(45) {
+ animation-delay: 0.9495687908s;
+ left: calc((100% - 5em) * 0.88);
+}
+
+.particle:nth-of-type(46) {
+ animation-delay: 0.0726774091s;
+ left: calc((100% - 5em) * 0.9);
+}
+
+.particle:nth-of-type(47) {
+ animation-delay: 0.6217245527s;
+ left: calc((100% - 5em) * 0.92);
+}
+
+.particle:nth-of-type(48) {
+ animation-delay: 0.3120535427s;
+ left: calc((100% - 5em) * 0.94);
+}
+
+.particle:nth-of-type(49) {
+ animation-delay: 0.6152128756s;
+ left: calc((100% - 5em) * 0.96);
+}
+
+.particle:nth-of-type(50) {
+ animation-delay: 0.34306107s;
left: calc((100% - 5em) * 0.98);
}
@@ -1500,14 +2030,17 @@ input[type=text]:focus::placeholder {
opacity: 0;
transform: translateY(0) scale(1);
}
+
25% {
opacity: 1;
}
+
to {
opacity: 0;
transform: translateY(-10em) scale(0);
}
}
+
canvas#ghost {
position: fixed;
height: 100vh;
@@ -1523,13 +2056,16 @@ canvas#ghost {
0% {
background-position: 0% 50%;
}
+
50% {
background-position: 100% 50%;
}
+
100% {
background-position: 0% 50%;
}
}
+
html {
height: 100%;
padding: 0;
@@ -1539,17 +2075,20 @@ body {
height: 100%;
margin: 0;
font-size: 18px;
- background-image: linear-gradient(160deg, #2353f3, #092ea7);
+ background-image: linear-gradient(-60deg, #2353f3, #062077);
background-attachment: fixed;
}
+
body.error {
background-image: linear-gradient(45deg, #ff1d79, #2353f3);
background-size: 200% 200%;
animation: gradient 1s ease infinite;
}
+
body.spooky {
background-image: linear-gradient(3deg, #020024 4%, #e03d12 14%, #b57027 26%, #852167 40%, #191558 70%, #000003 100%);
}
+
body.paddy {
background-color: #0b9a00;
background-image: linear-gradient(115deg, #086c00 0%, #0db300 100%);
@@ -1588,9 +2127,11 @@ progress {
.co .flag-1 {
fill: #EFC944;
}
+
.co .flag-2 {
fill: #0F2D7C;
}
+
.co .flag-3 {
fill: #B83F47;
}
@@ -1598,9 +2139,11 @@ progress {
.de .flag-1 {
fill: #000000;
}
+
.de .flag-2 {
fill: #DD0000;
}
+
.de .flag-3 {
fill: #FFCE00;
}
@@ -1609,10 +2152,12 @@ body.paddy .flag-1,
.ie .flag-1 {
fill: #ff5a0e;
}
+
body.paddy .flag-2,
.ie .flag-2 {
fill: #FFFFFF;
}
+
body.paddy .flag-3,
.ie .flag-3 {
fill: #00ff1a;
@@ -1621,9 +2166,11 @@ body.paddy .flag-3,
.we .flag-1 {
fill: #FFFFFF;
}
+
.we .flag-2 {
fill: #D30731;
}
+
.we .flag-3 {
fill: #00AD36;
}
@@ -1631,17 +2178,19 @@ body.paddy .flag-3,
.pride .flag-1 {
fill: #e81416;
}
+
.pride .flag-2 {
fill: #ffa500;
}
+
.pride .flag-3 {
fill: #faeb36;
}
+
.pride .flag-4 {
fill: #79c314;
}
+
.pride .flag-5 {
fill: #487de7;
}
-
-/*# sourceMappingURL=data:application/json;charset=utf-8,%7B%22version%22:3,%22sourceRoot%22:%22%22,%22sources%22:%5B%22file:///Users/ericgeorge/Development/PlayRequest/assets/css/app.scss%22,%22file:///Users/ericgeorge/Development/PlayRequest/assets/css/animations.scss%22,%22file:///Users/ericgeorge/Development/PlayRequest/assets/css/type.scss%22,%22file:///Users/ericgeorge/Development/PlayRequest/assets/css/variables.scss%22,%22file:///Users/ericgeorge/Development/PlayRequest/assets/css/layout.scss%22,%22file:///Users/ericgeorge/Development/PlayRequest/assets/css/track.scss%22,%22file:///Users/ericgeorge/Development/PlayRequest/assets/css/form.scss%22,%22file:///Users/ericgeorge/Development/PlayRequest/assets/css/setup-list.scss%22,%22file:///Users/ericgeorge/Development/PlayRequest/assets/css/alert.scss%22,%22file:///Users/ericgeorge/Development/PlayRequest/assets/css/pie.scss%22,%22file:///Users/ericgeorge/Development/PlayRequest/assets/css/fire.scss%22,%22file:///Users/ericgeorge/Development/PlayRequest/assets/css/ghost.scss%22%5D,%22names%22:%5B%5D,%22mappings%22:%22;AAAA;ACAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOA;AAAA;AAAA;AAAA;AAAA;AAKA;EACE;IAEE;IACA;;EAEF;IACE;;EAEF;IACE;;EAEF;IACE;;EAEF;IACE;;EAEF;IACE;;;AAIJ;AAAA;AAAA;AAAA;AAAA;AAKA;EACE;IACE;;EAEF;IACE;;EAEF;IACE;;EAEF;IACE;;EAEF;IACE;;EAEF;IACE;;;AAIJ;AAAA;AAAA;AAAA;AAAA;AAKA;EACE;IACE;IACA;IACA;;EAEF;IACE;IACA;IACA;;EAEF;IACE;IACA;;EAEF;IACE;IACA;;EAEF;IACE;IACA;;EAEF;IACE;IACA;;EAEF;IACE;IACA;;EAEF;IACE;IACA;;;AAIJ;AAAA;AAAA;AAAA;AAAA;AAKA;EACE;IACE;IACA;IACA;;EAEF;IACE;IACA;IACA;;;AAIJ;AAAA;AAAA;AAAA;AAAA;AAKA;EACE;IACE;;EAEF;IACE;;EAEF;IACE;;;AAIJ;AAAA;AAAA;AAAA;AAAA;AAKA;EACE;IACE;;EAEF;IACE;;;AAIJ;EACE;IACE;;EAEF;IACE;;EAEF;IACE;;EAEF;IACE;;EAEF;IACE;;EAEF;IACE;;EAEF;IACE;;EAEF;IACE;;EAEF;IACE;;EAEF;IACE;;EAEF;IACE;;;AAIJ;EACE;IAGE;;EAEF;IAEE;;;AAIJ;EACE;IAGE;;EAEF;IAEE;;;AAIJ;EACE;IACE;;EAEF;IACE;;EAEF;IACE;;EAEF;IACE;;EAEF;IACE;;EAEF;IACE;;EAEF;IACE;;;ACpOJ;EACE,aAJiB;EAKjB,KACE;AACwD;EAC1D;;AAEF;EACE,aAZY;EAaZ,KACE;AAC4D;EAC9D;;AAGF;EACE,aApBY;EAqBZ,KACE;AACyD;EAC3D;;AAGF;EACE;EACA;EACA;;;AAGF;AAAA;AAAA;AAAA;EAIE;EACA;EACA;EACA;EACA,OCzCM;ED0CN;;;AAEF;EACE;EACA;;AACA;EACE;;;AAGJ;EACE;EACA;EACA;;;AAEF;EACE;EACA;;;AAGA;EACE;;;AAGJ;EACE;EACA;;AACA;EACE;;AAEF;EACE;;;AAGJ;EACE;;;AAEF;EACE;EACA,OChFM;;;ADmFR;AAAA;EAEE;;;AAGF;AAAA;EAEE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEF;EACE,cC9GI;;ADiHN;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;;AAGF;EACE,kBChII;EDiIJ,OC5HG;ED6HH,cClII;EDmIJ;EACA;EACA;;AAEA;EACE;;;AAKN;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE,OCrJI;EDsJJ;;;AAIJ;EACE;IACE;IACA;;EAEA;IACE;;;AAKN;EACE;EACA;EAEA;EACA,YCnKW;;ADqKX;EACE;;AAGF;EACE;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;;AAGJ;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA,YChMK;EDiML;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;;AAIJ;EACE;;AACA;EACE,YC5NE;ED6NF;;;AE7NN;EACE;;;AAEF;EAGE;EACA;EACA;;;AAEF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EAEA;EACA;EAEA,qBACE;;AAGF;EAbF;IAcI;IACA;IACA;IACA,qBACE;;;AAIJ;EACE;;;AAIJ;EACE;EACA;EACA;EAEA;EAQA;EACA;;AAPA;EAPF;IAQI;;;AASF;EACE;;;AAIJ;AAAA;EAEE;;;AAEF;AAAA;EAEE;;;AAEF;EACE;;;AAEF;EACE;EACA;EACA;EACA;;AAEA;EANF;IAOI;IACA;;;;AAIJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EARF;IASI;IACA;IACA;IACA;;;AAGJ;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;;;AAIJ;EACE;EACA;EACA;EACA;EACA,YDhIK;ECiIL;EACA;;AAEA;EACE;EACA;;AAEA;EACE;;;AAKN;EAUE;EACA;EACA,YDxJW;ECyJX;EACA;;AAbA;EACE;EACA;EACA;EACA;;AAEF;EACE;;AAQF;EACE;EACA;EACA;EACA;EACA,YDtKO;ECuKP;;AACA;EACE;;;AAKN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;ACpMF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA,YFTK;EEUL;EACA;EACA;EAEA;EACA;EACA;EACA;;AACA;EACE;;AAGF;EAEE;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAEF;EACE,YFlCG;;AEoCL;EACE,YFvCO;;;AE2CX;EACE;EACA;EACA;EACA;EACA,YFpDM;EEqDN;EACA,OF9CK;EE+CL;EACA;;AAEA;EACE;EACA;;AAIF;EACE,OF5DG;;AE+DL;EACE,OFhEG;;AEkEL;EACE;;AAIF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA,OF9FI;;AE+FJ;EACE;EACA;;AAGF;EACE,OFpGC;;AEuGH;EACE;;AACA;EACE;;AAKN;EACE,OFjHI;EEkHJ,YF3GS;;AE6GT;EACE;;AAIJ;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EAEA;;AAEA;EACE;EACA;;AAIJ;EACE;EACA;EACA;EAEA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAEA;EAPF;IAQI;IACA;IACA;;;AAMA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;;AAKF;EACE;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIN;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA,YF3NG;EE4NH;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAIJ;EACE;EACA;EACA;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;;AAIJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EAEA,YFjRG;EEmRH;;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAEF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA,OFxTI;EEyTJ,YFvTO;EEwTP;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE,OFnUC;;AEqUH;EACE,OFvUC;;;AE4UP;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;;AAKF;EAEE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAEF;EACE;EACA;;;AAIJ;AAAA;EAEE;;;AAGF;AAAA;EAEE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AACA;EACE;;AAIJ;EACE;;;AC9cJ;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EAEA,OHTK;EGUL;EACA,YACE;;AAGF;EACE;EACA;;AAGF;EACE;EACA,kBH9BI;;AGgCJ;EACE;;AAIJ;EACE;EACA;EACA;;AAGF;EACE,kBH5CI;;;AIAR;EACE;EACA;;AAEA;EACE;EACA;EACA;;;AAIJ;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AA7BF;EACE;EACA;;AAEA;EACE;EACA;EACA;;;AAIJ;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AC7BF;EACE;;AAEA;EAHF;IAII;IACA;IACA;;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAEF;EACE;EACA;;AAEF;EACE;EACA;;AAEF;EACE;;;AAIJ;EACE;EACA;EAEA,OLjCK;EKkCL;EACA,YLpCW;EKsCX;;;AAEF;EACE,YL/CK;;;AKkDP;EACE,OLpDM;;;AKuDR;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;;;AC/EF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EAEA;EAKA;;AAOF;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;;AAGJ;AAAA;EAEE;EACA;EACA;;;AAEF;EACE;EACA,YACE;;;AAIJ;EACE;EAKA;;;AAMF;EACE;EACA;EACA;;;AAGF;EACE;;;AAEF;EACE,iBACE;;;AAGJ;EACE;;;AAEF;EACE;IACE;;;ACnFJ;EACE;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA,OAfS;EAgBT,QAhBS;EAiBT;;AAGE;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;AAFF;EACE;EACA;;;AAIN;EACE;IACE;IACA;;EAEF;IACE;;EAEF;IACE;IACA;;;AC1CJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AXOF;EACE;IACE;;EAEF;IACE;;EAEF;IACE;;;AAIJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;EAEA;EACA;;AAEA;EACE;EACA;EACA;;AAGF;EACE;;AAUF;EACE;EACA;;;AAKJ;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;AAAA;EAEE;;;AAEF;EACE;;;AAEF;EACE;;;AAIA;EACE;;AAEF;EACE;;AAEF;EACE;;;AAKF;EACE;;AAEF;EACE;;AAEF;EACE;;;AAMF;AAAA;EACE;;AAEF;AAAA;EACE;;AAEF;AAAA;EACE;;;AAKF;EACE;;AAEF;EACE;;AAEF;EACE;;;AAKF;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE%22,%22file%22:%22app.css%22%7D */
diff --git a/priv/static/fonts/BoogieBoysExtrude.otf b/priv/static/fonts/BoogieBoysExtrude.otf
new file mode 100644
index 0000000..4476ad3
Binary files /dev/null and b/priv/static/fonts/BoogieBoysExtrude.otf differ
diff --git a/priv/static/fonts/BoogieBoysRegular.otf b/priv/static/fonts/BoogieBoysRegular.otf
new file mode 100644
index 0000000..2466edb
Binary files /dev/null and b/priv/static/fonts/BoogieBoysRegular.otf differ
diff --git a/priv/static/fonts/BoogieBoysShadow.otf b/priv/static/fonts/BoogieBoysShadow.otf
new file mode 100644
index 0000000..d3aeb8c
Binary files /dev/null and b/priv/static/fonts/BoogieBoysShadow.otf differ
diff --git a/priv/static/fonts/Neon.ttf b/priv/static/fonts/Neon.ttf
new file mode 100644
index 0000000..cdd5904
Binary files /dev/null and b/priv/static/fonts/Neon.ttf differ