Skip to content

Commit 22871b5

Browse files
davepagurekdavepagurek
committed
Use fieldset and legend tags
1 parent 9139d02 commit 22871b5

File tree

2 files changed

+27
-24
lines changed

2 files changed

+27
-24
lines changed

‎client/modules/IDE/components/Preferences/index.jsx‎

Lines changed: 24 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -171,7 +171,7 @@ export default function Preferences() {
171171
<TabPanel>
172172
<div className="preference">
173173
<h4 className="preference__title">{t('Preferences.Theme')}</h4>
174-
<div className="preference__options">
174+
<fieldset className="preference__options">
175175
<input
176176
type="radio"
177177
onChange={() => dispatch(setTheme('light'))}
@@ -214,7 +214,7 @@ export default function Preferences() {
214214
>
215215
{t('Preferences.HighContrastTheme')}
216216
</label>
217-
</div>
217+
</fieldset>
218218
</div>
219219
<div className="preference">
220220
<h4 className="preference__title">{t('Preferences.TextSize')}</h4>
@@ -266,7 +266,7 @@ export default function Preferences() {
266266
</div>
267267
<div className="preference">
268268
<h4 className="preference__title">{t('Preferences.Autosave')}</h4>
269-
<div className="preference__options">
269+
<fieldset className="preference__options">
270270
<input
271271
type="radio"
272272
onChange={() => dispatch(setAutosave(true))}
@@ -293,13 +293,13 @@ export default function Preferences() {
293293
<label htmlFor="autosave-off" className="preference__option">
294294
{t('Preferences.Off')}
295295
</label>
296-
</div>
296+
</fieldset>
297297
</div>
298298
<div className="preference">
299299
<h4 className="preference__title">
300300
{t('Preferences.AutocloseBracketsQuotes')}
301301
</h4>
302-
<div className="preference__options">
302+
<fieldset className="preference__options">
303303
<input
304304
type="radio"
305305
onChange={() => dispatch(setAutocloseBracketsQuotes(true))}
@@ -332,13 +332,13 @@ export default function Preferences() {
332332
>
333333
{t('Preferences.Off')}
334334
</label>
335-
</div>
335+
</fieldset>
336336
</div>
337337
<div className="preference">
338338
<h4 className="preference__title">
339339
{t('Preferences.AutocompleteHinter')}
340340
</h4>
341-
<div className="preference__options">
341+
<fieldset className="preference__options">
342342
<input
343343
type="radio"
344344
onChange={() => dispatch(setAutocompleteHinter(true))}
@@ -371,11 +371,11 @@ export default function Preferences() {
371371
>
372372
{t('Preferences.Off')}
373373
</label>
374-
</div>
374+
</fieldset>
375375
</div>
376376
<div className="preference">
377377
<h4 className="preference__title">{t('Preferences.WordWrap')}</h4>
378-
<div className="preference__options">
378+
<fieldset className="preference__options">
379379
<input
380380
type="radio"
381381
onChange={() => dispatch(setLinewrap(true))}
@@ -402,15 +402,15 @@ export default function Preferences() {
402402
<label htmlFor="linewrap-off" className="preference__option">
403403
{t('Preferences.Off')}
404404
</label>
405-
</div>
405+
</fieldset>
406406
</div>
407407
</TabPanel>
408408
<TabPanel>
409409
<div className="preference">
410410
<h4 className="preference__title">
411411
{t('Preferences.LineNumbers')}
412412
</h4>
413-
<div className="preference__options">
413+
<fieldset className="preference__options">
414414
<input
415415
type="radio"
416416
onChange={() => dispatch(setLineNumbers(true))}
@@ -437,13 +437,13 @@ export default function Preferences() {
437437
<label htmlFor="line-numbers-off" className="preference__option">
438438
{t('Preferences.Off')}
439439
</label>
440-
</div>
440+
</fieldset>
441441
</div>
442442
<div className="preference">
443443
<h4 className="preference__title">
444444
{t('Preferences.LintWarningSound')}
445445
</h4>
446-
<div className="preference__options">
446+
<fieldset className="preference__options">
447447
<input
448448
type="radio"
449449
onChange={() => dispatch(setLintWarning(true))}
@@ -477,7 +477,7 @@ export default function Preferences() {
477477
>
478478
{t('Preferences.PreviewSound')}
479479
</button>
480-
</div>
480+
</fieldset>
481481
</div>
482482
<div className="preference">
483483
<h4 className="preference__title">
@@ -487,7 +487,7 @@ export default function Preferences() {
487487
{t('Preferences.UsedScreenReader')}
488488
</h6>
489489

490-
<div className="preference__options">
490+
<fieldset className="preference__options">
491491
<input
492492
type="checkbox"
493493
onChange={(event) => {
@@ -522,7 +522,7 @@ export default function Preferences() {
522522
>
523523
{t('Preferences.TableText')}
524524
</label>
525-
</div>
525+
</fieldset>
526526
</div>
527527
</TabPanel>
528528
<TabPanel>
@@ -567,7 +567,7 @@ export default function Preferences() {
567567
<h4 className="preference__title">
568568
{t('Preferences.SoundAddon')}
569569
</h4>
570-
<div className="preference__options">
570+
<fieldset className="preference__options">
571571
<input
572572
type="radio"
573573
onChange={() => {
@@ -618,17 +618,17 @@ export default function Preferences() {
618618
{t('Preferences.Off')}
619619
</label>
620620
{versionInfo.lastP5SoundURL && (
621-
<span className="preference__warning">
621+
<legend className="preference__warning">
622622
{t('Preferences.UndoSoundVersion')}
623-
</span>
623+
</legend>
624624
)}
625-
</div>
625+
</fieldset>
626626
</div>
627627
<div className="preference">
628628
<h4 className="preference__title">
629629
{t('Preferences.PreloadAddon')}
630630
</h4>
631-
<div className="preference__options">
631+
<fieldset className="preference__options">
632632
<input
633633
type="radio"
634634
onChange={() =>
@@ -665,13 +665,13 @@ export default function Preferences() {
665665
>
666666
{t('Preferences.Off')}
667667
</label>
668-
</div>
668+
</fieldset>
669669
</div>
670670
<div className="preference">
671671
<h4 className="preference__title">
672672
{t('Preferences.ShapesAddon')}
673673
</h4>
674-
<div className="preference__options">
674+
<fieldset className="preference__options">
675675
<input
676676
type="radio"
677677
onChange={() =>
@@ -708,7 +708,7 @@ export default function Preferences() {
708708
>
709709
{t('Preferences.Off')}
710710
</label>
711-
</div>
711+
</fieldset>
712712
</div>
713713
</>
714714
)}

‎client/styles/components/_preferences.scss‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -149,6 +149,7 @@
149149

150150
.preference__warning {
151151
@include themify() {
152+
display: contents;
152153
font-weight: bold;
153154
color: getThemifyVariable("preferences-warning-color");
154155
}
@@ -189,6 +190,8 @@ input[type="number"]::-webkit-outer-spin-button {
189190
}
190191

191192
.preference__options {
193+
border: 0;
194+
padding: 0;
192195
display: flex;
193196
justify-content: center;
194197
align-items: center;

0 commit comments

Comments
 (0)