Skip to content
Snippets Groups Projects
Commit 7b2f6dd5 authored by Jan G's avatar Jan G
Browse files
parents 183c2971 9a4499c8
No related merge requests found
...@@ -11,50 +11,50 @@ ...@@ -11,50 +11,50 @@
margin: 2em; margin: 2em;
min-width: 1000px; min-width: 1000px;
} }
h1 { h1 {
color: rebeccapurple; color: rebeccapurple;
margin: 2em 0; margin: 2em 0;
} }
.labels { .labels {
margin: 2em 0; margin: 2em 0;
} }
label { label {
display: block; display: block;
padding: 1em 0; padding: 1em 0;
} }
label span { label span {
display: inline-block; display: inline-block;
width: 4em; width: 4em;
} }
label, label,
input, input,
select { select {
font-size: 1rem; font-size: 1rem;
} }
input, input,
select { select {
vertical-align: middle; vertical-align: middle;
width: calc(1000px - 6em); width: calc(1000px - 6em);
margin-left: 2em; margin-left: 2em;
} }
canvas { canvas {
border: solid gray 1px; border: solid gray 1px;
} }
.lds-ellipsis { .lds-ellipsis {
display: inline-block; display: inline-block;
position: relative; position: relative;
width: 64px; width: 64px;
height: 64px; height: 64px;
} }
.lds-ellipsis div { .lds-ellipsis div {
position: absolute; position: absolute;
top: 27px; top: 27px;
...@@ -64,27 +64,27 @@ ...@@ -64,27 +64,27 @@
background: #AAA; background: #AAA;
animation-timing-function: cubic-bezier(0, 1, 1, 0); animation-timing-function: cubic-bezier(0, 1, 1, 0);
} }
.lds-ellipsis div:nth-child(1) { .lds-ellipsis div:nth-child(1) {
left: 6px; left: 6px;
animation: lds-ellipsis1 0.6s infinite; animation: lds-ellipsis1 0.6s infinite;
} }
.lds-ellipsis div:nth-child(2) { .lds-ellipsis div:nth-child(2) {
left: 6px; left: 6px;
animation: lds-ellipsis2 0.6s infinite; animation: lds-ellipsis2 0.6s infinite;
} }
.lds-ellipsis div:nth-child(3) { .lds-ellipsis div:nth-child(3) {
left: 26px; left: 26px;
animation: lds-ellipsis2 0.6s infinite; animation: lds-ellipsis2 0.6s infinite;
} }
.lds-ellipsis div:nth-child(4) { .lds-ellipsis div:nth-child(4) {
left: 45px; left: 45px;
animation: lds-ellipsis3 0.6s infinite; animation: lds-ellipsis3 0.6s infinite;
} }
@keyframes lds-ellipsis1 { @keyframes lds-ellipsis1 {
0% { 0% {
transform: scale(0); transform: scale(0);
...@@ -93,7 +93,7 @@ ...@@ -93,7 +93,7 @@
transform: scale(1); transform: scale(1);
} }
} }
@keyframes lds-ellipsis3 { @keyframes lds-ellipsis3 {
0% { 0% {
transform: scale(1); transform: scale(1);
...@@ -102,7 +102,7 @@ ...@@ -102,7 +102,7 @@
transform: scale(0); transform: scale(0);
} }
} }
@keyframes lds-ellipsis2 { @keyframes lds-ellipsis2 {
0% { 0% {
transform: translate(0, 0); transform: translate(0, 0);
...@@ -206,7 +206,7 @@ ...@@ -206,7 +206,7 @@
const dangerZone = document.querySelector('.dangerZone'); const dangerZone = document.querySelector('.dangerZone');
const adjacencyRadius = document.querySelector('.adjacencyRadius'); const adjacencyRadius = document.querySelector('.adjacencyRadius');
const pointThresholdSlider = document.querySelector('.pointThreshold'); const pointThresholdSlider = document.querySelector('.pointThreshold');
var stopOnCollision = false; var stopOnCollision = false;
var play = true; var play = true;
// const scl = .5; // const scl = .5;
...@@ -293,7 +293,7 @@ ...@@ -293,7 +293,7 @@
ctx.beginPath(); ctx.beginPath();
ctx.strokeStyle = '#000'; ctx.strokeStyle = '#000';
ctx.arc(width / 2, height / 2, 15*scl.value, 0, 2 * Math.PI); ctx.arc(width / 2, height / 2, 15*scl.value, 0, 2 * Math.PI);
ctx.fillStyle = stripedPatternCircle; ctx.fillStyle = stripedPatternCircle;
ctx.fill(); ctx.fill();
ctx.stroke(); ctx.stroke();
ctx.closePath(); ctx.closePath();
...@@ -474,4 +474,4 @@ ...@@ -474,4 +474,4 @@
</body> </body>
</html> </html>
\ No newline at end of file
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment