[Frontend] Converting tree items and labels to flex-box

open #431
Mobile fixes complete;
This commit is contained in:
Charles Hacskaylo 2015-12-16 14:52:19 -08:00
parent 9b32461240
commit b59fc43038
3 changed files with 43 additions and 26 deletions

View File

@ -34,6 +34,8 @@
line-height: $mobileTreeItemH;
margin-bottom: 0px;
.view-control {
font-size: 1.2em;
margin-right: 0;
order: 2;
width: $mobileTreeItemH;
&.has-children {
@ -49,6 +51,9 @@
}
.t-object-label {
line-height: inherit;
.t-item-icon.l-icon-link:before {
bottom: 20%; // Shift up due to height of mobile menu items
}
}
}
}

View File

@ -20,7 +20,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,
@ -41,38 +41,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; }
@ -5840,9 +5840,11 @@ ul.tree {
/* line 36, ../../../../general/res/sass/mobile/_tree.scss */
.tree-item .view-control,
.search-result-item .view-control {
font-size: 1.2em;
margin-right: 0;
order: 2;
width: 35px; }
/* line 40, ../../../../general/res/sass/mobile/_tree.scss */
/* line 42, ../../../../general/res/sass/mobile/_tree.scss */
.tree-item .view-control.has-children:before,
.search-result-item .view-control.has-children:before {
content: "\7d";
@ -5851,17 +5853,21 @@ ul.tree {
-ms-transform: translateX(-50%) rotate(90deg);
-webkit-transform: translateX(-50%) rotate(90deg);
transform: translateX(-50%) rotate(90deg); }
/* line 45, ../../../../general/res/sass/mobile/_tree.scss */
/* line 47, ../../../../general/res/sass/mobile/_tree.scss */
.tree-item .view-control.has-children.expanded:before,
.search-result-item .view-control.has-children.expanded:before {
-moz-transform: translateX(-50%) rotate(270deg);
-ms-transform: translateX(-50%) rotate(270deg);
-webkit-transform: translateX(-50%) rotate(270deg);
transform: translateX(-50%) rotate(270deg); }
/* line 50, ../../../../general/res/sass/mobile/_tree.scss */
/* line 52, ../../../../general/res/sass/mobile/_tree.scss */
.tree-item .t-object-label,
.search-result-item .t-object-label {
line-height: inherit; } }
line-height: inherit; }
/* line 54, ../../../../general/res/sass/mobile/_tree.scss */
.tree-item .t-object-label .t-item-icon.l-icon-link:before,
.search-result-item .t-object-label .t-item-icon.l-icon-link:before {
bottom: 20%; } }
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space

View File

@ -20,7 +20,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,
@ -41,38 +41,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; }
@ -5743,9 +5743,11 @@ ul.tree {
/* line 36, ../../../../general/res/sass/mobile/_tree.scss */
.tree-item .view-control,
.search-result-item .view-control {
font-size: 1.2em;
margin-right: 0;
order: 2;
width: 35px; }
/* line 40, ../../../../general/res/sass/mobile/_tree.scss */
/* line 42, ../../../../general/res/sass/mobile/_tree.scss */
.tree-item .view-control.has-children:before,
.search-result-item .view-control.has-children:before {
content: "\7d";
@ -5754,17 +5756,21 @@ ul.tree {
-ms-transform: translateX(-50%) rotate(90deg);
-webkit-transform: translateX(-50%) rotate(90deg);
transform: translateX(-50%) rotate(90deg); }
/* line 45, ../../../../general/res/sass/mobile/_tree.scss */
/* line 47, ../../../../general/res/sass/mobile/_tree.scss */
.tree-item .view-control.has-children.expanded:before,
.search-result-item .view-control.has-children.expanded:before {
-moz-transform: translateX(-50%) rotate(270deg);
-ms-transform: translateX(-50%) rotate(270deg);
-webkit-transform: translateX(-50%) rotate(270deg);
transform: translateX(-50%) rotate(270deg); }
/* line 50, ../../../../general/res/sass/mobile/_tree.scss */
/* line 52, ../../../../general/res/sass/mobile/_tree.scss */
.tree-item .t-object-label,
.search-result-item .t-object-label {
line-height: inherit; } }
line-height: inherit; }
/* line 54, ../../../../general/res/sass/mobile/_tree.scss */
.tree-item .t-object-label .t-item-icon.l-icon-link:before,
.search-result-item .t-object-label .t-item-icon.l-icon-link:before {
bottom: 20%; } }
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space