2023-01-04 07:23:46 +01:00
|
|
|
.icon-link {
|
|
|
|
display: inline-flex;
|
2023-03-02 19:32:43 +01:00
|
|
|
gap: $icon-link-gap;
|
2023-01-04 07:23:46 +01:00
|
|
|
align-items: center;
|
|
|
|
text-decoration-color: rgba(var(--#{$prefix}link-color-rgb), var(--#{$prefix}link-opacity, .5));
|
2023-03-02 19:32:43 +01:00
|
|
|
text-underline-offset: $icon-link-underline-offset;
|
2023-01-04 07:23:46 +01:00
|
|
|
backface-visibility: hidden;
|
|
|
|
|
|
|
|
> .bi {
|
|
|
|
flex-shrink: 0;
|
2023-03-02 19:32:43 +01:00
|
|
|
width: $icon-link-icon-size;
|
|
|
|
height: $icon-link-icon-size;
|
|
|
|
fill: currentcolor;
|
|
|
|
@include transition($icon-link-icon-transition);
|
2023-01-04 07:23:46 +01:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.icon-link-hover {
|
|
|
|
&:hover,
|
|
|
|
&:focus-visible {
|
|
|
|
> .bi {
|
2023-03-02 19:32:43 +01:00
|
|
|
transform: var(--#{$prefix}icon-link-transform, $icon-link-icon-transform);
|
2023-01-04 07:23:46 +01:00
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|