6 ms·
Sorry for the late reply. Right now there is a lot of stuff happening to simulate Web Components. Going forward they will become a W3C Standard and we can redu
by nik-graf 13y ago
Sorry for the late reply.
Right now there is a lot of stuff happening to simulate Web Components. Going forward they will become a W3C Standard and we can reduce the complexity. You might want to look at the current Draft https://dvcs.w3.org/hg/webcomponents/raw-file/tip/explainer/index.html https://dvcs.w3.org/hg/webcomponents/raw-file/tip/explainer/...
What’s happening at the moment is that the output for <x-loading></x-loading> is:
<span is="x-loading">
<style>
@-webkit-keyframes x-loading-dot {
0% {
opacity: 1;
}
50% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.x-loading-one {
opacity: 1;
-webkit-animation: x-loading-dot 1.3s infinite;
-webkit-animation-delay: 0.0s;
}
.x-loading-two {
opacity: 1;
-webkit-animation: x-loading-dot 1.3s infinite;
-webkit-animation-delay: 0.2s;
}
.x-loading-three {
opacity: 1;
-webkit-animation: x-loading-dot 1.3s infinite;
-webkit-animation-delay: 0.3s;
}
</style>
<span class="q-x-loading" style="color: rgb(80, 80, 80);">
<span class="x-loading-one">.</span><span class="x-loading-two">.</span><span class="x-loading-three">.</span>
</span>
</span>
If a component like the overlay also contains logic the code will be added to your compiled and minified JavaScript output.
For blossom.io/bee you can find the compiled output here https://www.blossom.io/bee_documentation.html_bootstrap.dart.js https://www.blossom.io/bee_documentation.html_bootstrap.dart...