Slang/simplesnake/simplesnake.css
Alex A. Naanou beef8bfd16 added scoring...
Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
2017-04-15 16:53:13 +03:00

82 lines
1.3 KiB
CSS
Executable File

body.hints:before,
body.hints:after {
display: block;
position: absolute;
left: 0;
top: 12.5%;
bottom: 12.5%;
z-index: 100;
}
body.hints:before {
content: "";
width: 100%;
border-top: dashed 0.5vmin red;
border-bottom: dashed 0.5vmin red;
}
body.hints:after {
content: "↺↻";
width: 37vmin;
right: 50%;
left: auto;
overflow: visible;
border-right: dashed 0.5vmin red;
color: rgba(255, 0, 0, 0.5);
font-size: 15vmin;
line-height: 70vmin;
white-space: pre;
letter-spacing: 50vmin;
}
.hints .simplesnake {
opacity: 0.3;
}
.hints .simplesnake:before,
.hints .simplesnake:after {
position: absolute;
display: block;
text-align: center;
width: 100vw;
color: red;
font-size: 5vh;
line-height: 10vh;
z-index: 100;
}
.hints .simplesnake:before {
content: "new level";
}
.hints .simplesnake:after {
bottom: 0;
content: "pause";
}
body {
font-family: sans-serif;
overflow: hidden;
}
.simplesnake .field {
position: relative;
left: 50%;
margin-left: -45vmin;
width: 90vmin;
height: 90vmin;
border: solid 1px silver;
}
.simplesnake[score]:after {
position: absolute;
display: block;
text-align: center;
width: 100vw;
color: gray;
font-size: 2vh;
line-height: 3vh;
content: "Top score: " attr(snake) ": " attr(score) " " attr(state);
opacity: 0.9;
}