overleaf-cep/services/web/frontend/stylesheets/bootstrap-5/base/links.scss
Rebeka Dekany 99e580047c Improve green link colour contrast on the marketing pages (#26461)
* Fix visited link colour

* Udpdate green link colors for the marketing pages

* Use the semantic color variables

GitOrigin-RevId: c53240cbd6f3608031d6e98db8203fe7bb414a9b
2025-06-27 07:34:46 +00:00

61 lines
1.2 KiB
SCSS

// Links
// Use CSS variables for link colors to make it easy to override in marketing page
:root {
--link-color: var(--link-ui);
--link-hover-color: var(--link-ui-hover);
--link-visited-color: var(--link-ui-visited);
--link-color-dark: var(--link-ui-dark);
--link-hover-color-dark: var(--link-ui-hover-dark);
--link-visited-color-dark: var(--link-ui-visited-dark);
--link-text-decoration: underline;
--link-hover-text-decoration: none;
}
a {
color: var(--link-color);
text-decoration: var(--link-text-decoration);
&:visited {
color: var(--link-visited-color);
}
&:hover {
color: var(--link-hover-color);
text-decoration: var(--link-hover-text-decoration);
}
}
.link-monospace {
@include font-mono;
font-weight: 500;
color: var(--link-web);
&:hover {
color: var(--link-web-hover);
}
}
.link-black-text {
color: var(--neutral-90);
text-decoration: none;
font-weight: 600;
&:visited {
color: var(--neutral-90);
}
&:hover {
color: var(--neutral-90);
text-decoration: underline;
}
}
.link-black-full-width {
@extend .link-black-text;
display: flex;
width: 100%;
justify-content: space-between;
}