author | ymh <ymh.work@gmail.com> |
Tue, 15 Nov 2016 17:42:57 +0100 | |
changeset 424 | feb0d3e0fef9 |
parent 373 | e952c8a31a2b |
child 454 | 710a2ae08a74 |
permissions | -rw-r--r-- |
246
5b7ae96768be
Bsic transcript-component design
Chloe Laisne <chloe.laisne@gmail.com>
parents:
245
diff
changeset
|
1 |
.transcript-component { |
373
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
2 |
background-color: $corpus-light-grey; |
247
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
3 |
padding: 0px; |
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
4 |
width: 554px; |
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
5 |
box-sizing: border-box; |
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
6 |
} |
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
7 |
|
254 | 8 |
body.videoscreen .transcript-component { |
9 |
overflow: scroll; |
|
10 |
} |
|
11 |
||
247
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
12 |
.transcript-component h2 { |
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
13 |
position: absolute; |
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
14 |
z-index: 1; |
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
15 |
width: inherit; |
373
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
16 |
background: linear-gradient($corpus-light-grey, $corpus-light-grey 50%, transparent); |
256
18f0c3ee9aa5
Add title translation to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
255
diff
changeset
|
17 |
padding-top: 12px; |
18f0c3ee9aa5
Add title translation to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
255
diff
changeset
|
18 |
padding-bottom: 66px; |
254 | 19 |
line-height: 30px; |
256
18f0c3ee9aa5
Add title translation to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
255
diff
changeset
|
20 |
margin: 0px!important; |
373
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
21 |
color: $corpus-blue; |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
22 |
font-weight: bold; |
256
18f0c3ee9aa5
Add title translation to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
255
diff
changeset
|
23 |
} |
18f0c3ee9aa5
Add title translation to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
255
diff
changeset
|
24 |
|
373
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
25 |
.transcript-component h2 .translation{ |
256
18f0c3ee9aa5
Add title translation to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
255
diff
changeset
|
26 |
display: block; |
373
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
27 |
font-weight: normal; |
254 | 28 |
} |
29 |
||
30 |
body.videoscreen .transcript-component h2 { |
|
31 |
padding-bottom: 0px; |
|
32 |
position: static; |
|
246
5b7ae96768be
Bsic transcript-component design
Chloe Laisne <chloe.laisne@gmail.com>
parents:
245
diff
changeset
|
33 |
} |
5b7ae96768be
Bsic transcript-component design
Chloe Laisne <chloe.laisne@gmail.com>
parents:
245
diff
changeset
|
34 |
|
247
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
35 |
.transcript-component .transcript { |
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
36 |
margin: 0px; |
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
37 |
padding: 154px 20px 0px 20px; |
246
5b7ae96768be
Bsic transcript-component design
Chloe Laisne <chloe.laisne@gmail.com>
parents:
245
diff
changeset
|
38 |
} |
5b7ae96768be
Bsic transcript-component design
Chloe Laisne <chloe.laisne@gmail.com>
parents:
245
diff
changeset
|
39 |
|
254 | 40 |
body.videoscreen .transcript-component .transcript { |
41 |
padding-top: 0px; |
|
42 |
} |
|
43 |
||
258
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
44 |
.transcript-component .transcript h3 { |
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
45 |
padding: 20px 20px 20px 64px; |
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
46 |
font-weight: bold; |
373
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
47 |
color: $corpus-blue; |
258
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
48 |
font-size: 12px; |
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
49 |
line-height: 24px; |
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
50 |
} |
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
51 |
|
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
52 |
.transcript-component .transcript .annotations { |
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
53 |
list-style: none; |
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
54 |
margin: 0px; |
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
55 |
padding: 0px; |
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
56 |
} |
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
57 |
|
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
58 |
.transcript-component .transcript .annotations .sentence { |
248
256272c33349
Transcript sentence lick and play
Chloe Laisne <chloe.laisne@gmail.com>
parents:
247
diff
changeset
|
59 |
padding: 20px 20px 20px 64px; |
373
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
60 |
color: $corpus-black; |
247
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
61 |
position: relative; |
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
62 |
background-color: transparent; |
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
63 |
transition: background-color .15s, color .15s; |
254 | 64 |
min-height: 24px; |
247
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
65 |
} |
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
66 |
|
258
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
67 |
.transcript-component .transcript .annotations .sentence:not(.active):hover { |
248
256272c33349
Transcript sentence lick and play
Chloe Laisne <chloe.laisne@gmail.com>
parents:
247
diff
changeset
|
68 |
cursor: pointer; |
373
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
69 |
background-color: $corpus-grey; |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
70 |
color: $corpus-white; |
248
256272c33349
Transcript sentence lick and play
Chloe Laisne <chloe.laisne@gmail.com>
parents:
247
diff
changeset
|
71 |
} |
256272c33349
Transcript sentence lick and play
Chloe Laisne <chloe.laisne@gmail.com>
parents:
247
diff
changeset
|
72 |
|
258
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
73 |
.transcript-component .transcript .annotations .sentence.active { |
373
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
74 |
background-color: $corpus-blue; |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
75 |
color: $corpus-white; |
257
eba9edbd8f46
Add title to annotation
Chloe Laisne <chloe.laisne@gmail.com>
parents:
256
diff
changeset
|
76 |
pointer-events: none; |
246
5b7ae96768be
Bsic transcript-component design
Chloe Laisne <chloe.laisne@gmail.com>
parents:
245
diff
changeset
|
77 |
} |
5b7ae96768be
Bsic transcript-component design
Chloe Laisne <chloe.laisne@gmail.com>
parents:
245
diff
changeset
|
78 |
|
373
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
79 |
|
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
80 |
.transcript-component .transcript .annotations .sentence.active .translation { |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
81 |
color: $corpus-white; |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
82 |
font-weight: normal; |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
83 |
} |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
84 |
|
258
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
85 |
.transcript-component .transcript .annotations .sentence .words { |
255
ed05b89e3299
Add words to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
254
diff
changeset
|
86 |
font-size: 0px; |
373
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
87 |
margin: 10px 0px; |
255
ed05b89e3299
Add words to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
254
diff
changeset
|
88 |
} |
ed05b89e3299
Add words to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
254
diff
changeset
|
89 |
|
258
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
90 |
.transcript-component .transcript .annotations .sentence .words .word { |
255
ed05b89e3299
Add words to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
254
diff
changeset
|
91 |
display: inline-block; |
ed05b89e3299
Add words to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
254
diff
changeset
|
92 |
} |
ed05b89e3299
Add words to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
254
diff
changeset
|
93 |
|
373
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
94 |
.transcript-component .transcript .annotations .sentence .original { |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
95 |
font-weight: bold; |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
96 |
} |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
97 |
|
258
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
98 |
.transcript-component .transcript .annotations .sentence .words .word .original, |
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
99 |
.transcript-component .transcript .annotations .sentence .words .word .translation { |
373
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
100 |
background-color: $corpus-black; |
255
ed05b89e3299
Add words to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
254
diff
changeset
|
101 |
padding: 0px 4px; |
ed05b89e3299
Add words to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
254
diff
changeset
|
102 |
margin-right: 2px; |
373
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
103 |
margin-bottom: 1px; |
255
ed05b89e3299
Add words to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
254
diff
changeset
|
104 |
font-size: 12px; |
ed05b89e3299
Add words to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
254
diff
changeset
|
105 |
} |
ed05b89e3299
Add words to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
254
diff
changeset
|
106 |
|
373
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
107 |
.transcript-component .transcript .annotations .sentence:hover .words .word .original, |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
108 |
.transcript-component .transcript .annotations .sentence:hover .words .word .translation { |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
109 |
background-color: $corpus-white; |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
110 |
color: $corpus-grey; |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
111 |
} |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
112 |
|
258
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
113 |
.transcript-component .transcript .annotations .sentence.active .words .word .original, |
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
114 |
.transcript-component .transcript .annotations .sentence.active .words .word .translation { |
373
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
115 |
background-color: $corpus-white; |
255
ed05b89e3299
Add words to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
254
diff
changeset
|
116 |
} |
ed05b89e3299
Add words to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
254
diff
changeset
|
117 |
|
258
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
118 |
.transcript-component .transcript .annotations .sentence .words .word { |
373
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
119 |
color: $corpus-white; |
255
ed05b89e3299
Add words to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
254
diff
changeset
|
120 |
} |
ed05b89e3299
Add words to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
254
diff
changeset
|
121 |
|
373
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
122 |
.transcript-component .transcript .annotations .sentence .words .word p { |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
123 |
line-height: 20px; |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
124 |
} |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
125 |
|
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
126 |
.transcript-component .transcript .annotations .sentence.active .words .word .original, |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
127 |
.transcript-component .transcript .annotations .sentence.active .words .word .translation { |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
128 |
color: $corpus-blue; |
255
ed05b89e3299
Add words to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
254
diff
changeset
|
129 |
} |
ed05b89e3299
Add words to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
254
diff
changeset
|
130 |
|
258
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
131 |
.transcript-component .transcript .annotations .sentence .words .word .translation { |
373
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
132 |
margin-bottom: 2px; |
247
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
133 |
} |
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
134 |
|
258
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
135 |
.transcript-component .transcript .annotations .sentence .fa-play { |
247
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
136 |
position: absolute; |
373
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
137 |
border-style: solid; |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
138 |
border-width: 2px; |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
139 |
border-color: $corpus-black; |
247
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
140 |
border-radius: 100%; |
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
141 |
width: 24px; |
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
142 |
height: 24px; |
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
143 |
line-height: 20px; |
248
256272c33349
Transcript sentence lick and play
Chloe Laisne <chloe.laisne@gmail.com>
parents:
247
diff
changeset
|
144 |
left: 20px; |
256272c33349
Transcript sentence lick and play
Chloe Laisne <chloe.laisne@gmail.com>
parents:
247
diff
changeset
|
145 |
cursor: pointer; |
373
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
146 |
opacity: 1; |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
147 |
color: $corpus-black; |
247
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
148 |
} |
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
149 |
|
258
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
150 |
.transcript-component .transcript .annotations .sentence .fa-play::before { |
248
256272c33349
Transcript sentence lick and play
Chloe Laisne <chloe.laisne@gmail.com>
parents:
247
diff
changeset
|
151 |
margin-left: 3px; |
247
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
152 |
} |
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
153 |
|
258
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
154 |
.transcript-component .transcript .annotations .sentence:not(.active):hover .fa-play { |
373
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
155 |
border-color: $corpus-white; |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
156 |
color: $corpus-white; |
247
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
157 |
} |
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
158 |
|
258
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
159 |
.transcript-component .transcript .annotations .sentence p { |
247
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
160 |
margin: 0; |
7a5d729992b8
Design and animate transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
246
diff
changeset
|
161 |
line-height: 24px; |
257
eba9edbd8f46
Add title to annotation
Chloe Laisne <chloe.laisne@gmail.com>
parents:
256
diff
changeset
|
162 |
} |
eba9edbd8f46
Add title to annotation
Chloe Laisne <chloe.laisne@gmail.com>
parents:
256
diff
changeset
|
163 |
|
258
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
164 |
.transcript-component .transcript .annotations .sentence .speaker { |
257
eba9edbd8f46
Add title to annotation
Chloe Laisne <chloe.laisne@gmail.com>
parents:
256
diff
changeset
|
165 |
font-weight: bold; |
eba9edbd8f46
Add title to annotation
Chloe Laisne <chloe.laisne@gmail.com>
parents:
256
diff
changeset
|
166 |
} |
eba9edbd8f46
Add title to annotation
Chloe Laisne <chloe.laisne@gmail.com>
parents:
256
diff
changeset
|
167 |
|
258
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
168 |
.transcript-component .transcript .annotations .sentence .title { |
257
eba9edbd8f46
Add title to annotation
Chloe Laisne <chloe.laisne@gmail.com>
parents:
256
diff
changeset
|
169 |
float: right; |
eba9edbd8f46
Add title to annotation
Chloe Laisne <chloe.laisne@gmail.com>
parents:
256
diff
changeset
|
170 |
line-height: 24px; |
eba9edbd8f46
Add title to annotation
Chloe Laisne <chloe.laisne@gmail.com>
parents:
256
diff
changeset
|
171 |
padding-left: 20px; |
373
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
172 |
color: $corpus-grey; |
257
eba9edbd8f46
Add title to annotation
Chloe Laisne <chloe.laisne@gmail.com>
parents:
256
diff
changeset
|
173 |
font-weight: bold; |
eba9edbd8f46
Add title to annotation
Chloe Laisne <chloe.laisne@gmail.com>
parents:
256
diff
changeset
|
174 |
} |
eba9edbd8f46
Add title to annotation
Chloe Laisne <chloe.laisne@gmail.com>
parents:
256
diff
changeset
|
175 |
|
258
12c694392e8e
Add topic to transcript
Chloe Laisne <chloe.laisne@gmail.com>
parents:
257
diff
changeset
|
176 |
.transcript-component .transcript .annotations .sentence.active .title { |
373
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
177 |
color: $corpus-white; |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
178 |
} |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
179 |
|
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
180 |
.transcript-component .transcript .annotations .sentence:not(.active):hover .title { |
e952c8a31a2b
Transcript design + Fix video display and filter component font
Chloe Laisne <chloe.laisne@gmail.com>
parents:
303
diff
changeset
|
181 |
color: $corpus-white; |
246
5b7ae96768be
Bsic transcript-component design
Chloe Laisne <chloe.laisne@gmail.com>
parents:
245
diff
changeset
|
182 |
} |