diff --git a/platform/commonUI/general/res/css/items.css b/platform/commonUI/general/res/css/items.css index 0786a7cef7..4576077bdc 100644 --- a/platform/commonUI/general/res/css/items.css +++ b/platform/commonUI/general/res/css/items.css @@ -353,18 +353,18 @@ * at runtime from the About dialog for additional information. *****************************************************************************/ @media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) { - /* line 36, ../sass/mobile/_item.scss */ + /* line 35, ../sass/mobile/_item.scss */ .items-holder .item.grid-item .bar.bottom-bar.abs { top: 0px; height: auto; } - /* line 43, ../sass/mobile/_item.scss */ + /* line 41, ../sass/mobile/_item.scss */ .items-holder .item.grid-item .item-main .item-type { font-size: 30px; text-align: left; } - /* line 48, ../sass/mobile/_item.scss */ + /* line 45, ../sass/mobile/_item.scss */ .items-holder .item.grid-item .item-main .item-open { display: none; } - /* line 53, ../sass/mobile/_item.scss */ + /* line 49, ../sass/mobile/_item.scss */ .items-holder .item.grid-item .title, .items-holder .item.grid-item .details { margin-left: 30px; } } @media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px) { @@ -372,14 +372,14 @@ .items-holder .item.grid-item { width: 100%; height: 50px; } - /* line 63, ../sass/mobile/_item.scss */ + /* line 59, ../sass/mobile/_item.scss */ .items-holder .item.grid-item .item-main .item-type { line-height: 40px; } - /* line 68, ../sass/mobile/_item.scss */ + /* line 63, ../sass/mobile/_item.scss */ .items-holder .item.grid-item .title { margin-right: 10px; line-height: 25px; } - /* line 74, ../sass/mobile/_item.scss */ + /* line 67, ../sass/mobile/_item.scss */ .items-holder .item.grid-item .details { margin-right: 10px; line-height: 0px; } } @@ -388,15 +388,15 @@ .items-holder .item.grid-item { width: 100%; height: 66.66667px; } - /* line 86, ../sass/mobile/_item.scss */ + /* line 78, ../sass/mobile/_item.scss */ .items-holder .item.grid-item .item-main .item-type { font-size: 30px; line-height: 50px; } - /* line 93, ../sass/mobile/_item.scss */ + /* line 83, ../sass/mobile/_item.scss */ .items-holder .item.grid-item .title { margin-right: 10px; line-height: 38px; } - /* line 99, ../sass/mobile/_item.scss */ + /* line 87, ../sass/mobile/_item.scss */ .items-holder .item.grid-item .details { margin-right: 10px; line-height: 0px; } } diff --git a/platform/commonUI/general/res/css/theme-espresso.css b/platform/commonUI/general/res/css/theme-espresso.css index 78e042f07a..12cb464c59 100644 --- a/platform/commonUI/general/res/css/theme-espresso.css +++ b/platform/commonUI/general/res/css/theme-espresso.css @@ -851,29 +851,24 @@ mct-container { .button-pos { position: absolute; } } -@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px) { +@media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) { /* line 138, ../sass/mobile/_layout.scss */ .object-header-mobile { position: relative; - left: 30px; } } -@media screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) { - /* line 138, ../sass/mobile/_layout.scss */ - .object-header-mobile { - position: relative; - left: 35px; } } + left: 44px; } } @media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) { - /* line 150, ../sass/mobile/_layout.scss */ + /* line 146, ../sass/mobile/_layout.scss */ .mobile-hide { display: none; } } @media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px) { - /* line 157, ../sass/mobile/_layout.scss */ + /* line 153, ../sass/mobile/_layout.scss */ .phone-hide { display: none; } } @media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) { - /* line 163, ../sass/mobile/_layout.scss */ + /* line 159, ../sass/mobile/_layout.scss */ .tree-holder { overflow-x: hidden !important; } } @@ -2903,14 +2898,11 @@ label.checkbox.custom { /* line 25, ../sass/mobile/controls/_menus.scss */ .mobile-menu-icon { display: inline-block; } - @media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px) { + @media screen and (orientation: portrait) and (max-width: 514px) and (max-height: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (max-height: 514px) and (max-width: 740px) and (max-device-width: 1024px) and (max-device-height: 799px), screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) { /* line 25, ../sass/mobile/controls/_menus.scss */ .mobile-menu-icon { - font-size: 25px; } } - @media screen and (orientation: portrait) and (min-width: 515px) and (max-width: 799px) and (min-height: 741px) and (max-height: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 799px) and (max-device-height: 1024px), screen and (orientation: landscape) and (min-height: 515px) and (max-height: 799px) and (min-width: 741px) and (max-width: 1024px) and (max-device-width: 1024px) and (max-device-height: 799px) { - /* line 25, ../sass/mobile/controls/_menus.scss */ - .mobile-menu-icon { - font-size: 29px; } } + font-size: 21px; + margin-top: 1px; } } @media screen and (min-device-width: 800px) and (min-device-height: 1025px), screen and (min-device-width: 1025px) and (min-device-height: 800px) { /* line 25, ../sass/mobile/controls/_menus.scss */ .mobile-menu-icon { diff --git a/platform/commonUI/general/res/css/tree.css b/platform/commonUI/general/res/css/tree.css index fa97baaa9a..625907bcb1 100644 --- a/platform/commonUI/general/res/css/tree.css +++ b/platform/commonUI/general/res/css/tree.css @@ -341,5 +341,4 @@ ul.tree { right: 16.9px; } /* line 58, ../sass/mobile/_tree.scss */ ul.tree ul.tree { - margin-left: 0px; - padding-left: 3px; } } + margin-left: 7px; } } diff --git a/platform/commonUI/general/res/sass/mobile/_constants.scss b/platform/commonUI/general/res/sass/mobile/_constants.scss index 6ebfd519e1..6a3a32c0db 100644 --- a/platform/commonUI/general/res/sass/mobile/_constants.scss +++ b/platform/commonUI/general/res/sass/mobile/_constants.scss @@ -29,7 +29,8 @@ $tablet-itemHeight: $ueBrowseGridItemLg/3; /************************** MOBILE TREE MENU DIMENSIONS */ $mobile-treeHeight: 38px; -$mobile-treeLeft: 3px; +$mobile-startingTreeLeft: 3px; +$mobile-runningTreeLeft: 7px; $mobile-treeRight: 13px; /************************** WINDOW DIMENSIONS FOR RWD */ diff --git a/platform/commonUI/general/res/sass/mobile/_item.scss b/platform/commonUI/general/res/sass/mobile/_item.scss index eb44048dc8..360acf3925 100644 --- a/platform/commonUI/general/res/sass/mobile/_item.scss +++ b/platform/commonUI/general/res/sass/mobile/_item.scss @@ -31,25 +31,21 @@ $dHei: $ueBrowseGridItemLg; @include phoneandtablet { $dWid: 100%; - .bar { &.bottom-bar.abs { top: 0px; height: auto; } - } - + } .item-main { .item-type { font-size: $mobile-listIcon; text-align: left; - } .item-open { display: none; } } - .title, .details { margin-left: $mobile-listIcon; } @@ -64,13 +60,10 @@ line-height: $phone-itemHeight * .8; } } - .title { margin-right: $mobile-listRight; line-height: $phone-itemHeight * .5; - } - .details { margin-right: $mobile-listRight; line-height: 0px; @@ -81,21 +74,16 @@ $dHei: $tablet-itemHeight; width: $dWid; height: $dHei; - .item-main { .item-type { font-size: $mobile-listIcon; line-height: $tablet-itemHeight * .75; - } } - .title { margin-right: $mobile-listRight; line-height: $tablet-itemHeight * .57; - } - .details { margin-right: $mobile-listRight; line-height: 0px; diff --git a/platform/commonUI/general/res/sass/mobile/_layout.scss b/platform/commonUI/general/res/sass/mobile/_layout.scss index a70944f038..4200916739 100644 --- a/platform/commonUI/general/res/sass/mobile/_layout.scss +++ b/platform/commonUI/general/res/sass/mobile/_layout.scss @@ -136,13 +136,9 @@ // over to make space for the // hamburger icon .object-header-mobile { - @include phone { + @include phoneandtablet { position: relative; - left: 30px; - } - @include tablet { - position: relative; - left: 35px; + left: 44px; } } diff --git a/platform/commonUI/general/res/sass/mobile/_tree.scss b/platform/commonUI/general/res/sass/mobile/_tree.scss index 6d5273f56f..37c7ad6a70 100644 --- a/platform/commonUI/general/res/sass/mobile/_tree.scss +++ b/platform/commonUI/general/res/sass/mobile/_tree.scss @@ -42,7 +42,7 @@ ul.tree { .label { // Designates the starting left margin // (indentation) of 'My Items' - left: $mobile-treeLeft; + left: $mobile-startingTreeLeft; font-size: 1.2em; // Allows tree item name to stop prior // to the arrow @@ -56,8 +56,7 @@ ul.tree { // Sets the margin on the left, which causes the // running indentation after each folder is made ul.tree { - margin-left: 0px; - padding-left: $mobile-treeLeft; + margin-left: $mobile-runningTreeLeft; } } } diff --git a/platform/commonUI/general/res/sass/mobile/controls/_menus.scss b/platform/commonUI/general/res/sass/mobile/controls/_menus.scss index 9b0136b5b3..e2e360b204 100644 --- a/platform/commonUI/general/res/sass/mobile/controls/_menus.scss +++ b/platform/commonUI/general/res/sass/mobile/controls/_menus.scss @@ -24,12 +24,10 @@ // sized according to the device .mobile-menu-icon { display: inline-block; - @include phone { - font-size: 25px; + @include phoneandtablet { + font-size: 21px; + margin-top: 1px; } - @include tablet { - font-size: 29px; - } @include desktop { display: none; }