xenofem
/
mindjack
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

rough draft of checkbox hack

mistress
Xenofem 2018-12-19 16:31:12 -05:00
parent 17d96b86e0
commit e615061555
1 changed files with 43 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

69
follow/index.html
View File

@ -2,42 +2,57 @@
<head> <head>
<style> <style>
body { body {
background-color: black; background-color: black;
} }
#logo { #logo {
height: 70px; height: 70px;
width: 70px; width: 70px;
} }
#light { #light {
background: red; background: red;
box-shadow: 0 0 80px red, 0 0 30px FireBrick, 0 0 6px DarkRed; box-shadow: 0 0 80px red, 0 0 30px FireBrick, 0 0 6px DarkRed;
border-radius: 50%; border-radius: 50%;
height: 80px; height: 80px;
width: 80px; width: 80px;
} }
.swing { .swing {
position: absolute; position: absolute;
top: 50%; top: 50%;
animation: swing 4s ease-in-out infinite, spin 2s linear infinite; animation: swing 4s ease-in-out infinite, spin 2s linear infinite;
} }
@keyframes swing { @keyframes swing {
0% { 0% {
left: 90%; left: 90%;
} }
50% { 50% {
left: 10%; left: 10%;
} }
100% { 100% {
left: 90%; left: 90%;
} }
} }
@keyframes spin { @keyframes spin {
0% { 0% {
transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg);
} }
100% { 100% {
transform: translate(-50%, -50%) rotate(360deg); transform: translate(-50%, -50%) rotate(360deg);
} }
}
input[type=checkbox] {
width: 100%;
height: 100%;
opacity: 0;
}
#controls {
display: none;
position: absolute;
bottom: 10px;
left: 10px;
}
input[type=checkbox]:checked ~ #controls {
display: block;
} }
</style> </style>
</head> </head>
@ -59,5 +74,7 @@
</g> </g>
</svg> </svg>
</div> </div>
<input type="checkbox">
<div id="controls"><a href="..">back</a></div>
</body> </body>
</html> </html>