Im starting a site using Polymer and the Paper Elements designed for it. I have install the components using bower and it seems i have everything in the right place. here is my code:
<html>
<head>
<script src="bower_components/webcomponentsjs/webcomponents.js"></script>
<link rel="import" href="bower_components/core-scaffold/core-scaffold.html">
<link rel="import" href="bower_components/core-item/core-item.html">
<link rel="import" href="bower_components/paper-input/paper-input.html">
<link rel="import" href="bower_components/paper-fab/paper-fab.html">
</head>
<body fullbleed unresolved>
<template is="auto-binding">
<core-scaffold>
<core-header-panel navigation flex>
<core-toolbar class="tall">
</core-toolbar>
</core-header-panel>
<div tool layout horizontal flex>
<span flex>Toolbar Text</span>
<core-icon icon="account-circle"></core-icon>
<span>7</span>
</div>
<div flex>
<div class="send_message" layout horizontal>
<paper-input flex label="Enter Text..." id="input" value="{{input}}"></paper-input>
<paper-fab icon="send" id="sendButton" on-tap="{{sendMyMessage}}"></paper-fab>
</div>
</div>
</core-scaffold>
</template>
</body>
</html>
Nothing show up once i load the webpage tho. If i take out the template tag i can see the text in my toolbar, but still none of the elements render. Any help is appreciated, thanks in advance!
It looks like you're using an old version of Polymer (< 1.0) based on your usage of core-*
elements (replaced by iron-*
) and auto-binding
(replaced by dom-bind
). Polymer docs have a migration guide that could help you upgrade, but it might be easier to start from scratch, using Polymer Starter Kit (which has the latest and greatest).