mirror of
https://github.com/nasa/openmct.git
synced 2025-03-22 03:55:31 +00:00
[Frontend] Inspector-related fixes
open #243 Enlarged size of mini-tab icon when panes are collapsed; Increased size of edge margin to allow for larger icons;
This commit is contained in:
parent
f4325e2bb3
commit
5f1f54fa91
@ -44,9 +44,10 @@ $ueAppLogoW: 105px;
|
||||
$ueEditToolBarH: 25px;
|
||||
$ueBrowseLeftPaneTreeW: 25%;
|
||||
$ueBrowseRightPaneInspectW: 20%;
|
||||
$ueCollapsedPaneEdgeM: 20px;
|
||||
$ueCollapsedPaneEdgeM: 22px;
|
||||
$uePaneMiniTabH: $ueTopBarH;
|
||||
$uePaneMiniTabW: 9px;
|
||||
$uePaneMiniTabCollapsedW: 11px;
|
||||
$ueEditLeftPaneW: 75%;
|
||||
$treeSearchInputBarH: 25px;
|
||||
$ueTimeControlH: (33px, 20px, 20px);
|
||||
|
@ -225,6 +225,11 @@ $pad: $interiorMargin * $baseRatio;
|
||||
overflow: hidden;
|
||||
word-break: break-all;
|
||||
|
||||
&.collapsed {
|
||||
$d: $uePaneMiniTabCollapsedW;
|
||||
width: $d; font-size: $d;
|
||||
}
|
||||
|
||||
&:before,
|
||||
&:after {
|
||||
position: absolute;
|
||||
|
@ -507,35 +507,35 @@ mct-container {
|
||||
padding: 5px 0; }
|
||||
|
||||
/********************************************* FLEX STYLES */
|
||||
/* line 95, ../../../../general/res/sass/_archetypes.scss */
|
||||
/* line 96, ../../../../general/res/sass/_archetypes.scss */
|
||||
.l-flex-row, .l-flex,
|
||||
.l-flex-col {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-flex-wrap: nowrap;
|
||||
flex-wrap: nowrap; }
|
||||
/* line 100, ../../../../general/res/sass/_archetypes.scss */
|
||||
/* line 101, ../../../../general/res/sass/_archetypes.scss */
|
||||
.l-flex-row .flex-elem:not(.grows), .l-flex .flex-elem:not(.grows),
|
||||
.l-flex-col .flex-elem:not(.grows) {
|
||||
-webkit-flex: 0 1 auto;
|
||||
flex: 0 1 auto; }
|
||||
/* line 103, ../../../../general/res/sass/_archetypes.scss */
|
||||
/* line 104, ../../../../general/res/sass/_archetypes.scss */
|
||||
.l-flex-row .flex-elem.grows, .l-flex .flex-elem.grows,
|
||||
.l-flex-col .flex-elem.grows {
|
||||
-webkit-flex: 1 1 auto;
|
||||
flex: 1 1 auto; }
|
||||
|
||||
/* line 109, ../../../../general/res/sass/_archetypes.scss */
|
||||
/* line 110, ../../../../general/res/sass/_archetypes.scss */
|
||||
.l-flex-row, .l-flex {
|
||||
-webkit-flex-direction: row;
|
||||
flex-direction: row; }
|
||||
|
||||
/* line 110, ../../../../general/res/sass/_archetypes.scss */
|
||||
/* line 111, ../../../../general/res/sass/_archetypes.scss */
|
||||
.l-flex-col {
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column; }
|
||||
|
||||
/* line 116, ../../../../general/res/sass/_archetypes.scss */
|
||||
/* line 115, ../../../../general/res/sass/_archetypes.scss */
|
||||
.l-flex .left {
|
||||
-webkit-flex: 1 1 0;
|
||||
flex: 1 1 0;
|
||||
@ -1895,26 +1895,30 @@ tr[class*="s-limit"].s-limit-lwr td:first-child:before {
|
||||
overflow: hidden;
|
||||
word-break: break-all; }
|
||||
/* line 228, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
.mini-tab-icon.collapsed {
|
||||
width: 11px;
|
||||
font-size: 11px; }
|
||||
/* line 233, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
.mini-tab-icon:before, .mini-tab-icon:after {
|
||||
position: absolute;
|
||||
display: inherit; }
|
||||
/* line 234, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
/* line 239, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
.mini-tab-icon:before {
|
||||
content: '\78'; }
|
||||
/* line 238, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
/* line 243, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
.mini-tab-icon:hover {
|
||||
color: #0099cc; } }
|
||||
|
||||
/* line 245, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
/* line 250, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
.l-btn-set {
|
||||
font-size: 0; }
|
||||
/* line 251, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
/* line 256, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
.l-btn-set .s-btn, .l-btn-set .s-menu-btn {
|
||||
-moz-border-radius: 0;
|
||||
-webkit-border-radius: 0;
|
||||
border-radius: 0;
|
||||
margin-left: 1px; }
|
||||
/* line 257, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
/* line 262, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
.l-btn-set .first .s-btn, .l-btn-set .first .s-menu-btn {
|
||||
-moz-border-radius-topleft: 3px;
|
||||
-webkit-border-top-left-radius: 3px;
|
||||
@ -1923,7 +1927,7 @@ tr[class*="s-limit"].s-limit-lwr td:first-child:before {
|
||||
-webkit-border-bottom-left-radius: 3px;
|
||||
border-bottom-left-radius: 3px;
|
||||
margin-left: 0; }
|
||||
/* line 264, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
/* line 269, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
.l-btn-set .last .s-btn, .l-btn-set .last .s-menu-btn {
|
||||
-moz-border-radius-topright: 3px;
|
||||
-webkit-border-top-right-radius: 3px;
|
||||
@ -1932,7 +1936,7 @@ tr[class*="s-limit"].s-limit-lwr td:first-child:before {
|
||||
-webkit-border-bottom-right-radius: 3px;
|
||||
border-bottom-right-radius: 3px; }
|
||||
|
||||
/* line 271, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
/* line 276, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
.paused:not(.s-btn):not(.s-menu-btn) {
|
||||
border-color: #c56f01 !important;
|
||||
color: #c56f01 !important; }
|
||||
@ -4533,10 +4537,10 @@ span.req {
|
||||
/* line 240, ../../../../general/res/sass/user-environ/_layout.scss */
|
||||
.pane .mini-tab-icon.toggle-pane.toggle-tree.anchor-left.collapsed {
|
||||
left: 0;
|
||||
-moz-transform: translateX(-15px);
|
||||
-ms-transform: translateX(-15px);
|
||||
-webkit-transform: translateX(-15px);
|
||||
transform: translateX(-15px); }
|
||||
-moz-transform: translateX(-17px);
|
||||
-ms-transform: translateX(-17px);
|
||||
-webkit-transform: translateX(-17px);
|
||||
transform: translateX(-17px); }
|
||||
/* line 244, ../../../../general/res/sass/user-environ/_layout.scss */
|
||||
.pane .mini-tab-icon.toggle-pane.toggle-tree.anchor-left:not(.collapsed):before {
|
||||
-moz-transition-property: opacity;
|
||||
@ -4757,11 +4761,11 @@ span.req {
|
||||
|
||||
/* line 418, ../../../../general/res/sass/user-environ/_layout.scss */
|
||||
.pane-tree-hidden .pane.right.primary-pane {
|
||||
left: 20px !important; }
|
||||
left: 22px !important; }
|
||||
|
||||
/* line 421, ../../../../general/res/sass/user-environ/_layout.scss */
|
||||
.pane-inspect-hidden .l-object-and-inspector .pane.left {
|
||||
right: 20px !important; }
|
||||
right: 22px !important; }
|
||||
|
||||
/* line 424, ../../../../general/res/sass/user-environ/_layout.scss */
|
||||
.pane:not(.resizing) {
|
||||
|
@ -507,35 +507,35 @@ mct-container {
|
||||
padding: 5px 0; }
|
||||
|
||||
/********************************************* FLEX STYLES */
|
||||
/* line 95, ../../../../general/res/sass/_archetypes.scss */
|
||||
/* line 96, ../../../../general/res/sass/_archetypes.scss */
|
||||
.l-flex-row, .l-flex,
|
||||
.l-flex-col {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-flex-wrap: nowrap;
|
||||
flex-wrap: nowrap; }
|
||||
/* line 100, ../../../../general/res/sass/_archetypes.scss */
|
||||
/* line 101, ../../../../general/res/sass/_archetypes.scss */
|
||||
.l-flex-row .flex-elem:not(.grows), .l-flex .flex-elem:not(.grows),
|
||||
.l-flex-col .flex-elem:not(.grows) {
|
||||
-webkit-flex: 0 1 auto;
|
||||
flex: 0 1 auto; }
|
||||
/* line 103, ../../../../general/res/sass/_archetypes.scss */
|
||||
/* line 104, ../../../../general/res/sass/_archetypes.scss */
|
||||
.l-flex-row .flex-elem.grows, .l-flex .flex-elem.grows,
|
||||
.l-flex-col .flex-elem.grows {
|
||||
-webkit-flex: 1 1 auto;
|
||||
flex: 1 1 auto; }
|
||||
|
||||
/* line 109, ../../../../general/res/sass/_archetypes.scss */
|
||||
/* line 110, ../../../../general/res/sass/_archetypes.scss */
|
||||
.l-flex-row, .l-flex {
|
||||
-webkit-flex-direction: row;
|
||||
flex-direction: row; }
|
||||
|
||||
/* line 110, ../../../../general/res/sass/_archetypes.scss */
|
||||
/* line 111, ../../../../general/res/sass/_archetypes.scss */
|
||||
.l-flex-col {
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column; }
|
||||
|
||||
/* line 116, ../../../../general/res/sass/_archetypes.scss */
|
||||
/* line 115, ../../../../general/res/sass/_archetypes.scss */
|
||||
.l-flex .left {
|
||||
-webkit-flex: 1 1 0;
|
||||
flex: 1 1 0;
|
||||
@ -1840,26 +1840,30 @@ tr[class*="s-limit"].s-limit-lwr td:first-child:before {
|
||||
overflow: hidden;
|
||||
word-break: break-all; }
|
||||
/* line 228, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
.mini-tab-icon.collapsed {
|
||||
width: 11px;
|
||||
font-size: 11px; }
|
||||
/* line 233, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
.mini-tab-icon:before, .mini-tab-icon:after {
|
||||
position: absolute;
|
||||
display: inherit; }
|
||||
/* line 234, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
/* line 239, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
.mini-tab-icon:before {
|
||||
content: '\78'; }
|
||||
/* line 238, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
/* line 243, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
.mini-tab-icon:hover {
|
||||
color: #0099cc; } }
|
||||
|
||||
/* line 245, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
/* line 250, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
.l-btn-set {
|
||||
font-size: 0; }
|
||||
/* line 251, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
/* line 256, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
.l-btn-set .s-btn, .l-btn-set .s-menu-btn {
|
||||
-moz-border-radius: 0;
|
||||
-webkit-border-radius: 0;
|
||||
border-radius: 0;
|
||||
margin-left: 1px; }
|
||||
/* line 257, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
/* line 262, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
.l-btn-set .first .s-btn, .l-btn-set .first .s-menu-btn {
|
||||
-moz-border-radius-topleft: 4px;
|
||||
-webkit-border-top-left-radius: 4px;
|
||||
@ -1868,7 +1872,7 @@ tr[class*="s-limit"].s-limit-lwr td:first-child:before {
|
||||
-webkit-border-bottom-left-radius: 4px;
|
||||
border-bottom-left-radius: 4px;
|
||||
margin-left: 0; }
|
||||
/* line 264, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
/* line 269, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
.l-btn-set .last .s-btn, .l-btn-set .last .s-menu-btn {
|
||||
-moz-border-radius-topright: 4px;
|
||||
-webkit-border-top-right-radius: 4px;
|
||||
@ -1877,7 +1881,7 @@ tr[class*="s-limit"].s-limit-lwr td:first-child:before {
|
||||
-webkit-border-bottom-right-radius: 4px;
|
||||
border-bottom-right-radius: 4px; }
|
||||
|
||||
/* line 271, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
/* line 276, ../../../../general/res/sass/controls/_buttons.scss */
|
||||
.paused:not(.s-btn):not(.s-menu-btn) {
|
||||
border-color: #ff9900 !important;
|
||||
color: #ff9900 !important; }
|
||||
@ -4455,10 +4459,10 @@ span.req {
|
||||
/* line 240, ../../../../general/res/sass/user-environ/_layout.scss */
|
||||
.pane .mini-tab-icon.toggle-pane.toggle-tree.anchor-left.collapsed {
|
||||
left: 0;
|
||||
-moz-transform: translateX(-15px);
|
||||
-ms-transform: translateX(-15px);
|
||||
-webkit-transform: translateX(-15px);
|
||||
transform: translateX(-15px); }
|
||||
-moz-transform: translateX(-17px);
|
||||
-ms-transform: translateX(-17px);
|
||||
-webkit-transform: translateX(-17px);
|
||||
transform: translateX(-17px); }
|
||||
/* line 244, ../../../../general/res/sass/user-environ/_layout.scss */
|
||||
.pane .mini-tab-icon.toggle-pane.toggle-tree.anchor-left:not(.collapsed):before {
|
||||
-moz-transition-property: opacity;
|
||||
@ -4679,11 +4683,11 @@ span.req {
|
||||
|
||||
/* line 418, ../../../../general/res/sass/user-environ/_layout.scss */
|
||||
.pane-tree-hidden .pane.right.primary-pane {
|
||||
left: 20px !important; }
|
||||
left: 22px !important; }
|
||||
|
||||
/* line 421, ../../../../general/res/sass/user-environ/_layout.scss */
|
||||
.pane-inspect-hidden .l-object-and-inspector .pane.left {
|
||||
right: 20px !important; }
|
||||
right: 22px !important; }
|
||||
|
||||
/* line 424, ../../../../general/res/sass/user-environ/_layout.scss */
|
||||
.pane:not(.resizing) {
|
||||
|
Loading…
x
Reference in New Issue
Block a user