mirror of
https://github.com/nasa/openmct.git
synced 2025-05-31 14:40:48 +00:00
[Mobile] layout adjustment
Currently mobile css transition does not work on phone portrait. Added some not reached css classes used in old slide menu.
This commit is contained in:
Shivam Dave
parent
46deabafee
commit
cb5429979a
@ -120,7 +120,7 @@
|
||||
* this source code distribution or the Licensing information page available
|
||||
* 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,
|
||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
||||
a, abbr, acronym, address, big, cite, code,
|
||||
@ -141,38 +141,38 @@ time, mark, audio, video {
|
||||
font-size: 100%;
|
||||
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 {
|
||||
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 {
|
||||
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 {
|
||||
border-collapse: collapse;
|
||||
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 {
|
||||
text-align: left;
|
||||
font-weight: normal;
|
||||
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 {
|
||||
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 {
|
||||
content: "";
|
||||
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 {
|
||||
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 {
|
||||
display: block; }
|
||||
|
||||
@ -822,29 +822,6 @@ mct-container {
|
||||
bottom: 0;
|
||||
left: 0; }
|
||||
|
||||
/* line 31, ../sass/mobile/_layout.scss */
|
||||
.pane.left.treeview {
|
||||
background-color: #222; }
|
||||
|
||||
/* line 35, ../sass/mobile/_layout.scss */
|
||||
.pane.right-repr {
|
||||
-moz-transition-duration: 0.35s;
|
||||
-o-transition-duration: 0.35s;
|
||||
-webkit-transition-duration: 0.35s;
|
||||
transition-duration: 0.35s;
|
||||
transition-timing-function: ease;
|
||||
backface-visibility: hidden;
|
||||
margin-left: 0 !important; }
|
||||
/* line 39, ../sass/mobile/_layout.scss */
|
||||
.pane.right-repr #content-area {
|
||||
-moz-transition-duration: 0.35s;
|
||||
-o-transition-duration: 0.35s;
|
||||
-webkit-transition-duration: 0.35s;
|
||||
transition-duration: 0.35s;
|
||||
transition-timing-function: ease;
|
||||
backface-visibility: hidden;
|
||||
opacity: 1; }
|
||||
|
||||
/* line 45, ../sass/mobile/_layout.scss */
|
||||
.user-environ .browse-area,
|
||||
.user-environ .edit-area,
|
||||
@ -866,15 +843,16 @@ mct-container {
|
||||
-moz-user-select: -moz-none;
|
||||
-ms-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
user-select: none; }
|
||||
/* line 63, ../sass/mobile/_layout.scss */
|
||||
user-select: none;
|
||||
background-color: #222; }
|
||||
/* line 64, ../sass/mobile/_layout.scss */
|
||||
.pane.left.inactive {
|
||||
opacity: 0;
|
||||
right: 100% !important;
|
||||
width: auto !important;
|
||||
overflow-y: hidden;
|
||||
overflow-x: hidden; }
|
||||
/* line 72, ../sass/mobile/_layout.scss */
|
||||
/* line 73, ../sass/mobile/_layout.scss */
|
||||
.pane.left.active {
|
||||
-moz-transition-property: opacity;
|
||||
-o-transition-property: opacity;
|
||||
@ -897,51 +875,72 @@ mct-container {
|
||||
display: block !important;
|
||||
right: auto !important;
|
||||
width: 40% !important; }
|
||||
/* line 84, ../sass/mobile/_layout.scss */
|
||||
/* line 85, ../sass/mobile/_layout.scss */
|
||||
.pane.left .create-btn.major.inactivePane {
|
||||
display: none; }
|
||||
|
||||
/* line 95, ../sass/mobile/_layout.scss */
|
||||
.split-pane-component.secondary-split.pane.right.leftActive {
|
||||
left: 40% !important; }
|
||||
/* line 93, ../sass/mobile/_layout.scss */
|
||||
.split-pane-component.secondary-split.pane.right {
|
||||
-moz-transition-duration: 0.35s;
|
||||
-o-transition-duration: 0.35s;
|
||||
-webkit-transition-duration: 0.35s;
|
||||
transition-duration: 0.35s;
|
||||
transition-timing-function: ease;
|
||||
backface-visibility: hidden;
|
||||
margin-left: 0 !important; }
|
||||
/* line 98, ../sass/mobile/_layout.scss */
|
||||
.split-pane-component.secondary-split.pane.right #content-area {
|
||||
-moz-transition-duration: 0.35s;
|
||||
-o-transition-duration: 0.35s;
|
||||
-webkit-transition-duration: 0.35s;
|
||||
transition-duration: 0.35s;
|
||||
transition-timing-function: ease;
|
||||
backface-visibility: hidden;
|
||||
opacity: 1; }
|
||||
/* line 103, ../sass/mobile/_layout.scss */
|
||||
.split-pane-component.secondary-split.pane.right.leftInactive {
|
||||
left: 0 !important; }
|
||||
/* line 108, ../sass/mobile/_layout.scss */
|
||||
.split-pane-component.secondary-split.pane.right.leftActive {
|
||||
left: 40% !important; }
|
||||
|
||||
/* line 150, ../sass/mobile/_layout.scss */
|
||||
/* line 163, ../sass/mobile/_layout.scss */
|
||||
.mobile-menu-icon {
|
||||
font-size: 110%;
|
||||
position: absolute;
|
||||
top: 12px;
|
||||
left: 10px; }
|
||||
|
||||
/* line 157, ../sass/mobile/_layout.scss */
|
||||
/* line 170, ../sass/mobile/_layout.scss */
|
||||
.object-browse-bar {
|
||||
left: 30px !important; }
|
||||
/* line 160, ../sass/mobile/_layout.scss */
|
||||
/* line 173, ../sass/mobile/_layout.scss */
|
||||
.object-browse-bar .context-available {
|
||||
opacity: 1 !important; }
|
||||
/* line 163, ../sass/mobile/_layout.scss */
|
||||
/* line 176, ../sass/mobile/_layout.scss */
|
||||
.object-browse-bar .view-switcher {
|
||||
margin-right: 0 !important; }
|
||||
/* line 165, ../sass/mobile/_layout.scss */
|
||||
/* line 178, ../sass/mobile/_layout.scss */
|
||||
.object-browse-bar .view-switcher .name {
|
||||
display: none; }
|
||||
|
||||
/* line 172, ../sass/mobile/_layout.scss */
|
||||
/* line 185, ../sass/mobile/_layout.scss */
|
||||
.tree-holder {
|
||||
overflow-x: hidden !important; }
|
||||
|
||||
/* line 176, ../sass/mobile/_layout.scss */
|
||||
/* line 189, ../sass/mobile/_layout.scss */
|
||||
.mobile-disable-select {
|
||||
-moz-user-select: -moz-none;
|
||||
-ms-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
user-select: none; }
|
||||
|
||||
/* line 181, ../sass/mobile/_layout.scss */
|
||||
/* line 194, ../sass/mobile/_layout.scss */
|
||||
.mobile-hide,
|
||||
.mobile-hide-important {
|
||||
display: none !important; }
|
||||
|
||||
/* line 186, ../sass/mobile/_layout.scss */
|
||||
/* line 199, ../sass/mobile/_layout.scss */
|
||||
.mobile-back-hide {
|
||||
pointer-events: none;
|
||||
-moz-transition-property: opacity;
|
||||
@ -958,7 +957,7 @@ mct-container {
|
||||
transition-timing-function: ease-in-out;
|
||||
opacity: 0; }
|
||||
|
||||
/* line 191, ../sass/mobile/_layout.scss */
|
||||
/* line 204, ../sass/mobile/_layout.scss */
|
||||
.mobile-back-unhide {
|
||||
pointer-events: all;
|
||||
-moz-transition-property: opacity;
|
||||
@ -975,20 +974,20 @@ mct-container {
|
||||
transition-timing-function: ease-in-out;
|
||||
opacity: 1; } }
|
||||
@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px) {
|
||||
/* line 203, ../sass/mobile/_layout.scss */
|
||||
/* line 216, ../sass/mobile/_layout.scss */
|
||||
.pane.left.active {
|
||||
width: 90% !important; }
|
||||
|
||||
/* line 211, ../sass/mobile/_layout.scss */
|
||||
/* line 224, ../sass/mobile/_layout.scss */
|
||||
.split-pane-component.secondary-split.pane.right.leftActive {
|
||||
left: 0 !important;
|
||||
transform: translateX(90%);
|
||||
-webkit-transform: translateX(90%); }
|
||||
/* line 214, ../sass/mobile/_layout.scss */
|
||||
/* line 227, ../sass/mobile/_layout.scss */
|
||||
.split-pane-component.secondary-split.pane.right.leftActive #content-area {
|
||||
opacity: 0; } }
|
||||
@media screen and (min-device-width: 800px) and (min-device-height: 1025px), screen and (min-device-width: 1025px) and (min-device-height: 800px) {
|
||||
/* line 236, ../sass/mobile/_layout.scss */
|
||||
/* line 249, ../sass/mobile/_layout.scss */
|
||||
.desktop-hide {
|
||||
display: none; } }
|
||||
/*****************************************************************************
|
||||
|
||||
@ -28,19 +28,19 @@
|
||||
top: 0 !important; right: 0; bottom: 0; left: 0;
|
||||
}
|
||||
|
||||
.pane.left.treeview {
|
||||
background-color: $colorMobilePaneLeft;
|
||||
}
|
||||
//.pane.left.treeview {
|
||||
// background-color: $colorMobilePaneLeft;
|
||||
//}
|
||||
|
||||
.pane.right-repr {
|
||||
//@include test();
|
||||
@include slMenuTransitions;
|
||||
margin-left: 0 !important;
|
||||
#content-area {
|
||||
@include slMenuTransitions;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
//.pane.right-repr {
|
||||
// //@include test();
|
||||
// @include slMenuTransitions;
|
||||
// margin-left: 0 !important;
|
||||
// #content-area {
|
||||
// @include slMenuTransitions;
|
||||
// opacity: 1;
|
||||
// }
|
||||
//}
|
||||
|
||||
.user-environ .browse-area,
|
||||
.user-environ .edit-area,
|
||||
@ -58,6 +58,7 @@
|
||||
// The left pane class
|
||||
.pane.left {
|
||||
@include user-select(none);
|
||||
background-color: $colorMobilePaneLeft;
|
||||
|
||||
// When the left pane is inactive and closed
|
||||
&.inactive {
|
||||
@ -91,6 +92,18 @@
|
||||
// (can include inspector and representation)
|
||||
.split-pane-component.secondary-split.pane.right {
|
||||
|
||||
//@include test();
|
||||
@include slMenuTransitions;
|
||||
margin-left: 0 !important;
|
||||
#content-area {
|
||||
@include slMenuTransitions;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
&.leftInactive {
|
||||
left: 0 !important;
|
||||
}
|
||||
|
||||
// When the left pane is open or 'active'
|
||||
&.leftActive {
|
||||
left: $proporMenuWithView !important;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user