Skip to content

Instantly share code, notes, and snippets.

@morethanreal

morethanreal/index.html

Created April 21, 2015 21:48
Show Gist options
  • Save morethanreal/da583f571d9931d03f99 to your computer and use it in GitHub Desktop.
Save morethanreal/da583f571d9931d03f99 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
index.html
<script src="../webcomponentsjs/webcomponents-lite.js"></script>
<link rel="import" href="../polymer/polymer.html">
<link rel="import" href="my-element.html">
<link rel="import" href="other-element.html">
<body>
<h1>with hostAttributes</h1>
<my-element>
<p>some stuff</p>
<other-element></other-element>
</my-element>
<h1>inline class</h1>
<my-element>
<p>some stuff</p>
<other-element class="foo"></other-element>
</my-element>
</body>
Raw
my-element.html
<dom-module id="my-element">
<style>
:host {
display: block;
border: 1px solid black;
}
</style>
<template>
some content with .foo
<content select=".foo"></content>
<br>
rest of the content
<content></content>
</template>
</dom-module>
<script>
(function() {
Polymer({
is: 'my-element'
});
})();
</script>
Raw
other-element.html
<dom-module id="other-element">
<style>
:host {
display: block;
color: red;
}
</style>
<template>
I should appear first
</template>
</dom-module>
<script>
(function() {
Polymer({
is: 'other-element',
hostAttributes: {
class: 'foo'
}
});
})();
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment