diff options
Diffstat (limited to 'js/panels/Timeline')
-rw-r--r-- | js/panels/Timeline/Style.reel/Style.html | 2 | ||||
-rw-r--r-- | js/panels/Timeline/Style.reel/Style.js | 6 | ||||
-rw-r--r-- | js/panels/Timeline/Style.reel/css/Style.css | 52 | ||||
-rw-r--r-- | js/panels/Timeline/Style.reel/scss/Style.scss | 5 |
4 files changed, 26 insertions, 39 deletions
diff --git a/js/panels/Timeline/Style.reel/Style.html b/js/panels/Timeline/Style.reel/Style.html index cdc355e7..f141fc1c 100644 --- a/js/panels/Timeline/Style.reel/Style.html +++ b/js/panels/Timeline/Style.reel/Style.html | |||
@@ -80,7 +80,7 @@ | |||
80 | </div> | 80 | </div> |
81 | <div class="cell-value value-editor editor-color hidden"> | 81 | <div class="cell-value value-editor editor-color hidden"> |
82 | <div data-montage-id="value-editor-color"> | 82 | <div data-montage-id="value-editor-color"> |
83 | <div data-montage-id="fillColorCtrl" class="toolColorChipCtrl"></div> | 83 | <div data-montage-id="fillColorCtrl" class="toolColorChipCtrl color-chip-position"></div> |
84 | </div> | 84 | </div> |
85 | </div> | 85 | </div> |
86 | <div class="cell-value value-editor editor-input hidden"> | 86 | <div class="cell-value value-editor editor-input hidden"> |
diff --git a/js/panels/Timeline/Style.reel/Style.js b/js/panels/Timeline/Style.reel/Style.js index fe8d04e9..c8d323a9 100644 --- a/js/panels/Timeline/Style.reel/Style.js +++ b/js/panels/Timeline/Style.reel/Style.js | |||
@@ -400,8 +400,10 @@ var LayerStyle = exports.LayerStyle = Montage.create(Component, { | |||
400 | var currentValue = ElementsMediator.getColor(this.parentComponent.parentComponent.parentComponent.parentComponent.layerData.stageElement,this._isFill,this._borderSide) | 400 | var currentValue = ElementsMediator.getColor(this.parentComponent.parentComponent.parentComponent.parentComponent.layerData.stageElement,this._isFill,this._borderSide) |
401 | this.application.ninja.timeline.selectedStyle = this.editorProperty; | 401 | this.application.ninja.timeline.selectedStyle = this.editorProperty; |
402 | this._fillColorCtrl.addEventListener("change", this.handleFillColorChange.bind(this), false); | 402 | this._fillColorCtrl.addEventListener("change", this.handleFillColorChange.bind(this), false); |
403 | this._fillColorCtrl.color(currentValue.colorMode, currentValue.color); | 403 | if(currentValue){ |
404 | this.addedColorChips = true; | 404 | this._fillColorCtrl.color(currentValue.colorMode, currentValue.color); |
405 | this.addedColorChips = true; | ||
406 | } | ||
405 | } | 407 | } |
406 | // TODO: set up color chip here. | 408 | // TODO: set up color chip here. |
407 | } else if (tweenable.tweener === "input"){ | 409 | } else if (tweenable.tweener === "input"){ |
diff --git a/js/panels/Timeline/Style.reel/css/Style.css b/js/panels/Timeline/Style.reel/css/Style.css index bb65b0c7..77035873 100644 --- a/js/panels/Timeline/Style.reel/css/Style.css +++ b/js/panels/Timeline/Style.reel/css/Style.css | |||
@@ -6,31 +6,22 @@ | |||
6 | /* Layer.scss | 6 | /* Layer.scss |
7 | * Main SCSS file for Layer component, compiled by SASS into the file css/Layer.css. | 7 | * Main SCSS file for Layer component, compiled by SASS into the file css/Layer.css. |
8 | */ | 8 | */ |
9 | /* line 18, ../scss/Style.scss */ | ||
10 | .hidden { | 9 | .hidden { |
11 | display: none; | 10 | display: none; } |
12 | } | ||
13 | 11 | ||
14 | /* line 21, ../scss/Style.scss */ | ||
15 | .row-editor { | 12 | .row-editor { |
16 | position: relative; | 13 | position: relative; |
17 | height: 14px; | 14 | height: 14px; } |
18 | } | ||
19 | 15 | ||
20 | /* line 25, ../scss/Style.scss */ | ||
21 | .style-padding { | 16 | .style-padding { |
22 | padding-left: 5px; | 17 | padding-left: 5px; |
23 | padding-top: 3px; | 18 | padding-top: 3px; |
24 | padding-right: 5px; | 19 | padding-right: 5px; } |
25 | } | ||
26 | 20 | ||
27 | /* line 30, ../scss/Style.scss */ | ||
28 | .style-row { | 21 | .style-row { |
29 | height: 20px; | 22 | height: 20px; |
30 | border-bottom: 1px solid #505050; | 23 | border-bottom: 1px solid #505050; } |
31 | } | ||
32 | 24 | ||
33 | /* line 35, ../scss/Style.scss */ | ||
34 | div.content-style div.editable2 { | 25 | div.content-style div.editable2 { |
35 | height: 14px; | 26 | height: 14px; |
36 | background-color: #242424 !important; | 27 | background-color: #242424 !important; |
@@ -41,18 +32,14 @@ div.content-style div.editable2 { | |||
41 | -webkit-user-select: text; | 32 | -webkit-user-select: text; |
42 | white-space: nowrap; | 33 | white-space: nowrap; |
43 | text-overflow: clip; | 34 | text-overflow: clip; |
44 | width: 100%; | 35 | width: 100%; } |
45 | } | ||
46 | 36 | ||
47 | /* line 49, ../scss/Style.scss */ | ||
48 | .content-style.collapsible-content, | 37 | .content-style.collapsible-content, |
49 | .content-style.collapsible-content div, | 38 | .content-style.collapsible-content div, |
50 | .content-style.collapsible-content span { | 39 | .content-style.collapsible-content span { |
51 | overflow: visible; | 40 | overflow: visible; |
52 | text-overflow: visible; | 41 | text-overflow: visible; } |
53 | } | ||
54 | 42 | ||
55 | /* line 54, ../scss/Style.scss */ | ||
56 | div.content-style div.cell-property, | 43 | div.content-style div.cell-property, |
57 | div.content-style div.cell-value { | 44 | div.content-style div.cell-value { |
58 | width: 45%; | 45 | width: 45%; |
@@ -61,38 +48,31 @@ div.content-style div.cell-value { | |||
61 | overflow: hidden; | 48 | overflow: hidden; |
62 | text-overflow: ellipsis; | 49 | text-overflow: ellipsis; |
63 | white-space: nowrap; | 50 | white-space: nowrap; |
64 | line-height: 18px; | 51 | line-height: 18px; } |
65 | } | ||
66 | 52 | ||
67 | /* line 63, ../scss/Style.scss */ | ||
68 | div.content-style div.cell-property div { | 53 | div.content-style div.cell-property div { |
69 | min-width: 90%; | 54 | min-width: 90%; |
70 | height: 100%; | 55 | height: 100%; |
71 | overflow: hidden; | 56 | overflow: hidden; |
72 | text-overflow: ellipsis; | 57 | text-overflow: ellipsis; |
73 | white-space: nowrap; | 58 | white-space: nowrap; } |
74 | } | ||
75 | 59 | ||
76 | /* line 71, ../scss/Style.scss */ | ||
77 | div.content-style input.nj-skinned { | 60 | div.content-style input.nj-skinned { |
78 | height: 10px; | 61 | height: 10px; |
79 | font-size: 12px; | 62 | font-size: 12px; |
80 | top: -3px; | 63 | top: -3px; } |
81 | } | ||
82 | 64 | ||
83 | /* line 76, ../scss/Style.scss */ | ||
84 | div.style-row .container-propvals { | 65 | div.style-row .container-propvals { |
85 | overflow: hidden; | 66 | overflow: hidden; } |
86 | } | ||
87 | 67 | ||
88 | /* line 80, ../scss/Style.scss */ | ||
89 | .content-style .style-row.selected { | 68 | .content-style .style-row.selected { |
90 | background-color: #474747; | 69 | background-color: #474747; |
91 | color: white; | 70 | color: white; } |
92 | } | ||
93 | 71 | ||
94 | /* line 84, ../scss/Style.scss */ | ||
95 | .content-style .style-row.style-selected { | 72 | .content-style .style-row.style-selected { |
96 | background-color: #b2b2b2; | 73 | background-color: #b2b2b2; |
97 | color: #242424; | 74 | color: #242424; } |
98 | } | 75 | |
76 | .toolColorChipCtrl.color-chip-position { | ||
77 | margin-top: 0px; | ||
78 | height: 14px; } | ||
diff --git a/js/panels/Timeline/Style.reel/scss/Style.scss b/js/panels/Timeline/Style.reel/scss/Style.scss index c5287b00..42420409 100644 --- a/js/panels/Timeline/Style.reel/scss/Style.scss +++ b/js/panels/Timeline/Style.reel/scss/Style.scss | |||
@@ -85,3 +85,8 @@ div.style-row .container-propvals { | |||
85 | background-color: $color-panel-hilite-bg; | 85 | background-color: $color-panel-hilite-bg; |
86 | color: $color-panel-hilite-text; | 86 | color: $color-panel-hilite-text; |
87 | } | 87 | } |
88 | |||
89 | .toolColorChipCtrl.color-chip-position{ | ||
90 | margin-top:0px; | ||
91 | height:14px; | ||
92 | } | ||