alihan/openmct
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[Frontend] Sanding and shimming styles for Elements pool

Browse Source 
open #199
open #279
Also tweaked bg color of text inputs;
This commit is contained in:
Charles Hacskaylo
2015-11-17 12:20:14 -08:00
parent a8d563975a
commit 3ff275c853
5 changed files with 131 additions and 161 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
platform/commonUI/general/res/sass/_inspector.scss
View File

@@ -23,7 +23,7 @@
.l-inspect, .l-inspect,
.l-inspect table tr td { .l-inspect table tr td {
font-size: 0.7rem; font-size: 0.75rem;
} }
.l-inspect { .l-inspect {
@@ -31,6 +31,9 @@
background: $colorInspectorBg; background: $colorInspectorBg;
color: $colorInspectorFg; color: $colorInspectorFg;
line-height: 140%; line-height: 140%;
.flex-elem.holder:not(:last-child) { margin-bottom: $interiorMargin; }
.pane-header { .pane-header {
color: pushBack($colorInspectorFg, 20%); color: pushBack($colorInspectorFg, 20%);
font-size: 0.8rem; font-size: 0.8rem;
@@ -122,9 +125,18 @@
.holder-elements { .holder-elements {
.current-elements { .current-elements {
position: relative; position: relative;
.tree-item .t-object-label { .tree-item {
// Elements pool is a flat list, so don't indent items. .t-object-label {
left: 0; // Elements pool is a flat list, so don't indent items.
left: 0;
.t-item-icon {
font-size: 1em;
width: 1em;
}
.t-title-label {
left: 20px + $interiorMargin;
}
}
} }
} }
} }

4
platform/commonUI/general/res/templates/object-inspector.html
View File

@@ -71,12 +71,12 @@
<div class="abs holder holder-elements l-flex-col"> <div class="abs holder holder-elements l-flex-col">
<em class="flex-elem">Elements</em> <em class="flex-elem">Elements</em>
<mct-include key="'input-filter'" <mct-include key="'input-filter'"
class="flex-elem"> class="flex-elem holder">
</mct-include> </mct-include>
<mct-representation <mct-representation
key="'edit-elements'" key="'edit-elements'"
mct-object="domainObject" mct-object="domainObject"
class="flex-elem current-elements grows vscroll"> class="flex-elem holder grows vscroll current-elements">
</mct-representation> </mct-representation>
</div> </div>
</div> </div>

139
platform/commonUI/themes/espresso/res/css/theme-espresso.css
View File

@@ -20,7 +20,7 @@
* this source code distribution or the Licensing information page available * this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information. * at runtime from the About dialog for additional information.
*****************************************************************************/ *****************************************************************************/
/* line 5, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ /* line 5, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
html, body, div, span, applet, object, iframe, html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code, a, abbr, acronym, address, big, cite, code,
@@ -41,38 +41,38 @@ time, mark, audio, video {
font-size: 100%; font-size: 100%;
vertical-align: baseline; } vertical-align: baseline; }
/* line 22, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ /* line 22, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
html { html {
line-height: 1; } line-height: 1; }
/* line 24, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ /* line 24, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
ol, ul { ol, ul {
list-style: none; } list-style: none; }
/* line 26, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ /* line 26, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
table { table {
border-collapse: collapse; border-collapse: collapse;
border-spacing: 0; } border-spacing: 0; }
/* line 28, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ /* line 28, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
caption, th, td { caption, th, td {
text-align: left; text-align: left;
font-weight: normal; font-weight: normal;
vertical-align: middle; } vertical-align: middle; }
/* line 30, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ /* line 30, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
q, blockquote { q, blockquote {
quotes: none; } quotes: none; }
/* line 103, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ /* line 103, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
q:before, q:after, blockquote:before, blockquote:after { q:before, q:after, blockquote:before, blockquote:after {
content: ""; content: "";
content: none; } content: none; }
/* line 32, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ /* line 32, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
a img { a img {
border: none; } border: none; }
/* line 116, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ /* line 116, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
display: block; } display: block; }
@@ -1451,18 +1451,21 @@ tr[class*="s-limit"].s-limit-lwr td:first-child:before {
/* line 24, ../../../../general/res/sass/_inspector.scss */ /* line 24, ../../../../general/res/sass/_inspector.scss */
.l-inspect, .l-inspect,
.l-inspect table tr td { .l-inspect table tr td {
font-size: 0.7rem; } font-size: 0.75rem; }
/* line 29, ../../../../general/res/sass/_inspector.scss */ /* line 29, ../../../../general/res/sass/_inspector.scss */
.l-inspect { .l-inspect {
background: #3b3b3b; background: #3b3b3b;
color: #999; color: #999;
line-height: 140%; } line-height: 140%; }
/* line 34, ../../../../general/res/sass/_inspector.scss */ /* line 35, ../../../../general/res/sass/_inspector.scss */
.l-inspect .flex-elem.holder:not(:last-child) {
margin-bottom: 5px; }
/* line 37, ../../../../general/res/sass/_inspector.scss */
.l-inspect .pane-header { .l-inspect .pane-header {
color: #666666; color: #666666;
font-size: 0.8rem; } font-size: 0.8rem; }
/* line 37, ../../../../general/res/sass/_inspector.scss */ /* line 40, ../../../../general/res/sass/_inspector.scss */
.l-inspect .pane-header:before { .l-inspect .pane-header:before {
color: gray; color: gray;
content: '\e615'; content: '\e615';
@@ -1470,63 +1473,63 @@ tr[class*="s-limit"].s-limit-lwr td:first-child:before {
font-family: symbolsfont; font-family: symbolsfont;
margin-right: 5px; margin-right: 5px;
vertical-align: bottom; } vertical-align: bottom; }
/* line 49, ../../../../general/res/sass/_inspector.scss */ /* line 52, ../../../../general/res/sass/_inspector.scss */
.l-inspect .split-layout .split-pane-component.pane.bottom { .l-inspect .split-layout .split-pane-component.pane.bottom {
height: 30%; height: 30%;
min-height: 20%; min-height: 20%;
max-height: 80%; } max-height: 80%; }
/* line 57, ../../../../general/res/sass/_inspector.scss */ /* line 60, ../../../../general/res/sass/_inspector.scss */
.l-inspect ul { .l-inspect ul {
-moz-box-sizing: border-box; -moz-box-sizing: border-box;
-webkit-box-sizing: border-box; -webkit-box-sizing: border-box;
box-sizing: border-box; box-sizing: border-box;
padding-right: 5px; } padding-right: 5px; }
/* line 62, ../../../../general/res/sass/_inspector.scss */ /* line 65, ../../../../general/res/sass/_inspector.scss */
.l-inspect ul li, .l-inspect ul li,
.l-inspect em { .l-inspect em {
display: block; display: block;
position: relative; } position: relative; }
/* line 68, ../../../../general/res/sass/_inspector.scss */ /* line 71, ../../../../general/res/sass/_inspector.scss */
.l-inspect ul li { .l-inspect ul li {
margin-bottom: 10px; } margin-bottom: 10px; }
/* line 72, ../../../../general/res/sass/_inspector.scss */ /* line 75, ../../../../general/res/sass/_inspector.scss */
.l-inspect em { .l-inspect em {
-moz-border-radius: 3px; -moz-border-radius: 3px;
-webkit-border-radius: 3px; -webkit-border-radius: 3px;
border-radius: 3px; border-radius: 3px;
background-color: #474747; background-color: rgba(255, 255, 255, 0.1);
color: #a1a1a1; color: #a1a1a1;
margin-bottom: 5px; margin-bottom: 5px;
padding: 5px 5px; padding: 5px 5px;
text-transform: uppercase; } text-transform: uppercase; }
/* line 81, ../../../../general/res/sass/_inspector.scss */ /* line 84, ../../../../general/res/sass/_inspector.scss */
.l-inspect .inspector-properties { .l-inspect .inspector-properties {
padding: 3px 0; } padding: 3px 0; }
/* line 82, ../../../../general/res/sass/_inspector.scss */ /* line 85, ../../../../general/res/sass/_inspector.scss */
.l-inspect .inspector-properties:not(.first) { .l-inspect .inspector-properties:not(.first) {
border-top: 1px solid #474747; } border-top: 1px solid rgba(255, 255, 255, 0.1); }
/* line 86, ../../../../general/res/sass/_inspector.scss */ /* line 89, ../../../../general/res/sass/_inspector.scss */
.l-inspect .inspector-properties .label { .l-inspect .inspector-properties .label {
color: #737373; color: #737373;
text-transform: uppercase; } text-transform: uppercase; }
/* line 90, ../../../../general/res/sass/_inspector.scss */ /* line 93, ../../../../general/res/sass/_inspector.scss */
.l-inspect .inspector-properties .value { .l-inspect .inspector-properties .value {
color: #bfbfbf; color: #bfbfbf;
word-break: break-all; } word-break: break-all; }
/* line 98, ../../../../general/res/sass/_inspector.scss */ /* line 101, ../../../../general/res/sass/_inspector.scss */
.l-inspect .inspector-location .location-item { .l-inspect .inspector-location .location-item {
cursor: pointer; cursor: pointer;
display: inline-block; display: inline-block;
position: relative; position: relative;
padding: 2px 4px; } padding: 2px 4px; }
/* line 103, ../../../../general/res/sass/_inspector.scss */ /* line 106, ../../../../general/res/sass/_inspector.scss */
.l-inspect .inspector-location .location-item:hover { .l-inspect .inspector-location .location-item:hover {
background: rgba(153, 153, 153, 0.1); background: rgba(153, 153, 153, 0.1);
color: #cccccc; } color: #cccccc; }
/* line 106, ../../../../general/res/sass/_inspector.scss */ /* line 109, ../../../../general/res/sass/_inspector.scss */
.l-inspect .inspector-location .location-item:hover .icon, .l-inspect .inspector-location .location-item:hover .t-item-icon { .l-inspect .inspector-location .location-item:hover .icon, .l-inspect .inspector-location .location-item:hover .t-item-icon {
color: #33ccff; } color: #33ccff; }
/* line 111, ../../../../general/res/sass/_inspector.scss */ /* line 114, ../../../../general/res/sass/_inspector.scss */
.l-inspect .inspector-location:not(.last) .t-object-label .t-title-label:after { .l-inspect .inspector-location:not(.last) .t-object-label .t-title-label:after {
color: #737373; color: #737373;
content: '\3e'; content: '\3e';
@@ -1536,12 +1539,19 @@ tr[class*="s-limit"].s-limit-lwr td:first-child:before {
line-height: inherit; line-height: inherit;
margin-left: 3px; margin-left: 3px;
width: 4px; } width: 4px; }
/* line 123, ../../../../general/res/sass/_inspector.scss */ /* line 126, ../../../../general/res/sass/_inspector.scss */
.l-inspect .holder-elements .current-elements { .l-inspect .holder-elements .current-elements {
position: relative; } position: relative; }
/* line 125, ../../../../general/res/sass/_inspector.scss */ /* line 129, ../../../../general/res/sass/_inspector.scss */
.l-inspect .holder-elements .current-elements .tree-item .t-object-label { .l-inspect .holder-elements .current-elements .tree-item .t-object-label {
left: 0; } left: 0; }
/* line 132, ../../../../general/res/sass/_inspector.scss */
.l-inspect .holder-elements .current-elements .tree-item .t-object-label .t-item-icon {
font-size: 1em;
width: 1em; }
/* line 136, ../../../../general/res/sass/_inspector.scss */
.l-inspect .holder-elements .current-elements .tree-item .t-object-label .t-title-label {
left: 25px; }
/********************************* CONTROLS */ /********************************* CONTROLS */
/* line 1, ../../../../general/res/sass/controls/_breadcrumb.scss */ /* line 1, ../../../../general/res/sass/controls/_breadcrumb.scss */
@@ -3685,7 +3695,7 @@ mct-include.l-time-controller {
-moz-border-radius: 3px; -moz-border-radius: 3px;
-webkit-border-radius: 3px; -webkit-border-radius: 3px;
border-radius: 3px; border-radius: 3px;
background-color: rgba(255, 255, 255, 0.07); background-color: rgba(0, 0, 0, 0.1);
padding: 1px 1px 0 5px; } padding: 1px 1px 0 5px; }
/***************************************************************************** /*****************************************************************************
@@ -3749,7 +3759,7 @@ mct-include.l-time-controller {
-moz-border-radius: 3px; -moz-border-radius: 3px;
-webkit-border-radius: 3px; -webkit-border-radius: 3px;
border-radius: 3px; border-radius: 3px;
background: rgba(0, 0, 0, 0.2); background: rgba(255, 255, 255, 0.1);
color: #cccccc; color: #cccccc;
font-size: 0.8em; font-size: 0.8em;
padding: 5px 5px; padding: 5px 5px;
@@ -3835,7 +3845,7 @@ mct-include.l-time-controller {
-moz-box-shadow: inset rgba(0, 0, 0, 0.6) 0 1px 3px; -moz-box-shadow: inset rgba(0, 0, 0, 0.6) 0 1px 3px;
-webkit-box-shadow: inset rgba(0, 0, 0, 0.6) 0 1px 3px; -webkit-box-shadow: inset rgba(0, 0, 0, 0.6) 0 1px 3px;
box-shadow: inset rgba(0, 0, 0, 0.6) 0 1px 3px; box-shadow: inset rgba(0, 0, 0, 0.6) 0 1px 3px;
background: rgba(255, 255, 255, 0.07); background: rgba(0, 0, 0, 0.1);
border: none; border: none;
color: #cccccc; color: #cccccc;
outline: none; outline: none;
@@ -3895,7 +3905,7 @@ input[type="search"] {
-moz-box-shadow: inset rgba(0, 0, 0, 0.6) 0 1px 3px; -moz-box-shadow: inset rgba(0, 0, 0, 0.6) 0 1px 3px;
-webkit-box-shadow: inset rgba(0, 0, 0, 0.6) 0 1px 3px; -webkit-box-shadow: inset rgba(0, 0, 0, 0.6) 0 1px 3px;
box-shadow: inset rgba(0, 0, 0, 0.6) 0 1px 3px; box-shadow: inset rgba(0, 0, 0, 0.6) 0 1px 3px;
background: rgba(255, 255, 255, 0.07); background: rgba(0, 0, 0, 0.1);
border: none; border: none;
color: #cccccc; color: #cccccc;
outline: none; outline: none;
@@ -3922,7 +3932,7 @@ textarea {
-moz-box-shadow: inset rgba(0, 0, 0, 0.6) 0 1px 3px; -moz-box-shadow: inset rgba(0, 0, 0, 0.6) 0 1px 3px;
-webkit-box-shadow: inset rgba(0, 0, 0, 0.6) 0 1px 3px; -webkit-box-shadow: inset rgba(0, 0, 0, 0.6) 0 1px 3px;
box-shadow: inset rgba(0, 0, 0, 0.6) 0 1px 3px; box-shadow: inset rgba(0, 0, 0, 0.6) 0 1px 3px;
background: rgba(255, 255, 255, 0.07); background: rgba(0, 0, 0, 0.1);
border: none; border: none;
color: #cccccc; color: #cccccc;
outline: none; outline: none;
@@ -4376,7 +4386,7 @@ span.req {
-moz-box-shadow: inset rgba(0, 0, 0, 0.6) 0 1px 3px; -moz-box-shadow: inset rgba(0, 0, 0, 0.6) 0 1px 3px;
-webkit-box-shadow: inset rgba(0, 0, 0, 0.6) 0 1px 3px; -webkit-box-shadow: inset rgba(0, 0, 0, 0.6) 0 1px 3px;
box-shadow: inset rgba(0, 0, 0, 0.6) 0 1px 3px; box-shadow: inset rgba(0, 0, 0, 0.6) 0 1px 3px;
background: rgba(255, 255, 255, 0.07); background: rgba(0, 0, 0, 0.1);
border: none; border: none;
color: #cccccc; color: #cccccc;
outline: none; } outline: none; }
@@ -5286,43 +5296,12 @@ span.req {
* this source code distribution or the Licensing information page available * this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information. * at runtime from the About dialog for additional information.
*****************************************************************************/ *****************************************************************************/
/* /* line 32, ../../../../general/res/sass/search/_search.scss */
// Moved to filter.scss
.clear-icon,
.menu-icon {
cursor: pointer;
font-family: symbolsfont;
@include trans-prop-nice((opacity, color), 150ms);
}
.clear-icon {
// 'x' in circle icon
&:before {
content: '\e607';
}
}
*/
/* line 63, ../../../../general/res/sass/search/_search.scss */
.holder-search .search-bar { .holder-search .search-bar {
font-size: 0.8em; font-size: 0.8em;
max-width: 250px; max-width: 250px;
position: relative; position: relative; }
/* .clear-icon { /* line 37, ../../../../general/res/sass/search/_search.scss */
right: $iconD + $interiorMargin;
// Icon is visible only when there is text input
visibility: hidden;
opacity: 0;
&.show {
visibility: visible;
opacity: 1;
}
&:hover {
color: pullForward($colorInputIcon, 10%);
}
}*/ }
/* line 68, ../../../../general/res/sass/search/_search.scss */
.holder-search .search-bar input[type="search"] { .holder-search .search-bar input[type="search"] {
height: 25px; height: 25px;
line-height: 25px; line-height: 25px;
@@ -5330,28 +5309,28 @@ span.req {
width: 100%; width: 100%;
padding-left: 22px !important; padding-left: 22px !important;
padding-right: 44px !important; } padding-right: 44px !important; }
/* line 133, ../../../../general/res/sass/search/_search.scss */ /* line 46, ../../../../general/res/sass/search/_search.scss */
.holder-search .search-bar .clear-icon { .holder-search .search-bar .clear-icon {
right: 22px; } right: 22px; }
/* line 137, ../../../../general/res/sass/search/_search.scss */ /* line 50, ../../../../general/res/sass/search/_search.scss */
.holder-search .search-bar .menu-icon { .holder-search .search-bar .menu-icon {
font-size: 0.8em; font-size: 0.8em;
padding-right: 4px; padding-right: 4px;
right: 4px; right: 4px;
text-align: right; } text-align: right; }
/* line 139, ../../../../general/res/sass/search/_search.scss */ /* line 52, ../../../../general/res/sass/search/_search.scss */
.holder-search .search-bar .menu-icon:before { .holder-search .search-bar .menu-icon:before {
content: '\76'; } content: '\76'; }
/* line 145, ../../../../general/res/sass/search/_search.scss */ /* line 58, ../../../../general/res/sass/search/_search.scss */
.holder-search .search-bar .menu-icon:hover { .holder-search .search-bar .menu-icon:hover {
color: #8c8c8c; } color: #8c8c8c; }
/* line 150, ../../../../general/res/sass/search/_search.scss */ /* line 63, ../../../../general/res/sass/search/_search.scss */
.holder-search .search-bar .search-menu-holder { .holder-search .search-bar .search-menu-holder {
float: right; float: right;
left: -20px; left: -20px;
z-index: 70; z-index: 70;
transition: visibility .05s, opacity .05s; } transition: visibility .05s, opacity .05s; }
/* line 158, ../../../../general/res/sass/search/_search.scss */ /* line 71, ../../../../general/res/sass/search/_search.scss */
.holder-search .active-filter-display { .holder-search .active-filter-display {
-moz-box-sizing: border-box; -moz-box-sizing: border-box;
-webkit-box-sizing: border-box; -webkit-box-sizing: border-box;
@@ -5359,7 +5338,7 @@ span.req {
line-height: 130%; line-height: 130%;
padding-left: 1.4625em; padding-left: 1.4625em;
font-size: 0.65em; } font-size: 0.65em; }
/* line 166, ../../../../general/res/sass/search/_search.scss */ /* line 79, ../../../../general/res/sass/search/_search.scss */
.holder-search .active-filter-display .clear-filters-icon { .holder-search .active-filter-display .clear-filters-icon {
color: #737373; color: #737373;
opacity: 1; opacity: 1;
@@ -5367,7 +5346,7 @@ span.req {
position: absolute; position: absolute;
left: 1px; left: 1px;
cursor: pointer; } cursor: pointer; }
/* line 176, ../../../../general/res/sass/search/_search.scss */ /* line 89, ../../../../general/res/sass/search/_search.scss */
.holder-search .search-results { .holder-search .search-results {
-moz-transition-property: opacity, visibility; -moz-transition-property: opacity, visibility;
-o-transition-property: opacity, visibility; -o-transition-property: opacity, visibility;
@@ -5387,16 +5366,16 @@ span.req {
transition-delay: 0; transition-delay: 0;
margin-top: 10px; margin-top: 10px;
padding-right: 5px; } padding-right: 5px; }
/* line 180, ../../../../general/res/sass/search/_search.scss */ /* line 93, ../../../../general/res/sass/search/_search.scss */
.holder-search .search-results .hint { .holder-search .search-results .hint {
margin-bottom: 10px; margin-bottom: 10px;
font-size: 0.65em; font-size: 0.65em;
opacity: 0.6; } opacity: 0.6; }
/* line 185, ../../../../general/res/sass/search/_search.scss */ /* line 98, ../../../../general/res/sass/search/_search.scss */
.holder-search .search-results.active { .holder-search .search-results.active {
visibility: visible; visibility: visible;
opacity: 1; } opacity: 1; }
/* line 189, ../../../../general/res/sass/search/_search.scss */ /* line 102, ../../../../general/res/sass/search/_search.scss */
.holder-search .search-results .load-more-button { .holder-search .search-results .load-more-button {
-moz-transform: translateX(-50%); -moz-transform: translateX(-50%);
-ms-transform: translateX(-50%); -ms-transform: translateX(-50%);

6
platform/commonUI/themes/espresso/res/sass/_constants.scss
View File

@@ -69,8 +69,8 @@ $colorFormValid: #33cc33;
$colorFormError: #cc0000; $colorFormError: #cc0000;
$colorFormInvalid: #ff3300; $colorFormInvalid: #ff3300;
$colorFormLines: rgba(#fff, 0.1); $colorFormLines: rgba(#fff, 0.1);
$colorFormSectionHeader: rgba(#000, 0.2); $colorFormSectionHeader: rgba(#fff, 0.1);
$colorInputBg: rgba(#fff, 0.07); $colorInputBg: rgba(#000, 0.1);
$colorInputFg: pullForward($colorBodyFg, 20%); $colorInputFg: pullForward($colorBodyFg, 20%);
$colorFormText: rgba(#fff, 0.5); $colorFormText: rgba(#fff, 0.5);
$colorInputIcon: pushBack($colorBodyFg, 15%); $colorInputIcon: pushBack($colorBodyFg, 15%);
@@ -80,7 +80,7 @@ $colorInspectorBg: pullForward($colorBodyBg, 3%);
$colorInspectorFg: $colorBodyFg; $colorInspectorFg: $colorBodyFg;
$colorInspectorPropName: pushBack($colorBodyFg, 15%); $colorInspectorPropName: pushBack($colorBodyFg, 15%);
$colorInspectorPropVal: pullForward($colorInspectorFg, 15%); $colorInspectorPropVal: pullForward($colorInspectorFg, 15%);
$colorInspectorSectionHeaderBg: pullForward($colorInspectorBg, 5%); $colorInspectorSectionHeaderBg: $colorFormSectionHeader;
$colorInspectorSectionHeaderFg: pullForward($colorInspectorBg, 40%); $colorInspectorSectionHeaderFg: pullForward($colorInspectorBg, 40%);
// Status colors, mainly used for messaging and item ancillary symbols // Status colors, mainly used for messaging and item ancillary symbols

123
platform/commonUI/themes/snow/res/css/theme-snow.css
View File

@@ -20,7 +20,7 @@
* this source code distribution or the Licensing information page available * this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information. * at runtime from the About dialog for additional information.
*****************************************************************************/ *****************************************************************************/
/* line 5, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ /* line 5, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
html, body, div, span, applet, object, iframe, html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code, a, abbr, acronym, address, big, cite, code,
@@ -41,38 +41,38 @@ time, mark, audio, video {
font-size: 100%; font-size: 100%;
vertical-align: baseline; } vertical-align: baseline; }
/* line 22, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ /* line 22, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
html { html {
line-height: 1; } line-height: 1; }
/* line 24, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ /* line 24, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
ol, ul { ol, ul {
list-style: none; } list-style: none; }
/* line 26, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ /* line 26, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
table { table {
border-collapse: collapse; border-collapse: collapse;
border-spacing: 0; } border-spacing: 0; }
/* line 28, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ /* line 28, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
caption, th, td { caption, th, td {
text-align: left; text-align: left;
font-weight: normal; font-weight: normal;
vertical-align: middle; } vertical-align: middle; }
/* line 30, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ /* line 30, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
q, blockquote { q, blockquote {
quotes: none; } quotes: none; }
/* line 103, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ /* line 103, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
q:before, q:after, blockquote:before, blockquote:after { q:before, q:after, blockquote:before, blockquote:after {
content: ""; content: "";
content: none; } content: none; }
/* line 32, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ /* line 32, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
a img { a img {
border: none; } border: none; }
/* line 116, ../../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */ /* line 116, ../../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
display: block; } display: block; }
@@ -1432,18 +1432,21 @@ tr[class*="s-limit"].s-limit-lwr td:first-child:before {
/* line 24, ../../../../general/res/sass/_inspector.scss */ /* line 24, ../../../../general/res/sass/_inspector.scss */
.l-inspect, .l-inspect,
.l-inspect table tr td { .l-inspect table tr td {
font-size: 0.7rem; } font-size: 0.75rem; }
/* line 29, ../../../../general/res/sass/_inspector.scss */ /* line 29, ../../../../general/res/sass/_inspector.scss */
.l-inspect { .l-inspect {
background: #efefef; background: #efefef;
color: #666; color: #666;
line-height: 140%; } line-height: 140%; }
/* line 34, ../../../../general/res/sass/_inspector.scss */ /* line 35, ../../../../general/res/sass/_inspector.scss */
.l-inspect .flex-elem.holder:not(:last-child) {
margin-bottom: 5px; }
/* line 37, ../../../../general/res/sass/_inspector.scss */
.l-inspect .pane-header { .l-inspect .pane-header {
color: #999999; color: #999999;
font-size: 0.8rem; } font-size: 0.8rem; }
/* line 37, ../../../../general/res/sass/_inspector.scss */ /* line 40, ../../../../general/res/sass/_inspector.scss */
.l-inspect .pane-header:before { .l-inspect .pane-header:before {
color: gray; color: gray;
content: '\e615'; content: '\e615';
@@ -1451,26 +1454,26 @@ tr[class*="s-limit"].s-limit-lwr td:first-child:before {
font-family: symbolsfont; font-family: symbolsfont;
margin-right: 5px; margin-right: 5px;
vertical-align: bottom; } vertical-align: bottom; }
/* line 49, ../../../../general/res/sass/_inspector.scss */ /* line 52, ../../../../general/res/sass/_inspector.scss */
.l-inspect .split-layout .split-pane-component.pane.bottom { .l-inspect .split-layout .split-pane-component.pane.bottom {
height: 30%; height: 30%;
min-height: 20%; min-height: 20%;
max-height: 80%; } max-height: 80%; }
/* line 57, ../../../../general/res/sass/_inspector.scss */ /* line 60, ../../../../general/res/sass/_inspector.scss */
.l-inspect ul { .l-inspect ul {
-moz-box-sizing: border-box; -moz-box-sizing: border-box;
-webkit-box-sizing: border-box; -webkit-box-sizing: border-box;
box-sizing: border-box; box-sizing: border-box;
padding-right: 5px; } padding-right: 5px; }
/* line 62, ../../../../general/res/sass/_inspector.scss */ /* line 65, ../../../../general/res/sass/_inspector.scss */
.l-inspect ul li, .l-inspect ul li,
.l-inspect em { .l-inspect em {
display: block; display: block;
position: relative; } position: relative; }
/* line 68, ../../../../general/res/sass/_inspector.scss */ /* line 71, ../../../../general/res/sass/_inspector.scss */
.l-inspect ul li { .l-inspect ul li {
margin-bottom: 10px; } margin-bottom: 10px; }
/* line 72, ../../../../general/res/sass/_inspector.scss */ /* line 75, ../../../../general/res/sass/_inspector.scss */
.l-inspect em { .l-inspect em {
-moz-border-radius: 4px; -moz-border-radius: 4px;
-webkit-border-radius: 4px; -webkit-border-radius: 4px;
@@ -1480,34 +1483,34 @@ tr[class*="s-limit"].s-limit-lwr td:first-child:before {
margin-bottom: 5px; margin-bottom: 5px;
padding: 5px 5px; padding: 5px 5px;
text-transform: uppercase; } text-transform: uppercase; }
/* line 81, ../../../../general/res/sass/_inspector.scss */ /* line 84, ../../../../general/res/sass/_inspector.scss */
.l-inspect .inspector-properties { .l-inspect .inspector-properties {
padding: 3px 0; } padding: 3px 0; }
/* line 82, ../../../../general/res/sass/_inspector.scss */ /* line 85, ../../../../general/res/sass/_inspector.scss */
.l-inspect .inspector-properties:not(.first) { .l-inspect .inspector-properties:not(.first) {
border-top: 1px solid #e3e3e3; } border-top: 1px solid #e3e3e3; }
/* line 86, ../../../../general/res/sass/_inspector.scss */ /* line 89, ../../../../general/res/sass/_inspector.scss */
.l-inspect .inspector-properties .label { .l-inspect .inspector-properties .label {
color: #999999; color: #999999;
text-transform: uppercase; } text-transform: uppercase; }
/* line 90, ../../../../general/res/sass/_inspector.scss */ /* line 93, ../../../../general/res/sass/_inspector.scss */
.l-inspect .inspector-properties .value { .l-inspect .inspector-properties .value {
color: #404040; color: #404040;
word-break: break-all; } word-break: break-all; }
/* line 98, ../../../../general/res/sass/_inspector.scss */ /* line 101, ../../../../general/res/sass/_inspector.scss */
.l-inspect .inspector-location .location-item { .l-inspect .inspector-location .location-item {
cursor: pointer; cursor: pointer;
display: inline-block; display: inline-block;
position: relative; position: relative;
padding: 2px 4px; } padding: 2px 4px; }
/* line 103, ../../../../general/res/sass/_inspector.scss */ /* line 106, ../../../../general/res/sass/_inspector.scss */
.l-inspect .inspector-location .location-item:hover { .l-inspect .inspector-location .location-item:hover {
background: rgba(102, 102, 102, 0.1); background: rgba(102, 102, 102, 0.1);
color: #333333; } color: #333333; }
/* line 106, ../../../../general/res/sass/_inspector.scss */ /* line 109, ../../../../general/res/sass/_inspector.scss */
.l-inspect .inspector-location .location-item:hover .icon, .l-inspect .inspector-location .location-item:hover .t-item-icon { .l-inspect .inspector-location .location-item:hover .icon, .l-inspect .inspector-location .location-item:hover .t-item-icon {
color: #0099cc; } color: #0099cc; }
/* line 111, ../../../../general/res/sass/_inspector.scss */ /* line 114, ../../../../general/res/sass/_inspector.scss */
.l-inspect .inspector-location:not(.last) .t-object-label .t-title-label:after { .l-inspect .inspector-location:not(.last) .t-object-label .t-title-label:after {
color: #8c8c8c; color: #8c8c8c;
content: '\3e'; content: '\3e';
@@ -1517,12 +1520,19 @@ tr[class*="s-limit"].s-limit-lwr td:first-child:before {
line-height: inherit; line-height: inherit;
margin-left: 3px; margin-left: 3px;
width: 4px; } width: 4px; }
/* line 123, ../../../../general/res/sass/_inspector.scss */ /* line 126, ../../../../general/res/sass/_inspector.scss */
.l-inspect .holder-elements .current-elements { .l-inspect .holder-elements .current-elements {
position: relative; } position: relative; }
/* line 125, ../../../../general/res/sass/_inspector.scss */ /* line 129, ../../../../general/res/sass/_inspector.scss */
.l-inspect .holder-elements .current-elements .tree-item .t-object-label { .l-inspect .holder-elements .current-elements .tree-item .t-object-label {
left: 0; } left: 0; }
/* line 132, ../../../../general/res/sass/_inspector.scss */
.l-inspect .holder-elements .current-elements .tree-item .t-object-label .t-item-icon {
font-size: 1em;
width: 1em; }
/* line 136, ../../../../general/res/sass/_inspector.scss */
.l-inspect .holder-elements .current-elements .tree-item .t-object-label .t-title-label {
left: 25px; }
/********************************* CONTROLS */ /********************************* CONTROLS */
/* line 1, ../../../../general/res/sass/controls/_breadcrumb.scss */ /* line 1, ../../../../general/res/sass/controls/_breadcrumb.scss */
@@ -5208,43 +5218,12 @@ span.req {
* this source code distribution or the Licensing information page available * this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information. * at runtime from the About dialog for additional information.
*****************************************************************************/ *****************************************************************************/
/* /* line 32, ../../../../general/res/sass/search/_search.scss */
// Moved to filter.scss
.clear-icon,
.menu-icon {
cursor: pointer;
font-family: symbolsfont;
@include trans-prop-nice((opacity, color), 150ms);
}
.clear-icon {
// 'x' in circle icon
&:before {
content: '\e607';
}
}
*/
/* line 63, ../../../../general/res/sass/search/_search.scss */
.holder-search .search-bar { .holder-search .search-bar {
font-size: 0.8em; font-size: 0.8em;
max-width: 250px; max-width: 250px;
position: relative; position: relative; }
/* .clear-icon { /* line 37, ../../../../general/res/sass/search/_search.scss */
right: $iconD + $interiorMargin;
// Icon is visible only when there is text input
visibility: hidden;
opacity: 0;
&.show {
visibility: visible;
opacity: 1;
}
&:hover {
color: pullForward($colorInputIcon, 10%);
}
}*/ }
/* line 68, ../../../../general/res/sass/search/_search.scss */
.holder-search .search-bar input[type="search"] { .holder-search .search-bar input[type="search"] {
height: 25px; height: 25px;
line-height: 25px; line-height: 25px;
@@ -5252,28 +5231,28 @@ span.req {
width: 100%; width: 100%;
padding-left: 22px !important; padding-left: 22px !important;
padding-right: 44px !important; } padding-right: 44px !important; }
/* line 133, ../../../../general/res/sass/search/_search.scss */ /* line 46, ../../../../general/res/sass/search/_search.scss */
.holder-search .search-bar .clear-icon { .holder-search .search-bar .clear-icon {
right: 22px; } right: 22px; }
/* line 137, ../../../../general/res/sass/search/_search.scss */ /* line 50, ../../../../general/res/sass/search/_search.scss */
.holder-search .search-bar .menu-icon { .holder-search .search-bar .menu-icon {
font-size: 0.8em; font-size: 0.8em;
padding-right: 4px; padding-right: 4px;
right: 4px; right: 4px;
text-align: right; } text-align: right; }
/* line 139, ../../../../general/res/sass/search/_search.scss */ /* line 52, ../../../../general/res/sass/search/_search.scss */
.holder-search .search-bar .menu-icon:before { .holder-search .search-bar .menu-icon:before {
content: '\76'; } content: '\76'; }
/* line 145, ../../../../general/res/sass/search/_search.scss */ /* line 58, ../../../../general/res/sass/search/_search.scss */
.holder-search .search-bar .menu-icon:hover { .holder-search .search-bar .menu-icon:hover {
color: #8c8c8c; } color: #8c8c8c; }
/* line 150, ../../../../general/res/sass/search/_search.scss */ /* line 63, ../../../../general/res/sass/search/_search.scss */
.holder-search .search-bar .search-menu-holder { .holder-search .search-bar .search-menu-holder {
float: right; float: right;
left: -20px; left: -20px;
z-index: 70; z-index: 70;
transition: visibility .05s, opacity .05s; } transition: visibility .05s, opacity .05s; }
/* line 158, ../../../../general/res/sass/search/_search.scss */ /* line 71, ../../../../general/res/sass/search/_search.scss */
.holder-search .active-filter-display { .holder-search .active-filter-display {
-moz-box-sizing: border-box; -moz-box-sizing: border-box;
-webkit-box-sizing: border-box; -webkit-box-sizing: border-box;
@@ -5281,7 +5260,7 @@ span.req {
line-height: 130%; line-height: 130%;
padding-left: 1.4625em; padding-left: 1.4625em;
font-size: 0.65em; } font-size: 0.65em; }
/* line 166, ../../../../general/res/sass/search/_search.scss */ /* line 79, ../../../../general/res/sass/search/_search.scss */
.holder-search .active-filter-display .clear-filters-icon { .holder-search .active-filter-display .clear-filters-icon {
color: #a6a6a6; color: #a6a6a6;
opacity: 1; opacity: 1;
@@ -5289,7 +5268,7 @@ span.req {
position: absolute; position: absolute;
left: 1px; left: 1px;
cursor: pointer; } cursor: pointer; }
/* line 176, ../../../../general/res/sass/search/_search.scss */ /* line 89, ../../../../general/res/sass/search/_search.scss */
.holder-search .search-results { .holder-search .search-results {
-moz-transition-property: opacity, visibility; -moz-transition-property: opacity, visibility;
-o-transition-property: opacity, visibility; -o-transition-property: opacity, visibility;
@@ -5309,16 +5288,16 @@ span.req {
transition-delay: 0; transition-delay: 0;
margin-top: 10px; margin-top: 10px;
padding-right: 5px; } padding-right: 5px; }
/* line 180, ../../../../general/res/sass/search/_search.scss */ /* line 93, ../../../../general/res/sass/search/_search.scss */
.holder-search .search-results .hint { .holder-search .search-results .hint {
margin-bottom: 10px; margin-bottom: 10px;
font-size: 0.65em; font-size: 0.65em;
opacity: 0.6; } opacity: 0.6; }
/* line 185, ../../../../general/res/sass/search/_search.scss */ /* line 98, ../../../../general/res/sass/search/_search.scss */
.holder-search .search-results.active { .holder-search .search-results.active {
visibility: visible; visibility: visible;
opacity: 1; } opacity: 1; }
/* line 189, ../../../../general/res/sass/search/_search.scss */ /* line 102, ../../../../general/res/sass/search/_search.scss */
.holder-search .search-results .load-more-button { .holder-search .search-results .load-more-button {
-moz-transform: translateX(-50%); -moz-transform: translateX(-50%);
-ms-transform: translateX(-50%); -ms-transform: translateX(-50%);