Skip to content

Instantly share code, notes, and snippets.

@NatalieLukaniuk

NatalieLukaniuk/dabblet.css

Created October 3, 2013 07:58
Show Gist options
  • Save NatalieLukaniuk/6806632 to your computer and use it in GitHub Desktop.
Save NatalieLukaniuk/6806632 to your computer and use it in GitHub Desktop.
Download ZIP
Untitled
Raw
dabblet.css
#inherit-buttons {
margin-left: 15px;
margin-top: 20px;
display: inline-block;
vertical-align: top;
}
#inherit-buttons button {
display: block;
margin-bottom: 10px;
}
Raw
dabblet.html
<div id="inherit-buttons">
<button id="demo-applyAuthorStyles">applyAuthorStyles=true</button>
<button id="demo-resetStyleInheritance">resetStyleInheritance=false</button>
</div>
<script>
(function() {
var container = document.querySelector('#style-ex-inheritance');
var root = container.createShadowRoot();
root.applyAuthorStyles = true;
//root.resetStyleInheritance = false;
root.innerHTML = '<style>h3{color: red;}</style><h3>Shadow DOM Title</h3><content select="h3"></content>';
document.querySelector('#demo-applyAuthorStyles').addEventListener('click', function(e) {
root.applyAuthorStyles = !root.applyAuthorStyles;
e.target.textContent = 'applyAuthorStyles=' + root.applyAuthorStyles;
document.querySelector('#code-applyAuthorStyles').textContent = root.applyAuthorStyles;
});
document.querySelector('#demo-resetStyleInheritance').addEventListener('click', function(e) {
root.resetStyleInheritance = !root.resetStyleInheritance;
e.target.textContent = 'resetStyleInheritance=' + root.resetStyleInheritance;
document.querySelector('#code-resetStyleInheritance').textContent = root.resetStyleInheritance;
});
})();
</script>
Raw
dabblet.js
// alert('Hello world!');
Raw
settings.json
{"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment