ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-03-25 13:28:38 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

[Mobile] Constants

Browse Source 
Re-edited media query constants
to be cleaner and consistent.
This commit is contained in:
Shivam Dave 2015-07-13 13:11:27 -07:00
parent b00eee00fc
commit 7d09df9a85
6 changed files with 19 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -70,8 +70,8 @@
* at runtime from the About dialog for additional information.
*****************************************************************************/
/************************** WINDOW DIMENSIONS FOR RWD */
/************************** WINDOW CHECKS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** WINDOWS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** MEDIA QUERIES: WINDOW CHECKS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** MEDIA QUERIES: WINDOWS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** DEVICE PARAMETERS FOR MENUS */
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government

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

@ -70,8 +70,8 @@
* at runtime from the About dialog for additional information.
*****************************************************************************/
/************************** WINDOW DIMENSIONS FOR RWD */
/************************** WINDOW CHECKS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** WINDOWS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** MEDIA QUERIES: WINDOW CHECKS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** MEDIA QUERIES: WINDOWS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** DEVICE PARAMETERS FOR MENUS */
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government

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

@ -71,8 +71,8 @@
* at runtime from the About dialog for additional information.
*****************************************************************************/
/************************** WINDOW DIMENSIONS FOR RWD */
/************************** WINDOW CHECKS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** WINDOWS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** MEDIA QUERIES: WINDOW CHECKS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** MEDIA QUERIES: WINDOWS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** DEVICE PARAMETERS FOR MENUS */
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government

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

@ -70,8 +70,8 @@
* at runtime from the About dialog for additional information.
*****************************************************************************/
/************************** WINDOW DIMENSIONS FOR RWD */
/************************** WINDOW CHECKS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** WINDOWS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** MEDIA QUERIES: WINDOW CHECKS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** MEDIA QUERIES: WINDOWS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** DEVICE PARAMETERS FOR MENUS */
/*****************************************************************************
* Open MCT Web, Copyright (c) 2014-2015, United States Government

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

@ -33,10 +33,13 @@ $tabMaxH: 1024px;
$compMinW: 800px;
$compMinH: 1025px;
/************************** WINDOW CHECKS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** MEDIA QUERIES: WINDOW CHECKS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
$screenPortrait: "screen and (orientation: portrait)";
$screenLandscape: "screen and (orientation: landscape)";
$mobileDevice: "(max-device-width: #{$tabMaxW}) and (max-device-height: #{$tabMaxH})";
$mobileDeviceEmu: "(max-device-width: #{$tabMaxH}) and (max-device-height: #{$tabMaxW})";
$phonePortraitCheck: "(max-width: #{$phoMaxW}) and (max-height: #{$phoMaxH})";
$phoneLandscapeCheck: "(max-height: #{$phoMaxW}) and (max-width: #{$phoMaxH})";
@ -48,10 +51,10 @@ $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})";
$desktopPortraitCheck: "(min-device-width: #{$compMinW}) and (min-device-height: #{$compMinH})";
$desktopLanscapeCheck: "(min-device-width: #{$compMinH}) and (min-device-height: #{$compMinW})";
/************************** WINDOWS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
/************************** MEDIA QUERIES: 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}";
@ -60,13 +63,9 @@ $tabletPortrait: "#{$screenPortrait} and #{$tabletPortraitCheck} and #{$mobileDe
$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})";
$compWidth: "screen and #{$desktopDevicePortrait}";
$compHeight: "screen and #{$desktopDeviceLandscape}";
$desktopPortrait: "screen and #{$desktopPortraitCheck}";
$desktopLandscape: "screen and #{$desktopLanscapeCheck}";
/************************** DEVICE PARAMETERS FOR MENUS */
$phoneSlideMenuWidth: $phoMaxW/2;
$tabletSlideMenuWidth: $tabMaxW/2;

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

@ -37,16 +37,9 @@
}
}
//@mixin phoneandtablet {
// @media screen and (max-width: $tabMaxW) and (orientation: portrait),
// screen and (max-width: $tabMaxH) and (orientation: landscape) {
// @content
// }
//}
@mixin desktop {
@media #{$compWidth},
#{$compHeight} {
@media #{$desktopPortrait},
#{$desktopLandscape} {
@content
}
}