600 West

Fieldset: Tight 

<fieldset role="group" class="Fieldset _tight" style="" aria-label="It’s AMAZING!">
</fieldset>
 
<fieldset
    role="group"
    {{#if disabled}}disabled{{/if}}
    {{#if name}}name="{{name}}"{{/if}}
    class="Fieldset {{modifier}}"
    style="{{style}}"
    {{#if arialabel}}aria-label="{{arialabel}}"{{/if}}
>
    {{> @children}}
</fieldset>
 
{
  "modifier": "_tight",
  "style": null,
  "disabled": null,
  "name": null,
  "children": [],
  "arialabel": "It’s AMAZING!"
}
  • Content: 
    import {ready, each} from '@sproutsocial/sprout-brand/modules/util';

ready(() => {
    each(document.querySelectorAll('fieldset'), (fieldset, i) => {
        const legend = fieldset.querySelector('legend');
        if (legend) {
            legend.id = `fieldsetLegend${i}`;
            legend.tabindex = 1;
            fieldset.setAttribute('aria-labeledby', legend.id);
        }
    });
});
  • URL: /components/raw/fieldset/Fieldset.js
  • Filesystem Path: components/atoms/Fieldset/Fieldset.js
  • Size: 395 Bytes
  • Content: 
    .Fieldset {
    border: none;

    &._tight {
        padding: 0;
        margin: 1rem 0 0;

        legend,
        label {
            &:not(.Rating) {
                margin-top: .5rem;
            }
        }
    }
}
  • URL: /components/raw/fieldset/Fieldset.scss
  • Filesystem Path: components/atoms/Fieldset/Fieldset.scss
  • Size: 221 Bytes

There are no notes for this item.