From 241a9a450204317676d9cd4bfc13e9c3172db73b Mon Sep 17 00:00:00 2001
From: Yvonne Yip <ykyyip@google.com>
Date: Tue, 28 Apr 2015 17:59:08 -0700
Subject: [PATCH 1/2] =?UTF-8?q?update=20shadow=20values.=20now=20with=20?=
 =?UTF-8?q?=E2=88=9E=20more=20umbra?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 demo/index.html   | 43 +++++++++++++++++++++++++++++++-
 paper-styles.html |  1 +
 shadow.html       | 63 ++++++++++++++++++++++++++++++++++++++++-------
 3 files changed, 97 insertions(+), 10 deletions(-)

diff --git a/demo/index.html b/demo/index.html
index c35af0b..8e7b92e 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -146,6 +146,38 @@
           mixin(--paper-font-display1);
         }
 
+        .shadow {
+          display: inline-block;
+          padding: 8px;
+          margin: 16px;
+          height: 50px;
+          width: 50px;
+        }
+
+        .shadow-2dp {
+          mixin(--shadow-elevation-2dp);
+        }
+
+        .shadow-3dp {
+          mixin(--shadow-elevation-3dp);
+        }
+
+        .shadow-4dp {
+          mixin(--shadow-elevation-4dp);
+        }
+
+        .shadow-6dp {
+          mixin(--shadow-elevation-6dp);
+        }
+
+        .shadow-8dp {
+          mixin(--shadow-elevation-8dp);
+        }
+
+        .shadow-16dp {
+          mixin(--shadow-elevation-16dp);
+        }
+
       </style>
 
       <template>
@@ -231,12 +263,21 @@ <h4>body1</h4>
           </section>
         </section>
 
+        <section id="shadow">
+          <h2>shadow.html</h2>
+          <div class="shadow shadow-2dp">2dp</div>
+          <div class="shadow shadow-3dp">3dp</div>
+          <div class="shadow shadow-4dp">4dp</div>
+          <div class="shadow shadow-6dp">6dp</div>
+          <div class="shadow shadow-8dp">8dp</div>
+          <div class="shadow shadow-16dp">16dp</div>
+        </section>
+
       </template>
     </dom-module>
 
     <script>
       document.addEventListener('HTMLImportsLoaded', function() {
-        console.log('asdasd');
         Polymer({
           is: 'x-demo',
           enableCustomStyleProperties: true
diff --git a/paper-styles.html b/paper-styles.html
index 828fffe..4a4271f 100644
--- a/paper-styles.html
+++ b/paper-styles.html
@@ -11,5 +11,6 @@
 <link rel="import" href="color.html">
 <link rel="import" href="default-theme.html">
 <link rel="import" href="layout.html">
+<link rel="import" href="shadow.html">
 <link rel="import" href="typography.html">
 <link rel="import" href="shadow.html">
diff --git a/shadow.html b/shadow.html
index 6d7ae7a..08e9080 100644
--- a/shadow.html
+++ b/shadow.html
@@ -12,34 +12,79 @@
 
 <style is="x-style">
 
+
   * {
 
     --shadow-transition: {
       transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
     };
 
+    /* from http://codepen.io/shyndman/pen/c5394ddf2e8b2a5c9185904b57421cdb */
+
+    --shadow-elevation-2dp: {
+      box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14),
+                  0 1px 5px 0 rgba(0, 0, 0, 0.12),
+                  0 3px 1px -2px rgba(0, 0, 0, 0.2);
+    };
+
     --shadow-elevation-1: {
-      box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.37);
+      box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14),
+                  0 1px 5px 0 rgba(0, 0, 0, 0.12),
+                  0 3px 1px -2px rgba(0, 0, 0, 0.2);
+    };
+
+    --shadow-elevation-3dp: {
+      box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.14),
+                  0 1px 8px 0 rgba(0, 0, 0, 0.12),
+                  0 3px 3px -2px rgba(0, 0, 0, 0.2);
+    };
+
+    --shadow-elevation-4dp: {
+      box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14),
+                  0 1px 10px 0 rgba(0, 0, 0, 0.12),
+                  0 2px 4px -1px rgba(0, 0, 0, 0.2);
     };
 
     --shadow-elevation-2: {
-      box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.2),
-                  0 6px 10px 0 rgba(0, 0, 0, 0.3);
+      box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14),
+                  0 1px 10px 0 rgba(0, 0, 0, 0.12),
+                  0 2px 4px -1px rgba(0, 0, 0, 0.2);
+    };
+
+    --shadow-elevation-6dp: {
+      box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14),
+                  0 1px 18px 0 rgba(0, 0, 0, 0.12),
+                  0 3px 5px -1px rgba(0, 0, 0, 0.2);
     };
 
     --shadow-elevation-3: {
-      box-shadow: 0 11px 7px 0 rgba(0, 0, 0, 0.19),
-                  0 13px 25px 0 rgba(0, 0, 0, 0.3);
+      box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14),
+                  0 1px 18px 0 rgba(0, 0, 0, 0.12),
+                  0 3px 5px -1px rgba(0, 0, 0, 0.2);
+    };
+
+    --shadow-elevation-8dp: {
+      box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14),
+                  0 3px 14px 2px rgba(0, 0, 0, 0.12),
+                  0 5px 5px -3px rgba(0, 0, 0, 0.2);
     };
 
     --shadow-elevation-4: {
-      box-shadow: 0 14px 12px 0 rgba(0, 0, 0, 0.17),
-                  0 20px 40px 0 rgba(0, 0, 0, 0.3);
+      box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14),
+                  0 3px 14px 2px rgba(0, 0, 0, 0.12),
+                  0 5px 5px -3px rgba(0, 0, 0, 0.2);
+    };
+
+    --shadow-elevation-16dp: {
+      box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14),
+                  0  6px 30px 5px rgba(0, 0, 0, 0.12),
+                  0  8px 10px -5px rgba(0, 0, 0, 0.2);
     };
 
     --shadow-elevation-5: {
-      box-shadow: 0 17px 17px 0 rgba(0, 0, 0, 0.15),
-                  0 27px 55px 0 rgba(0, 0, 0, 0.3);
+      box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14),
+                  0  6px 30px 5px rgba(0, 0, 0, 0.12),
+                  0  8px 10px -5px rgba(0, 0, 0, 0.2);
     };
 
   }

From 5c2253f38b2eddbf2442a50420a96c0e6d450838 Mon Sep 17 00:00:00 2001
From: Yvonne Yip <ykyyip@google.com>
Date: Tue, 28 Apr 2015 18:16:07 -0700
Subject: [PATCH 2/2] remove elevation-z

---
 shadow.html | 30 ------------------------------
 1 file changed, 30 deletions(-)

diff --git a/shadow.html b/shadow.html
index 08e9080..12e48dd 100644
--- a/shadow.html
+++ b/shadow.html
@@ -27,12 +27,6 @@
                   0 3px 1px -2px rgba(0, 0, 0, 0.2);
     };
 
-    --shadow-elevation-1: {
-      box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14),
-                  0 1px 5px 0 rgba(0, 0, 0, 0.12),
-                  0 3px 1px -2px rgba(0, 0, 0, 0.2);
-    };
-
     --shadow-elevation-3dp: {
       box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.14),
                   0 1px 8px 0 rgba(0, 0, 0, 0.12),
@@ -45,48 +39,24 @@
                   0 2px 4px -1px rgba(0, 0, 0, 0.2);
     };
 
-    --shadow-elevation-2: {
-      box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14),
-                  0 1px 10px 0 rgba(0, 0, 0, 0.12),
-                  0 2px 4px -1px rgba(0, 0, 0, 0.2);
-    };
-
     --shadow-elevation-6dp: {
       box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14),
                   0 1px 18px 0 rgba(0, 0, 0, 0.12),
                   0 3px 5px -1px rgba(0, 0, 0, 0.2);
     };
 
-    --shadow-elevation-3: {
-      box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14),
-                  0 1px 18px 0 rgba(0, 0, 0, 0.12),
-                  0 3px 5px -1px rgba(0, 0, 0, 0.2);
-    };
-
     --shadow-elevation-8dp: {
       box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14),
                   0 3px 14px 2px rgba(0, 0, 0, 0.12),
                   0 5px 5px -3px rgba(0, 0, 0, 0.2);
     };
 
-    --shadow-elevation-4: {
-      box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14),
-                  0 3px 14px 2px rgba(0, 0, 0, 0.12),
-                  0 5px 5px -3px rgba(0, 0, 0, 0.2);
-    };
-
     --shadow-elevation-16dp: {
       box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14),
                   0  6px 30px 5px rgba(0, 0, 0, 0.12),
                   0  8px 10px -5px rgba(0, 0, 0, 0.2);
     };
 
-    --shadow-elevation-5: {
-      box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14),
-                  0  6px 30px 5px rgba(0, 0, 0, 0.12),
-                  0  8px 10px -5px rgba(0, 0, 0, 0.2);
-    };
-
   }
 
 </style>