I have encountered a large number of style warnings like this. How can I migrate them

Please describe the question in detail and share your code, configuration, and other relevant info.

g]   Sass's behavior for declarations that appear after nested
[ng]   rules will be changing to match the behavior specified by CSS in an upcoming
[ng]   version. To keep the existing behavior, move the declaration above the nested
[ng]   rule. To opt into the new behavior, wrap the declaration in `& {}`.
[ng]
[ng]   More info: https://sass-lang.com/d/mixed-decls
[ng] ▲ [WARNING] Deprecation [plugin angular-sass]
[ng]     src/app/register/register.page.scss:3:8:
[ng]       3 │ @import "../../style/mixin.scss";
[ng]         ╵         ^
[ng]   Sass @import rules are deprecated and will be removed in Dart Sass 3.0.0.
[ng]
[ng]   More info and automated migrator: https://sass-lang.com/d/import
[ng] ▲ [WARNING] Deprecation [plugin angular-sass]
[ng]     src/app/register/register.page.scss:83:8:
[ng]       83 │         color: #fff;
[ng]          ╵         ^
[ng]   Sass's behavior for declarations that appear after nested
[ng]   rules will be changing to match the behavior specified by CSS in an upcoming
[ng]   version. To keep the existing behavior, move the declaration above the nested
[ng]   rule. To opt into the new behavior, wrap the declaration in `& {}`.
[ng]
[ng]   More info: https://sass-lang.com/d/mixed-decls
[ng] ▲ [WARNING] Deprecation [plugin angular-sass]
[ng]     src/app/register/register.page.scss:83:8:
[ng]       83 │         color: #fff;
[ng]          ╵         ^
[ng]   Sass's behavior for declarations that appear after nested
[ng]   rules will be changing to match the behavior specified by CSS in an upcoming
[ng]   version. To keep the existing behavior, move the declaration above the nested
[ng]   rule. To opt into the new behavior, wrap the declaration in `& {}`.
[ng]
[ng]   More info: https://sass-lang.com/d/mixed-decls
[ng] ▲ [WARNING] Deprecation [plugin angular-sass]
[ng]     src/app/register/register.page.scss:100:6:
[ng]       100 │       color: #fff;
[ng]           ╵       ^
[ng]   Sass's behavior for declarations that appear after nested
[ng]   rules will be changing to match the behavior specified by CSS in an upcoming
[ng]   version. To keep the existing behavior, move the declaration above the nested
[ng]   rule. To opt into the new behavior, wrap the declaration in `& {}`.
[ng]
[ng]   More info: https://sass-lang.com/d/mixed-decls
[ng] ▲ [WARNING] Deprecation [plugin angular-sass]
[ng]     src/app/register/register.page.scss:100:6:
[ng]       100 │       color: #fff;
[ng]           ╵       ^
[ng]   Sass's behavior for declarations that appear after nested
[ng]   rules will be changing to match the behavior specified by CSS in an upcoming
[ng]   version. To keep the existing behavior, move the declaration above the nested
[ng]   rule. To opt into the new behavior, wrap the declaration in `& {}`.
[ng]
[ng]   More info: https://sass-lang.com/d/mixed-decls
[ng] ▲ [WARNING] Deprecation [plugin angular-sass]
[ng]     src/app/register/register.page.scss:114:8:
[ng]       114 │         background: rgba(255, 255, 255, 0.1);
[ng]           ╵         ^
[ng]   Sass's behavior for declarations that appear after nested
[ng]   rules will be changing to match the behavior specified by CSS in an upcoming
[ng]   version. To keep the existing behavior, move the declaration above the nested
[ng]   rule. To opt into the new behavior, wrap the declaration in `& {}`.
[ng]
[ng]   More info: https://sass-lang.com/d/mixed-decls