a container that contains the 2 backgrounds

googlearchive · Jun 9, 2014 · 34ed527 · 34ed527
1 parent 54d271f
commit 34ed527
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 2 deletions.
diff --git a/core-scroll-header-panel.css b/core-scroll-header-panel.css
@@ -29,6 +29,14 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
   top: 0;
   right: 0;
   left: 0;
+}
+
+.bg-container {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
   overflow: hidden;
 }
 

diff --git a/core-scroll-header-panel.html b/core-scroll-header-panel.html
@@ -44,8 +44,10 @@
 
   <div id="headerContainer">
 
-    <div id="condensedHeaderBg"></div>
-    <div id="headerBg"></div>
+    <div class="bg-container">
+      <div id="condensedHeaderBg"></div>
+      <div id="headerBg"></div>
+    </div>
 
     <content id="headerContent" select="core-toolbar, .core-header"></content>
 

diff --git a/demos/demo8.html b/demos/demo8.html
@@ -67,6 +67,13 @@
       color: #ccc;
     }
 
+    .bookmark {
+      position: absolute;
+      bottom: -24px;
+      right: 24px;
+      fill: #4285f4;
+    }
+
     .content {
       padding: 20px 20px 20px 68px;
     }
@@ -91,6 +98,8 @@
         <div class="subtitle">Iisque perfecto dissentiet cum et</div>
       </div>
 
+      <core-icon class="bottom bookmark" icon="bookmark" size="48"></core-icon>
+
     </core-toolbar>
 
     <div class="content">