UI tweaks

This commit is contained in:
Zach 2023-08-03 15:23:58 -05:00
parent d3d51176ca
commit 0a5d39dc34
3 changed files with 10 additions and 11 deletions

View File

@ -1,11 +1,10 @@
.flex-container {
display: flex;
flex-direction: row;
flex-direction: column;
flex-wrap: nowrap;
justify-content: normal;
align-items: normal;
align-content: normal;
margin: 20px;
padding: 20px;
}
.flex-items {
@ -19,8 +18,11 @@
flex-basis: auto;
align-self: auto;
order: 0;
width: 300px;
width: 500px;
border: 2px black solid;
font-size: 44px;
text-align: center;
margin: 0 auto 20px;
}
.flex-items:nth-child(2) {
@ -31,7 +33,8 @@
align-self: auto;
order: 0;
border: 2px black solid;
margin-left: 12px;
margin: 0 auto;
width: 500px;
}
#keyboard {
@ -42,6 +45,7 @@
grid-template-rows: repeat(2, 1fr);
grid-row-gap: 12px;
padding: 12px;
margin: 0 auto;
}
.keyboard-key {
@ -81,9 +85,4 @@
#keyboard-key:nth-child(8) {
grid-area: 2 / 4 / 3 / 5;
}
.flex-items:nth-child(1) {
margin: 0 auto;
font-size: 44px;
}

View File

@ -8,7 +8,7 @@
</head>
<body>
<div class="flex-container">
<div class="flex-items" id="letterbox"></div>
<div class="flex-items" id="text-to-type"></div>
<div class="flex-items">
<div id="keyboard">
<div class="keyboard-key"></div>

View File

@ -49,7 +49,7 @@ $(document).ready(async function() {
for (let key in mappings) {
await sleep(1000);
console.log(key);
$('#letterbox').text(key.split('_')[1].toUpperCase())
$('#text-to-type').text(key.split('_')[1].toUpperCase())
artsey_draw(mappings[key]);
}
artsey_reset();