@socketsupply/socket
Version:
A Cross-Platform, Native Runtime for Desktop and Mobile Apps — Create apps using HTML, CSS, and JavaScript. Written from the ground up to be small and maintainable.
146 lines (130 loc) • 3.88 kB
HTML
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta
http-equiv="Content-Security-Policy"
content="
connect-src socket: https: http: blob: ipc: wss: ws: ws://localhost:* {{protocol_handlers}};
script-src socket: https: http: blob: http://localhost:* 'unsafe-eval' 'unsafe-inline' {{protocol_handlers}};
worker-src socket: https: http: blob: 'unsafe-eval' 'unsafe-inline' {{protocol_handlers}};
frame-src socket: https: http: blob: http://localhost:*;
img-src socket: https: http: blob: http://localhost:*;
child-src socket: https: http: blob:;
object-src 'none';
"
>
<script charset="utf-8" type="text/javascript">
Object.defineProperty(globalThis, '__RUNTIME_SHARED_WORKER_CONTEXT__', {
configurable: false,
enumerable: false,
writable: false,
value: true
})
</script>
<script type="module">
import application from 'socket:application'
import process from 'socket:process'
Object.assign(globalThis, {
async openExternalLink (href) {
const currentWindow = await application.getCurrentWindow()
await currentWindow.openExternal(href)
}
})
document.title = `Shared Worker Debugger - v${process.version}`
</script>
<script type="module" src="./init.js"></script>
<style type="text/css" media="all">
* {
box-sizing: border-box;
}
body {
background: rgba(40, 40, 40, 1);
color: rgba(255, 255, 255, 1);
font-family: 'Inter-Light', sans-serif;
font-size: 14px;
margin: 0;
position: absolute; top: 0px; left: 0; right:0; bottom: 0px;
}
a {
color: inherit;
text-decoration: none;
transition: all 0.2s ease;
&.with-hover:hover {
border-bottom: 2px solid rgba(255, 255, 255, 1);
}
}
p {
background: rgba(14, 85, 152, .25);
border-radius: 2px;
display: inline-block;
font: 12px/26px 'Inter-Light', sans-serif;
margin: 0;
text-align: center;
width: 100%;
&.message {
display: block;
overflow: hidden;
padding: 0 8px;
position: relative;
text-overflow: ellipsis;
white-space: nowrap;
width: 100%;
}
}
pre#log {
background: rgba(0, 0, 0, 1);
overflow-y: scroll;
padding: 16px;
margin: 0;
position: absolute; top: 0px; left: 0; right:0; bottom: 0px;
& span {
opacity: 0.8;
transition: all 0.2s ease;
&:hover {
opacity: 1;
transition: all 0.05s ease;
}
& code {
color: rgb(215, 215, 215);
display: block;
font-size: 12px;
line-break: anywhere;
margin-bottom: 8px;
opacity: 0.8;
white-space: wrap;
transition: all 0.1s ease;
&:hover {
color: rgb(225, 225, 225);
opacity: 1;
transition: all 0.025s ease;
}
& span {
&.red {
color: red;
}
}
}
& details {
&[open] span {
opacity: 1;
transition: all 0.05s ease;
& code {
color: rgb(225, 225, 225);
opacity: 1;
transition: all 0.025s ease;
}
}
& > summary {
cursor: pointer;
list-style: none;
}
}
}
}
</style>
</head>
<body>
<pre id="log"></pre>
</body>
</html>