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

[Mobile] Styles

Browse Source 
Added new style to set the width
of the tree.
This commit is contained in:
Shivam Dave
2015-07-06 13:15:38 -07:00
parent 07c907b315
commit 0c6a9ca857
3 changed files with 71 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
platform/commonUI/browse/res/templates/browse.html
View File

@@ -23,8 +23,8 @@
<mct-include key="'topbar-browse'"></mct-include> <mct-include key="'topbar-browse'"></mct-include>
<div class="holder browse-area s-browse-area abs" ng-controller="BrowseController"> <div class="holder browse-area s-browse-area abs" ng-controller="BrowseController">
<mct-split-pane class='contents abs' anchor='left'> <mct-split-pane class='contents abs' anchor='left'>
<div class='split-pane-component treeview pane' <div class='split-pane-component treeview pane browser-manage'>
style="min-width: 150px; max-width: 800px; width: 25%;"> <!-- style="min-width: 150px; max-width: 800px; width: 25%;"-->
<mct-representation key="'create-button'" mct-object="navigatedObject"> <mct-representation key="'create-button'" mct-object="navigatedObject">
</mct-representation> </mct-representation>
<div class='holder tree-holder abs'> <div class='holder tree-holder abs'>

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

@@ -473,7 +473,11 @@ mct-container {
-webkit-border-radius: 3px; -webkit-border-radius: 3px;
border-radius: 3px; } border-radius: 3px; }
/* line 50, ../sass/user-environ/_layout.scss */ /* line 51, ../sass/user-environ/_layout.scss */
.browser-manage {
width: 100%; }
/* line 55, ../sass/user-environ/_layout.scss */
.contents { .contents {
box-sizing: border-box; box-sizing: border-box;
position: absolute; position: absolute;
@@ -481,36 +485,36 @@ mct-container {
right: 0; right: 0;
bottom: 0; bottom: 0;
left: 0; } left: 0; }
/* line 58, ../sass/user-environ/_layout.scss */ /* line 63, ../sass/user-environ/_layout.scss */
.contents.nomargin { .contents.nomargin {
right: 0px; right: 0px;
bottom: 0px; bottom: 0px;
left: 0px; } left: 0px; }
/* line 67, ../sass/user-environ/_layout.scss */ /* line 72, ../sass/user-environ/_layout.scss */
.bar .icon.major { .bar .icon.major {
margin-right: 5px; } margin-right: 5px; }
/* line 70, ../sass/user-environ/_layout.scss */ /* line 75, ../sass/user-environ/_layout.scss */
.bar.abs, .btn-menu span.bar.l-click-area { .bar.abs, .btn-menu span.bar.l-click-area {
text-wrap: none; text-wrap: none;
white-space: nowrap; } white-space: nowrap; }
/* line 74, ../sass/user-environ/_layout.scss */ /* line 79, ../sass/user-environ/_layout.scss */
.bar.left, .bar.left,
.bar .left { .bar .left {
width: 45% !important; width: 45% !important;
right: auto !important; } right: auto !important; }
/* line 79, ../sass/user-environ/_layout.scss */ /* line 84, ../sass/user-environ/_layout.scss */
.bar.right, .bar.right,
.bar .right { .bar .right {
width: 45% !important; width: 45% !important;
left: auto !important; left: auto !important;
text-align: right; } text-align: right; }
/* line 84, ../sass/user-environ/_layout.scss */ /* line 89, ../sass/user-environ/_layout.scss */
.bar.right .icon.major, .bar.right .icon.major,
.bar .right .icon.major { .bar .right .icon.major {
margin-left: 15px; } margin-left: 15px; }
/* line 91, ../sass/user-environ/_layout.scss */ /* line 96, ../sass/user-environ/_layout.scss */
.user-environ .browse-area, .user-environ .browse-area,
.user-environ .edit-area, .user-environ .edit-area,
.user-environ .editor { .user-environ .editor {
@@ -518,23 +522,23 @@ mct-container {
right: 10px; right: 10px;
bottom: 35px; bottom: 35px;
left: 10px; } left: 10px; }
/* line 102, ../sass/user-environ/_layout.scss */ /* line 107, ../sass/user-environ/_layout.scss */
.user-environ .browse-area > .contents, .user-environ .browse-area > .contents,
.user-environ .edit-area > .contents { .user-environ .edit-area > .contents {
left: 0; left: 0;
right: 0; } right: 0; }
/* line 108, ../sass/user-environ/_layout.scss */ /* line 113, ../sass/user-environ/_layout.scss */
.user-environ .edit-area { .user-environ .edit-area {
top: 45px; } top: 45px; }
/* line 111, ../sass/user-environ/_layout.scss */ /* line 116, ../sass/user-environ/_layout.scss */
.user-environ .edit-area .tool-bar { .user-environ .edit-area .tool-bar {
bottom: auto; bottom: auto;
height: 30px; height: 30px;
line-height: 25px; } line-height: 25px; }
/* line 116, ../sass/user-environ/_layout.scss */ /* line 121, ../sass/user-environ/_layout.scss */
.user-environ .edit-area .work-area { .user-environ .edit-area .work-area {
top: 40px; } top: 40px; }
/* line 121, ../sass/user-environ/_layout.scss */ /* line 126, ../sass/user-environ/_layout.scss */
.user-environ .bottom-bar { .user-environ .bottom-bar {
overflow: hidden; overflow: hidden;
position: absolute; position: absolute;
@@ -546,20 +550,20 @@ mct-container {
height: auto; height: auto;
top: auto; top: auto;
height: 25px; } height: 25px; }
/* line 126, ../sass/user-environ/_layout.scss */ /* line 131, ../sass/user-environ/_layout.scss */
.user-environ .bottom-bar .status-holder { .user-environ .bottom-bar .status-holder {
z-index: 1; } z-index: 1; }
/* line 130, ../sass/user-environ/_layout.scss */ /* line 135, ../sass/user-environ/_layout.scss */
.user-environ .bottom-bar .app-logo { .user-environ .bottom-bar .app-logo {
left: auto; left: auto;
width: 105px; width: 105px;
z-index: 2; } z-index: 2; }
/* line 138, ../sass/user-environ/_layout.scss */ /* line 143, ../sass/user-environ/_layout.scss */
.cols { .cols {
overflow: hidden; overflow: hidden;
*zoom: 1; } *zoom: 1; }
/* line 140, ../sass/user-environ/_layout.scss */ /* line 145, ../sass/user-environ/_layout.scss */
.cols .col { .cols .col {
-moz-box-sizing: border-box; -moz-box-sizing: border-box;
-webkit-box-sizing: border-box; -webkit-box-sizing: border-box;
@@ -570,100 +574,100 @@ mct-container {
margin-left: 1.5%; margin-left: 1.5%;
padding-left: 5px; padding-left: 5px;
position: relative; } position: relative; }
/* line 148, ../sass/user-environ/_layout.scss */ /* line 153, ../sass/user-environ/_layout.scss */
.cols .col:first-child { .cols .col:first-child {
margin-left: 0; margin-left: 0;
padding-left: 0; } padding-left: 0; }
/* line 155, ../sass/user-environ/_layout.scss */ /* line 160, ../sass/user-environ/_layout.scss */
.cols.cols-2 .col-1 { .cols.cols-2 .col-1 {
min-width: 250px; min-width: 250px;
width: 48.5%; } width: 48.5%; }
/* line 161, ../sass/user-environ/_layout.scss */ /* line 166, ../sass/user-environ/_layout.scss */
.cols.cols-2-ff .col-100px { .cols.cols-2-ff .col-100px {
width: 100px; } width: 100px; }
/* line 168, ../sass/user-environ/_layout.scss */ /* line 173, ../sass/user-environ/_layout.scss */
.cols.cols-6 .col-1 { .cols.cols-6 .col-1 {
min-width: 83.33333px; min-width: 83.33333px;
width: 15.16667%; } width: 15.16667%; }
/* line 174, ../sass/user-environ/_layout.scss */ /* line 179, ../sass/user-environ/_layout.scss */
.cols.cols-16 .col-1 { .cols.cols-16 .col-1 {
min-width: 31.25px; min-width: 31.25px;
width: 4.75%; } width: 4.75%; }
/* line 177, ../sass/user-environ/_layout.scss */ /* line 182, ../sass/user-environ/_layout.scss */
.cols.cols-16 .col-2 { .cols.cols-16 .col-2 {
min-width: 62.5px; min-width: 62.5px;
width: 11%; } width: 11%; }
/* line 180, ../sass/user-environ/_layout.scss */ /* line 185, ../sass/user-environ/_layout.scss */
.cols.cols-16 .col-7 { .cols.cols-16 .col-7 {
min-width: 218.75px; min-width: 218.75px;
width: 42.25%; } width: 42.25%; }
/* line 186, ../sass/user-environ/_layout.scss */ /* line 191, ../sass/user-environ/_layout.scss */
.cols.cols-32 .col-2 { .cols.cols-32 .col-2 {
min-width: 31.25px; min-width: 31.25px;
width: 4.75%; } width: 4.75%; }
/* line 189, ../sass/user-environ/_layout.scss */ /* line 194, ../sass/user-environ/_layout.scss */
.cols.cols-32 .col-15 { .cols.cols-32 .col-15 {
min-width: 234.375px; min-width: 234.375px;
width: 45.375%; } width: 45.375%; }
/* line 193, ../sass/user-environ/_layout.scss */ /* line 198, ../sass/user-environ/_layout.scss */
.cols .l-row { .cols .l-row {
overflow: hidden; overflow: hidden;
*zoom: 1; *zoom: 1;
padding: 5px 0; } padding: 5px 0; }
/* line 199, ../sass/user-environ/_layout.scss */ /* line 204, ../sass/user-environ/_layout.scss */
.pane { .pane {
position: absolute; } position: absolute; }
/* line 202, ../sass/user-environ/_layout.scss */ /* line 207, ../sass/user-environ/_layout.scss */
.pane.treeview .create-btn-holder { .pane.treeview .create-btn-holder {
bottom: auto; bottom: auto;
top: 0; top: 0;
height: 24px; } height: 24px; }
/* line 205, ../sass/user-environ/_layout.scss */ /* line 210, ../sass/user-environ/_layout.scss */
.pane.treeview .create-btn-holder .wrapper.menu-element { .pane.treeview .create-btn-holder .wrapper.menu-element {
position: absolute; position: absolute;
bottom: 5px; } bottom: 5px; }
/* line 210, ../sass/user-environ/_layout.scss */ /* line 215, ../sass/user-environ/_layout.scss */
.pane.treeview .tree-holder { .pane.treeview .tree-holder {
overflow: auto; overflow: auto;
top: 34px; } top: 34px; }
/* line 217, ../sass/user-environ/_layout.scss */ /* line 222, ../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 .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 .right.abs,
.pane.items .object-browse-bar .btn-menu span.right.l-click-area, .pane.items .object-browse-bar .btn-menu span.right.l-click-area,
.btn-menu .pane.items .object-browse-bar span.right.l-click-area { .btn-menu .pane.items .object-browse-bar span.right.l-click-area {
top: auto; } top: auto; }
/* line 222, ../sass/user-environ/_layout.scss */ /* line 227, ../sass/user-environ/_layout.scss */
.pane.items .object-holder { .pane.items .object-holder {
top: 34px; } top: 34px; }
/* line 227, ../sass/user-environ/_layout.scss */ /* line 232, ../sass/user-environ/_layout.scss */
.pane.edit-main .object-holder { .pane.edit-main .object-holder {
top: 0; } top: 0; }
/* line 233, ../sass/user-environ/_layout.scss */ /* line 238, ../sass/user-environ/_layout.scss */
.pane .object-holder { .pane .object-holder {
overflow: auto; } overflow: auto; }
/* line 241, ../sass/user-environ/_layout.scss */ /* line 246, ../sass/user-environ/_layout.scss */
.split-layout.horizontal > .pane { .split-layout.horizontal > .pane {
margin-top: 5px; } margin-top: 5px; }
/* line 244, ../sass/user-environ/_layout.scss */ /* line 249, ../sass/user-environ/_layout.scss */
.split-layout.horizontal > .pane:first-child { .split-layout.horizontal > .pane:first-child {
margin-top: 0; } margin-top: 0; }
/* line 251, ../sass/user-environ/_layout.scss */ /* line 256, ../sass/user-environ/_layout.scss */
.split-layout.vertical > .pane { .split-layout.vertical > .pane {
margin-left: 5px; } margin-left: 5px; }
/* line 253, ../sass/user-environ/_layout.scss */ /* line 258, ../sass/user-environ/_layout.scss */
.split-layout.vertical > .pane > .holder { .split-layout.vertical > .pane > .holder {
left: 0; left: 0;
right: 0; } right: 0; }
/* line 257, ../sass/user-environ/_layout.scss */ /* line 262, ../sass/user-environ/_layout.scss */
.split-layout.vertical > .pane:first-child { .split-layout.vertical > .pane:first-child {
margin-left: 0; } margin-left: 0; }
/* line 259, ../sass/user-environ/_layout.scss */ /* line 264, ../sass/user-environ/_layout.scss */
.split-layout.vertical > .pane:first-child .holder { .split-layout.vertical > .pane:first-child .holder {
right: 5px; } right: 5px; }
/* line 268, ../sass/user-environ/_layout.scss */ /* line 273, ../sass/user-environ/_layout.scss */
.vscroll { .vscroll {
overflow-y: auto; } overflow-y: auto; }
@@ -1256,26 +1260,37 @@ mct-container {
.tabular tr td, .tabular tr .td, .tabular .tr td, .tabular .tr .td { .tabular tr td, .tabular tr .td, .tabular .tr td, .tabular .tr .td {
border-top: 1px solid rgba(255, 255, 255, 0.1); border-top: 1px solid rgba(255, 255, 255, 0.1);
min-width: 110px; min-width: 110px;
color: #fff;
padding: 2px 5px; padding: 2px 5px;
vertical-align: top; } vertical-align: top; }
/* line 107, ../sass/lists/_tabular.scss */ /* line 108, ../sass/lists/_tabular.scss */
.tabular tr td.numeric, .tabular tr .td.numeric, .tabular .tr td.numeric, .tabular .tr .td.numeric { .tabular tr td.numeric, .tabular tr .td.numeric, .tabular .tr td.numeric, .tabular .tr .td.numeric {
text-align: right; } text-align: right; }
/* line 113, ../sass/lists/_tabular.scss */ /* line 111, ../sass/lists/_tabular.scss */
.tabular tr td.s-cell-type-value, .tabular tr .td.s-cell-type-value, .tabular .tr td.s-cell-type-value, .tabular .tr .td.s-cell-type-value {
text-align: right; }
/* line 113, ../sass/lists/_tabular.scss */
.tabular tr td.s-cell-type-value .l-cell-contents, .tabular tr .td.s-cell-type-value .l-cell-contents, .tabular .tr td.s-cell-type-value .l-cell-contents, .tabular .tr .td.s-cell-type-value .l-cell-contents {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
padding-left: 5px;
padding-right: 5px; }
/* line 122, ../sass/lists/_tabular.scss */
.tabular.filterable tbody, .tabular.filterable .tbody { .tabular.filterable tbody, .tabular.filterable .tbody {
top: 36px; } top: 36px; }
/* line 118, ../sass/lists/_tabular.scss */ /* line 127, ../sass/lists/_tabular.scss */
.tabular.fixed-header { .tabular.fixed-header {
height: 100%; } height: 100%; }
/* line 120, ../sass/lists/_tabular.scss */ /* line 129, ../sass/lists/_tabular.scss */
.tabular.fixed-header thead, .tabular.fixed-header .thead, .tabular.fixed-header thead, .tabular.fixed-header .thead,
.tabular.fixed-header tbody tr, .tabular.fixed-header .tbody .tr { .tabular.fixed-header tbody tr, .tabular.fixed-header .tbody .tr {
display: table; display: table;
table-layout: fixed; } table-layout: fixed; }
/* line 125, ../sass/lists/_tabular.scss */ /* line 134, ../sass/lists/_tabular.scss */
.tabular.fixed-header thead, .tabular.fixed-header .thead { .tabular.fixed-header thead, .tabular.fixed-header .thead {
width: calc(100% - 10px); } width: calc(100% - 10px); }
/* line 128, ../sass/lists/_tabular.scss */ /* line 137, ../sass/lists/_tabular.scss */
.tabular.fixed-header tbody, .tabular.fixed-header .tbody { .tabular.fixed-header tbody, .tabular.fixed-header .tbody {
overflow: hidden; overflow: hidden;
position: absolute; position: absolute;
@@ -1288,7 +1303,7 @@ mct-container {
top: 18px; top: 18px;
display: block; display: block;
overflow-y: scroll; } overflow-y: scroll; }
/* line 136, ../sass/lists/_tabular.scss */ /* line 145, ../sass/lists/_tabular.scss */
.tabular.t-event-messages td, .tabular.t-event-messages .td { .tabular.t-event-messages td, .tabular.t-event-messages .td {
min-width: 150px; } min-width: 150px; }

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

@@ -47,6 +47,11 @@
@include border-radius($basicCr * 1.5); @include border-radius($basicCr * 1.5);
} }
// style="min-width: 150px; max-width: 800px; width: 25%;"
.browser-manage {
width: 100%;
}
.contents { .contents {
$myM: 0; //$interiorMargin; $myM: 0; //$interiorMargin;
box-sizing: border-box; box-sizing: border-box;