eric/the-monospace-web-pandoc
1
0
Fork 0
mirror of https://github.com/frainfreeze/the-monospace-web-pandoc synced 2026-02-27 16:51:57 -08:00
Code Issues Packages Projects Releases Wiki Activity

make radio buttons round

Browse Source
This commit is contained in:
Oskar Wickström
2025-01-25 13:20:07 +01:00
parent 30326d1be4
commit d3dc1bf018
2 changed files with 9 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
index.css
View File

@@ -327,6 +327,10 @@ input[type=radio]:checked:before {
height: calc(var(--line-height) / 2); height: calc(var(--line-height) / 2);
background: var(--text-color); background: var(--text-color);
} }
input[type=radio],
input[type=radio]:before {
border-radius: 100%;
}
button:focus, input:focus { button:focus, input:focus {
--border-thickness: 3px; --border-thickness: 3px;

5
index.html
View File

@@ -203,6 +203,11 @@ Save
name <input type="text" placeholder="Text goes here..." /></label> name <input type="text" placeholder="Text goes here..." /></label>
<label>Age <input type="text" value="30" /></label> <label>Age <input type="text" value="30" /></label>
</form> </form>
<form class="grid">
<label><input name="radio" type="radio" /> One</label>
<label><input name="radio" type="radio" /> Two</label>
<label><input name="radio" type="radio" /> Three</label>
</form>
<h2 id="grids">Grids</h2> <h2 id="grids">Grids</h2>
<p>Add the <code>grid</code> class to a container to divide up the <p>Add the <code>grid</code> class to a container to divide up the
horizontal space evenly for the cells. Note that it maintains the horizontal space evenly for the cells. Note that it maintains the