Mercurial > hg > orthanc-stone

annotate Applications/StoneWebViewer/Resources/Styles/wv-timeline-controls.scss @ 1891:3716d72161d2

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
reorganization
author Sebastien Jodogne <s.jodogne@gmail.com>
date Wed, 19 Jan 2022 12:32:15 +0100
parents d1806b4e4839
children
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
1495
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
1 /* wv-timeline-controls directive */
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
2 .wv-timeline-controls {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
3 padding: 0.5em 0.5em 0.5em 0.5em;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
4 line-height: 1em;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
5 background-color: rgba(0, 0, 0, 0.66);
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
6
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
7 text-align: center;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
8
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
9 transition: color 500ms, background-color 500ms;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
10 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
11
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
12 .wv-timeline-controls:hover {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
13 background-color: rgba(0, 0, 0, 0.9);
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
14 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
15
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
16 // Used to make sure buttons doesn't break the style
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
17 .wv-timeline-controls-vertical-sizing {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
18 display: inline-block;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
19 line-height: 1em;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
20 font-size: 1em;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
21 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
22
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
23 .wv-timeline-controls-vflip {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
24 // flip only the icon
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
25 &:before, &:after{
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
26 transform: scaleX(-1);
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
27 display: inline-block;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
28 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
29 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
30
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
31 .wv-timeline-controls-button {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
32 display: inline-block;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
33 height: 1em;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
34 width: 1em;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
35 line-height: 1em;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
36 font-size: 1em;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
37 margin: 0;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
38
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
39 user-select: none;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
40 cursor: pointer;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
41 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
42
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
43 .wv-timeline-controls-input {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
44 height: 1em;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
45 width: 3em;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
46 padding: 0;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
47 padding-bottom: 1px;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
48 box-sizing: content-box;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
49
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
50 border: none;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
51 border-bottom: 1px solid hsla(35, 100%, 75%, 0.24);
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
52 background-color: transparent;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
53
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
54 text-align: right;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
55 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
56
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
57 // Display play button on the right side
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
58 .wv-timeline-controls-play-button-wrapper {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
59 float: right;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
60 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
61
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
62 /* wv-play-button directive */
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
63 .wv-play-button {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
64 display: inline-block;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
65 position: relative;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
66 line-height: 1em;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
67
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
68 // This is for the boxing box
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
69 height: 3em;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
70 width: 6em;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
71 padding-bottom: 1em;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
72 padding-left: 0.25em;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
73 padding-right: 0.25em;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
74 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
75
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
76 .wv-play-button:hover .wv-play-button-config-position-handler {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
77 visibility: visible;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
78 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
79
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
80 // This is a 0x0 div to set the position
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
81 .wv-play-button-config-position-handler {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
82 visibility: hidden;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
83 position: absolute;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
84 bottom: 3em;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
85 left: 1em;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
86 right: 0.5em;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
87 // z-index: 2;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
88 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
89
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
90 // The layout of play configuration
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
91 .wv-play-button-config {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
92 position: absolute;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
93 bottom: 0;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
94 left: -6em;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
95 width: 12em;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
96 padding: 1em;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
97 background-color: hsla(0,1,0, 0.5);
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
98 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
99
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
100 /* Style range input (see http://brennaobrien.com/blog/2014/05/style-input-type-range-in-every-browser.html) */
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
101
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
102 .wv-play-button-config-framerate-wrapper {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
103 display: inline-block;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
104 margin: 0.25em 0 0.5em 0;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
105 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
106 input[type="range"].wv-play-button-config-framerate {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
107 /*removes default webkit styles*/
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
108 -webkit-appearance: none;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
109
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
110 /*fix for FF unable to apply focus style bug */
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
111 border: 1px solid white;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
112
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
113 /*required for proper track sizing in FF*/
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
114 width: 10em;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
115 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
116 input[type="range"].wv-play-button-config-framerate::-webkit-slider-runnable-track {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
117 width: 10em;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
118 height: 5px;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
119 background: #ddd;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
120 border: none;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
121 border-radius: 3px;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
122 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
123 input[type="range"].wv-play-button-config-framerate::-webkit-slider-thumb {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
124 -webkit-appearance: none;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
125 border: none;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
126 height: 16px;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
127 width: 16px;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
128 border-radius: 50%;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
129 background: goldenrod;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
130 margin-top: -4px;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
131 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
132 input[type="range"].wv-play-button-config-framerate:focus {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
133 outline: none;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
134 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
135 input[type="range"].wv-play-button-config-framerate:focus::-webkit-slider-runnable-track {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
136 background: #ccc;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
137 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
138
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
139 input[type="range"].wv-play-button-config-framerate::-moz-range-track {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
140 width: 10em;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
141 height: 5px;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
142 background: #ddd;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
143 border: none;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
144 border-radius: 3px;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
145 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
146 input[type="range"].wv-play-button-config-framerate::-moz-range-thumb {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
147 border: none;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
148 height: 16px;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
149 width: 16px;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
150 border-radius: 50%;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
151 background: goldenrod;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
152 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
153
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
154 /*hide the outline behind the border*/
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
155 input[type="range"].wv-play-button-config-framerate:-moz-focusring{
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
156 outline: 1px solid white;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
157 outline-offset: -1px;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
158 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
159
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
160 input[type="range"].wv-play-button-config-framerate::-ms-track {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
161 width: 10em;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
162 height: 5px;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
163
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
164 /*remove bg colour from the track, we'll use ms-fill-lower and ms-fill-upper instead */
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
165 background: transparent;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
166
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
167 /*leave room for the larger thumb to overflow with a transparent border */
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
168 border-color: transparent;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
169 border-width: 6px 0;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
170
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
171 /*remove default tick marks*/
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
172 color: transparent;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
173 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
174 input[type="range"].wv-play-button-config-framerate::-ms-fill-lower {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
175 background: #777;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
176 border-radius: 10px;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
177 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
178 input[type="range"].wv-play-button-config-framerate::-ms-fill-upper {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
179 background: #ddd;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
180 border-radius: 10px;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
181 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
182 input[type="range"].wv-play-button-config-framerate::-ms-thumb {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
183 border: none;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
184 height: 16px;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
185 width: 16px;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
186 border-radius: 50%;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
187 background: goldenrod;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
188 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
189 input[type="range"].wv-play-button-config-framerate:focus::-ms-fill-lower {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
190 background: #888;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
191 }
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
192 input[type="range"].wv-play-button-config-framerate:focus::-ms-fill-upper {
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
193 background: #ccc;
fb74ed5d8c22 initial commit of the Stone Web viewer
Sebastien Jodogne <s.jodogne@gmail.com>
parents:
diff changeset
194 }