ByteDice/ByteDiceWeb
1
0
Fork 0
Code Issues Pull Requests Actions Releases Activity

made even more mobile-friendly

Browse Source
This commit is contained in:
ByteDice
2025-01-26 10:59:03 +01:00
parent 729c773052
commit b592131c78
2 changed files with 22 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
toys/license/index.html
+10 -10
View File
@@ -58,19 +58,19 @@
<h1>Basic</h1><br> <h1>Basic</h1><br>
<form> <form>
<label for="titleInput">Title</label><input type="text" id="titleInput" name="titleInput" value="Boykisser license"><br> <div class="paramContainer"><label for="titleInput">Title</label><input type="text" id="titleInput" name="titleInput" value="Boykisser license"></div>
<label for="authorInput">For/Author</label><input type="text" id="authorInput" name="authorInput" value="Byte Dice"><br> <div class="paramContainer"><label for="authorInput">For/Author</label><input type="text" id="authorInput" name="authorInput" value="Byte Dice"></div>
<label for="createdInput">Issued</label><input type="text" id="createdInput" name="createdInput" value="2025-01-01"><br> <div class="paramContainer"><label for="createdInput">Issued</label><input type="text" id="createdInput" name="createdInput" value="2025-01-01"></div>
<label for="expireInput">Expires</label><input type="text" id="expireInput" name="expireInput" value="NEVER!!!"><br> <div class="paramContainer"><label for="expireInput">Expires</label><input type="text" id="expireInput" name="expireInput" value="NEVER!!!"></div>
<label for="identityInput">Identity</label><input type="text" id="identityInput" name="identityInput" value="any pronouns"><br> <div class="paramContainer"><label for="identityInput">Identity</label><input type="text" id="identityInput" name="identityInput" value="any pronouns"></div>
<label for="sillyInput">Silly</label><div id="sillyNumberValue">03</div><div class="sliderDiv"> <div class="paramContainer"><label for="sillyInput">Silly</label><div id="sillyNumberValue">03</div><div class="sliderDiv">
<input type="range" min="0" max="10" value="3" class="slider" id="sillyInput" name="sillyInput"> <input type="range" min="0" max="10" value="3" class="slider" id="sillyInput" name="sillyInput">
</div><br> </div></div>
<label for="signatureInput">Signature</label><input type="text" id="signatureInput" name="signatureInput" value="Byte Dice"><br> <div class="paramContainer"><label for="signatureInput">Signature</label><input type="text" id="signatureInput" name="signatureInput" value="Byte Dice"></div>
<label for="picInput">Picture</label><select id="picInput" name="picInput"> <div class="paramContainer"><label for="picInput">Picture</label><select id="picInput" name="picInput">
<option value="boykisser" >Boykisser</option> <option value="boykisser" >Boykisser</option>
<option value="bi-kisser" >Bi-kisser</option> <option value="bi-kisser" >Bi-kisser</option>
<option value="Ace-kisser" >Ace-kisser</option> <option value="Ace-kisser" >Ace-kisser</option>
@@ -83,7 +83,7 @@
for="picUpload" id="picUploadLabel"><img src="/assets/icons/upload.svg" id="picUploadIcon" draggable="false"></label for="picUpload" id="picUploadLabel"><img src="/assets/icons/upload.svg" id="picUploadIcon" draggable="false"></label
><input ><input
type="file" id="picUpload" name="picUpload" accept=".png,.jpg,.jpeg,.webp" type="file" id="picUpload" name="picUpload" accept=".png,.jpg,.jpeg,.webp"
><br> ></div>
</form><br> </form><br>
<h1>Extra</h1><br> <h1>Extra</h1><br>
toys/license/options.css
+12 -3
View File
@@ -7,6 +7,7 @@
overflow-y: scroll; overflow-y: scroll;
max-width: min(600px, 100vw); max-width: min(600px, 100vw);
flex-grow: 1; flex-grow: 1;
font-size: calc(4px * var(--pxDensity));
} }
.optionsCredits { .optionsCredits {
margin: 0%; margin: 0%;
@@ -83,8 +84,10 @@ input {
margin: calc(3px * var(--pxDensity)) calc(2px * var(--pxDensity)) 0% 0%; margin: calc(3px * var(--pxDensity)) calc(2px * var(--pxDensity)) 0% 0%;
box-sizing: border-box; box-sizing: border-box;
width: 50%; width: 50%;
height: round(auto, var(--pxDensity)); height: calc(6px * var(--pxDensity));
color: inherit; color: inherit;
align-items: center;
display: flex;
} }
#sillyNumberValue { #sillyNumberValue {
display: inline; display: inline;
@@ -100,7 +103,7 @@ input {
margin: calc(3px * var(--pxDensity)) calc(3px * var(--pxDensity)) 0% 0%; margin: calc(3px * var(--pxDensity)) calc(3px * var(--pxDensity)) 0% 0%;
box-sizing: border-box; box-sizing: border-box;
width: round(auto, var(--pxDensity)); width: round(auto, var(--pxDensity));
height: auto; height: calc(6px * var(--pxDensity));;
aspect-ratio: 1 / 1; aspect-ratio: 1 / 1;
} }
h1 { h1 {
@@ -156,6 +159,7 @@ input[type=file] {
aspect-ratio: 1 / 1; aspect-ratio: 1 / 1;
width: auto; width: auto;
background-image: url(/assets/icons/upload.svg); background-image: url(/assets/icons/upload.svg);
display: inline-flex;
} }
#picUploadIcon { #picUploadIcon {
height: calc(4px * var(--pxDensity)); height: calc(4px * var(--pxDensity));
@@ -180,7 +184,8 @@ form {
box-sizing: border-box; box-sizing: border-box;
width: calc(100% - (4px * var(--pxDensity))); width: calc(100% - (4px * var(--pxDensity)));
height: calc(6px * var(--pxDensity)); height: calc(6px * var(--pxDensity));
display: inline-block; display: inline-flex;
justify-content: center;
} }
.generateButtonIcon { .generateButtonIcon {
height: calc(4px * var(--pxDensity)); height: calc(4px * var(--pxDensity));
@@ -189,3 +194,7 @@ form {
display: inline-block; display: inline-block;
margin: auto 0%; margin: auto 0%;
} }
.paramContainer {
display: flex;
align-items: center;
}