mercuryworkshop-mirror/scramjet
1
0
Fork 0
mirror of https://github.com/MercuryWorkshop/scramjet.git synced 2025-05-13 14:30:02 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

update dev server ui again

Browse source
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
Download patch file Download diff file Expand all files Collapse all files

4
static/index.html
View file

@ -6,13 +6,15 @@
<title>Document</title>
<link rel="prefetch" href="./scramjet.worker.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>
body, html, #app {
font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
width:100vw;
height:100vh;
margin: 0;
padding: 0;
background-color:#191724;
background-color:#121212;
overflow: hidden;
}
</style>

52
static/ui.js
View file

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