update dev server ui again

This commit is contained in:
Percs 2024-05-07 17:50:46 -05:00
parent 9d4f5d9abd
commit 8c58108727
2 changed files with 60 additions and 46 deletions

View file

@ -6,13 +6,15 @@
<title>Document</title> <title>Document</title>
<link rel="prefetch" href="./scramjet.worker.js"> <link rel="prefetch" href="./scramjet.worker.js">
<link rel="prefetch" href="./scramjet.bundle.js"> <link rel="prefetch" href="./scramjet.bundle.js">
<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&amp;family=Inter+Tight:ital,wght@0,100..900;1,100..900&amp;family=Inter:wght@100..900&amp;display=swap&amp;" rel="stylesheet">
<style> <style>
body, html, #app { body, html, #app {
font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
width:100vw; width:100vw;
height:100vh; height:100vh;
margin: 0; margin: 0;
padding: 0; padding: 0;
background-color:#191724; background-color:#121212;
overflow: hidden; overflow: hidden;
} }
</style> </style>

View file

@ -9,59 +9,71 @@ const store = $store({
wispurl: "wss://wisp.mercurywork.shop/", wispurl: "wss://wisp.mercurywork.shop/",
bareurl: (location.protocol === "https:" ? "https" : "http") + "://" + location.host + "/bare/", bareurl: (location.protocol === "https:" ? "https" : "http") + "://" + location.host + "/bare/",
}, { ident: "settings", backing: "localstorage", autosave: "auto" }); }, { ident: "settings", backing: "localstorage", autosave: "auto" });
BareMux.SetTransport("BareMod.BareClient", (location.protocol === "https:" ? "https" : "http") + "://" + location.host + "/bare/")
function App() { function App() {
this.urlencoded = ""; this.urlencoded = "";
this.css = ` this.css = `
width: 100%; width: 100%;
height:100%; height: 100%;
color: #e0def4; color: #e0def4;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
flex-direction:column; flex-direction: column;
h1 { input,
font-family: "Inter"; button {
text-align: center; font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont,
} sans-serif;
iframe { }
border: 8px solid #11528f; h1 {
background-color: #11528f; font-family: "Inter Tight", "Inter", system-ui, -apple-system, BlinkMacSystemFont,
border-radius: 25px; sans-serif;
margin: 2em; margin-bottom: 0;
width: calc(100% - 4em); }
height: calc(100% - 8em); iframe {
} border: 4px solid #313131;
background-color: #121212;
input.bar { border-radius: 1rem;
border: none; margin: 2em;
outline: none; margin-top: 0.5em;
color: #191724; width: calc(100% - 4em);
height:2em; height: calc(100% - 8em);
width:60%; }
text-align:center;
border-radius: 5px; input.bar {
background-color: #eb6f92; border: none;
} outline: none;
.cfg * { color: #fff;
margin: 2px; height: 2em;
} width: 60%;
.buttons button { text-align: center;
border: 4px solid #11528f; border-radius: 0.75em;
background-color: #eb6f92; background-color: #313131;
color: #191724; padding: 0.45em;
} }
.cfg input { .cfg * {
border: 3px solid #3d84a8; margin: 2px;
background-color: #eb6f92; }
outline: none; .buttons button {
} border: 2px solid #4c8bf5;
background-color: #313131;
border-radius: 0.75em;
color: #fff;
padding: 0.45em;
}
.cfg input {
border: none;
background-color: #313131;
border-radius: 0.75em;
color: #fff;
outline: none;
padding: 0.45em;
}
`; `;
return html` return html`
<div> <div>
<h1>Percury Unblocker</h1> <h1>Percury Unblocker</h1>
surf the unblocked and mostly buggy web <p>surf the unblocked and mostly buggy web</p>
<div class=${[flex, col, "cfg"]}> <div class=${[flex, col, "cfg"]}>
<input bind:value=${use(store.wispurl)}></input> <input bind:value=${use(store.wispurl)}></input>