prismarine-web-client/styles.css
u9g 48538f573f
Remove css from index.html (#54)
* Remove css from index.html

* Create styles.css

* Update webpack.config.js
2021-03-04 05:07:07 +01:00

128 lines
2 KiB
CSS

@font-face {
font-family: minecraft;
src: url(minecraftia.woff);
}
@font-face {
font-family: mojangles;
src: url(mojangles.ttf);
}
html {
overflow: hidden;
}
html,
body {
height: 100%;
margin: 0;
padding: 0;
}
canvas {
height: 100%;
width: 100%;
font-size: 0;
margin: 0;
padding: 0;
}
.chat-wrapper {
position: fixed;
background-color: rgba(0, 0, 0, 0.5);
}
.chat-display-wrapper {
bottom: calc(8px * 16);
padding: 4px;
max-height: calc(90px * 8);
width: calc(320px * 4);
}
.chat-input-wrapper {
bottom: calc(2px * 16);
width: 100%;
overflow: hidden;
background-color: rgba(0, 0, 0, 0);
}
.chat {
overflow: hidden;
color: white;
font-size: 16px;
margin: 0px;
line-height: 100%;
text-shadow: 2px 2px 0px #3f3f3f;
font-family: mojangles, minecraft, monospace;
width: 100%;
max-height: calc(90px * 8)
}
input[type=text] {
background-color: rgba(0, 0, 0, 0.5);
display: none;
}
li {
display: block;
}
#crosshair {
image-rendering: optimizeSpeed;
image-rendering: -moz-crisp-edges;
image-rendering: -webkit-optimize-contrast;
image-rendering: -o-crisp-edges;
image-rendering: pixelated;
-ms-interpolation-mode: nearest-neighbor;
position: absolute;
top: 50%;
left: 50%;
height: calc(256px * 4);
width: calc(256px * 4);
transform: translate(calc(-50% + 120px * 4), calc(-50% + 120px * 4));
clip-path: inset(0px calc(240px * 4) calc(240px * 4) 0px);
}
h1 {
font-family: mojangles, minecraft, monospace;
}
.loader {
display: initial;
}
#loading-image {
height: 75%;
top: 50%;
left: 50%;
position: absolute;
transform: translate(-50%, -50%);
image-rendering: crisp-edges;
image-rendering: -webkit-crisp-edges;
}
#loading-background {
background-color: #60a490;
z-index: 100;
height: 100% !important;
width: 100%;
position: fixed;
}
#loading-text {
color: #29594b;
z-index: 200;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, 12rem);
}
body {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}