Merge branch 'main' of https://github.com/MeowcaTheoRange/HexFlagGen
This commit is contained in:
commit
57505591b0
1 changed files with 16 additions and 19 deletions
35
index.html
35
index.html
|
@ -6,6 +6,7 @@
|
||||||
<title>HexFlagGen</title>
|
<title>HexFlagGen</title>
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||||
<link rel="stylesheet" href="https://cdn.abtmtr.link/cdn/css/normal.css" />
|
<link rel="stylesheet" href="https://cdn.abtmtr.link/cdn/css/normal.css" />
|
||||||
|
<link rel="stylesheet" href="https://cdn.abtmtr.link/cdn/css/normal.css" />
|
||||||
<style>
|
<style>
|
||||||
@import url("https://fonts.googleapis.com/css2?family=Lexend+Deca:wght@100;200;300;400;500;600;700;800;900&display=swap");
|
@import url("https://fonts.googleapis.com/css2?family=Lexend+Deca:wght@100;200;300;400;500;600;700;800;900&display=swap");
|
||||||
|
|
||||||
|
@ -21,7 +22,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
* {
|
* {
|
||||||
transition: background-color 0.125s, color 0.125s;
|
transition: background-color 0.125s, color 0.125s, opacity 0.125s;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
|
@ -48,30 +49,29 @@
|
||||||
Base style
|
Base style
|
||||||
</label>
|
</label>
|
||||||
<p>by <a href="https://abtmtr.link/">MeowcaTheoRange</a></p>
|
<p>by <a href="https://abtmtr.link/">MeowcaTheoRange</a></p>
|
||||||
<p>
|
<p>Make a Scott The Woz thumbnail out of any Steam game.</p>
|
||||||
Welcome, here you can make a flag out of the hexadecimal bytes of your
|
|
||||||
choice!
|
|
||||||
</p>
|
|
||||||
</section>
|
</section>
|
||||||
<hr />
|
<hr />
|
||||||
<section>
|
<section>
|
||||||
<label for="data">Generator string</label><br />
|
|
||||||
<input
|
<input
|
||||||
type="text"
|
type="number"
|
||||||
id="data"
|
id="steam_game"
|
||||||
value="5BCEFAF5A9B8FFFFFFF5A9B85BCEFABA53"
|
style="width: 8ch"
|
||||||
style="width: 100%"
|
min="10"
|
||||||
/><br />
|
value="620"
|
||||||
|
/>
|
||||||
|
<label for="steam_game">Steam Game ID</label><br />
|
||||||
<button id="generateButton">Generate!</button>
|
<button id="generateButton">Generate!</button>
|
||||||
</section>
|
</section>
|
||||||
<section>
|
<section>
|
||||||
|
<label for="scott_index">Extras</label><br />
|
||||||
<input
|
<input
|
||||||
type="number"
|
type="number"
|
||||||
id="size_width"
|
id="scott_index"
|
||||||
style="width: 8ch"
|
style="width: 8ch"
|
||||||
min="0"
|
min="0"
|
||||||
max="3000"
|
max="9"
|
||||||
value="300"
|
value="0"
|
||||||
/>
|
/>
|
||||||
<label for="size_width">Width (px)</label><br />
|
<label for="size_width">Width (px)</label><br />
|
||||||
<input
|
<input
|
||||||
|
@ -87,14 +87,11 @@
|
||||||
<option value="vert" selected>Vertical</option>
|
<option value="vert" selected>Vertical</option>
|
||||||
<option value="horiz">Horizontal</option>
|
<option value="horiz">Horizontal</option>
|
||||||
</select>
|
</select>
|
||||||
<label for="flag_type">Flag type</label>
|
<label for="align">Background Alignment</label>
|
||||||
</section>
|
</section>
|
||||||
<hr />
|
<hr />
|
||||||
<section>
|
<section>
|
||||||
<p>
|
<canvas id="canvas" width="1280" height="720"></canvas>
|
||||||
Hex: <code><span id="hexdisplay">...</span></code>
|
|
||||||
</p>
|
|
||||||
<canvas id="canvas" width="300" height="200"></canvas>
|
|
||||||
</section>
|
</section>
|
||||||
<script src="scripts/index.js"></script>
|
<script src="scripts/index.js"></script>
|
||||||
</body>
|
</body>
|
||||||
|
|
Loading…
Reference in a new issue