Skip to content

Instantly share code, notes, and snippets.

@mogeta

mogeta/index.html

Created Dec 5, 2017
Embed
What would you like to do?
gasでpolymerするときのtemplate
<!DOCTYPE html>
<html lang="en">
<head>
<base href="https://cdn.rawgit.com/download/polymer-cdn/2.0.1/lib/">
<script src="webcomponentsjs/webcomponents-lite.js"></script>
<link rel="import" href="app-layout/app-layout.html">
<link rel="import" href="iron-icon/iron-icon.html">
<link rel="import" href="iron-icons/iron-icons.html">
<link rel="import" href="paper-button/paper-button.html">
<link rel="import" href="paper-checkbox/paper-checkbox.html">
<link rel="import" href="paper-tabs/paper-tabs.html">
<link rel="import" href="paper-toggle-button/paper-toggle-button.html">
<link rel="import" href="iron-ajax/iron-ajax.html">
<custom-style>
<style is="custom-style">
html, body {
margin: 0;
font-family: 'Roboto', 'Noto', sans-serif;
-webkit-font-smoothing: antialiased;
background: #f1f1f1;
max-height: 368px;
}
app-toolbar {
background-color: #4285f4;
color: #fff;
}
paper-icon-button {
--paper-icon-button-ink-color: white;
}
paper-icon-button + [main-title] {
margin-left: 24px;
}
paper-progress {
display: block;
width: 100%;
--paper-progress-active-color: rgba(255, 255, 255, 0.5);
--paper-progress-container-color: transparent;
}
app-header {
@apply --layout-fixed-top;
color: #fff;
--app-header-background-rear-layer: {
background-color: #ef6c00;
};
}
app-drawer {
--app-drawer-scrim-background: rgba(0, 0, 100, 0.8);
--app-drawer-content-container: {
background-color: #B0BEC5;
}
}
sample-content {
padding-top: 64px;
}
</style>
</custom-style>
</head>
<body>
<app-header reveals>
<app-toolbar>
<paper-icon-button icon="menu" onclick="drawer.toggle()"></paper-icon-button>
<div main-title>My app</div>
<paper-icon-button icon="delete"></paper-icon-button>
<paper-icon-button icon="search"></paper-icon-button>
<paper-icon-button icon="close"></paper-icon-button>
<paper-progress value="10" indeterminate bottom-item></paper-progress>
</app-toolbar>
</app-header>
<app-drawer id="drawer" swipe-open></app-drawer>
<sample-content size="10"></sample-content>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment