A suite to track Project Diva score statistics and ratings / D4DJ event data.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 
projectdivar/frontend/src/App.css

137 lines
2.0 KiB

body{
background-color: #0d194a;
background-image: url("http://45.33.13.215/stars.png");
font-family: Copperplate,Verdana;
color: #fff;
text-shadow:
0 0 1px #aaa,
0 0 2px #aaa,
0 0 4px #aaa,
0 0 8px #ccc,
0 0 16px #ccc,
0 0 18px #ccc,
0 0 20px #ccc,
0 0 30px #ccc;
}
.starbox{
opacity:0.5;
background-color:#0d194a;
color:#fff;
}
.starbox:hover{
border: 1px white solid;
opacity:0.8;
background-color:#0d194a;
color:#fff;
}
.header{
font: 32px ACROTSRG;
font-weight: bold;
}
@font-face {
font-family: ACROTSRG;
src: local('ACROTSRG'), url(./fonts/ACROTSRG.TTF) format('truetype');
}
.glowHeavy {
color: #fff;
text-shadow:
0 0 5px #fff,
0 0 10px #fff,
0 0 20px #fff,
0 0 40px #0ff,
0 0 80px #0ff,
0 0 90px #0ff,
0 0 100px #0ff,
0 0 150px #0ff;
}
.glowLight {
color: #fff;
text-shadow:
0 0 1px #aaa,
0 0 2px #aaa,
0 0 4px #aaa,
0 0 8px #ccc,
0 0 16px #ccc,
0 0 18px #ccc,
0 0 20px #ccc,
0 0 30px #ccc;
}
.fadein {
animation-name: fadein;
animation-duration: 4s;
}
.fadein3 {
animation-name: fadein;
animation-duration: 4s;
animation-iteration-count: 3;
}
.slowblink{
animation-name: slowblink;
animation-duration: 2s;
animation-iteration-count: infinite;
}
.longfadein {
animation-name: fadein;
animation-duration: 8s;
}
@keyframes fadein {
0% {opacity:0;}
100% {opacity:1;}
}
@keyframes slowblink {
0% {opacity:0;}
50% {opacity:1;}
100% {opacity:0;}
}
.stars {
}
.App {
text-align: center;
}
.App-logo {
height: 40vmin;
pointer-events: none;
}
@media (prefers-reduced-motion: no-preference) {
.App-logo {
animation: App-logo-spin infinite 20s linear;
}
}
.App-header {
background-color: #282c34;
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-size: calc(10px + 2vmin);
color: white;
}
.App-link {
color: #61dafb;
}
@keyframes App-logo-spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}