| <html> |
| <head> |
| <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> |
| <title>Inspectable pages</title> |
| <style> |
| body { |
| color: #222; |
| font-family: Helvetica, Arial, sans-serif; |
| margin: 0; |
| text-shadow: rgba(255, 255, 255, 0.496094) 0px 1px 0px; |
| } |
| #caption { |
| font-size: 16px; |
| margin-top: 15px; |
| margin-bottom: 10px; |
| margin-left: 20px; |
| height: 20px; |
| text-align: left; |
| } |
| #items { |
| display: flex; |
| flex-direction: column; |
| margin: 10px; |
| } |
| .item { |
| color: #222; |
| display: flex; |
| flex-direction: row; |
| text-decoration: none; |
| padding: 10px; |
| cursor: pointer; |
| -webkit-transition-property: background-color, border-color; |
| -webkit-transition: background-color 0.15s, 0.15s; |
| -webkit-transition-delay: 0ms, 0ms; |
| } |
| .thumbnail { |
| background-attachment: scroll; |
| background-origin: padding-box; |
| background-repeat: no-repeat; |
| border: 1px solid rgba(184, 184, 184, 1); |
| flex: none; |
| height: 180; |
| width: 180; |
| } |
| .item:not(.connected):hover { |
| background-color: rgba(242, 242, 242, 1); |
| border-color: rgba(110, 116, 128, 1); |
| color: black; |
| } |
| .item.connected .thumbnail { |
| opacity: 0.5; |
| } |
| .item.connected:hover { |
| border-color: rgba(184, 184, 184, 1); |
| color: rgb(110, 116, 128); |
| } |
| .description { |
| display: flex; |
| flex-direction: column; |
| } |
| .title, .subtitle { |
| font-size: 13px; |
| margin: 4px 0px 0px 6px; |
| overflow: hidden; |
| padding-left: 20px; |
| } |
| .title { |
| background-repeat: no-repeat; |
| background-size: 16px; |
| font-size: 15px; |
| } |
| </style> |
| </head> |
| |
| <body> |
| <div id="caption">Inspectable pages</div> |
| <hr> |
| <div id="items"> |
| <div title="Cobalt" class="item"> |
| <script> |
| document.querySelector('.item').addEventListener('click', function() { |
| var authority = window.location.hostname + ':' + window.location.port; |
| window.location = '/devtools/inspector.html?ws=' + authority + |
| '/devtools/page/cobalt'; |
| }); |
| </script> |
| <div class="thumbnail" |
| style="background-image: url("/cobalt-logo-180.png");"> |
| </div> |
| <div class="description"> |
| <div class="title" |
| style="background-image: url("/favicon.ico");"> |
| Cobalt |
| </div> |
| <div class="subtitle">https://youtube.com/tv</div> |
| </div> |
| </div> |
| </div> |
| </body> |
| </html> |
