diff --git a/index.html b/index.html index f8cce9f..c64941f 100644 --- a/index.html +++ b/index.html @@ -4,6 +4,7 @@ jsTrr + @@ -14,25 +15,6 @@ -->
-

: @@ -48,17 +30,18 @@

- - - - - - - + + + + + + +
TimeSTEP
MissTarget
RatioHigh Score
TypesTrr Trial
SpeedSTEP Trial
Score
Comment
TimeSTEP
MissTarget
RatioHigh Score
TypesTrr Trial
SpeedSTEP Trial
Score
Comment
+
-
+ - + diff --git a/jstrr.css b/jstrr.css index 4f70273..c2be480 100644 --- a/jstrr.css +++ b/jstrr.css @@ -12,7 +12,7 @@ .wrapper.snow-inner{ position: relative; } -.snow { +/* .snow { background-color: #fff; border-radius: 50%; position: absolute; @@ -36,96 +36,29 @@ opacity: 0; top: 100vh; } +} */ +.blue{ + background-color: #81d4fa; } -/*.wrapper.snow-inner img:nth-child(2n+1){ - width: 13px; +.pink{ + background-color: #FFBCFF; } -.wrapper.snow-inner img:nth-child(2n){ - width: 15px; +.yellow{ + background-color: #FFFFB2; } -img .snow-part1{top: 0; left: 5%;} -img .snow-part2{top: 0; left: 12%;} -img .snow-part3{top: 0; left: 15%;} -img .snow-part4{top: 0; left: 22%;} -img .snow-part5{top: 0; left: 25%;} -img .snow-part6{top: 0; left: 28%;} -img .snow-part7{top: 0; left: 35%;} -img .snow-part8{top: 0; left: 40%;} -img .snow-part9{top: 0; left: 43%;} -img .snow-part10{top: 0; left: 50%;} -img .snow-part11{top: 0; left: 55%;} -img .snow-part12{top: 0; left: 60%;} -img .snow-part13{top: 0; left: 63%;} -img .snow-part14{top: 0; left: 70%;} -img .snow-part15{top: 0; left: 75%;} -img .snow-part16{top: 0; left: 81%;} -img .snow-part17{top: 0; left: 85%;} -img .snow-part18{top: 0; left: 90%;} -img .snow-part19{top: 0; left: 93%;} - -@keyframes animate-snow { - 0% { - opacity: 0; - } - 20% { - transform:translate(3px,30px) rotate(20deg); - opacity: 1; - } - 30% { - transform:translate(0,50px) rotate(50deg); - } - 50% { - transform:translate(-20px,100px) rotate(150deg); - } - 70% { - transform:translate(-40px,150px) rotate(-50deg); - opacity: .8; - } - 90% { - transform:translate(-60px,200px) rotate(-180deg); - } - 100% { - transform:translate(-70px,230px); - opacity: 0; - } +.green{ + background-color: #C4FF89; } -.snow-inner img { - animation: animate-snow linear 6s infinite; +.red{ + background-color: #FFB2D8; } -img.snow-part1,img.snow-part4,img.snow-part7,img.snow-part10,img.snow-part8,img.snow-part11,img.snow-part13,img.snow-part16,img.snow-part19{ - -webkit-animation-delay: 0s; - animation-delay: 0s; -} -img.snow-part2,img.snow-part5{ - -webkit-animation-delay: 1.5s; - animation-delay: 1.5s; -} -img.snow-part3,img.snow-part6,img.snow-part9,img.snow-part12{ - -webkit-animation-delay: 4s; - animation-delay: 4s; -} -img.snow-part8,img.snow-part11,img.snow-part13,img.snow-part16,img.snow-part19{ - -webkit-animation-delay: 0.5s; - animation-delay: 0.5s; -} -img.snow-part14,img.snow-part17{ - -webkit-animation-delay: 2s; - animation-delay: 2s; -} -img.snow-part15,img.snow-part18{ - -webkit-animation-delay: 5s; - animation-delay: 5s; -}*/ table{ margin: 0 auto; background-color: white; } -.login{ - background-color: rgb(142, 174, 235); - background-image: url(snow.png); - background-position: center; - background-repeat: no-repeat; - background-size: cover;} + i{ + margin-right: 4px; + } body.secret {background: black; color: white;} div#typing {margin: 1em 1ex; border-top: double cyan 5px;} div#typing pre {