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,7 +9,6 @@ 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 = `
@ -20,15 +19,22 @@ function App() {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
flex-direction: column; flex-direction: column;
input,
button {
font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont,
sans-serif;
}
h1 { h1 {
font-family: "Inter"; font-family: "Inter Tight", "Inter", system-ui, -apple-system, BlinkMacSystemFont,
text-align: center; sans-serif;
margin-bottom: 0;
} }
iframe { iframe {
border: 8px solid #11528f; border: 4px solid #313131;
background-color: #11528f; background-color: #121212;
border-radius: 25px; border-radius: 1rem;
margin: 2em; margin: 2em;
margin-top: 0.5em;
width: calc(100% - 4em); width: calc(100% - 4em);
height: calc(100% - 8em); height: calc(100% - 8em);
} }
@ -36,32 +42,38 @@ function App() {
input.bar { input.bar {
border: none; border: none;
outline: none; outline: none;
color: #191724; color: #fff;
height: 2em; height: 2em;
width: 60%; width: 60%;
text-align: center; text-align: center;
border-radius: 5px; border-radius: 0.75em;
background-color: #eb6f92; background-color: #313131;
padding: 0.45em;
} }
.cfg * { .cfg * {
margin: 2px; margin: 2px;
} }
.buttons button { .buttons button {
border: 4px solid #11528f; border: 2px solid #4c8bf5;
background-color: #eb6f92; background-color: #313131;
color: #191724; border-radius: 0.75em;
color: #fff;
padding: 0.45em;
} }
.cfg input { .cfg input {
border: 3px solid #3d84a8; border: none;
background-color: #eb6f92; background-color: #313131;
border-radius: 0.75em;
color: #fff;
outline: none; 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>