mirror of
https://github.com/twbs/bootstrap.git
synced 2025-08-30 16:50:00 +02:00
Add new link utilities, icon link helper, and update colored link helpers (#37762)
* Add new link utilities, update colored link helpers * Remove commented out code * Fixes * Remove examples changes * Fixes and copy * Fix icon-link instances on homepage * Bump bundlewatch * Fix node-sass issue for rgba() function bug * More bundlewatch * One more time after merge * Add callout for a11y * Hover and focus-visible * Add a11y callouts * Remove duplicate for now * More code review feedback
This commit is contained in:
24
scss/helpers/_icon-link.scss
Normal file
24
scss/helpers/_icon-link.scss
Normal file
@@ -0,0 +1,24 @@
|
||||
.icon-link {
|
||||
display: inline-flex;
|
||||
gap: .375rem;
|
||||
align-items: center;
|
||||
text-decoration-color: rgba(var(--#{$prefix}link-color-rgb), var(--#{$prefix}link-opacity, .5));
|
||||
text-underline-offset: .5rem;
|
||||
backface-visibility: hidden;
|
||||
|
||||
> .bi {
|
||||
flex-shrink: 0;
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
@include transition(.2s ease-in-out transform);
|
||||
}
|
||||
}
|
||||
|
||||
.icon-link-hover {
|
||||
&:hover,
|
||||
&:focus-visible {
|
||||
> .bi {
|
||||
transform: var(--#{$prefix}icon-link-transform, translate3d(.25em, 0, 0));
|
||||
}
|
||||
}
|
||||
}
|
Reference in New Issue
Block a user