* add the svg icon as a partial so we can include it easily
* add the icon to the homepage
* drop .bd-booticon for svgs here
* rip out the import for .bd-booticon sass file
* Delete _booticon.scss
* indentation
* Update bootstrap-icon.html
* remove those
This makes them keyboard-accessible. For mouse users, the only change
here is that the focus outline will remain on the button once clicked
(in future, this can be solved with :focus-ring, but for now this would
require a polyfill). the tooltip is explicitly hidden on `mouseleave`,
so even though the `<button>` retains focus after clicking, the tooltip
won't stay visible once mouse user moves away.
the mouse hover styles have explicitly not been make to also apply to
:focus, so as to minimise the visual impact for
mouse users (though the tooltip remains visible)
- but due to the default outline and the custom tooltip, it
should be fairly clear when keyboard users set focus to a copy button
too.
* Drop -x and -y as they're all the same
- Also move -width to elsewhere in the vars because it makes no sense by spacers.
- Update values of -x and -y across main Sass and docs Sass.
* Update docs to reflect changes; link to spacing utils from options page
On small screens (< 576px), all documentation pages containing
`.bd-example` styled tags, show the horizontal scrollbar because of a
wrong horizontal margin property.
This PR sets the horizontal margin on gutter width basis instead of rem.
Double up :hover styles to also apply on :focus (particularly the
masthead button needs this, as otherwise it gives no visible indication
of being focused)
