Find file
3dcf5d4 May 10, 2016
71 lines (64 sloc) 1.99 KB
Copyright (c) 2016 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at
The complete set of authors may be found at
The complete set of contributors may be found at
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at
<link rel="import" href="/bower_components/paper-button/paper-button.html">
<link rel="import" href="/bower_components/iron-icon/iron-icon.html">
<link rel="import" href="/bower_components/iron-icons/iron-icons.html">
<link rel="import" href="/bower_components/iron-flex-layout/iron-flex-layout.html">
<dom-module id="na-login">
:host {
position: absolute;
top: 46px;
left: 0;
right: 0;
bottom: 0;
background-color: var(--paper-purple-500);
transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1);
z-index: 1;
color: var(--paper-purple-50);
:host([signed-in]) {
opacity: 0;
pointer-events: none;
paper-button > * {
vertical-align: middle;
text-transform: none;
<paper-button on-tap="signIn" disabled="[[disabled]]">
<iron-icon icon="account-circle"></iron-icon>
<span>Sign in with Google</span>
is: 'na-login',
properties: {
disabled: {
type: Boolean,
reflectToAttribute: true,
value: false
signedIn: {
type: Boolean,
reflectToAttribute: true,
value: false
signIn: function() {'sign-in', null, { bubbles: false });