Optimized pictures, improved compatibility with mobile browsers, added hints

This commit is contained in:
DarkCat09 2021-08-13 14:34:50 +04:00
parent 06d5469978
commit 17ce3ba86d
7 changed files with 123 additions and 27 deletions

View file

@ -18,6 +18,11 @@ body {
bottom: 0;
background-color: #001;
font-family: 'Montserrat', sans-serif;
--topmenu-bg: rgba(81, 75, 144, 0.4);
--popups-rgb: 34;
--popups-alpha: 0.8;
--hint-alpha: 0.4;
--popups-bg: rgba(var(--popups-rgb), var(--popups-rgb), var(--popups-rgb), var(--popups-alpha));
}
img.logo {
@ -32,7 +37,7 @@ img.logo {
margin: 10px;
border-radius: 5px;
position: fixed;
background-color: #514b9066;
background-color: var(--topmenu-bg);
z-index: 998;
}
.top-menu {
@ -57,12 +62,11 @@ img.logo {
.context-menu-like {
margin: 0;
padding: 0;
/*display: none;*/
opacity: 0;
pointer-events: none;
position: absolute;
border-radius: 5px;
background-color: #222222d4;
background-color: var(--popups-bg);
}
.context-menu-like ul {
margin: 0;
@ -142,6 +146,38 @@ span.minecraft-text {
font-weight: 500;
}
.hint {
position: absolute;
pointer-events: none;
top: 40%;
left: 35%;
margin: 0;
padding: 0;
background-color: rgba(var(--popups-rgb),var(--popups-rgb),var(--popups-rgb),var(--hint-alpha));
backdrop-filter: blur(4px);
border-radius: 5px;
opacity: 0;
transition: opacity 0.4s ease-out 0s;
z-index: 1000;
}
.hint > span {
margin: 0;
padding: 5px;
color: #fff;
font-family: 'Montserrat', sans-serif;
font-size: 1.7em;
}
#stars {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: -1;
}
.space-obj {
position: fixed;
text-align: center;
@ -150,8 +186,7 @@ span.minecraft-text {
z-index: 997;
}
.space-obj > img {
/* 360 degrees in 20 minutes (instead of 23 hours) */
animation: rotate 1200s linear 0s infinite normal;
animation: rotate 480s linear 0s infinite normal;
/* unselectable */
-webkit-touch-callout: none;