interface: bigger now

This commit is contained in:
root 2025-04-27 10:11:26 +00:00
parent 72a24ce131
commit 96a5876297
2 changed files with 14 additions and 11 deletions

View file

@ -7,7 +7,8 @@
<script src="lib/p5.js"></script>
<style>
:root {
--aside-size: 218px;
--aside-width: 220px;
--aside-height: 270px;
}
.js {
display: none;
@ -24,7 +25,7 @@ body {
background-color: #1b1b1b;
overflow: hidden;
display: grid;
grid-template-columns: var(--aside-size) auto;
grid-template-columns: var(--aside-width) auto;
color: white;
}
aside {
@ -56,7 +57,7 @@ aside > container > div {
@media screen and (orientation:portrait) {
body {
grid-template-columns: none;
grid-template-rows: auto var(--aside-size);
grid-template-rows: auto var(--aside-height);
}
aside {
order: 1;
@ -83,8 +84,7 @@ aside > container > div {
<div>
<button onclick="toggle_skeleton()">Skeleton</button>
<input id="checkbox-skeleton" type="checkbox" disabled>
</div>
<div>
<div></div>
<button onclick="toggle_polytope()">Polytope</button>
<input id="checkbox-polytope" type="checkbox" disabled>
</div>
@ -104,12 +104,12 @@ aside > container > div {
<button onclick="make_particles(7)">7</button>
<button onclick="make_particles(8)">8</button>
<button onclick="make_particles(9)">9</button>
<div>
</div>
<div style="display:grid;grid-template-columns:1fr auto;width:100%;">
<input id="input-particles" type="number" min="0" max="360"
onkeypress="if (event.key === 'Enter') button_particles.click()">
<button id="button-particles" onclick="make_particles(min(360, max(0, input_particles.valueAsNumber)))">Create</button>
</div>
</div>
</container>
</aside>
<main>