From acfa96263b65ebfa1bba710b1cd9e774716dce0b Mon Sep 17 00:00:00 2001
From: Francis Lachapelle <flachapelle@inverse.ca>
Date: Wed, 2 Sep 2015 15:52:18 -0400
Subject: [PATCH] (css) Improve md-dialog on small screens

---
 .../scss/components/dialog/dialog.scss        | 38 ++++++++++++++-----
 1 file changed, 29 insertions(+), 9 deletions(-)

diff --git a/UI/WebServerResources/scss/components/dialog/dialog.scss b/UI/WebServerResources/scss/components/dialog/dialog.scss
index 2792d4c78..35ce2267f 100644
--- a/UI/WebServerResources/scss/components/dialog/dialog.scss
+++ b/UI/WebServerResources/scss/components/dialog/dialog.scss
@@ -1,13 +1,33 @@
 /// dialog.scss -*- Mode: scss; indent-tabs-mode: nil; basic-offset: 2 -*-
 @import 'extends';
 
-@media (max-width: $layout-breakpoint-sm) {
-  [flex-sm="100"],
-  .flex-sm-100 {
-    max-width: 100%;
-    max-height: 100%;
-    width: 100%;
-    height: 100%;
-    border-radius: 0;
+@mixin fullscreen {
+  max-width: 100%;
+  max-height: 100%;
+  width: 100%;
+  height: 100%;
+  border-radius: 0;
+  flex-basis: 100%;
+  md-dialog-content {
+    padding: $layout-gutter-width;
   }
-}
\ No newline at end of file
+}
+
+body.popup {
+  md-dialog {
+    &[flex-sm="100"],
+    &.flex-sm-100 {
+      @include fullscreen;
+    }
+  }
+}
+
+@media (max-width: $layout-breakpoint-sm) {
+  md-dialog {
+    &[flex-sm="100"],
+    &.flex-sm-100 {
+      @include fullscreen;
+    }
+  }
+}
+