boltdesignsystem / bolt

The Bolt Design System provides robust Twig and Web Component-powered UI components, reusable visual styles, and powerful tooling to help developers, designers, and content authors build, maintain, and scale best of class digital experiences.
https://boltdesignsystem.com
MIT License
292 stars 45 forks source link

Unsanitized buttons #149

Closed charginghawk closed 5 years ago

charginghawk commented 6 years ago

In Pegakit, we used the sanitize.css library in our generics to set a clean default for buttons. Since we don't use that library in Bolt, our buttons aren't looking so clean out of the box.

Before: screen shot 2017-10-10 at 1 10 29 pm screen shot 2017-10-10 at 1 10 45 pm

After: screen shot 2017-10-10 at 1 10 25 pm

mikemai2awesome commented 6 years ago

Is this built with c-bolt-button? The clean reset is currently applied to the button component. @charginghawk

charginghawk commented 6 years ago

@mikemai2awesome Niet, it's based off the markup @sghoweri used for the Academy search form adapted to pega.com's new nav. So, for example, pulled directly from pega.com:

<button class="c-global-search__submit" type="submit">
    <span class="u-visuallyhidden">Search Pegasystems</span>
    <svg class="c-global-search__search-icon o-icon" viewBox="0 0 24 24">
        <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#search"></use>
    </svg>
</button>
sghoweri commented 5 years ago

stale issue from a year ago for Bolt v0.x. closing out since this should have already been addressed a while ago but please re-open if this is still indeed an issue.