comunes/todos-contra-el-fuego-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

scss: migrate @import -> @use, lighten/darken -> color.adjust (dart-sass)

Browse source 
Silences the dart-sass deprecation warnings that flooded every build:
- All @import of local partials (colors, mixins, and the CSS-emitting
  partials) -> @use '...' as * (partials are pure defs, so 'as *' keeps the
  global names and the ~25 call sites unchanged). Added explicit @use './colors'
  to bootstrap-overrides.scss and cookies-eu.scss, which used -palette*
  transitively (broke under @use's scoping).
- lighten(c, x%) -> color.adjust(c, $lightness: x%) and darken -> negative,
  with @use 'sass:color' in the 6 affected files.
Compiles clean (byte-for-byte CSS behavior preserved).
This commit is contained in:
vjrj 2026-07-17 18:18:04 +02:00
parent 62ac2fbd9c
commit c6c22643c1
26 changed files with 60 additions and 52 deletions
Download patch file Download diff file Expand all files Collapse all files

4
imports/ui/pages/Index/Index-custom.scss
View file

@ -1,5 +1,5 @@
@import '../../stylesheets/mixins';
@import '../../stylesheets/colors';
@use '../../stylesheets/mixins' as *;
@use '../../stylesheets/colors' as *;
.full-width {
position: relative;

15
imports/ui/pages/Index/Index.scss
View file

@ -1,9 +1,10 @@
@import '../../stylesheets/mixins';
@import '../../stylesheets/colors';
@use 'sass:color';
@use '../../stylesheets/mixins' as *;
@use '../../stylesheets/colors' as *;
.Index {
padding: 20px;
background: lighten($todos-back1, 75%);
background: color.adjust($todos-back1, $lightness: 75%);
text-align: center;
border-radius: 3px;
color: $todos-font1;
@ -23,7 +24,7 @@
p {
font-size: 18px;
color: lighten($cb-blue, 25%);
color: color.adjust($cb-blue, $lightness: 25%);
}
> div {
@ -41,18 +42,18 @@
footer {
margin: 20px -20px -20px;
border-top: 1px solid darken($cb-blue, 10%);
border-top: 1px solid color.adjust($cb-blue, $lightness: -10%);
padding: 20px;
p {
font-size: 14px;
line-height: 22px;
color: lighten($cb-blue, 35%);
color: color.adjust($cb-blue, $lightness: 35%);
margin: 0;
}
p a {
color: lighten($cb-blue, 35%);
color: color.adjust($cb-blue, $lightness: 35%);
text-decoration: underline;
}
}