diff options
Diffstat (limited to 'js/panels/Timeline/TimelinePanel.reel/css')
-rw-r--r-- | js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css | 685 |
1 files changed, 412 insertions, 273 deletions
diff --git a/js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css b/js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css index 2e420b98..d2a31033 100644 --- a/js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css +++ b/js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css | |||
@@ -1,297 +1,436 @@ | |||
1 | @charset "UTF-8"; | ||
1 | /* <copyright> | 2 | /* <copyright> |
2 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> | 3 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> |
3 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> | 4 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> |
4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | 5 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. |
5 | </copyright> */ | 6 | </copyright> */ |
7 | /* TimelinePanel.scss | ||
8 | * Main SCSS file for TimelinePanel component, compiled by SASS into the file css/TimelinePanel.css. | ||
9 | */ | ||
10 | /* line 22, ../scss/TimelinePanel.scss */ | ||
11 | .tl_container { | ||
12 | display: -webkit-box; | ||
13 | -webkit-box-orient: vertical; | ||
14 | height: 100%; | ||
15 | } | ||
16 | |||
17 | /* line 27, ../scss/TimelinePanel.scss */ | ||
18 | .maintimeline { | ||
19 | -webkit-box-flex: 1; | ||
20 | display: -webkit-box; | ||
21 | -webkit-box-orient: horizontal; | ||
22 | height: 100%; | ||
23 | position: relative; | ||
24 | margin-top: 1px; | ||
25 | } | ||
26 | |||
27 | /* line 35, ../scss/TimelinePanel.scss */ | ||
28 | .leftinside { | ||
29 | height: 100%; | ||
30 | width: 100%; | ||
31 | display: -webkit-box; | ||
32 | -webkit-box-orient: vertical; | ||
33 | position: absolute; | ||
34 | overflow: hidden; | ||
35 | } | ||
6 | 36 | ||
7 | .tl_container{ | 37 | /* line 43, ../scss/TimelinePanel.scss */ |
8 | display: -webkit-box; | 38 | .rightinside { |
9 | -webkit-box-orient: vertical; | 39 | height: 100%; |
10 | height: 100%; | 40 | width: 100%; |
11 | } | 41 | display: -webkit-box; |
12 | .maintimeline{ | 42 | -webkit-box-orient: vertical; |
13 | -webkit-box-flex: 1; | 43 | position: absolute; |
14 | display: -webkit-box; | ||
15 | -webkit-box-orient: horizontal; | ||
16 | height : 100%; | ||
17 | position: relative; | ||
18 | margin-top:1px; | ||
19 | } | ||
20 | .leftinside{ | ||
21 | height: 100%; | ||
22 | width: 100%; | ||
23 | display: -webkit-box; | ||
24 | -webkit-box-orient: vertical; | ||
25 | position:absolute; | ||
26 | overflow: hidden; | ||
27 | } | ||
28 | .rightinside{ | ||
29 | height: 100%; | ||
30 | width: 100%; | ||
31 | display: -webkit-box; | ||
32 | -webkit-box-orient: vertical; | ||
33 | position:absolute; | ||
34 | } | ||
35 | .tl_leftpane{ | ||
36 | min-width: 200px; | ||
37 | max-width: 500px; | ||
38 | position: relative; | ||
39 | overflow: hidden; | ||
40 | -webkit-box-flex: 0; | ||
41 | } | ||
42 | .tl_rightpane{ | ||
43 | width: 100%; | ||
44 | position: relative; | ||
45 | -webkit-box-flex: 1; | ||
46 | } | 44 | } |
47 | 45 | ||
46 | /* line 50, ../scss/TimelinePanel.scss */ | ||
47 | .tl_leftpane { | ||
48 | min-width: 200px; | ||
49 | max-width: 500px; | ||
50 | position: relative; | ||
51 | overflow: hidden; | ||
52 | -webkit-box-flex: 0; | ||
53 | } | ||
54 | |||
55 | /* line 57, ../scss/TimelinePanel.scss */ | ||
56 | .tl_rightpane { | ||
57 | width: 100%; | ||
58 | position: relative; | ||
59 | -webkit-box-flex: 1; | ||
60 | } | ||
61 | |||
62 | /* line 63, ../scss/TimelinePanel.scss */ | ||
48 | #bottomPanelContainer { | 63 | #bottomPanelContainer { |
49 | overflow: hidden !IMPORTANT; | 64 | overflow: hidden !IMPORTANT; |
50 | } | 65 | } |
51 | 66 | ||
67 | /* line 67, ../scss/TimelinePanel.scss */ | ||
52 | .layout-tracks { | 68 | .layout-tracks { |
53 | width: 100%; | 69 | width: 100%; |
54 | height: 100%; | 70 | height: 100%; |
55 | padding-bottom: 6px; | 71 | padding-bottom: 6px; |
56 | box-sizing: border-box; | 72 | box-sizing: border-box; |
57 | overflow: auto; | 73 | overflow: auto; |
58 | position: relative; | 74 | position: relative; |
59 | } | 75 | } |
60 | .tl_layertracks{ | 76 | |
61 | background-color: #222; | 77 | /* line 75, ../scss/TimelinePanel.scss */ |
62 | height: 100%; | 78 | .tl_layertracks { |
63 | width: 100%; | 79 | background-color: #292929; |
64 | -webkit-box-flex: 1; | 80 | height: 100%; |
65 | padding-top: 21px; | 81 | width: 100%; |
66 | box-sizing: border-box; | 82 | -webkit-box-flex: 1; |
67 | } | 83 | padding-top: 21px; |
68 | .layerresizer{ | 84 | box-sizing: border-box; |
69 | height: auto; | 85 | } |
70 | width:6px; | 86 | |
71 | border-right-style: solid; | 87 | /* line 83, ../scss/TimelinePanel.scss */ |
72 | border-right-color: #333; | 88 | .layerresizer { |
73 | border-right-width: thin; | 89 | height: auto; |
74 | border-left-style: solid; | 90 | width: 6px; |
75 | border-left-color: #000; | 91 | border-right-style: solid; |
76 | border-left-width: thin; | 92 | border-right-color: #3a3a3a; |
77 | background-color: #222; | 93 | border-right-width: thin; |
78 | cursor: col-resize; | 94 | border-left-style: solid; |
79 | -webkit-box-flex: 0; | 95 | border-left-color: black; |
80 | } | 96 | border-left-width: thin; |
81 | .timelinecontroller{ | 97 | background-color: #232323; |
82 | height:20px; | 98 | cursor: col-resize; |
83 | background-color: #222; | 99 | -webkit-box-flex: 0; |
84 | -webkit-box-flex: 0; | 100 | } |
85 | border-bottom-style: solid; | 101 | |
86 | border-bottom-width: thin; | 102 | /* line 96, ../scss/TimelinePanel.scss */ |
87 | border-bottom-color: #000; | 103 | .timelinecontroller { |
88 | } | 104 | height: 20px; |
89 | .timelinecontrols{ | 105 | background-color: #474747; |
90 | width: 100%; | 106 | -webkit-box-flex: 0; |
91 | padding-left: 6px; | 107 | border-bottom-style: solid; |
92 | padding-top: 2px; | 108 | border-bottom-width: thin; |
93 | height: 18px; | 109 | border-bottom-color: black; |
94 | background-color: #222; | ||
95 | float: left; | ||
96 | } | ||
97 | .timetext{ | ||
98 | float: right; | ||
99 | padding-right: 10px; | ||
100 | color: white; | ||
101 | } | ||
102 | .rewindbutton{ | ||
103 | background-image: url('../images/play_prev.png'); | ||
104 | background-repeat: no-repeat; | ||
105 | height: 18px; | ||
106 | width: 18px; | ||
107 | float: left; | ||
108 | padding-right: 5px; | ||
109 | } | ||
110 | .playbutton{ | ||
111 | background-image: url('../images/play.png'); | ||
112 | background-repeat: no-repeat; | ||
113 | height: 18px; | ||
114 | width: 18px; | ||
115 | float: left; | ||
116 | padding-right: 5px; | ||
117 | } | ||
118 | .pausebutton{ | ||
119 | background-image: url('../images/pause.png'); | ||
120 | background-repeat: no-repeat; | ||
121 | height: 18px; | ||
122 | width: 18px; | ||
123 | float: left; | ||
124 | padding-right: 5px; | ||
125 | } | ||
126 | .forwardbutton{ | ||
127 | background-image: url('../images/play_next.png'); | ||
128 | background-repeat: no-repeat; | ||
129 | height: 18px; | ||
130 | width: 18px; | ||
131 | float: left; | ||
132 | padding-right: 5px; | ||
133 | } | ||
134 | .timelinemarkers{ | ||
135 | height: 20px; | ||
136 | width: 100%; | ||
137 | background-color: #222; | ||
138 | border-bottom-style: solid; | ||