Skip to content

Instantly share code, notes, and snippets.

@diegogurgel
Created August 10, 2014 03:23
Show Gist options
  • Save diegogurgel/5db3dddd4ee91569ee1c to your computer and use it in GitHub Desktop.
Save diegogurgel/5db3dddd4ee91569ee1c to your computer and use it in GitHub Desktop.
HTML import test
<section class="profile">
Just import
</section>
<style scoped >
.profile{
font-weight: 100;
letter-spacing: 1.3px;
background: #fff;
color:#dc6b65;
float: left;
border-radius: 2px;
font-family: Tahoma;
padding: 0 1em;
border:1px solid #ccc;
}
</style>
<script>
console.log("loaded via import");
</script>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Web components</title>
<link rel="import" href="components/card-profile-import.html">
<link rel="import" href="components/card-profile-custom.html">
<link rel="import" href="components/bg-video.html">
</head>
<body>
<x-card>Via tag(x-card)</x-card>
<section class="profile">
Just import 2
</section>
<bg-video src='videos/trailer_400p.ogg'>
</bg-video>
<script src="scripts/main.js" type="text/javascript"></script>
</body>
</html>
'use strict';
window.onload= function(){
var imports = document.querySelectorAll('link[rel="import"]');
var simpleImport = imports[0].import;
document.body.appendChild(simpleImport.querySelector('section'));
//var customElement = imports[1].import;
//console.log(customElement);
//document.body.appendChild(customElement.querySelector('card-profile'));
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment