ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-03-10 22:43:55 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

[Mobile] Redefine

Browse Source 
Renames variables to be clearer.
Breaks up constants into parts to be
cleaners and straightforward. Also
removed the ratio.
This commit is contained in:
Shivam Dave 2015-07-13 13:02:57 -07:00
parent c0d83f9395
commit b00eee00fc
7 changed files with 43 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
platform/commonUI/general/res/css/forms.css
View File

@ -70,8 +70,9 @@
* at runtime from the About dialog for additional information.
*****************************************************************************/
/************************** WINDOW DIMENSIONS FOR RWD */
/************************** WINDOW CHECKS FOR RWD */
/************************** WINDOWS FOR RWD */
/************************** WINDOW CHECKS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** WINDOWS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** DEVICE PARAMETERS FOR MENUS */
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space

5
platform/commonUI/general/res/css/items.css
View File

@ -70,8 +70,9 @@
* at runtime from the About dialog for additional information.
*****************************************************************************/
/************************** WINDOW DIMENSIONS FOR RWD */
/************************** WINDOW CHECKS FOR RWD */
/************************** WINDOWS FOR RWD */
/************************** WINDOW CHECKS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** WINDOWS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** DEVICE PARAMETERS FOR MENUS */
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space

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

@ -71,8 +71,9 @@
* at runtime from the About dialog for additional information.
*****************************************************************************/
/************************** WINDOW DIMENSIONS FOR RWD */
/************************** WINDOW CHECKS FOR RWD */
/************************** WINDOWS FOR RWD */
/************************** WINDOW CHECKS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** WINDOWS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** DEVICE PARAMETERS FOR MENUS */
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space

5
platform/commonUI/general/res/css/tree.css
View File

@ -70,8 +70,9 @@
* at runtime from the About dialog for additional information.
*****************************************************************************/
/************************** WINDOW DIMENSIONS FOR RWD */
/************************** WINDOW CHECKS FOR RWD */
/************************** WINDOWS FOR RWD */
/************************** WINDOW CHECKS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** WINDOWS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** DEVICE PARAMETERS FOR MENUS */
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government
* as represented by the Administrator of the National Aeronautics and Space

33
platform/commonUI/general/res/sass/mobile/_constants.scss
View File

@ -33,33 +33,32 @@ $tabMaxH: 1024px;
$compMinW: 800px;
$compMinH: 1025px;
/************************** WINDOW CHECKS FOR RWD */
/************************** WINDOW CHECKS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
$screenPortrait: "screen and (orientation: portrait)";
$screenLandscape: "screen and (orientation: landscape)";
$phoWidPorCheck: "(max-width: #{$phoMaxW})";
$phoHeiPorCheck: "(max-height: #{$phoMaxH})";
$phoWidLanCheck: "(max-height: #{$phoMaxW})";
$phoHeiLanCheck: "(max-width: #{$phoMaxH})";
$phonePortraitCheck: "(max-width: #{$phoMaxW}) and (max-height: #{$phoMaxH})";
$phoneLandscapeCheck: "(max-height: #{$phoMaxW}) and (max-width: #{$phoMaxH})";
$tabWidPorCheck: "(min-width: #{$tabMinW}) and (max-width: #{$tabMaxW})";
$tabHeiPorCheck: "(min-height: #{$tabMinH}) and (max-height: #{$tabMaxH})";
$tabletPortraitCheck: "#{$tabWidPorCheck} and #{$tabHeiPorCheck}";
$tabWidLanCheck: "(min-height: #{$tabMinW}) and (max-height: #{$tabMaxW})";
$tabHeiLanCheck: "(min-width: #{$tabMinH}) and (max-width: #{$tabMaxH})";
$tabletLandscapeCheck: "#{$tabWidLanCheck} and #{$tabHeiLanCheck}";
$mobileDevice: "(max-device-width: #{$tabMaxW}) and (max-device-height: #{$tabMaxH})";
$mobileDeviceEmu: "(max-device-width: #{$tabMaxH}) and (max-device-height: #{$tabMaxW})";
/************************** WINDOWS FOR RWD */
$phoneWidth: "#{$screenPortrait} and #{$phoWidPorCheck} and #{$phoHeiPorCheck} and #{$mobileDevice}";
$phoneHeight: "#{$screenLandscape} and #{$phoWidLanCheck} and #{$phoHeiLanCheck} and #{$mobileDevice}";
$phoneHeightEmu: "#{$screenLandscape} and #{$phoWidLanCheck} and #{$phoHeiLanCheck} and #{$mobileDeviceEmu}";
/************************** WINDOWS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
$phonePortrait: "#{$screenPortrait} and #{$phonePortraitCheck} and #{$mobileDevice}";
$phoneLandscape: "#{$screenLandscape} and #{$phoneLandscapeCheck} and #{$mobileDevice}";
$phoneLandscapeEmu: "#{$screenLandscape} and #{$phoneLandscapeCheck} and #{$mobileDeviceEmu}";
$tabletWidth: "#{$screenPortrait} and #{$tabWidPorCheck} and #{$tabHeiPorCheck} and #{$mobileDevice}";
$tabletHeight: "#{$screenLandscape} and #{$tabWidLanCheck} and #{$tabHeiLanCheck} and #{$mobileDevice}";
$tabletHeightEmu: "#{$screenLandscape} and #{$tabWidLanCheck} and #{$tabHeiLanCheck} and #{$mobileDeviceEmu}";
$tabletPortrait: "#{$screenPortrait} and #{$tabletPortraitCheck} and #{$mobileDevice}";
$tabletLandscape: "#{$screenLandscape} and #{$tabletLandscapeCheck} and #{$mobileDevice}";
$tabletLandscapeEmu: "#{$screenLandscape} and #{$tabletLandscapeCheck} and #{$mobileDeviceEmu}";
$desktopDevicePortrait: "(min-device-width: #{$compMinW}) and (min-device-height: #{$compMinH})";
$desktopDeviceLandscape: "(min-device-width: #{$compMinH}) and (min-device-height: #{$compMinW})";
@ -67,9 +66,7 @@ $desktopDeviceLandscape: "(min-device-width: #{$compMinH}) and (min-device-heigh
$compWidth: "screen and #{$desktopDevicePortrait}";
$compHeight: "screen and #{$desktopDeviceLandscape}";
$leftPhone: $phoMaxW/2;
$leftTab: $tabMaxW/2;
$hideRatioPhone: 1;
$hideRatioTab: 1;
/************************** DEVICE PARAMETERS FOR MENUS */
$phoneSlideMenuWidth: $phoMaxW/2;
$tabletSlideMenuWidth: $tabMaxW/2;

20
platform/commonUI/general/res/sass/mobile/_layout.scss
View File

@ -26,11 +26,11 @@
.holder-hide {
@include phone {
@include transition-duration(.2s);
left: (-1 * $hideRatioPhone) * $leftPhone;
left: (-1) * $phoneSlideMenuWidth;
}
@include tablet {
@include transition-duration(.2s);
left: (-1 * $hideRatioTab) * $leftTab;
left: (-1) * $tabletSlideMenuWidth;
}
}
@ -49,11 +49,11 @@
position: absolute;
@include phone {
@include transition-duration(.2s);
left: ($hideRatioPhone) * $leftPhone;
left: $phoneSlideMenuWidth;
}
@include tablet {
@include transition-duration(.2s);
left: ($hideRatioTab) * $leftTab;
left: $tabletSlideMenuWidth;
}
}
@ -61,20 +61,20 @@
position: absolute;
@include transition-duration(.2s);
@include phone {
left: $leftPhone;
left: $phoneSlideMenuWidth;
}
@include tablet {
left: $leftTab;
left: $tabletSlideMenuWidth;
}
}
.object-header-mobile {
position: relative;
@include phone {
left: $leftPhone/10;
left: $phoneSlideMenuWidth/10;
}
@include tablet {
left: $leftTab/10;
left: $tabletSlideMenuWidth/10;
}
}
@ -87,10 +87,10 @@
.browse-manage {
@include phone {
width: $leftPhone;
width: $phoneSlideMenuWidth;
}
@include tablet {
width: $leftTab;
width: $tabletSlideMenuWidth;
}
@include desktop {
min-width: 150px;

12
platform/commonUI/general/res/sass/mobile/_mixins.scss
View File

@ -22,17 +22,17 @@
// NOTE: Mixins for devices
@mixin phone {
@media #{$phoneWidth},
#{$phoneHeight},
#{$phoneHeightEmu}{
@media #{$phonePortrait},
#{$phoneLandscape},
#{$phoneLandscapeEmu}{
@content
}
}
@mixin tablet {
@media #{$tabletWidth},
#{$tabletHeight},
#{$tabletHeightEmu}{
@media #{$tabletPortrait},
#{$tabletLandscape},
#{$tabletLandscapeEmu}{
@content
}
}