diff options
Diffstat (limited to 'js/panels')
-rw-r--r-- | js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css | 115 | ||||
-rw-r--r-- | js/panels/Timeline/TimelinePanel.reel/scss/TimelinePanel.scss | 9 |
2 files changed, 67 insertions, 57 deletions
diff --git a/js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css b/js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css index eeb8a9ad..f9f5e98c 100644 --- a/js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css +++ b/js/panels/Timeline/TimelinePanel.reel/css/TimelinePanel.css | |||
@@ -6,16 +6,11 @@ All Rights Reserved. | |||
6 | Redistribution and use in source and binary forms, with or without | 6 | Redistribution and use in source and binary forms, with or without |
7 | modification, are permitted provided that the following conditions are met: | 7 | modification, are permitted provided that the following conditions are met: |
8 | 8 | ||
9 | * Redistributions of source code must retain the above copyright notice, | 9 | * Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer. |
10 | this list of conditions and the following disclaimer. | ||
11 | 10 | ||
12 | * Redistributions in binary form must reproduce the above copyright notice, | 11 | * Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution. |
13 | this list of conditions and the following disclaimer in the documentation | ||
14 | and/or other materials provided with the distribution. | ||
15 | 12 | ||
16 | * Neither the name of Motorola Mobility LLC nor the names of its | 13 | * Neither the name of Motorola Mobility LLC nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission. |
17 | contributors may be used to endorse or promote products derived from this | ||
18 | software without specific prior written permission. | ||
19 | 14 | ||
20 | THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" | 15 | THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" |
21 | AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE | 16 | AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE |
@@ -30,138 +25,150 @@ ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE | |||
30 | POSSIBILITY OF SUCH DAMAGE. | 25 | POSSIBILITY OF SUCH DAMAGE. |
31 | </copyright> */ | 26 | </copyright> */ |
32 | /* TimelinePanel.scss Main SCSS file for TimelinePanel component, compiled by SASS into the file css/TimelinePanel.css. */ | 27 | /* TimelinePanel.scss Main SCSS file for TimelinePanel component, compiled by SASS into the file css/TimelinePanel.css. */ |
33 | /* line 22, ../scss/TimelinePanel.scss */ | 28 | /* line 47, ../scss/TimelinePanel.scss */ |
34 | .tl_container { display: -webkit-box; -webkit-box-orient: vertical; height: 100%; } | 29 | .tl_container { display: -webkit-box; -webkit-box-orient: vertical; height: 100%; } |
35 | 30 | ||
36 | /* line 27, ../scss/TimelinePanel.scss */ | 31 | /* line 52, ../scss/TimelinePanel.scss */ |
37 | .maintimeline { -webkit-box-flex: 1; display: -webkit-box; -webkit-box-orient: horizontal; height: 100%; position: relative; margin-top: 1px; } | 32 | .maintimeline { -webkit-box-flex: 1; display: -webkit-box; -webkit-box-orient: horizontal; height: 100%; position: relative; margin-top: 1px; } |
38 | 33 | ||
39 | /* line 35, ../scss/TimelinePanel.scss */ | 34 | /* line 60, ../scss/TimelinePanel.scss */ |
40 | .leftinside { height: 100%; width: 100%; display: -webkit-box; -webkit-box-orient: vertical; position: absolute; overflow: hidden; } | 35 | .leftinside { height: 100%; width: 100%; display: -webkit-box; -webkit-box-orient: vertical; position: absolute; overflow: hidden; } |
41 | 36 | ||
42 | /* line 43, ../scss/TimelinePanel.scss */ | 37 | /* line 68, ../scss/TimelinePanel.scss */ |
43 | .rightinside { height: 100%; width: 100%; display: -webkit-box; -webkit-box-orient: vertical; position: absolute; } | 38 | .rightinside { height: 100%; width: 100%; display: -webkit-box; -webkit-box-orient: vertical; position: absolute; } |
44 | 39 | ||
45 | /* line 50, ../scss/TimelinePanel.scss */ | 40 | /* line 75, ../scss/TimelinePanel.scss */ |
46 | .tl_leftpane { min-width: 210px; max-width: 500px; position: relative; overflow: hidden; -webkit-box-flex: 0; } | 41 | .tl_leftpane { min-width: 210px; max-width: 500px; position: relative; overflow: hidden; -webkit-box-flex: 0; } |
47 | 42 | ||
48 | /* line 57, ../scss/TimelinePanel.scss */ | 43 | /* line 82, ../scss/TimelinePanel.scss */ |
49 | .tl_rightpane { width: 100%; position: relative; -webkit-box-flex: 1; } | 44 | .tl_rightpane { width: 100%; position: relative; -webkit-box-flex: 1; } |
50 | 45 | ||
51 | /* line 63, ../scss/TimelinePanel.scss */ | 46 | /* line 88, ../scss/TimelinePanel.scss */ |
52 | #bottomPanelContainer { overflow: hidden !IMPORTANT; } | 47 | #bottomPanelContainer { overflow: hidden !IMPORTANT; } |
53 | 48 | ||
54 | /* line 67, ../scss/TimelinePanel.scss */ | 49 | /* line 92, ../scss/TimelinePanel.scss */ |
55 | .layout-tracks { width: 100%; height: 100%; padding-bottom: 6px; box-sizing: border-box; overflow: auto; position: relative; } | 50 | .layout-tracks { width: 100%; height: 100%; padding-bottom: 6px; box-sizing: border-box; overflow: auto; position: relative; } |
56 | 51 | ||
57 | /* line 75, ../scss/TimelinePanel.scss */ | 52 | /* line 100, ../scss/TimelinePanel.scss */ |
58 | .tl_layertracks { background-color: #292929; height: 100%; width: 100%; -webkit-box-flex: 1; padding-top: 21px; box-sizing: border-box; } | 53 | .tl_layertracks { background-color: #292929; height: 100%; width: 100%; -webkit-box-flex: 1; padding-top: 21px; box-sizing: border-box; } |
59 | 54 | ||
60 | /* line 83, ../scss/TimelinePanel.scss */ | 55 | /* line 108, ../scss/TimelinePanel.scss */ |
61 | .layerresizer { height: auto; width: 6px; border-right-style: solid; border-right-color: #3a3a3a; border-right-width: thin; border-left-style: solid; border-left-color: black; border-left-width: thin; background-color: #232323; cursor: col-resize; -webkit-box-flex: 0; } | 56 | .layerresizer { height: auto; width: 6px; border-right-style: solid; border-right-color: #3a3a3a; border-right-width: thin; border-left-style: solid; border-left-color: black; border-left-width: thin; background-color: #232323; cursor: col-resize; -webkit-box-flex: 0; } |
62 | 57 | ||
63 | /* line 96, ../scss/TimelinePanel.scss */ | 58 | /* line 121, ../scss/TimelinePanel.scss */ |
64 | .timelinecontroller { height: 20px; background-color: #474747; -webkit-box-flex: 0; border-bottom-style: solid; border-bottom-width: thin; border-bottom-color: black; } | 59 | .timelinecontroller { height: 20px; background-color: #474747; -webkit-box-flex: 0; border-bottom-style: solid; border-bottom-width: thin; border-bottom-color: black; } |
65 | 60 | ||
66 | /* line 104, ../scss/TimelinePanel.scss */ | 61 | /* line 129, ../scss/TimelinePanel.scss */ |
67 | .timelinecontrols { width: 100%; padding-left: 6px; padding-top: 2px; height: 18px; background-color: #474747; float: left; } | 62 | .timelinecontrols { width: 100%; padding-left: 6px; padding-top: 2px; height: 18px; background-color: #474747; float: left; } |
68 | 63 | ||
69 | /* line 112, ../scss/TimelinePanel.scss */ | 64 | /* line 137, ../scss/TimelinePanel.scss */ |
70 | .timetext { float: right; padding-right: 10px; color: white; } | 65 | .timetext { float: right; padding-right: 10px; color: white; } |
71 | 66 | ||
72 | /* line 117, ../scss/TimelinePanel.scss */ | 67 | /* line 142, ../scss/TimelinePanel.scss */ |
73 | .rewindbutton { background-image: url("../images/play_prev.png"); background-repeat: no-repeat; height: 18px; width: 18px; float: left; padding-right: 5px; } | 68 | .rewindbutton { background-image: url("../images/play_prev.png"); background-repeat: no-repeat; height: 18px; width: 18px; float: left; padding-right: 5px; } |
74 | 69 | ||
75 | /* line 125, ../scss/TimelinePanel.scss */ | 70 | /* line 150, ../scss/TimelinePanel.scss */ |
76 | .playbutton { background-image: url("../images/play.png"); background-repeat: no-repeat; height: 18px; width: 18px; float: left; padding-right: 5px; } | 71 | .playbutton { background-image: url("../images/play.png"); background-repeat: no-repeat; height: 18px; width: 18px; float: left; padding-right: 5px; } |
77 | 72 | ||
78 | /* line 133, ../scss/TimelinePanel.scss */ | 73 | /* line 158, ../scss/TimelinePanel.scss */ |
79 | .pausebutton { background-image: url("../images/pause.png"); background-repeat: no-repeat; height: 18px; width: 18px; float: left; padding-right: 5px; } | 74 | .pausebutton { background-image: url("../images/pause.png"); background-repeat: no-repeat; height: 18px; width: 18px; float: left; padding-right: 5px; } |
80 | 75 | ||
81 | /* line 141, ../scss/TimelinePanel.scss */ | 76 | /* line 166, ../scss/TimelinePanel.scss */ |
82 | .forwardbutton { background-image: url("../images/play_next.png"); background-repeat: no-repeat; height: 18px; width: 18px; float: left; padding-right: 5px; } | 77 | .forwardbutton { background-image: url("../images/play_next.png"); background-repeat: no-repeat; height: 18px; width: 18px; float: left; padding-right: 5px; } |
83 | 78 | ||
84 | /* line 149, ../scss/TimelinePanel.scss */ | 79 | /* line 174, ../scss/TimelinePanel.scss */ |
85 | .timelinemarkers { height: 20px; width: 100%; background-color: #474747; border-bottom-style: solid; border-bottom-width: thin; border-bottom-color: black; -webkit-box-flex: 0; position: absolute; background-image: url("../images/timetick.jpg"); overflow: visible; } | 80 | .timelinemarkers { height: 20px; width: 100%; background-color: #474747; border-bottom-style: solid; border-bottom-width: thin; border-bottom-color: black; -webkit-box-flex: 0; position: absolute; background-image: url("../images/timetick.jpg"); overflow: visible; } |
86 | 81 | ||
87 | /* line 161, ../scss/TimelinePanel.scss */ | 82 | /* line 186, ../scss/TimelinePanel.scss */ |
88 | .layout_markers { position: absolute; overflow: hidden; top: 0px; left: 0px; height: 20px; width: 100%; border-bottom-style: solid; } | 83 | .layout_markers { position: absolute; overflow: hidden; top: 0px; left: 0px; height: 20px; width: 100%; border-bottom-style: solid; } |
89 | 84 | ||
90 | /* line 171, ../scss/TimelinePanel.scss */ | 85 | /* line 196, ../scss/TimelinePanel.scss */ |
91 | .masterlayer { font-family: 'Droid Sans'; font-size: 12px; text-shadow: 1px 1px 1px black; height: 18px; background-color: #474747; border-bottom-style: solid; border-bottom-width: thin; border-bottom-color: #3a3a3a; color: white; padding-left: 15px; padding-top: 2px; } | 86 | .masterlayer { font-family: 'Droid Sans'; font-size: 12px; text-shadow: 1px 1px 1px black; height: 18px; background-color: #474747; border-bottom-style: solid; border-bottom-width: thin; border-bottom-color: #3a3a3a; color: white; padding-left: 15px; padding-top: 2px; } |
92 | 87 | ||
93 | /* line 184, ../scss/TimelinePanel.scss */ | 88 | /* line 209, ../scss/TimelinePanel.scss */ |
94 | .mastertrack { -webkit-box-flex: 0; color: white; height: 20px; width: 100%; border-bottom-style: solid; border-bottom-width: thin; border-bottom-color: #3a3a3a; background-color: #232323; background-image: url("../../Track.reel/images/gridline.jpg"); } | 89 | .mastertrack { -webkit-box-flex: 0; color: white; height: 20px; width: 100%; border-bottom-style: solid; border-bottom-width: thin; border-bottom-color: #3a3a3a; background-color: #232323; background-image: url("../../Track.reel/images/gridline.jpg"); } |
95 | 90 | ||
96 | /* line 198, ../scss/TimelinePanel.scss */ | 91 | /* line 223, ../scss/TimelinePanel.scss */ |
97 | .container-tracks, .timelinemarkers, .mastertrack { width: 2000px; } | 92 | .container-tracks, .timelinemarkers, .mastertrack { width: 2000px; } |
98 | 93 | ||
99 | /* line 201, ../scss/TimelinePanel.scss */ | 94 | /* line 226, ../scss/TimelinePanel.scss */ |
100 | .userlayers { width: 100%; background-color: #292929; -webkit-box-flex: 1; overflow: hidden; border-bottom-style: solid; border-bottom-width: thin; border-bottom-color: black; } | 95 | .userlayers { width: 100%; background-color: #292929; -webkit-box-flex: 1; overflow: hidden; border-bottom-style: solid; border-bottom-width: thin; border-bottom-color: black; } |
101 | 96 | ||
102 | /* line 210, ../scss/TimelinePanel.scss */ | 97 | /* line 235, ../scss/TimelinePanel.scss */ |
103 | .timelinegutter { height: 16px; padding-top: 1px; padding-left: 6px; -webkit-box-flex: 0; background-color: #474747; border-top-style: solid; border-top-width: thin; border-top-color: #3a3a3a; } | 98 | .timelinegutter { height: 16px; padding-top: 1px; padding-left: 6px; -webkit-box-flex: 0; background-color: #474747; border-top-style: solid; border-top-width: thin; border-top-color: #3a3a3a; } |
104 | 99 | ||
105 | /* line 220, ../scss/TimelinePanel.scss */ | 100 | /* line 245, ../scss/TimelinePanel.scss */ |
106 | .newlayerbutton { background-image: url("../images/plus.png"); background-repeat: no-repeat; height: 16px; width: 16px; float: left; padding-right: 5px; } | 101 | .newlayerbutton { background-image: url("../images/plus.png"); background-repeat: no-repeat; height: 16px; width: 16px; float: left; padding-right: 5px; } |
107 | 102 | ||
108 | /* line 228, ../scss/TimelinePanel.scss */ | 103 | /* line 253, ../scss/TimelinePanel.scss */ |
109 | .deletelayerbutton { background-image: url("../images/trash.png"); background-repeat: no-repeat; height: 16px; width: 16px; float: left; padding-right: 5px; } | 104 | .deletelayerbutton { background-image: url("../images/trash.png"); background-repeat: no-repeat; height: 16px; width: 16px; float: left; padding-right: 5px; } |
110 | 105 | ||
111 | /* line 236, ../scss/TimelinePanel.scss */ | 106 | /* line 261, ../scss/TimelinePanel.scss */ |
112 | .tracktick { height: 100%; width: 15px; border-right-color: #3a3a3a; border-right-style: solid; border-right-width: thin; float: left; } | 107 | .tracktick { height: 100%; width: 15px; border-right-color: #3a3a3a; border-right-style: solid; border-right-width: thin; float: left; } |
113 | 108 | ||
114 | /* line 244, ../scss/TimelinePanel.scss */ | 109 | /* line 269, ../scss/TimelinePanel.scss */ |
115 | .timemark { font-family: 'Droid Sans'; font-size: 12px; text-shadow: 1px 1px 1px #3a3a3a; width: 76px; color: gray; float: left; padding-top: 6px; padding-left: 4px; text-align: left; } | 110 | .timemark { font-family: 'Droid Sans'; font-size: 12px; text-shadow: 1px 1px 1px #3a3a3a; width: 76px; color: gray; float: left; padding-top: 6px; padding-left: 4px; text-align: left; } |
116 | 111 | ||
117 | /* line 255, ../scss/TimelinePanel.scss */ | 112 | /* line 280, ../scss/TimelinePanel.scss */ |
118 | .playhead { height: 14px; width: 6px; position: absolute; top: 6px; left: -3px; z-index: 92; background-color: #b50003; opacity: 0.5; visibility: hidden; } | 113 | .playhead { height: 14px; width: 6px; position: absolute; top: 6px; left: -3px; z-index: 92; background-color: #b50003; opacity: 0.5; visibility: hidden; } |
119 | 114 | ||
120 | /* line 266, ../scss/TimelinePanel.scss */ | 115 | /* line 291, ../scss/TimelinePanel.scss */ |
121 | .playheadmarker { height: 100%; width: 1px; background-color: white; top: 0; left: 0; position: absolute; z-index: 91; opacity: 0.7; } | 116 | .playheadmarker { height: 100%; width: 1px; background-color: white; top: 0; left: 0; position: absolute; z-index: 91; opacity: 0.7; } |
122 | 117 | ||
123 | /* line 276, ../scss/TimelinePanel.scss */ | 118 | /* line 301, ../scss/TimelinePanel.scss */ |
124 | .timebar { height: 3px; width: 0; background-color: #ff0003; opacity: 0.3; top: 10px; position: absolute; border-top: #c7a19f thin solid; border-right: #ffffff thin solid; } | 119 | .timebar { height: 3px; width: 0; background-color: #ff0003; opacity: 0.3; top: 10px; position: absolute; border-top: #c7a19f thin solid; border-right: #ffffff thin solid; } |
125 | 120 | ||
126 | /* line 286, ../scss/TimelinePanel.scss */ | 121 | /* line 311, ../scss/TimelinePanel.scss */ |
127 | .timelinegutter .endhottext { float: right; font-family: 'Droid Sans'; font-size: 12px; text-shadow: 1px 1px 1px #3a3a3a; color: white; margin-top: 0%; } | 122 | .timelinegutter .endhottext { float: right; font-family: 'Droid Sans'; font-size: 12px; text-shadow: 1px 1px 1px #3a3a3a; color: white; margin-top: 0%; } |
128 | 123 | ||
129 | /* line 294, ../scss/TimelinePanel.scss */ | 124 | /* line 319, ../scss/TimelinePa |