diff options
Diffstat (limited to 'index.html')
| -rw-r--r-- | index.html | 26 |
1 files changed, 21 insertions, 5 deletions
@@ -13,6 +13,7 @@ overflow: hidden; } + :root { --ui-border: white; --ui-height: 2.5em; @@ -77,10 +78,18 @@ vertical-align: middle; display: inline-block; height: 2.0em; - margin: 0.5em 0.2em 0.5em 0.5em; - padding: 0; + margin: 0.3em 0.1em 0.3em 0.3em; border: 2px solid var(--ui-border); background-color: #333; + color: white; + } + #ui input[type=color] { + padding: 0; + } + #ui input[type=text] { + width: 3em; + font-size: inherit; + height: 1.5em; } #ui label { margin-right: 0.5em; @@ -152,9 +161,16 @@ void main() { <canvas id="ui-canvas"></canvas> </div> <div id="ui"> - <input type="color" value="#ffffff" name="color-input" id="color-input"> - <label for="color-input">color</label> - <input type="range" value="0.1" min="0" max="1" step="any" name="color-mix-input" id="color-mix-input"> + <!-- + <input type="text" value="1.0" name="red-input" id="red-input"> + <label for="red-input">R</label> + <input type="text" value="1.0" name="green-input" id="green-input"> + <label for="green-input">G</label> + <input type="text" value="1.0" name="blue-input" id="blue-input"> + <label for="blue-input">B</label> + --> + <input type="color" value="#ffffff" name="color-input" id="color-input" aria-label="Color"> + <input type="text" value="0.1" name="color-mix-input" id="color-mix-input"> <label for="color-mix-input">opacity</label> </div> |