Update to 2.0.2

miztroh-zz · Dec 5, 2017 · 108d637 · 108d637
1 parent 72a38c2
commit 108d637
Showing 1 changed file with 40 additions and 4 deletions.
diff --git a/paper-collapse.html b/paper-collapse.html
@@ -1,10 +1,23 @@
 <link rel="import" href="../polymer/polymer-element.html">
 <link rel="import" href="../iron-collapse/iron-collapse.html">
 <link rel="import" href="../iron-icon/iron-icon.html">
+<link rel="import" href="../iron-iconset-svg/iron-iconset-svg.html">
 <link rel="import" href="../iron-flex-layout/iron-flex-layout.html">
 <link rel="import" href="../font-roboto/roboto.html">
+<iron-iconset-svg size="24" name="paper-collapse">
+	<svg>
+		<defs>
+			<g id="expand-less">
+				<path d="M12 8l-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z"></path>
+			</g>
+			<g id="expand-more">
+				<path d="M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z"></path>
+			</g>
+		</defs>
+	</svg>
+</iron-iconset-svg>
 <dom-module id="paper-collapse">
-  <template>
+	<template>
 		<style>
 			:host {
 				display: block;
@@ -48,6 +61,26 @@
 			#openedIcon {
 				color: #B4B4B4;
 			}
+
+			#dropShadowContainer {
+				position: relative;
+			}
+
+			#dropShadow {
+				opacity: 0;
+				transition: opacity 0.5s;
+				height: 6px;
+				box-shadow: inset 0px 5px 6px -3px rgba(0, 0, 0, 0.4);
+				position: absolute;
+				top: 0;
+				left: 0;
+				right: 0;
+				pointer-events: none;
+			}
+
+			:host([opened]) #dropShadow {
+				opacity: 1;
+			}
 		</style>
 		<div id="container">
 			<div id="toolbar" on-click="toggle">
@@ -58,11 +91,14 @@
 				<iron-icon icon="{{closedIcon}}" id="closedIcon" hidden$="{{opened}}"></iron-icon>
 				<iron-icon icon="{{openedIcon}}" id="openedIcon" hidden$="{{!opened}}"></iron-icon>
 			</div>
+			<div id="dropShadowContainer">
+				<div id="dropShadow"></div>
+			</div>
 			<iron-collapse id="collapse" opened$="{{opened}}">
 				<slot></slot>
 			</iron-collapse>
 		</div>
-  </template>
+	</template>
 	<script>
 		class PaperCollapse extends Polymer.Element {
 			static get is() {
@@ -73,7 +109,7 @@
 				return {
 					closedIcon: {
 						type: String,
-						value: 'the-waypoint:expand-more'
+						value: 'paper-collapse:expand-more'
 					},
 					label: {
 						type: String,
@@ -91,7 +127,7 @@
 					},
 					openedIcon: {
 						type: String,
-						value: 'the-waypoint:expand-less'
+						value: 'paper-collapse:expand-less'
 					}
 				};
 			}