refactor: update $css-var-prefix name

This commit is contained in:
Lucas Larroche 2023-12-28 13:21:52 +07:00
parent 2c97dc3ae5
commit 3c96e6043b
41 changed files with 866 additions and 759 deletions

View file

@ -8,54 +8,54 @@
a,
[role="link"] {
#{$✨}color: var(#{$}primary);
#{$✨}background-color: transparent;
#{$✨}underline: var(#{$}primary-underline);
#{$css-var-prefix}color: var(#{$css-var-prefix}primary);
#{$css-var-prefix}background-color: transparent;
#{$css-var-prefix}underline: var(#{$css-var-prefix}primary-underline);
outline: none;
background-color: var(#{$}background-color); // 1
color: var(#{$}color);
text-decoration: var(#{$}text-decoration);
text-decoration-color: var(#{$}underline);
background-color: var(#{$css-var-prefix}background-color); // 1
color: var(#{$css-var-prefix}color);
text-decoration: var(#{$css-var-prefix}text-decoration);
text-decoration-color: var(#{$css-var-prefix}underline);
text-underline-offset: 0.125em;
@if $enable-transitions {
transition:
background-color var(#{$}transition),
color var(#{$}transition),
text-decoration var(#{$}transition),
box-shadow var(#{$}transition);
background-color var(#{$css-var-prefix}transition),
color var(#{$css-var-prefix}transition),
text-decoration var(#{$css-var-prefix}transition),
box-shadow var(#{$css-var-prefix}transition);
}
&:is([aria-current]:not([aria-current="false"]), :hover, :active, :focus) {
#{$✨}color: var(#{$}primary-hover);
#{$✨}underline: var(#{$}primary-hover-underline);
#{$✨}text-decoration: underline;
#{$css-var-prefix}color: var(#{$css-var-prefix}primary-hover);
#{$css-var-prefix}underline: var(#{$css-var-prefix}primary-hover-underline);
#{$css-var-prefix}text-decoration: underline;
}
&:focus-visible {
box-shadow: 0 0 0 var(#{$}outline-width) var(#{$}primary-focus);
box-shadow: 0 0 0 var(#{$css-var-prefix}outline-width) var(#{$css-var-prefix}primary-focus);
}
@if $enable-classes {
// Secondary
&.secondary {
#{$✨}color: var(#{$}secondary);
#{$✨}underline: var(#{$}secondary-underline);
#{$css-var-prefix}color: var(#{$css-var-prefix}secondary);
#{$css-var-prefix}underline: var(#{$css-var-prefix}secondary-underline);
&:is([aria-current]:not([aria-current="false"]), :hover, :active, :focus) {
#{$✨}color: var(#{$}secondary-hover);
#{$✨}underline: var(#{$}secondary-hover-underline);
#{$css-var-prefix}color: var(#{$css-var-prefix}secondary-hover);
#{$css-var-prefix}underline: var(#{$css-var-prefix}secondary-hover-underline);
}
}
// Contrast
&.contrast {
#{$✨}color: var(#{$}contrast);
#{$✨}underline: var(#{$}contrast-underline);
#{$css-var-prefix}color: var(#{$css-var-prefix}contrast);
#{$css-var-prefix}underline: var(#{$css-var-prefix}contrast-underline);
&:is([aria-current]:not([aria-current="false"]), :hover, :active, :focus) {
#{$✨}color: var(#{$}contrast-hover);
#{$✨}underline: var(#{$}contrast-hover-underline);
#{$css-var-prefix}color: var(#{$css-var-prefix}contrast-hover);
#{$css-var-prefix}underline: var(#{$css-var-prefix}contrast-hover-underline);
}
}
}