openOutpaint/pages/configuration.html

91 lines
2.2 KiB
HTML
Raw Normal View History

<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8" />
<title>openOutpaint 🐠</title>
<!-- CSS Variables -->
<link href="../css/colors.css?v=3f0d162" rel="stylesheet" />
<link href="../css/icons.css?v=665c8c1" rel="stylesheet" />
<link href="../css/index.css?v=6538a62" rel="stylesheet" />
<link href="../css/layers.css?v=104d682" rel="stylesheet" />
<link href="../css/ui/generic.css?v=90f4b50" rel="stylesheet" />
<link href="../css/ui/history.css?v=ce2a69a" rel="stylesheet" />
<link href="../css/ui/layers.css?v=71d2325" rel="stylesheet" />
<link href="../css/ui/toolbar.css?v=dfdf183" rel="stylesheet" />
<!-- Tool Specific CSS -->
<link href="../css/ui/tool/dream.css?v=eff86a8" rel="stylesheet" />
<link href="../css/ui/tool/stamp.css?v=85def70" rel="stylesheet" />
<link href="../css/ui/tool/colorbrush.css?v=5e5bb2f" rel="stylesheet" />
<link rel="icon" type="image/x-icon" href="favicon.ico" />
<style>
body {
color: var(--c-text);
margin: 0;
padding: 15px;
}
label {
display: flex;
}
input.canvas-size-input {
-webkit-appearance: textfield;
-moz-appearance: textfield;
width: 50px;
}
</style>
</head>
<body>
<label style="display: flex">
Canvas Size:
<input
id="canvas-width"
class="canvas-size-input"
type="number"
step="1" />
x
<input
id="canvas-height"
class="canvas-size-input"
type="number"
step="1" />
</label>
<script>
const canvasWidth = document.getElementById("canvas-width");
const canvasHeight = document.getElementById("canvas-height");
function writeToLocalStorage() {
localStorage.setItem(
"openoutpaint/settings.canvas-width",
canvasWidth.value
);
localStorage.setItem(
"openoutpaint/settings.canvas-height",
canvasHeight.value
);
}
// Loads values from local storage
canvasWidth.value =
localStorage.getItem("openoutpaint/settings.canvas-width") || 2048;
canvasHeight.value =
localStorage.getItem("openoutpaint/settings.canvas-height") || 2048;
writeToLocalStorage();
canvasWidth.onchange = writeToLocalStorage;
canvasHeight.onchange = writeToLocalStorage;
</script>
</body>
</html>