reorganizing buttons

This commit is contained in:
ReznoRMichael 2021-01-23 15:40:26 +01:00
parent e6bd87a866
commit b216b1c5a9
2 changed files with 27 additions and 11 deletions

View file

@ -141,7 +141,7 @@ textarea::placeholder {
}
input[type="file"] {
max-width: 14rem;
max-width: 500px;
margin: 0.5rem;
}
@ -154,7 +154,7 @@ input[type="file"] {
.buttons {
display: flex;
flex-direction: row;
align-items: flex-end;
align-items: center;
justify-content: space-between;
}
@ -164,17 +164,14 @@ input[type="file"] {
}
.checkboxes {
margin-top: 1rem;
margin-bottom: 0.4rem;
margin-left: -1rem;
padding-left: 1.5rem;
margin-top: 0rem;
}
.button {
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
width: max-content;
font-size: 1rem;
font-weight: 500;
font-family: 'Heebo', sans-serif;
@ -187,7 +184,7 @@ input[type="file"] {
}
.button:first-child {
margin-left: 0;
margin-left: 0.25rem;
}
.button:hover {
@ -201,6 +198,11 @@ input[type="file"] {
outline-offset: -2px;
}
.centered {
flex-direction: column;
align-items: center;
}
@media screen and (max-width: 400px) {
.buttons {
flex-direction: column;
@ -210,6 +212,13 @@ input[type="file"] {
align-items: center;
justify-content: center;
}
.centered {
flex-direction: row;
align-items: flex-start;
}
.checkboxes {
margin-top: 0.8rem;
}
}
p {

View file

@ -38,19 +38,26 @@
<p class="smalltext">
Please check the <a href="https://steamcommunity.com/sharedfiles/filedetails/?id=2209910193" target="_blank">[ Official Steam Guide ]</a> on how to use this Tool.<br>
Shortcuts: <a href="https://bloodorca.github.io/hollow/" target="_blank">[ Decode ]</a> your Hollow Knight user*.dat <a href="https://store.steampowered.com/account/remotestorageapp/?appid=367520" target="_blank">[ Save File ]</a><br>
Choose a Hollow Knight user*.dat save OR <a href="https://bloodorca.github.io/hollow/" target="_blank">[ Decode ]</a> it from your <a href="https://store.steampowered.com/account/remotestorageapp/?appid=367520" target="_blank">[ Steam Cloud ]</a><br>
<a href="https://pastebin.com/raw/shfZ4Vqs" target="_blank">[ Decoded 5% Save Example ]</a><br>
<a href="https://www.paypal.me/ReznoRMichael" target="_blank">Support Tool development</a> 🉑 <a href="https://www.youtube.com/c/MichaelReznoR" target="_blank">Youtube</a> 🉑 <a href="https://github.com/ReznoRMichael/hollow-knight-completion-check" target="_blank">Source Code</a>
</p>
<div>
<textarea name="save-area" id="save-area" rows="6" spellcheck="false" placeholder="Paste (Ctrl + V) your decoded save here..." autofocus></textarea>
<div class="buttons centered">
<div class="input-buttons">
<input id="save-area-file" class="" type="file" name="file" accept=".dat,.bak*" onchange="LoadSaveFile(this)">
</div>
</div>
<textarea name="save-area" id="save-area" rows="6" spellcheck="false" placeholder="Choose a user*.dat save file OR paste (Ctrl + V) your decoded save here manually..." autofocus></textarea>
<div class="buttons">
<div class="input-buttons">
<!-- <button id="save-area-file" class="button" onclick="">Load Save</button> -->
<input id="save-area-file" class="" type="file" name="file" accept=".dat,.bak*" onchange="LoadSaveFile(this)">
<!-- <input id="save-area-file" class="" type="file" name="file" accept=".dat,.bak*" onchange="LoadSaveFile(this)"> -->
<button id="save-area-read" class="button" onclick="HKReadTextArea();">Analyze Text</button>
</div>