Skip to content

Instantly share code, notes, and snippets.

@walteribeiro
Last active January 6, 2016 16:24
Show Gist options
  • Select an option

  • Save walteribeiro/9df625f7290a30e66819 to your computer and use it in GitHub Desktop.

Select an option

Save walteribeiro/9df625f7290a30e66819 to your computer and use it in GitHub Desktop.
designer
<link rel="import" href="../paper-button/paper-button.html">
<link rel="import" href="../core-tooltip/core-tooltip.html">
<link rel="import" href="../paper-input/paper-input.html">
<polymer-element name="cadastro-basico">
<template>
<style>
:host {
position: absolute;
width: 100%;
height: 100%;
box-sizing: border-box;
}
#core_card {
position: absolute;
width: 300px;
height: 320px;
border-radius: 2px;
box-shadow: rgba(0, 0, 0, 0.0980392) 0px 2px 4px, rgba(0, 0, 0, 0.0980392) 0px 0px 3px;
left: 0px;
top: 0px;
background-color: rgb(255, 255, 255);
}
#paper_button {
padding: 5px;
width: 150px;
left: 25%;
top: 80%;
background-color: rgb(68, 162, 255);
}
#paper_input {
width: 250px;
left: 7%;
padding: 2px;
position: relative;
}
</style>
<core-card id="core_card" layout vertical>
<paper-button raised id="paper_button" center>Gravar</paper-button>
<core-tooltip label="Seu nome aqui!" position="right" id="core_tooltip">
<paper-input label="Nome" floatinglabel value="{{ nome }}" id="paper_input"></paper-input>
</core-tooltip>
<core-tooltip label="Seu sobrenome aqui!" position="right" id="core_tooltip">
<paper-input label="Sobrenome" floatinglabel value="{{ sobrenome }}" id="paper_input"></paper-input>
</core-tooltip>
<core-tooltip label="Seu email aqui!" position="right" id="core_tooltip">
<paper-input label="Email" floatinglabel value="{{ email }}" id="paper_input"></paper-input>
</core-tooltip>
<div>
<button formaction="https://polymer-designer.appspot.com/elements/designer-element/frame.html" type="submit" willvalidate id="btn">Click me!</button>
<paper-tooltip for="btn">Tooltip text</paper-tooltip>
</div>
</core-card>
</template>
<script>
Polymer({
is: 'cadastro-basico',
properties: {},
ready: function (){
this.nome = 'Example';
this.sobrenome = 'Basic';
this.email = 'basic@example.com';
},
email: '',
nome: '',
sobrenome: ''
});
</script>
</polymer-element>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment