blob: 0c6f4e5ac49f9bca8625bc49e968a8d287c179b2 (
plain)
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
94
95
96
97
98
99
100
101
|
/* Copyright (c) 2014 The Chromium Authors. All rights reserved.
* Use of this source code is governed by a BSD-style license that can be
* found in the LICENSE file.
*/
body {
height: calc(100% - 12px);
overflow: auto;
}
html {
height: 100%;
}
.summary-log-container {
width: 50%;
height: 100%;
overflow-y: auto;
float: left;
}
#text-log-container {
position: fixed;
top: 32px;
left: 16px;
right: 16px;
bottom: 32px;
border: 1px solid gray;
box-shadow: 0px 4px 10px 4px rgba(0,0,0,0.3);
background-color: white;
overflow: scroll;
}
#text-log {
padding: 8px;
}
.selectable {
-webkit-user-select: text;
cursor: text;
}
.key-div {
border-radius: 4px;
border: 1px solid rgba(0, 0, 0, 0.3);
padding: 2px;
margin-right: 2px;
display: inline-block;
}
.char-event {
background-color: #DDF;
}
.key-up {
background-color: #DFD;
}
.key-up::before {
content: "\2011"; /** non-breaking hyphen */
}
.key-down {
background-color: #FDD;
}
.key-down::before {
content: "+";
}
.key-down.unreleased {
background-color: #F77;
}
.key-down.unreleased::before {
content: "!";
}
.chord-div {
margin-top: 8px;
}
.chord-div:not(.all-keys-released)::after {
content: "..."
}
.chord-div.all-keys-released::after {
content: " \2714"; /* tick */
color: green;
}
.chord-div.some-keys-still-pressed::after {
content: " \2716"; /* cross */
color: red;
}
.controls {
position: absolute;
right: 8px;
top: 8px;
}
|