remove core-flex from mainContainer when mode == 'cover'

googlearchive · Apr 21, 2014 · c2e402a · c2e402a
1 parent c604b1c
commit c2e402a
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 9 deletions.
diff --git a/core-header-panel.css b/core-header-panel.css
@@ -53,10 +53,4 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
   right: 0;
   bottom: 0;
   left: 0;
-  pointer-events: none;
-}
-
-/* @polyfill :host([mode=cover]) #mainContainer > * */
-:host([mode=cover]) ::content#mainContent > * {
-  pointer-events: visible;
 }
diff --git a/core-header-panel.html b/core-header-panel.html
@@ -79,7 +79,7 @@
 
     <div class="panel-container core-h" core-flex>
 
-      <div id="mainContainer" core-flex on-scroll="{{scroll}}">
+      <div id="mainContainer" core-flex?="{{mode !== 'cover'}}" on-scroll="{{scroll}}">
         <content id="mainContent" select="*"></content>
       </div>
 

diff --git a/demo.html b/demo.html
@@ -17,7 +17,7 @@
     <link rel="import" href="../core-toolbar/core-toolbar.html">
     <link rel="import" href="../core-icon-button/core-icon-button.html">
 
-    <style>
+    <style shim-shadowdom>
 
       body {
         font-family: sans-serif;
@@ -29,6 +29,10 @@
         height: 400px;
         margin: 5px;
       }
+
+      core-header-panel[mode=cover]::shadow #mainContainer {
+        left: 70px;
+      }
 
       core-toolbar {
         background-color: #4F7DC9;
@@ -91,7 +95,7 @@
         <core-icon-button icon="menu"></core-icon-button>
         <div>cover</div>
       </core-toolbar>
-      <div class="content" style="margin: 60px 60px 60px 70px;"></div>
+      <div class="content" style="margin: 60px 60px 60px 0;"></div>
     </core-header-panel>
 
   </body>