japanese-drum-game/public/src/css/titlescreen.css

58 lines
949 B
CSS
Raw Normal View History

2018-09-18 06:37:59 +08:00
@keyframes toggleFade{
40%{
opacity: 1;
}
70%{
opacity: 0.2;
}
2015-07-17 16:22:46 +08:00
}
#title-screen{
2018-09-18 06:37:59 +08:00
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: flex;
justify-content: center;
align-items: center;
2018-10-28 19:54:15 +08:00
background-color: #1389f0;
background-repeat: no-repeat;
background-position: center;
2018-09-18 06:37:59 +08:00
background-size: cover;
cursor: pointer;
}
2019-01-28 09:57:18 +08:00
#logo{
width: 100vmin;
height: calc(100vmin / 1170 * 390);
2015-07-17 16:22:46 +08:00
}
2018-09-18 06:37:59 +08:00
.click-to-continue{
2018-10-09 14:59:36 +08:00
position: absolute;
2019-01-28 19:43:18 +08:00
bottom: 15%;
2018-09-18 06:37:59 +08:00
color: #fff;
font-size: 8vmin;
text-align: center;
z-index: 1;
animation: toggleFade 2s infinite ease-in-out;
2015-07-17 16:22:46 +08:00
}
2018-09-18 06:37:59 +08:00
.click-to-continue::before{
-webkit-text-stroke: 0.25em #f00;
2018-10-09 14:59:36 +08:00
filter: blur(0.3vmin);
}
2019-01-28 19:43:18 +08:00
#title-disclaimer {
text-align: center;
position: absolute;
bottom: 5%;
color: #fff;
z-index: 1;
}
#title-disclaimer span {
color: #fff;
font-size: 2vmin;
text-align: center;
display: block;
}
#title-disclaimer span:before {
left: initial;
filter: blur(0.1vmin);
}