| Content-Type: text/plain |
| <html><head><style>template { display: none; }</style> |
| <title>Simple Web Components Example</title> |
| |
| <script src="../../packages/polymer/testing/testing.js"></script> |
| <style>template, |
| thead[template], |
| tbody[template], |
| tfoot[template], |
| th[template], |
| tr[template], |
| td[template], |
| caption[template], |
| colgroup[template], |
| col[template], |
| option[template] { |
| display: none; |
| }</style></head> |
| <body><polymer-element name="x-news" extends="ul"> |
| <template> |
| <style scoped=""> |
| div.breaking { |
| color: Red; |
| font-size: 20px; |
| border: 1px dashed Purple; |
| } |
| div.other { |
| padding: 2px 0 0 0; |
| border: 1px solid Cyan; |
| } |
| </style> |
| <div class="breaking"> |
| <h2>Breaking Stories</h2> |
| <ul> |
| <content select=".breaking"></content> |
| </ul> |
| </div> |
| <div class="other"> |
| <h2>Other News</h2> |
| <ul> |
| <content></content> |
| </ul> |
| </div> |
| </template> |
| |
| </polymer-element> |
| |
| <h1>Simple Web Components Example</h1> |
| <ul is="x-news"><shadow-root> |
| <style scoped=""> |
| div.breaking { |
| color: Red; |
| font-size: 20px; |
| border: 1px dashed Purple; |
| } |
| div.other { |
| padding: 2px 0 0 0; |
| border: 1px solid Cyan; |
| } |
| </style> |
| <div class="breaking"> |
| <h2>Breaking Stories</h2> |
| <ul> |
| <content select=".breaking"></content> |
| </ul> |
| </div> |
| <div class="other"> |
| <h2>Other News</h2> |
| <ul> |
| <content></content> |
| </ul> |
| </div> |
| </shadow-root> |
| <li><a href="//example.com/stories/1">A story</a></li> |
| <li><a href="//example.com/stories/2">Another story</a></li> |
| <li class="breaking"><a href="//example.com/stories/3">Also a story</a></li> |
| <li><a href="//example.com/stories/4">Yet another story</a></li> |
| <li><a href="//example.com/stories/4">Awesome story</a></li> |
| <li class="breaking"><a href="//example.com/stories/5">Horrible story</a></li> |
| </ul> |
| |
| |
| |
| <script type="text/javascript" src="packages/shadow_dom/shadow_dom.debug.js"></script> |
| <script type="application/dart" src="news_index_test.html_bootstrap.dart"></script></body></html> |
