Commit bb42e883 authored by dpapad's avatar dpapad Committed by Commit Bot

WebUI: Update Polymer paper-button version 1.0.13 -> 2.0.0

Also had to update paper-styles version 1.1.4 -> 1.3.1, and removed
the deprecated and unused shadow-layout.html.

Bug: 738611
Cq-Include-Trybots: master.tryserver.chromium.linux:closure_compilation
Change-Id: I43fc909502ac321e3a6a512ca6b00c93a98abab2
Reviewed-on: https://chromium-review.googlesource.com/882446Reviewed-by: default avatarHector Carmona <hcarmona@chromium.org>
Commit-Queue: Demetrios Papadopoulos <dpapad@chromium.org>
Cr-Commit-Position: refs/heads/master@{#531851}
parent 9030bb3e
......@@ -34,7 +34,7 @@
"iron-validatable-behavior": "PolymerElements/iron-validatable-behavior#1.1.1",
"neon-animation": "PolymerElements/neon-animation#1.2.4",
"paper-behaviors": "PolymerElements/paper-behaviors#1.0.12",
"paper-button": "PolymerElements/paper-button#1.0.13",
"paper-button": "PolymerElements/paper-button#2.0.0",
"paper-checkbox": "PolymerElements/paper-checkbox#1.4.0",
"paper-fab": "PolymerElements/paper-fab#1.2.0",
"paper-icon-button": "PolymerElements/paper-icon-button#1.1.6",
......@@ -48,7 +48,7 @@
"paper-ripple": "PolymerElements/paper-ripple#1.0.9",
"paper-slider": "PolymerElements/paper-slider#2.0.2",
"paper-spinner": "PolymerElements/paper-spinner#1.2.0",
"paper-styles": "PolymerElements/paper-styles#1.1.4",
"paper-styles": "PolymerElements/paper-styles#1.3.1",
"paper-tabs": "PolymerElements/paper-tabs#1.6.2",
"paper-toggle-button": "PolymerElements/paper-toggle-button#1.3.0",
"paper-tooltip": "PolymerElements/paper-tooltip#1.1.4",
......
{
"name": "paper-button",
"version": "1.0.13",
"version": "2.0.0",
"description": "Material design button",
"authors": [
"The Polymer Authors"
......@@ -21,21 +21,46 @@
"license": "http://polymer.github.io/LICENSE.txt",
"homepage": "https://github.com/PolymerElements/paper-button",
"dependencies": {
"polymer": "Polymer/polymer#^1.1.0",
"iron-flex-layout": "PolymerElements/iron-flex-layout#^1.0.0",
"paper-behaviors": "PolymerElements/paper-behaviors#^1.0.0",
"paper-material": "PolymerElements/paper-material#^1.0.0"
"polymer": "Polymer/polymer#1.9 - 2",
"iron-flex-layout": "PolymerElements/iron-flex-layout#1 - 2",
"paper-behaviors": "PolymerElements/paper-behaviors#1 - 2",
"paper-styles": "PolymerElements/paper-styles#1 - 2"
},
"devDependencies": {
"iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
"iron-demo-helpers": "PolymerElements/iron-demo-helpers#^1.0.0",
"iron-icon": "PolymerElements/iron-icon#^1.0.0",
"iron-icons": "PolymerElements/iron-icons#^1.0.0",
"iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0",
"paper-styles": "PolymerElements/paper-styles#^1.0.0",
"test-fixture": "PolymerElements/test-fixture#^1.0.0",
"web-component-tester": "^4.0.0",
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
"iron-component-page": "PolymerElements/iron-component-page#1 - 2",
"iron-demo-helpers": "PolymerElements/iron-demo-helpers#1 - 2",
"iron-icon": "PolymerElements/iron-icon#1 - 2",
"iron-icons": "PolymerElements/iron-icons#1 - 2",
"iron-test-helpers": "PolymerElements/iron-test-helpers#1 - 2",
"test-fixture": "PolymerElements/test-fixture#^3.0.0-rc.1",
"web-component-tester": "^6.0.0",
"webcomponentsjs": "webcomponents/webcomponentsjs#^1.0.0"
},
"ignore": []
"variants": {
"1.x": {
"dependencies": {
"polymer": "Polymer/polymer#^1.9",
"iron-flex-layout": "PolymerElements/iron-flex-layout#^1.0.0",
"paper-behaviors": "PolymerElements/paper-behaviors#^1.0.0",
"paper-styles": "PolymerElements/paper-styles#^1.0.0"
},
"devDependencies": {
"iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
"iron-demo-helpers": "PolymerElements/iron-demo-helpers#^1.0.0",
"iron-icon": "PolymerElements/iron-icon#^1.0.0",
"iron-icons": "PolymerElements/iron-icons#^1.0.0",
"iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0",
"test-fixture": "PolymerElements/test-fixture#^1.0.0",
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0",
"web-component-tester": "Polymer/web-component-tester#^4.0.0"
},
"resolutions": {
"webcomponentsjs": "^0.7"
}
}
},
"ignore": [],
"resolutions": {
"webcomponentsjs": "^1.0.0"
}
}
......@@ -9,7 +9,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
--><html><head><link rel="import" href="../polymer/polymer.html">
<link rel="import" href="../iron-flex-layout/iron-flex-layout.html">
<link rel="import" href="../paper-behaviors/paper-button-behavior.html">
<link rel="import" href="../paper-material/paper-material-shared-styles.html">
<link rel="import" href="../paper-styles/element-styles/paper-material-styles.html">
<!--
Material design: [Buttons](https://www.google.com/design/spec/components/buttons.html)
......@@ -81,10 +81,11 @@ Custom property | Description | Default
</head><body><dom-module id="paper-button">
<template strip-whitespace="">
<style include="paper-material-shared-styles">
<style include="paper-material-styles">
/* Need to specify the same specificity as the styles imported from paper-material. */
:host {
@apply(--layout-inline);
@apply(--layout-center-center);
@apply --layout-inline;
@apply --layout-center-center;
position: relative;
box-sizing: border-box;
min-width: 5.14em;
......@@ -101,8 +102,28 @@ Custom property | Description | Default
z-index: 0;
padding: 0.7em 0.57em;
@apply(--paper-font-common-base);
@apply(--paper-button);
@apply --paper-font-common-base;
@apply --paper-button;
}
:host([elevation="1"]) {
@apply --paper-material-elevation-1;
}
:host([elevation="2"]) {
@apply --paper-material-elevation-2;
}
:host([elevation="3"]) {
@apply --paper-material-elevation-3;
}
:host([elevation="4"]) {
@apply --paper-material-elevation-4;
}
:host([elevation="5"]) {
@apply --paper-material-elevation-5;
}
:host([hidden]) {
......@@ -111,12 +132,12 @@ Custom property | Description | Default
:host([raised].keyboard-focus) {
font-weight: bold;
@apply(--paper-button-raised-keyboard-focus);
@apply --paper-button-raised-keyboard-focus;
}
:host(:not([raised]).keyboard-focus) {
font-weight: bold;
@apply(--paper-button-flat-keyboard-focus);
@apply --paper-button-flat-keyboard-focus;
}
:host([disabled]) {
......@@ -125,11 +146,11 @@ Custom property | Description | Default
cursor: auto;
pointer-events: none;
@apply(--paper-button-disabled);
@apply --paper-button-disabled;
}
:host([animated]) {
@apply(--shadow-transition);
@apply --shadow-transition;
}
paper-ripple {
......@@ -137,7 +158,7 @@ Custom property | Description | Default
}
</style>
<content></content>
<slot></slot>
</template>
</dom-module>
......
{
"name": "paper-styles",
"version": "1.1.4",
"version": "1.3.1",
"description": "Common (global) styles for Material Design elements.",
"authors": [
"The Polymer Authors"
......
<!--
@license
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
-->
<style>
/*******************************
Flex Layout
*******************************/
html /deep/ .layout.horizontal,
html /deep/ .layout.horizontal-reverse,
html /deep/ .layout.vertical,
html /deep/ .layout.vertical-reverse {
display: flex;
}
html /deep/ .layout.inline {
display: inline-flex;
}
html /deep/ .layout.horizontal {
flex-direction: row;
}
html /deep/ .layout.horizontal-reverse {
flex-direction: row-reverse;
}
html /deep/ .layout.vertical {
flex-direction: column;
}
html /deep/ .layout.vertical-reverse {
flex-direction: column-reverse;
}
html /deep/ .layout.wrap {
flex-wrap: wrap;
}
html /deep/ .layout.wrap-reverse {
flex-wrap: wrap-reverse;
}
html /deep/ .flex-auto {
flex: 1 1 auto;
}
html /deep/ .flex-none {
flex: none;
}
html /deep/ .flex,
html /deep/ .flex-1 {
flex: 1;
}
html /deep/ .flex-2 {
flex: 2;
}
html /deep/ .flex-3 {
flex: 3;
}
html /deep/ .flex-4 {
flex: 4;
}
html /deep/ .flex-5 {
flex: 5;
}
html /deep/ .flex-6 {
flex: 6;
}
html /deep/ .flex-7 {
flex: 7;
}
html /deep/ .flex-8 {
flex: 8;
}
html /deep/ .flex-9 {
flex: 9;
}
html /deep/ .flex-10 {
flex: 10;
}
html /deep/ .flex-11 {
flex: 11;
}
html /deep/ .flex-12 {
flex: 12;
}
/* alignment in cross axis */
html /deep/ .layout.start {
align-items: flex-start;
}
html /deep/ .layout.center,
html /deep/ .layout.center-center {
align-items: center;
}
html /deep/ .layout.end {
align-items: flex-end;
}
/* alignment in main axis */
html /deep/ .layout.start-justified {
justify-content: flex-start;
}
html /deep/ .layout.center-justified,
html /deep/ .layout.center-center {
justify-content: center;
}
html /deep/ .layout.end-justified {
justify-content: flex-end;
}
html /deep/ .layout.around-justified {
justify-content: space-around;
}
html /deep/ .layout.justified {
justify-content: space-between;
}
/* self alignment */
html /deep/ .self-start {
align-self: flex-start;
}
html /deep/ .self-center {
align-self: center;
}
html /deep/ .self-end {
align-self: flex-end;
}
html /deep/ .self-stretch {
align-self: stretch;
}
/*******************************
Other Layout
*******************************/
html /deep/ .block {
display: block;
}
/* IE 10 support for HTML5 hidden attr */
html /deep/ [hidden] {
display: none !important;
}
html /deep/ .invisible {
visibility: hidden !important;
}
html /deep/ .relative {
position: relative;
}
html /deep/ .fit {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
body.fullbleed {
margin: 0;
height: 100vh;
}
html /deep/ .scroll {
-webkit-overflow-scrolling: touch;
overflow: auto;
}
.fixed-bottom,
.fixed-left,
.fixed-right,
.fixed-top {
position: fixed;
}
html /deep/ .fixed-top {
top: 0;
left: 0;
right: 0;
}
html /deep/ .fixed-right {
top: 0;
right: 0;
bottom: 0;
}
html /deep/ .fixed-bottom {
right: 0;
bottom: 0;
left: 0;
}
html /deep/ .fixed-left {
top: 0;
bottom: 0;
left: 0;
}
</style>
......@@ -16,7 +16,7 @@ http://www.google.com/design/spec/style/typography.html#typography-standard-styl
To make use of them, apply a `paper-font-<style>` class to elements, matching
the font style you wish it to inherit.
<header class="paper-font-display2">Hey there!</header>
<h1 class="paper-font-display2">Hey there!</h1>
Note that these are English/Latin centric styles. You may need to further adjust
line heights and weights for CJK typesetting. See the notes in the Material
......
<!--
@license
Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
-->
<link rel="import" href="../../polymer/polymer.html">
<link rel="import" href="../color.html">
<link rel="import" href="../default-theme.html">
<link rel="import" href="../typography.html">
<!--
Material design: [Lists](https://www.google.com/design/spec/components/lists.html)
Shared styles for a native `button` to be used as an item in a `paper-listbox` element:
<custom-style>
<style is="custom-style" include="paper-item-styles"></style>
</custom-style>
<paper-listbox>
<button class="paper-item" role="option">Inbox</button>
<button class="paper-item" role="option">Starred</button>
<button class="paper-item" role="option">Sent mail</button>
</paper-listbox>
@group Paper Elements
@demo demo/index.html
-->
<dom-module id="paper-item-styles">
<template>
<style>
:host, html {
--paper-item: {
display: block;
position: relative;
min-height: var(--paper-item-min-height, 48px);
padding: 0px 16px;
@apply --paper-font-subhead;
border:none;
outline: none;
background: white;
width: 100%;
text-align: left;
};
}
.paper-item {
@apply --paper-item;
}
.paper-item[hidden] {
display: none !important;
}
.paper-item.iron-selected {
font-weight: var(--paper-item-selected-weight, bold);
@apply --paper-item-selected;
}
.paper-item[disabled] {
color: var(--paper-item-disabled-color, var(--disabled-text-color));
@apply --paper-item-disabled;
}
.paper-item:focus {
position: relative;
outline: 0;
@apply --paper-item-focused;
}
.paper-item:focus:before {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: currentColor;
content: '';
opacity: var(--dark-divider-opacity);
pointer-events: none;
@apply --paper-item-focused-before;
}
</style>
</template>
</dom-module>
<!--
@license
Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
-->
<link rel="import" href="../../polymer/polymer.html">
<link rel="import" href="../shadow.html">
<!--
Material design: [Cards](https://www.google.com/design/spec/components/cards.html)
Shared styles that you can apply to an element to renders two shadows on top
of each other,that create the effect of a lifted piece of paper.
Example:
<custom-style>
<style is="custom-style" include="paper-material-styles"></style>
</custom-style>
<div class="paper-material elevation-1">
... content ...
</div>
@group Paper Elements
@demo demo/index.html
-->
<dom-module id="paper-material-styles">
<template>
<style>
:host, html {
--paper-material: {
display: block;
position: relative;
};
--paper-material-elevation-1: {
@apply --shadow-elevation-2dp;
};
--paper-material-elevation-2: {
@apply --shadow-elevation-4dp;
};
--paper-material-elevation-3: {
@apply --shadow-elevation-6dp;
};
--paper-material-elevation-4: {
@apply --shadow-elevation-8dp;
};
--paper-material-elevation-5: {
@apply --shadow-elevation-16dp;
};
}
:host(.paper-material), .paper-material {
@apply --paper-material;
}
:host(.paper-material[elevation="1"]), .paper-material[elevation="1"] {
@apply --paper-material-elevation-1;
}
:host(.paper-material[elevation="2"]), .paper-material[elevation="2"] {
@apply --paper-material-elevation-2;
}
:host(.paper-material[elevation="3"]), .paper-material[elevation="3"] {
@apply --paper-material-elevation-3;
}
:host(.paper-material[elevation="4"]), .paper-material[elevation="4"] {
@apply --paper-material-elevation-4;
}
:host(.paper-material[elevation="5"]), .paper-material[elevation="5"] {
@apply --paper-material-elevation-5;
}
</style>
</template>
</dom-module>
......@@ -66,6 +66,11 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
0 8px 10px -5px rgba(0, 0, 0, 0.4);
};
--shadow-elevation-24dp: {
box-shadow: 0 24px 38px 3px rgba(0, 0, 0, 0.14),
0 9px 46px 8px rgba(0, 0, 0, 0.12),
0 11px 15px -7px rgba(0, 0, 0, 0.4);
};
}
</style>
......@@ -192,9 +192,9 @@ Tree link: https://github.com/PolymerElements/paper-behaviors/tree/v1.0.12
Name: paper-button
Repository: https://github.com/PolymerElements/paper-button.git
Tree: v1.0.13
Revision: 649ac0c09fa74b5af258cb6debebba811024f7cc
Tree link: https://github.com/PolymerElements/paper-button/tree/v1.0.13
Tree: v2.0.0
Revision: b37655b85e1c3364ce9f5ca0470ddf1071cca3aa
Tree link: https://github.com/PolymerElements/paper-button/tree/v2.0.0
Name: paper-checkbox
Repository: https://github.com/PolymerElements/paper-checkbox.git
......@@ -276,9 +276,9 @@ Tree link: https://github.com/PolymerElements/paper-spinner/tree/v1.2.0
Name: paper-styles
Repository: https://github.com/PolymerElements/paper-styles.git
Tree: v1.1.4
Revision: 885bbd74db88dab4fb5dc229cdf994c55fb2b31b
Tree link: https://github.com/PolymerElements/paper-styles/tree/v1.1.4
Tree: v1.3.1
Revision: 1ed324102daa36458d153dd20eac80be9758b00e
Tree link: https://github.com/PolymerElements/paper-styles/tree/v1.3.1
Name: paper-tabs
Repository: https://github.com/PolymerElements/paper-tabs.git
......
......@@ -12,6 +12,7 @@ hero.svg
index.html
*.md
metadata.html
package.json
*/test/
*/tests/
.travis.yml
......@@ -29,3 +30,6 @@ paper-material/paper-material.html
# paper-spinner
paper-spinner/paper-spinner.html
# paper-styles
paper-styles/classes/shadow-layout.html
......@@ -764,10 +764,6 @@
file="../../../third_party/polymer/v1_0/components-chromium/paper-spinner/paper-spinner-styles.html"
type="chrome_html"
compress="gzip" />
<structure name="IDR_POLYMER_1_0_PAPER_STYLES_CLASSES_SHADOW_LAYOUT_HTML"
file="../../../third_party/polymer/v1_0/components-chromium/paper-styles/classes/shadow-layout.html"
type="chrome_html"
compress="gzip" />
<structure name="IDR_POLYMER_1_0_PAPER_STYLES_CLASSES_SHADOW_HTML"
file="../../../third_party/polymer/v1_0/components-chromium/paper-styles/classes/shadow.html"
type="chrome_html"
......@@ -784,6 +780,14 @@
file="../../../third_party/polymer/v1_0/components-chromium/paper-styles/default-theme.html"
type="chrome_html"
compress="gzip" />
<structure name="IDR_POLYMER_1_0_PAPER_STYLES_ELEMENT_STYLES_PAPER_ITEM_STYLES_HTML"
file="../../../third_party/polymer/v1_0/components-chromium/paper-styles/element-styles/paper-item-styles.html"
type="chrome_html"
compress="gzip" />
<structure name="IDR_POLYMER_1_0_PAPER_STYLES_ELEMENT_STYLES_PAPER_MATERIAL_STYLES_HTML"
file="../../../third_party/polymer/v1_0/components-chromium/paper-styles/element-styles/paper-material-styles.html"
type="chrome_html"
compress="gzip" />
<structure name="IDR_POLYMER_1_0_PAPER_STYLES_PAPER_STYLES_CLASSES_HTML"
file="../../../third_party/polymer/v1_0/components-chromium/paper-styles/paper-styles-classes.html"
type="chrome_html"
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment