Sha256: 3b34bb36ec72309211c53d28fba693661807cf816f5bec106f50e52748ab1010
Contents?: true
Size: 1.12 KB
Versions: 7
Compression:
Stored size: 1.12 KB
Contents
@use '../0-tools/vars' as *;
// Rules for styling links
// =========================================
.links__darker-link {
color: $darker-link;
}
.links__phone--span { // Phone # link in the navigation on landing pages like info.kcc.edu
color: $white;
position: relative; // Needed to make pseudo-element underlining the right width
text-decoration: none;
&:visited {
color: $white;
}
&:hover,
&:focus {
color: $white; // Remove the Bootstrap primary blue colour on a:hover
text-decoration: none; // Prevent underlining
}
}
.links__phone--span:focus:after,
.links__phone--span:hover:after { // mouse-hover effect for phone # in landing pages
opacity: 1; // Make the underline fade in
transform: translateY(-.2em); // Move the underline up (along the Y-axis) as it fades-in
}
.links__phone--span:after { // Pseudo-element to unerline the phone # on mouse-hover
background-color: $color-orange;
bottom: - .325rem;
content: "";
display: block;
height: .1875rem;
opacity: 0;
position: absolute;
transition: opacity .3s,transform .3s; // mouse-hover effect
width: 100%;
}
Version data entries
7 entries across 7 versions & 1 rubygems