/
style.css
93 lines (83 loc) · 1.48 KB
/
style.css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
#blue_stim {
width: 15vw;
height: 20vw;
background: #0066CC;
}
#green_stim {
width: 15vw;
height: 20vw;
background: green;
}
.stim_left {
position:absolute;
top:50%;
left:50%;
transform: translate(-200%,-50%);
border-style: solid;
border-width: 6px;
border-color: transparent;
}
.stim_right {
position:absolute;
top:50%;
left:50%;
margin-right:-50%;
transform: translate(100%,-50%);
border-style: solid;
border-width: 6px;
border-color: transparent;
}
.selected {
border-color: red;
}
.stim_center {
position:absolute;
top:50%;
left:50%;
margin-right:-50%;
transform: translate(-50%,-50%);
}
#fb_holder {
width: 12vw;
height: 12vw;
background: gray;
-moz-border-radius: 8vw;
-webkit-border-radius: 8vw;
border-radius: 8vw;
}
.feedback_bar {
background: #eee;
color: red;
border: 0;
height: 2vw;
border-radius: 9px;
width: 60vw;
position:absolute;
top:50%;
left:50%;
margin-right:-50%;
transform: translate(-50%,700%);
}
.goal_1 {
width: .5vw;
height: 2vw;
background: grey;
position:absolute;
top:50%;
left:50%;
margin-right:-50%;
transform: translate(3000%,700%);
}
.goal_2 {
width: .5vw;
height: 2vw;
background: gold;
position:absolute;
top:50%;
left:50%;
margin-right:-50%;
transform: translate(4800%,700%);
}
progress::-webkit-progress-bar {background: #eee; }
progress::-webkit-progress-value { background: red; }
progress::-moz-progress-bar { background: red; }