diff options
Diffstat (limited to '_scss/imports/scss/_PanelUI.scss')
-rw-r--r-- | _scss/imports/scss/_PanelUI.scss | 99 |
1 files changed, 49 insertions, 50 deletions
diff --git a/_scss/imports/scss/_PanelUI.scss b/_scss/imports/scss/_PanelUI.scss index e72a1502..ac82adf8 100644 --- a/_scss/imports/scss/_PanelUI.scss +++ b/_scss/imports/scss/_PanelUI.scss | |||
@@ -4,24 +4,23 @@ | |||
4 | // (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | 4 | // (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. |
5 | // </copyright> | 5 | // </copyright> |
6 | 6 | ||
7 | /* | 7 | // |
8 | * PanelUI.scss | 8 | // PanelUI.scss |
9 | * Styles governing the panels in the UI. | 9 | // Styles governing the panels in the UI. |
10 | * Note that colors and font definitions go in | 10 | // Note that colors and font definitions go in |
11 | * _scss/themes/themename/_colors.scss and _scss/themes/themename/_fonts.scss | 11 | // _scss/themes/themename/_colors.scss and _scss/themes/themename/_fonts.scss |
12 | */ | 12 | |
13 | /* layout for the container of all panels within a dock area */ | 13 | // layout for the container of all panels within a dock area |
14 | .panelContainer { | 14 | .panelContainer { |
15 | margin: 0px; | 15 | margin: 0px; |
16 | padding: 0px 0px; | 16 | padding: 0px 0px; |
17 | position:relative; | 17 | position:relative; |
18 | /* | 18 | // this is here to hopefully show vertical scroll bars when the panels exceed the height of the panel |
19 | this is here to hopefully show vertical scroll bars when the panels exceed the height of the panel | 19 | // unfortunately it doesn't seem to work properly. this is probably due to some of our box styling or positioning |
20 | unfortunately it doesn't seem to work properly. this is probably due to some of our box styling or positioning | 20 | overflow: auto; |
21 | overflow: auto; */ | ||
22 | } | 21 | } |
23 | 22 | ||
24 | /* base layout style for all panels*/ | 23 | // base layout style for all panels |
25 | .panelDisclosureIcon | 24 | .panelDisclosureIcon |
26 | { | 25 | { |
27 | background-image:url("../images/panels/panelDisclosureIcon.png"); | 26 | background-image:url("../images/panels/panelDisclosureIcon.png"); |
@@ -40,7 +39,7 @@ | |||
40 | } | 39 | } |
41 | 40 | ||
42 | .panelCollapseArrowFill { | 41 | .panelCollapseArrowFill { |
43 | color: rgba(76,76,76,1); /* this is never really used but is set so we can get it via javascript to draw the control via script on the canvas */ | 42 | color: rgba(76,76,76,1); // this is never really used but is set so we can get it via javascript to draw the control via script on the canvas |
44 | padding:0px 4px; | 43 | padding:0px 4px; |
45 | } | 44 | } |
46 | 45 | ||
@@ -87,11 +86,11 @@ | |||
87 | padding-right:3px; | 86 | padding-right:3px; |
88 | width:32px; | 87 | width:32px; |
89 | 88 | ||
90 | /*This is a hack to get the tools panel to extend all the way to the bottom.*/ | 89 | // This is a hack to get the tools panel to extend all the way to the bottom. |
91 | padding-bottom:450px; | 90 | padding-bottom:450px; |
92 | } | 91 | } |
93 | 92 | ||
94 | /* sizes for the specific panels */ | 93 | // sizes for the specific panels |
95 | 94 | ||
96 | #toolPropertiesPanel { | 95 | #toolPropertiesPanel { |
97 | height: 32px; | 96 | height: 32px; |
@@ -102,7 +101,7 @@ | |||
102 | height: 116px; | 101 | height: 116px; |
103 | } | 102 | } |
104 | 103 | ||
105 | /* Only used by Animation Presets Panel currently */ | 104 | // Only used by Animation Presets Panel currently |
106 | 105 | ||
107 | .treeComponent | 106 | .treeComponent |
108 | { | 107 | { |
@@ -119,7 +118,7 @@ | |||
119 | list-style: none; | 118 | list-style: none; |
120 | } | 119 | } |
121 | 120 | ||
122 | /*This sets the style for a tree folder's icon*/ | 121 | // This sets the style for a tree folder's icon |
123 | ul.treeComponent > img:first-child | 122 | ul.treeComponent > img:first-child |
124 | { | 123 | { |
125 | margin-left: -35px; | 124 | margin-left: -35px; |
@@ -139,7 +138,7 @@ ul.treeComponent > img:first-child | |||
139 | margin-left: -20px; | 138 | margin-left: -20px; |
140 | padding-right:10px; | 139 | padding-right:10px; |
141 | vertical-align:middle; | 140 | vertical-align:middle; |
142 | /*border-bottom:1px solid #555555;*/ | 141 | // border-bottom:1px solid #555555; |
143 | } | 142 | } |
144 | 143 | ||
145 | .treeCategory | 144 | .treeCategory |
@@ -153,8 +152,8 @@ ul.treeComponent > img:first-child | |||
153 | color: $color-panel-text; | 152 | color: $color-panel-text; |
154 | } | 153 | } |
155 | 154 | ||
156 | /* ====== Used by Properties Panel ====== */ | 155 | // ====== Used by Properties Panel ====== |
157 | /* Removed the outline text input style -> Causing problems with the Canvas */ | 156 | // Removed the outline text input style -> Causing problems with the Canvas |
158 | 157 | ||
159 | .propertiesPanel | 158 | .propertiesPanel |
160 | { | 159 | { |
@@ -210,7 +209,7 @@ ul.treeComponent > img:first-child | |||
210 | background-color: $color-panel-shadow; | 209 | background-color: $color-panel-shadow; |
211 | } | 210 | } |
212 | 211 | ||
213 | /* ====== Indexed table row and column classes for Properties Panel layout ====== */ | 212 | // ====== Indexed table row and column classes for Properties Panel layout ====== |
214 | .propRow1{ | 213 | .propRow1{ |
215 | width:100%; | 214 | width:100%; |
216 | } | 215 | } |
@@ -313,7 +312,7 @@ ul.treeComponent > img:first-child | |||
313 | 312 | ||
314 | 313 | ||
315 | 314 | ||
316 | /* Begin: Project Panel UI classes */ | 315 | // Begin: Project Panel UI classes |
317 | .Project-Panel { | 316 | .Project-Panel { |
318 | height: 100%; | 317 | height: 100%; |
319 | } | 318 | } |
@@ -354,14 +353,14 @@ ul.treeComponent > img:first-child | |||
354 | margin-bottom: 36px; | 353 | margin-bottom: 36px; |
355 | 354 | ||
356 | } | 355 | } |
357 | /* | 356 | // |
358 | #pp-container-list, | 357 | #pp-container-list, |
359 | #pp-container-assets { | 358 | #pp-container-assets { |
360 | height: 310px; | 359 | height: 310px; |
361 | width: 100%; | 360 | width: 100%; |
362 | overflow: auto; | 361 | overflow: auto; |
363 | } | 362 | } |
364 | */ | 363 | |
365 | 364 | ||
366 | .pp-scroll-main { | 365 | .pp-scroll-main { |
367 | display: block; | 366 | display: block; |
@@ -388,12 +387,12 @@ ul.treeComponent > img:first-child | |||
388 | #pp-view-assets { | 387 | #pp-view-assets { |
389 | display: none; | 388 | display: none; |
390 | } | 389 | } |
391 | /* | 390 | // |
392 | #pp-container-assets .pp-scroll-linked, | 391 | #pp-container-assets .pp-scroll-linked, |
393 | #pp-container-list .pp-scroll-linked { | 392 | #pp-container-list .pp-scroll-linked { |
394 | width: 420px; | 393 | width: 420px; |
395 | } | 394 | } |
396 | */ | 395 | |
397 | 396 | ||
398 | .pp-header-container { | 397 | .pp-header-container { |
399 | position: relative; | 398 | position: relative; |
@@ -518,10 +517,10 @@ span.pp-span-all:focus { | |||
518 | display: block; | 517 | display: block; |
519 | width: 9px; | 518 | width: 9px; |
520 | height: 5px; | 519 | height: 5px; |
521 | /* | 520 | // |
522 | margin-right: 10px; | 521 | margin-right: 10px; |
523 | margin-top: 2px; | 522 | margin-top: 2px; |
524 | */ | 523 | |
525 | background-image: url("../images/panels/project-panel/icon-sort-arrow.png"); | 524 | background-image: url("../images/panels/project-panel/icon-sort-arrow.png"); |
526 | background-repeat: no-repeat; | 525 | background-repeat: no-repeat; |
527 | position: absolute; | 526 | position: absolute; |
@@ -559,7 +558,7 @@ span.pp-span-all:focus { | |||
559 | color: $color-menu-bg; | 558 | color: $color-menu-bg; |
560 | } | 559 | } |
561 | 560 | ||
562 | /* Icons! */ | 561 | // Icons! |
563 | #pp-container-list li, | 562 | #pp-container-list li, |
564 | #pp-container-list span.span-space { | 563 | #pp-container-list span.span-space { |
565 | background-repeat: no-repeat; | 564 | background-repeat: no-repeat; |
@@ -660,7 +659,7 @@ span.pp-span-all:focus { | |||
660 | } | 659 | } |
661 | 660 | ||
662 | 661 | ||
663 | /* Buttons */ | 662 | // Buttons |
664 | .pp-button, | 663 | .pp-button, |
665 | #pp-col-buttons .pp-button div { | 664 | #pp-col-buttons .pp-button div { |
666 | margin: 0px; | 665 | margin: 0px; |
@@ -748,7 +747,7 @@ div.pp-button.button-divider div { | |||
748 | display: none; | 747 | display: none; |
749 | } | 748 | } |
750 | 749 | ||
751 | /* Hide and Show different types of assets */ | 750 | // Hide and Show different types of assets |
752 | .pp-type-script, | 751 | .pp-type-script, |
753 | .pp-type-video, | 752 | .pp-type-video, |
754 | .pp-type-audio, | 753 | .pp-type-audio, |
@@ -777,7 +776,7 @@ div.pp-button.button-divider div { | |||
777 | display: block; | 776 | display: block; |
778 | } | 777 | } |
779 | 778 | ||
780 | /* New file flyout */ | 779 | // New file flyout |
781 | .pp-popup { | 780 | .pp-popup { |
782 | position: absolute; | 781 | position: absolute; |
783 | top: -53px; | 782 | top: -53px; |
@@ -796,7 +795,7 @@ div.pp-button.button-divider div { | |||
796 | margin: 0px; | 795 | margin: 0px; |
797 | padding: 0px; | 796 | padding: 0px; |
798 | } | 797 | } |
799 | /* Search subwidge |