ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2024-12-18 20:57:53 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

[Mobile] Multiple mobile Safari fixes

Browse Source 
open #74
New mixins to prefix '-webkit-' to props and vals;
'flex' classes use new webkit mixins;
Fixed flex layout of .object-browse-bar and
.context-available element;
Migrated CSS to remove small .scss include files;
This commit is contained in:
Charles Hacskaylo 2015-08-27 17:05:50 -07:00
parent 683b3f7511
commit 54bf39344a
10 changed files with 197 additions and 246 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
platform/commonUI/browse/res/templates/browse/object-header.html
View File

@ -22,7 +22,7 @@
<div class='object-header object-header-mobile'>
<span class='type-icon ui-symbol'>{{type.getGlyph()}}</span>
<!--span class='type-name mobile-important-hide'>{{type.getName()}}</span-->
<span class="l-elem-wrapper">
<span class="l-elem-wrapper l-flex">
<span ng-if="parameters.mode" class='action'>{{parameters.mode}}</span>
<span class='title-label'>{{model.name}}</span>
<mct-representation key="'menu-arrow'" mct-object='domainObject'></mct-representation>

273
platform/commonUI/general/res/css/theme-espresso.css
View File

@ -562,15 +562,8 @@ mct-container {
.bar.abs .right .icon.major,
.btn-menu span.bar.l-click-area .right .icon.major {
margin-left: 15px; }
/* line 88, ../sass/user-environ/_layout.scss */
.bar.l-flex {
display: flex;
flex-flow: row nowrap; }
/* line 91, ../sass/user-environ/_layout.scss */
.bar.l-flex .left {
flex: 1 1 0; }
/* line 99, ../sass/user-environ/_layout.scss */
/* line 91, ../sass/user-environ/_layout.scss */
.user-environ .browse-area,
.user-environ .edit-area,
.user-environ .editor {
@ -578,23 +571,23 @@ mct-container {
right: 10px;
bottom: 35px;
left: 10px; }
/* line 110, ../sass/user-environ/_layout.scss */
/* line 102, ../sass/user-environ/_layout.scss */
.user-environ .browse-area > .contents,
.user-environ .edit-area > .contents {
left: 0;
right: 0; }
/* line 116, ../sass/user-environ/_layout.scss */
/* line 108, ../sass/user-environ/_layout.scss */
.user-environ .edit-area {
top: 45px; }
/* line 119, ../sass/user-environ/_layout.scss */
/* line 111, ../sass/user-environ/_layout.scss */
.user-environ .edit-area .tool-bar {
bottom: auto;
height: 30px;
line-height: 25px; }
/* line 124, ../sass/user-environ/_layout.scss */
/* line 116, ../sass/user-environ/_layout.scss */
.user-environ .edit-area .work-area {
top: 40px; }
/* line 129, ../sass/user-environ/_layout.scss */
/* line 121, ../sass/user-environ/_layout.scss */
.user-environ .ue-bottom-bar {
overflow: hidden;
position: absolute;
@ -606,20 +599,20 @@ mct-container {
height: auto;
top: auto;
height: 25px; }
/* line 134, ../sass/user-environ/_layout.scss */
/* line 126, ../sass/user-environ/_layout.scss */
.user-environ .ue-bottom-bar .status-holder {
z-index: 1; }
/* line 138, ../sass/user-environ/_layout.scss */
/* line 130, ../sass/user-environ/_layout.scss */
.user-environ .ue-bottom-bar .app-logo {
left: auto;
width: 105px;
z-index: 2; }
/* line 146, ../sass/user-environ/_layout.scss */
/* line 138, ../sass/user-environ/_layout.scss */
.cols {
overflow: hidden;
*zoom: 1; }
/* line 148, ../sass/user-environ/_layout.scss */
/* line 140, ../sass/user-environ/_layout.scss */
.cols .col {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
@ -630,111 +623,111 @@ mct-container {
margin-left: 1.5%;
padding-left: 5px;
position: relative; }
/* line 156, ../sass/user-environ/_layout.scss */
/* line 148, ../sass/user-environ/_layout.scss */
.cols .col:first-child {
margin-left: 0;
padding-left: 0; }
/* line 163, ../sass/user-environ/_layout.scss */
/* line 155, ../sass/user-environ/_layout.scss */
.cols.cols-2 .col-1 {
min-width: 250px;
width: 48.5%; }
/* line 169, ../sass/user-environ/_layout.scss */
/* line 161, ../sass/user-environ/_layout.scss */
.cols.cols-2-ff .col-100px {
width: 100px; }
/* line 176, ../sass/user-environ/_layout.scss */
/* line 168, ../sass/user-environ/_layout.scss */
.cols.cols-6 .col-1 {
min-width: 83.33333px;
width: 15.16667%; }
/* line 182, ../sass/user-environ/_layout.scss */
/* line 174, ../sass/user-environ/_layout.scss */
.cols.cols-16 .col-1 {
min-width: 31.25px;
width: 4.75%; }
/* line 185, ../sass/user-environ/_layout.scss */
/* line 177, ../sass/user-environ/_layout.scss */
.cols.cols-16 .col-2 {
min-width: 62.5px;
width: 11%; }
/* line 188, ../sass/user-environ/_layout.scss */
/* line 180, ../sass/user-environ/_layout.scss */
.cols.cols-16 .col-7 {
min-width: 218.75px;
width: 42.25%; }
/* line 194, ../sass/user-environ/_layout.scss */
/* line 186, ../sass/user-environ/_layout.scss */
.cols.cols-32 .col-2 {
min-width: 31.25px;
width: 4.75%; }
/* line 197, ../sass/user-environ/_layout.scss */
/* line 189, ../sass/user-environ/_layout.scss */
.cols.cols-32 .col-15 {
min-width: 234.375px;
width: 45.375%; }
/* line 201, ../sass/user-environ/_layout.scss */
/* line 193, ../sass/user-environ/_layout.scss */
.cols .l-row {
overflow: hidden;
*zoom: 1;
padding: 5px 0; }
/* line 209, ../sass/user-environ/_layout.scss */
/* line 201, ../sass/user-environ/_layout.scss */
.browse-mode .split-layout .split-pane-component.pane.left {
min-width: 150px;
max-width: 800px;
width: 25%; }
/* line 222, ../sass/user-environ/_layout.scss */
/* line 214, ../sass/user-environ/_layout.scss */
.edit-mode .split-layout .split-pane-component.pane.right .split-pane-component.pane.bottom {
min-height: 50px;
max-height: 80%; }
/* line 230, ../sass/user-environ/_layout.scss */
/* line 222, ../sass/user-environ/_layout.scss */
.pane {
position: absolute; }
/* line 233, ../sass/user-environ/_layout.scss */
/* line 225, ../sass/user-environ/_layout.scss */
.pane.treeview.left .create-btn-holder {
bottom: auto;
top: 0;
height: 24px; }
/* line 236, ../sass/user-environ/_layout.scss */
/* line 228, ../sass/user-environ/_layout.scss */
.pane.treeview.left .create-btn-holder .wrapper.menu-element {
position: absolute;
bottom: 5px; }
/* line 241, ../sass/user-environ/_layout.scss */
/* line 233, ../sass/user-environ/_layout.scss */
.pane.treeview.left .search-holder {
top: 34px; }
/* line 244, ../sass/user-environ/_layout.scss */
/* line 236, ../sass/user-environ/_layout.scss */
.pane.treeview.left .tree-holder {
overflow: auto;
top: 64px; }
/* line 251, ../sass/user-environ/_layout.scss */
/* line 243, ../sass/user-environ/_layout.scss */
.pane.items .object-browse-bar .left.abs, .pane.items .object-browse-bar .btn-menu span.left.l-click-area, .btn-menu .pane.items .object-browse-bar span.left.l-click-area,
.pane.items .object-browse-bar .right.abs,
.pane.items .object-browse-bar .btn-menu span.right.l-click-area,
.btn-menu .pane.items .object-browse-bar span.right.l-click-area {
top: auto; }
/* line 262, ../sass/user-environ/_layout.scss */
/* line 254, ../sass/user-environ/_layout.scss */
.pane.items .object-holder {
top: 34px; }
/* line 266, ../sass/user-environ/_layout.scss */
/* line 258, ../sass/user-environ/_layout.scss */
.pane .object-holder {
overflow: auto; }
/* line 274, ../sass/user-environ/_layout.scss */
/* line 266, ../sass/user-environ/_layout.scss */
.split-layout.horizontal > .pane {
margin-top: 5px; }
/* line 277, ../sass/user-environ/_layout.scss */
/* line 269, ../sass/user-environ/_layout.scss */
.split-layout.horizontal > .pane:first-child {
margin-top: 0; }
/* line 284, ../sass/user-environ/_layout.scss */
/* line 276, ../sass/user-environ/_layout.scss */
.split-layout.vertical > .pane {
margin-left: 5px; }
/* line 287, ../sass/user-environ/_layout.scss */
/* line 279, ../sass/user-environ/_layout.scss */
.split-layout.vertical > .pane > .holder {
left: 0;
right: 0; }
/* line 291, ../sass/user-environ/_layout.scss */
/* line 283, ../sass/user-environ/_layout.scss */
.split-layout.vertical > .pane:first-child {
margin-left: 0; }
/* line 293, ../sass/user-environ/_layout.scss */
/* line 285, ../sass/user-environ/_layout.scss */
.split-layout.vertical > .pane:first-child .holder {
right: 3px; }
/* line 302, ../sass/user-environ/_layout.scss */
/* line 294, ../sass/user-environ/_layout.scss */
.object-browse-bar .btn,
.object-browse-bar .t-btn,
.object-browse-bar .view-switcher,
@ -748,12 +741,48 @@ mct-container {
line-height: 200%;
vertical-align: top; }
/* line 319, ../sass/user-environ/_layout.scss */
/* line 311, ../sass/user-environ/_layout.scss */
.object-browse-bar .view-switcher,
.top-bar .view-switcher {
margin-right: 20px; }
/* line 324, ../sass/user-environ/_layout.scss */
/* line 316, ../sass/user-environ/_layout.scss */
.object-browse-bar {
overflow: visible;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: auto;
height: auto;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
height: 24px;
line-height: 24px;
white-space: nowrap; }
/* line 324, ../sass/user-environ/_layout.scss */
.object-browse-bar .left {
padding-right: 20px; }
/* line 326, ../sass/user-environ/_layout.scss */
.object-browse-bar .left .l-back {
display: inline-block;
float: left;
margin-right: 10px; }
/* line 334, ../sass/user-environ/_layout.scss */
.l-flex {
display: flex;
display: -webkit-flex;
flex-flow: row nowrap;
-webkit-flex-flow: row nowrap; }
/* line 337, ../sass/user-environ/_layout.scss */
.l-flex .left {
flex: 1 1 0;
-webkit-flex: 1 1 0; }
/* line 343, ../sass/user-environ/_layout.scss */
.vscroll {
overflow-y: auto; }
@ -952,7 +981,8 @@ mct-container {
/* line 160, ../sass/mobile/_layout.scss */
.browse-showtree .pane.right-repr {
left: 0 !important;
transform: translateX(90%); }
transform: translateX(90%);
-webkit-transform: translateX(90%); }
/* line 163, ../sass/mobile/_layout.scss */
.browse-showtree .pane.right-repr #content-area {
opacity: 0; } }
@ -2527,31 +2557,37 @@ label.checkbox.custom {
/* line 364, ../sass/controls/_controls.scss */
.object-header {
font-size: 1em; }
/* line 374, ../sass/controls/_controls.scss */
/* line 375, ../sass/controls/_controls.scss */
.object-header > .type-icon {
font-size: 120%;
float: left;
margin-right: 5px; }
/* line 380, ../sass/controls/_controls.scss */
/* line 381, ../sass/controls/_controls.scss */
.object-header .l-elem-wrapper {
display: flex;
flex-flow: row nowrap;
justify-content: flex-start; }
/* line 386, ../sass/controls/_controls.scss */
justify-content: flex-start;
-webkit-justify-content: flex-start; }
/* line 384, ../sass/controls/_controls.scss */
.object-header .l-elem-wrapper mct-representation {
min-width: 0.7em; }
/* line 392, ../sass/controls/_controls.scss */
.object-header .action {
margin-right: 5px; }
/* line 390, ../sass/controls/_controls.scss */
/* line 396, ../sass/controls/_controls.scss */
.object-header .title-label {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
color: white;
flex: 0 1 auto;
-webkit-flex: 0 1 auto;
padding-right: 0.35em; }
/* line 397, ../sass/controls/_controls.scss */
/* line 405, ../sass/controls/_controls.scss */
.object-header .context-available {
font-size: 0.7em; }
font-size: 0.7em;
flex: 0 0 1;
-webkit-flex: 0 0 1; }
@media screen and (min-device-width: 800px) and (min-device-height: 1025px), screen and (min-device-width: 1025px) and (min-device-height: 800px) {
/* line 402, ../sass/controls/_controls.scss */
/* line 412, ../sass/controls/_controls.scss */
.object-header .context-available {
-moz-transition-property: opacity;
-o-transition-property: opacity;
@ -2566,12 +2602,12 @@ label.checkbox.custom {
-webkit-transition-timing-function: ease-in-out;
transition-timing-function: ease-in-out;
opacity: 0; }
/* line 407, ../sass/controls/_controls.scss */
/* line 417, ../sass/controls/_controls.scss */
.object-header:hover .context-available {
opacity: 1; } }
/******************************************************** SLIDERS */
/* line 420, ../sass/controls/_controls.scss */
/* line 430, ../sass/controls/_controls.scss */
.slider .slot {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
@ -2592,7 +2628,7 @@ label.checkbox.custom {
right: 0;
bottom: auto;
left: 0; }
/* line 431, ../sass/controls/_controls.scss */
/* line 441, ../sass/controls/_controls.scss */
.slider .knob {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzUyNTI1MiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzQ1NDU0NSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
@ -2675,12 +2711,12 @@ label.checkbox.custom {
-webkit-transition-timing-function: ease-in-out;
transition-timing-function: ease-in-out;
border-color: #0099cc; }
/* line 442, ../sass/controls/_controls.scss */
/* line 452, ../sass/controls/_controls.scss */
.slider .knob:before {
top: 1px;
bottom: 3px;
left: 5px; }
/* line 449, ../sass/controls/_controls.scss */
/* line 459, ../sass/controls/_controls.scss */
.slider .range {
background: rgba(0, 153, 204, 0.6);
cursor: ew-resize;
@ -2691,13 +2727,13 @@ label.checkbox.custom {
left: auto;
height: auto;
width: auto; }
/* line 459, ../sass/controls/_controls.scss */
/* line 469, ../sass/controls/_controls.scss */
.slider .range:hover {
background: rgba(0, 153, 204, 0.7); }
/******************************************************** BROWSER ELEMENTS */
@media screen and (min-device-width: 800px) and (min-device-height: 1025px), screen and (min-device-width: 1025px) and (min-device-height: 800px) {
/* line 468, ../sass/controls/_controls.scss */
/* line 478, ../sass/controls/_controls.scss */
::-webkit-scrollbar {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
@ -2714,7 +2750,7 @@ label.checkbox.custom {
height: 10px;
width: 10px; }
/* line 474, ../sass/controls/_controls.scss */
/* line 484, ../sass/controls/_controls.scss */
::-webkit-scrollbar-thumb {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzY2NjY2NiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzU5NTk1OSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
@ -2732,7 +2768,7 @@ label.checkbox.custom {
-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
box-shadow: rgba(0, 0, 0, 0.2) 0 1px 2px;
border-top: 1px solid gray; }
/* line 481, ../sass/controls/_controls.scss */
/* line 491, ../sass/controls/_controls.scss */
::-webkit-scrollbar-thumb:hover {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzgwODA4MCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzczNzM3MyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
background-size: 100%;
@ -2741,7 +2777,7 @@ label.checkbox.custom {
background-image: -webkit-linear-gradient(#808080, #737373 20px);
background-image: linear-gradient(#808080, #737373 20px); }
/* line 486, ../sass/controls/_controls.scss */
/* line 496, ../sass/controls/_controls.scss */
::-webkit-scrollbar-corner {
background: rgba(0, 0, 0, 0.4); } }
/*****************************************************************************
@ -4385,20 +4421,23 @@ input[type="text"] {
/* line 38, ../sass/search/_search.scss */
.search {
display: flex;
display: -webkit-flex;
flex-direction: column;
-webkit-flex-direction: column;
height: 100%; }
/* line 49, ../sass/search/_search.scss */
/* line 48, ../sass/search/_search.scss */
.search .search-bar {
font-size: 0.8em;
max-width: 250px;
position: relative;
width: 100%; }
/* line 66, ../sass/search/_search.scss */
/* line 60, ../sass/search/_search.scss */
.search .search-bar .search-input {
height: 25px;
line-height: 25px;
padding-top: 0;
padding-bottom: 0; }
/* line 73, ../sass/search/_search.scss */
/* line 67, ../sass/search/_search.scss */
.search .search-bar .search-icon,
.search .search-bar .clear-icon,
.search .search-bar .menu-icon {
@ -4412,68 +4451,68 @@ input[type="text"] {
position: absolute;
text-align: center;
top: 4px; }
/* line 86, ../sass/search/_search.scss */
/* line 80, ../sass/search/_search.scss */
.search .search-bar .clear-icon,
.search .search-bar .menu-icon {
cursor: pointer;
transition: color .25s; }
/* line 93, ../sass/search/_search.scss */
/* line 87, ../sass/search/_search.scss */
.search .search-bar .search-input {
position: relative;
width: 100%;
padding-left: 22px !important;
padding-right: 44px !important; }
/* line 100, ../sass/search/_search.scss */
/* line 94, ../sass/search/_search.scss */
.search .search-bar .search-input input {
width: 100%; }
/* line 105, ../sass/search/_search.scss */
/* line 99, ../sass/search/_search.scss */
.search .search-bar .search-icon {
color: #737373;
left: 3px;
transition: visibility .15s, opacity .15s, color .2s;
pointer-events: none; }
/* line 125, ../sass/search/_search.scss */
/* line 119, ../sass/search/_search.scss */
.search .search-bar .search-input:hover + div.search-icon {
color: #a6a6a6; }
/* line 129, ../sass/search/_search.scss */
/* line 123, ../sass/search/_search.scss */
.search .search-bar .clear-icon {
right: 22px;
visibility: hidden;
opacity: 0;
transition: visibility .15s, opacity .15s, color .2s; }
/* line 138, ../sass/search/_search.scss */
/* line 132, ../sass/search/_search.scss */
.search .search-bar .clear-icon.content {
visibility: visible;
opacity: 1; }
/* line 143, ../sass/search/_search.scss */
/* line 137, ../sass/search/_search.scss */
.search .search-bar .clear-icon:hover {
color: #a6a6a6; }
/* line 148, ../sass/search/_search.scss */
/* line 142, ../sass/search/_search.scss */
.search .search-bar .menu-icon {
font-size: 0.8em;
padding-right: 4px;
right: 4px;
text-align: right; }
/* line 154, ../sass/search/_search.scss */
/* line 148, ../sass/search/_search.scss */
.search .search-bar .menu-icon:hover {
color: #a6a6a6; }
/* line 159, ../sass/search/_search.scss */
/* line 153, ../sass/search/_search.scss */
.search .search-bar .search-menu-holder {
float: right;
left: -20px;
z-index: 1;
transition: visibility .05s, opacity .05s; }
/* line 169, ../sass/search/_search.scss */
/* line 163, ../sass/search/_search.scss */
.search .search-bar .search-menu-holder.off {
visibility: hidden;
opacity: 0; }
/* line 176, ../sass/search/_search.scss */
/* line 170, ../sass/search/_search.scss */
.search .search-bar .menu-icon:hover + div.search-menu-holder {
visibility: visible; }
/* line 179, ../sass/search/_search.scss */
/* line 173, ../sass/search/_search.scss */
.search .search-bar div.search-menu-holder:hover {
visibility: visible; }
/* line 184, ../sass/search/_search.scss */
/* line 178, ../sass/search/_search.scss */
.search .active-filter-display {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
@ -4486,14 +4525,14 @@ input[type="text"] {
padding-left: 1.4625em;
font-size: 0.65em;
margin-top: 3px; }
/* line 199, ../sass/search/_search.scss */
/* line 193, ../sass/search/_search.scss */
.search .active-filter-display .clear-filters-icon {
opacity: 0.4;
font-size: 0.8em;
position: absolute;
left: 1px;
cursor: pointer; }
/* line 210, ../sass/search/_search.scss */
/* line 204, ../sass/search/_search.scss */
.search .active-filter-display.off {
visibility: hidden;
opacity: 0;
@ -4501,7 +4540,7 @@ input[type="text"] {
margin: 0;
padding: 0;
border: 0; }
/* line 220, ../sass/search/_search.scss */
/* line 214, ../sass/search/_search.scss */
.search .search-scroll {
order: 3;
margin-top: 4px;
@ -4510,27 +4549,27 @@ input[type="text"] {
height: auto;
max-height: 100%;
position: relative; }
/* line 233, ../sass/search/_search.scss */
/* line 227, ../sass/search/_search.scss */
.search .search-scroll .load-icon {
position: relative; }
/* line 235, ../sass/search/_search.scss */
/* line 229, ../sass/search/_search.scss */
.search .search-scroll .load-icon.loading {
pointer-events: none;
margin-left: 6px; }
/* line 239, ../sass/search/_search.scss */
/* line 233, ../sass/search/_search.scss */
.search .search-scroll .load-icon.loading .title-label {
font-style: italic;
font-size: .9em;
opacity: 0.5;
margin-left: 26px;
line-height: 24px; }
/* line 249, ../sass/search/_search.scss */
/* line 243, ../sass/search/_search.scss */
.search .search-scroll .load-icon.loading .wait-spinner {
margin-left: 6px; }
/* line 254, ../sass/search/_search.scss */
/* line 248, ../sass/search/_search.scss */
.search .search-scroll .load-icon:not(.loading) {
cursor: pointer; }
/* line 259, ../sass/search/_search.scss */
/* line 253, ../sass/search/_search.scss */
.search .search-scroll .load-more-button {
margin-top: 5px 0;
font-size: 0.8em;
@ -4879,52 +4918,6 @@ input[type="text"] {
.status.block .status-indicator.caution {
color: #ffaa00; }
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0.
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
* Open MCT Web includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
/* line 22, ../sass/user-environ/_object-browse.scss */
.object-browse-bar {
overflow: visible;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: auto;
height: auto;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
height: 24px;
line-height: 24px;
white-space: nowrap; }
/* line 30, ../sass/user-environ/_object-browse.scss */
.object-browse-bar .left {
padding-right: 5px; }
/* line 32, ../sass/user-environ/_object-browse.scss */
.object-browse-bar .left .l-back {
display: inline-block;
float: left;
margin-right: 10px; }
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space

37
platform/commonUI/general/res/sass/_flex.scss
View File

@ -1,37 +0,0 @@
.l-flex {
&.l-flex-justify {
justify-content: space-between;
}
.l-flex-row,
&.l-flex-row {
display: flex;
flex-flow: row nowrap;
div, span {
//@include tmpBorder();
}
> div, > span {
//flex: 1 1 0;
}
}
.l-flex-max {
flex: 1 0 !important;
}
.flex-ignore {
display: flex;
flex-flow: row nowrap;
flex: 0 1 auto;
}
}
// TEMP, move out of here once working
.object-browse-bar.bar > div.abs {
@include test(green);
}
.l-flex-row .title-label {
@include test(blue);
flex: 1 0 !important;
}

2
platform/commonUI/general/res/sass/_main.scss
View File

@ -68,7 +68,7 @@
@import "user-environ/frame";
@import "user-environ/top-bar";
@import "user-environ/bottom-bar";
@import "user-environ/object-browse";
//@import "user-environ/object-browse";
@import "user-environ/tool-bar";
@import "helpers/bubbles";
@import "helpers/splitter";

10
platform/commonUI/general/res/sass/_mixins.scss
View File

@ -318,6 +318,16 @@
}
}
@mixin webkitProp($name, $val) {
#{$name}: #{$val};
-webkit-#{$name}: #{$val};
}
@mixin webkitVal($name, $val) {
#{$name}: #{$val};
#{$name}: -webkit-#{$val};
}
@mixin verticalCenter {
/* This doesn't work on an element inside an element with absolute positioning that has height: auto */
//position: relative;

28
platform/commonUI/general/res/sass/controls/_controls.scss
View File

@ -365,12 +365,13 @@ label.checkbox.custom {
//@include test();
font-size: 1em;
> .title-label,
> .type-icon,
> .context-available {
//@include tmpBorder(#6666ff);
//vertical-align: middle;
}
//> .title-label,
//> .type-icon,
//> .context-available {
// //@include tmpBorder(#6666ff);
// //vertical-align: middle;
//}
> .type-icon {
font-size: 120%;
float: left;
@ -378,9 +379,14 @@ label.checkbox.custom {
}
.l-elem-wrapper {
display: flex;
flex-flow: row nowrap;
justify-content: flex-start;
//@include test(#66f, 0.2);
@include webkitProp(justify-content, flex-start);
mct-representation {
// Holds the context-available item
// Must have min-width to make flex work properly
// in Safari
min-width: 0.7em;
}
}
.action {
@ -388,14 +394,18 @@ label.checkbox.custom {
}
.title-label {
//@include test(green, 0.9);
@include ellipsize();
color: lighten($colorBodyFg, 40%);
@include webkitProp(flex, '0 1 auto');
padding-right: 0.35em; // For context arrow. Done with em's so pad is relative to the scale of the text.
//position: relative;
}
.context-available {
font-size: 0.7em;
@include webkitProp(flex, '0 0 1');
//margin-right: $interiorMargin;
}
@include desktop {

2
platform/commonUI/general/res/sass/mobile/_layout.scss
View File

@ -159,7 +159,7 @@
}
.pane.right-repr {
left: 0 !important;
transform: translateX($proporMenuOnly);
@include webkitProp(transform, translateX($proporMenuOnly));
#content-area {
opacity: 0;
}

16
platform/commonUI/general/res/sass/search/_search.scss
View File

@ -39,26 +39,20 @@
$iconWidth: 20px;
$leftMargin: 6px;
$rightPadding: 5px;
//padding-right: $rightPadding;
//@include test();
display: flex; //block;
flex-direction: column;
@include webkitVal(display, flex);
//display: flex;
@include webkitProp(flex-direction, column);
//flex-direction: column;
height: 100%;
.search-bar {
//$heightAdjust: 4px;
$textInputHeight: 19px; // This is equal to the default value, 19px
$iconEdgeM: 4px;
$iconD: $treeSearchInputBarH - ($iconEdgeM*2);
font-size: 0.8em;
//order: 1;
max-width: 250px;
position: relative;
width: 100%;
//height: $textInputHeight;
//margin-top: $heightAdjust;
.search-input,
.search-icon {
}

35
platform/commonUI/general/res/sass/user-environ/_layout.scss
View File

@ -85,14 +85,6 @@
}
}
}
&.l-flex {
display: flex;
flex-flow: row nowrap;
.left {
//@include test(green);
flex: 1 1 0;
}
}
}
.user-environ {
@ -321,6 +313,33 @@
}
}
.object-browse-bar {
//@include test(blue);
@include absPosDefault(0, visible);
@include box-sizing(border-box);
height: $ueTopBarH;
line-height: $ueTopBarH;
white-space: nowrap;
.left {
padding-right: $interiorMarginLg * 2;
.l-back {
display: inline-block;
float: left;
margin-right: $interiorMarginLg;
}
}
}
.l-flex {
@include webkitVal('display', 'flex');
@include webkitProp('flex-flow', 'row nowrap');
.left {
//@include test(red);
@include webkitProp(flex, '1 1 0');
}
}
.vscroll {
overflow-y: auto;
}

38
platform/commonUI/general/res/sass/user-environ/_object-browse.scss
View File

@ -1,38 +0,0 @@
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space
* Administration. All rights reserved.
*
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
* "License"); you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
* http://www.apache.org/licenses/LICENSE-2.0.
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
* License for the specific language governing permissions and limitations
* under the License.
*
* Open MCT Web includes source code licensed under additional open source
* licenses. See the Open Source Licenses file (LICENSES.md) included with
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
.object-browse-bar {
//@include test(blue);
@include absPosDefault(0, visible);
@include box-sizing(border-box);
height: $ueTopBarH;
line-height: $ueTopBarH;
white-space: nowrap;
.left {
padding-right: $interiorMargin;
.l-back {
display: inline-block;
float: left;
margin-right: $interiorMarginLg;
}
}
}