| <!DOCTYPE html> |
| <html> |
| <head> |
| {{template "header.html" .}} |
| |
| <title>Directory of AutoRollers</title> |
| |
| </head> |
| <body> |
| <!--We must use is=custom-style here so the variables get piped through to the |
| app properly. Note that using custom-style inside <dom-module> can lead to |
| unintended consequences, such as CSS mixins not being visible. |
| https://www.polymer-project.org/1.0/docs/devguide/styling#custom-style --> |
| <style is="custom-style"> |
| app-sk { |
| --app-sk-main: { |
| background-color: #FFFFFF; |
| font-family: sans-serif; |
| }; |
| --app-sk-toolbar: { |
| background-color: #1F78B4; |
| color: #FFFFFF; |
| font-size: 15px; |
| font-family: sans-serif; |
| text-align: center; |
| }; |
| } |
| .fit { |
| position: absolute; |
| top: 0; |
| right: 0; |
| bottom: 0; |
| left: 0; |
| } |
| </style> |
| <app-sk id="app" class="fit"> |
| {{template "navbar.html" .}} |
| <h1 toolbar>Directory of AutoRollers</h1> |
| <arb-table-sk></arb-table-sk> |
| </app-sk> |
| </body> |
| <script> |
| var rollers = [ |
| {{range .Rollers}} |
| "{{.}}", |
| {{end}} |
| ]; |
| var elem = document.getElementsByTagName("arb-table-sk")[0]; |
| elem.rollers = rollers; |
| </script> |
| </html> |