project-client/static/first-launch.html

126 lines
2.9 KiB
HTML
Raw Normal View History

2023-06-21 12:39:41 +00:00
<head>
<style>
:root {
--bg: white;
--fg: black;
--fg-semi-trans: rgb(0 0 0 / 0.2);
}
@media (prefers-color-scheme: dark) {
:root {
--bg: hsl(223 6.7% 20.6%);
--fg: white;
--fg-semi-trans: rgb(255 255 255 / 0.2);
}
}
body {
height: 100vh;
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell,
"Open Sans", "Helvetica Neue", sans-serif;
margin: 0;
padding: 1.5em;
padding-bottom: 1em;
border: 1px solid var(--fg-semi-trans);
border-top: none;
display: flex;
flex-direction: column;
box-sizing: border-box;
}
body,
select {
background: var(--bg);
color: var(--fg);
}
select {
padding: 0.3em;
margin: -0.3em;
border-radius: 6px;
}
h1 {
margin: 0.4em 0 0;
}
p {
margin: 1em 0 2em;
}
form {
display: grid;
gap: 0.5em;
margin: 0;
}
label {
display: flex;
justify-content: space-between;
}
#buttons {
display: flex;
justify-content: end;
gap: 0.5em;
margin-top: auto;
}
button {
padding: 0.6em;
background: red;
color: white;
border-radius: 6px;
border: none;
cursor: pointer;
}
#submit {
background: green;
}
</style>
</head>
<body>
<h1>Welcome to Vencord Desktop</h1>
<p>Let's customise your experience!</p>
<form>
<label>
Discord Branch
<select name="discordBranch">
<option value="stable">stable</option>
<option value="canary">canary</option>
<option value="ptb">ptb</option>
</select>
</label>
<label>
Import Settings from existing Vencord install (if found)
<input type="checkbox" name="importSettings" checked />
</label>
<label>
Minimise to Tray when closing
<input type="checkbox" name="minimizeToTray" checked />
</label>
</form>
<div id="buttons">
<button id="cancel">Cancel</button>
<button id="submit">Submit</button>
</div>
</body>
<script>
cancel.onclick = () => console.info("cancel");
submit.onclick = e => {
const form = document.querySelector("form");
const formData = new FormData(form);
const data = Object.fromEntries(formData.entries());
console.info("form:" + JSON.stringify(data));
e.preventDefault();
};
</script>