[Frontend] Refactor CSS to not use 'desktop' media query

open #639
Refactored all usage of @include desktop to use CSS selector body.desktop
instead; Still to-do: deal with desktopandtablet usage with hover bubbles
and mixins btnBase;

platform/commonUI/general/res/sass/mobile/_layout.scss

@@ -156,7 +156,7 @@
     }
 }
 
-@include desktop {
+body.desktop {
     .desktop-hide {
         display: none;
     }

platform/commonUI/general/res/sass/mobile/_mixins.scss

@@ -78,6 +78,8 @@
 
 // Desktop monitors in any orientation
 @mixin desktopandtablet {
+    // Keeping only for legacy - should not be used moving forward
+    // Use body.desktop, body.tablet instead.
     @media #{$tabletPortrait},
            #{$tabletLandscape},
            #{$desktop} {
@@ -87,6 +89,8 @@
 
 // Desktop monitors in any orientation
 @mixin desktop {
+    // Keeping only for legacy - should not be used moving forward
+    // Use body.desktop instead.
     @media #{$desktop} {
         @content
     }