diff options
author | Brian Cully <bjc@spork.org> | 2025-03-08 12:05:29 -0500 |
---|---|---|
committer | Brian Cully <bjc@spork.org> | 2025-03-08 12:05:29 -0500 |
commit | daeace070ee8687fceb77ee5e9f7bce507669639 (patch) | |
tree | f30594b634a51e45d4f7888d5e2a7ab763829b18 /index.html | |
parent | 9cab8925d7df982b49fc12ebf47208fed95903b6 (diff) | |
download | chords-daeace070ee8687fceb77ee5e9f7bce507669639.tar.gz chords-daeace070ee8687fceb77ee5e9f7bce507669639.zip |
html: rejigger as radio buttons
Diffstat (limited to 'index.html')
-rw-r--r-- | index.html | 126 |
1 files changed, 64 insertions, 62 deletions
@@ -7,69 +7,71 @@ </head> <body> - <table id='fretboard'> - <thead> - <tr> - <td>root</td> - <td>fret 1</td> - <td>fret 2</td> - <td>fret 3</td> - <td>fret 4</td> - <td>fret 5</td> - </tr> - </thead> + <form id='fretboard'> + <table> + <thead> + <tr> + <td>root</td> + <td>fret 1</td> + <td>fret 2</td> + <td>fret 3</td> + <td>fret 4</td> + <td>fret 5</td> + </tr> + </thead> - <tbody> - <tr id='string1'> - <td>E</td> - <td><input type='checkbox' name='fret1'></td> - <td><input type='checkbox' name='fret2'></td> - <td><input type='checkbox' name='fret3'></td> - <td><input type='checkbox' name='fret4'></td> - <td><input type='checkbox' name='fret5'></td> - </tr> - <tr id='string2'> - <td>A</td> - <td><input type='checkbox' name='fret1'></td> - <td><input type='checkbox' name='fret2'></td> - <td><input type='checkbox' name='fret3'></td> - <td><input type='checkbox' name='fret4'></td> - <td><input type='checkbox' name='fret5'></td> - </tr> - <tr id='string3'> - <td>D</td> - <td><input type='checkbox' name='fret1'></td> - <td><input type='checkbox' name='fret2'></td> - <td><input type='checkbox' name='fret3'></td> - <td><input type='checkbox' name='fret4'></td> - <td><input type='checkbox' name='fret5'></td> - </tr> - <tr id='string4'> - <td>G</td> - <td><input type='checkbox' name='fret1'></td> - <td><input type='checkbox' name='fret2'></td> - <td><input type='checkbox' name='fret3'></td> - <td><input type='checkbox' name='fret4'></td> - <td><input type='checkbox' name='fret5'></td> - </tr> - <tr id='string5'> - <td>B</td> - <td><input type='checkbox' name='fret1'></td> - <td><input type='checkbox' name='fret2'></td> - <td><input type='checkbox' name='fret3'></td> - <td><input type='checkbox' name='fret4'></td> - <td><input type='checkbox' name='fret5'></td> - </tr> - <tr id='string6'> - <td>E</td> - <td><input type='checkbox' name='fret1'></td> - <td><input type='checkbox' name='fret2'></td> - <td><input type='checkbox' name='fret3'></td> - <td><input type='checkbox' name='fret4'></td> - <td><input type='checkbox' name='fret5'></td> - </tr> - </tbody> - </table> + <tbody> + <tr> + <td>E</td> + <td><input type='radio' name='string1' value='fret1'></td> + <td><input type='radio' name='string1' value='fret2'></td> + <td><input type='radio' name='string1' value='fret3'></td> + <td><input type='radio' name='string1' value='fret4'></td> + <td><input type='radio' name='string1' value='fret5'></td> + </tr> + <tr> + <td>A</td> + <td><input type='radio' name='string2' value='fret1'></td> + <td><input type='radio' name='string2' value='fret2'></td> + <td><input type='radio' name='string2' value='fret3'></td> + <td><input type='radio' name='string2' value='fret4'></td> + <td><input type='radio' name='string2' value='fret5'></td> + </tr> + <tr> + <td>D</td> + <td><input type='radio' name='string3' value='fret1'></td> + <td><input type='radio' name='string3' value='fret2'></td> + <td><input type='radio' name='string3' value='fret3'></td> + <td><input type='radio' name='string3' value='fret4'></td> + <td><input type='radio' name='string3' value='fret5'></td> + </tr> + <tr> + <td>G</td> + <td><input type='radio' name='string4' value='fret1'></td> + <td><input type='radio' name='string4' value='fret2'></td> + <td><input type='radio' name='string4' value='fret3'></td> + <td><input type='radio' name='string4' value='fret4'></td> + <td><input type='radio' name='string4' value='fret5'></td> + </tr> + <tr> + <td>B</td> + <td><input type='radio' name='string5' value='fret1'></td> + <td><input type='radio' name='string5' value='fret2'></td> + <td><input type='radio' name='string5' value='fret3'></td> + <td><input type='radio' name='string5' value='fret4'></td> + <td><input type='radio' name='string5' value='fret5'></td> + </tr> + <tr> + <td>E</td> + <td><input type='radio' name='string6' value='fret1'></td> + <td><input type='radio' name='string6' value='fret2'></td> + <td><input type='radio' name='string6' value='fret3'></td> + <td><input type='radio' name='string6' value='fret4'></td> + <td><input type='radio' name='string6' value='fret5'></td> + </tr> + </tbody> + </table> + </form> <script type='module' src='main.mjs'></script> </body> |