From babe420f268e19f8b9802e22a7638d348bbd62f0 Mon Sep 17 00:00:00 2001
From: Charles Hacskaylo <charles.f.hacskaylo@nasa.gov>
Date: Tue, 28 Apr 2015 14:49:08 -0700
Subject: [PATCH] [Frontend] CSS and markup for iframe

WTD-1150
WTD-1145
CSS and markup to cause iframes to layout properly without double scroll bars
---
 .../general/res/css/theme-espresso.css        | 41 +++++++++++--------
 .../commonUI/general/res/sass/_iframe.scss    |  9 ++++
 platform/commonUI/general/res/sass/_main.scss |  1 +
 platform/features/pages/res/iframe.html       |  5 ++-
 4 files changed, 37 insertions(+), 19 deletions(-)
 create mode 100644 platform/commonUI/general/res/sass/_iframe.scss

diff --git a/platform/commonUI/general/res/css/theme-espresso.css b/platform/commonUI/general/res/css/theme-espresso.css
index 741c0aee75..e2c08cabac 100644
--- a/platform/commonUI/general/res/css/theme-espresso.css
+++ b/platform/commonUI/general/res/css/theme-espresso.css
@@ -1,5 +1,5 @@
 /* CONSTANTS */
-/* line 17, ../../../../../../../../../../Library/Ruby/Gems/1.8/gems/compass-0.12.2/frameworks/compass/stylesheets/compass/reset/_utilities.scss */
+/* line 17, ../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-0.12.2/frameworks/compass/stylesheets/compass/reset/_utilities.scss */
 html, body, div, span, applet, object, iframe,
 h1, h2, h3, h4, h5, h6, p, blockquote, pre,
 a, abbr, acronym, address, big, cite, code,
@@ -20,38 +20,38 @@ time, mark, audio, video {
   font-size: 100%;
   vertical-align: baseline; }
 
-/* line 22, ../../../../../../../../../../Library/Ruby/Gems/1.8/gems/compass-0.12.2/frameworks/compass/stylesheets/compass/reset/_utilities.scss */
+/* line 22, ../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-0.12.2/frameworks/compass/stylesheets/compass/reset/_utilities.scss */
 html {
   line-height: 1; }
 
-/* line 24, ../../../../../../../../../../Library/Ruby/Gems/1.8/gems/compass-0.12.2/frameworks/compass/stylesheets/compass/reset/_utilities.scss */
+/* line 24, ../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-0.12.2/frameworks/compass/stylesheets/compass/reset/_utilities.scss */
 ol, ul {
   list-style: none; }
 
-/* line 26, ../../../../../../../../../../Library/Ruby/Gems/1.8/gems/compass-0.12.2/frameworks/compass/stylesheets/compass/reset/_utilities.scss */
+/* line 26, ../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-0.12.2/frameworks/compass/stylesheets/compass/reset/_utilities.scss */
 table {
   border-collapse: collapse;
   border-spacing: 0; }
 
-/* line 28, ../../../../../../../../../../Library/Ruby/Gems/1.8/gems/compass-0.12.2/frameworks/compass/stylesheets/compass/reset/_utilities.scss */
+/* line 28, ../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-0.12.2/frameworks/compass/stylesheets/compass/reset/_utilities.scss */
 caption, th, td {
   text-align: left;
   font-weight: normal;
   vertical-align: middle; }
 
-/* line 30, ../../../../../../../../../../Library/Ruby/Gems/1.8/gems/compass-0.12.2/frameworks/compass/stylesheets/compass/reset/_utilities.scss */
+/* line 30, ../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-0.12.2/frameworks/compass/stylesheets/compass/reset/_utilities.scss */
 q, blockquote {
   quotes: none; }
-  /* line 103, ../../../../../../../../../../Library/Ruby/Gems/1.8/gems/compass-0.12.2/frameworks/compass/stylesheets/compass/reset/_utilities.scss */
+  /* line 103, ../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-0.12.2/frameworks/compass/stylesheets/compass/reset/_utilities.scss */
   q:before, q:after, blockquote:before, blockquote:after {
     content: "";
     content: none; }
 
-/* line 32, ../../../../../../../../../../Library/Ruby/Gems/1.8/gems/compass-0.12.2/frameworks/compass/stylesheets/compass/reset/_utilities.scss */
+/* line 32, ../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-0.12.2/frameworks/compass/stylesheets/compass/reset/_utilities.scss */
 a img {
   border: none; }
 
-/* line 116, ../../../../../../../../../../Library/Ruby/Gems/1.8/gems/compass-0.12.2/frameworks/compass/stylesheets/compass/reset/_utilities.scss */
+/* line 116, ../../../../../../../../../Library/Ruby/Gems/2.0.0/gems/compass-0.12.2/frameworks/compass/stylesheets/compass/reset/_utilities.scss */
 article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {
   display: block; }
 
@@ -2882,10 +2882,10 @@ input[type="text"] {
 .wait-spinner {
   display: block;
   position: absolute;
-  -webkit-animation: rotation 0.6s infinite linear;
-  -moz-animation: rotation 0.6s infinite linear;
-  -o-animation: rotation 0.6s infinite linear;
-  animation: rotation 0.6s infinite linear;
+  -webkit-animation: rotation .6s infinite linear;
+  -moz-animation: rotation .6s infinite linear;
+  -o-animation: rotation .6s infinite linear;
+  animation: rotation .6s infinite linear;
   border-color: rgba(0, 153, 204, 0.25);
   border-top-color: #0099cc;
   border-style: solid;
@@ -2924,10 +2924,10 @@ input[type="text"] {
 .treeview .wait-spinner {
   display: block;
   position: absolute;
-  -webkit-animation: rotation 0.6s infinite linear;
-  -moz-animation: rotation 0.6s infinite linear;
-  -o-animation: rotation 0.6s infinite linear;
-  animation: rotation 0.6s infinite linear;
+  -webkit-animation: rotation .6s infinite linear;
+  -moz-animation: rotation .6s infinite linear;
+  -o-animation: rotation .6s infinite linear;
+  animation: rotation .6s infinite linear;
   border-color: rgba(0, 153, 204, 0.25);
   border-top-color: #0099cc;
   border-style: solid;
@@ -3039,3 +3039,10 @@ input[type="text"] {
       .autoflow .l-autoflow-items .l-autoflow-col:first-child {
         border-left: none;
         padding-left: 0; }
+
+/* Styles for the iframe EmbeddedPageController element */
+/* line 4, ../sass/iframe.scss */
+.l-iframe iframe {
+  display: block;
+  height: 100%;
+  width: 100%; }
diff --git a/platform/commonUI/general/res/sass/_iframe.scss b/platform/commonUI/general/res/sass/_iframe.scss
new file mode 100644
index 0000000000..3c8aacbe67
--- /dev/null
+++ b/platform/commonUI/general/res/sass/_iframe.scss
@@ -0,0 +1,9 @@
+/* Styles for the iframe EmbeddedPageController element */
+
+.l-iframe {
+    iframe {
+        display: block;
+        height: 100%;
+        width: 100%;
+    }
+}
\ No newline at end of file
diff --git a/platform/commonUI/general/res/sass/_main.scss b/platform/commonUI/general/res/sass/_main.scss
index 10cc1789d2..99bf5b6322 100755
--- a/platform/commonUI/general/res/sass/_main.scss
+++ b/platform/commonUI/general/res/sass/_main.scss
@@ -40,3 +40,4 @@
 @import "helpers/wait-spinner";
 @import "properties";
 @import "autoflow";
+@import "iframe";
diff --git a/platform/features/pages/res/iframe.html b/platform/features/pages/res/iframe.html
index e23e073555..0ab4edea5c 100644
--- a/platform/features/pages/res/iframe.html
+++ b/platform/features/pages/res/iframe.html
@@ -1,4 +1,5 @@
+<div class="abs l-iframe">
 <iframe ng-controller="EmbeddedPageController as ctl"
-        style="width: 100%; height: 100%;"
         ng-src="{{ctl.trust(model.url)}}">
-</iframe>
\ No newline at end of file
+</iframe>
+</div>
\ No newline at end of file