Update preview button layout

This commit is contained in:
kaBeech
2023-03-18 16:18:32 -07:00
parent bf9ae5904e
commit b55cb5239f
2 changed files with 26 additions and 6 deletions

View File

@@ -30,12 +30,20 @@
<p>THE FIVE TALL BOXING WIZARDS JUMP QUICKLY!</p> <p>THE FIVE TALL BOXING WIZARDS JUMP QUICKLY!</p>
<p>0123456789.:,;(*!?')</p> <p>0123456789.:,;(*!?')</p>
</div> </div>
<button id="seriousButton">Serious Sans</button> <div id="previewButtons">
<button id="seriousItalicButton">Serious Sans Italic</button> <div class="flex column">
<button id="seriousBoldButton">Serious Sans Bold</button> <button id="seriousButton">Serious Sans</button>
<button id="seriousBoldItalicButton">Serious Sans Bold Italic</button> <button id="seriousBoldButton">Serious Sans Bold</button>
<button id="seriousLightButton">Serious Sans Light</button> <button id="seriousLightButton">Serious Sans Light</button>
<button id="seriousLightItalicButton">Serious Sans Light Italic</button> </div>
<div class="flex column">
<button id="seriousItalicButton">Serious Sans Italic</button>
<button id="seriousBoldItalicButton">Serious Sans Bold Italic</button>
<button id="seriousLightItalicButton">
Serious Sans Light Italic
</button>
</div>
</div>
<br /> <br />
<h2>Downloads</h2> <h2>Downloads</h2>
<div id="downloads"> <div id="downloads">

View File

@@ -36,6 +36,10 @@
display: flex; display: flex;
justify-content: space-evenly; justify-content: space-evenly;
} }
#previewButtons {
display: flex;
justify-content: center;
}
} }
body { body {
@@ -95,6 +99,14 @@ button {
color: rgb(0, 188, 138); color: rgb(0, 188, 138);
} }
.flex {
display: flex;
}
.column {
flex-direction: column;
}
.selected { .selected {
background-color: #464646; background-color: #464646;
color: #d4d4d4; color: #d4d4d4;