diff --git a/client/src/app/+admin/moderation/registration-list/registration-list.component.scss b/client/src/app/+admin/moderation/registration-list/registration-list.component.scss
index 9cae08e85..a02b10c84 100644
--- a/client/src/app/+admin/moderation/registration-list/registration-list.component.scss
+++ b/client/src/app/+admin/moderation/registration-list/registration-list.component.scss
@@ -1,5 +1,5 @@
-@use '_mixins' as *;
 @use '_variables' as *;
+@use '_mixins' as *;
 
 my-global-icon {
   width: 24px;
diff --git a/client/src/app/+admin/moderation/video-block-list/video-block-list.component.scss b/client/src/app/+admin/moderation/video-block-list/video-block-list.component.scss
index 9cae08e85..a02b10c84 100644
--- a/client/src/app/+admin/moderation/video-block-list/video-block-list.component.scss
+++ b/client/src/app/+admin/moderation/video-block-list/video-block-list.component.scss
@@ -1,5 +1,5 @@
-@use '_mixins' as *;
 @use '_variables' as *;
+@use '_mixins' as *;
 
 my-global-icon {
   width: 24px;
diff --git a/client/src/app/+admin/overview/comments/video-comment-list.component.scss b/client/src/app/+admin/overview/comments/video-comment-list.component.scss
index d7eb02142..2777bf6d1 100644
--- a/client/src/app/+admin/overview/comments/video-comment-list.component.scss
+++ b/client/src/app/+admin/overview/comments/video-comment-list.component.scss
@@ -1,5 +1,5 @@
-@use '_mixins' as *;
 @use '_variables' as *;
+@use '_mixins' as *;
 
 my-feed {
   @include margin-left(5px);
diff --git a/client/src/app/+my-library/my-video-channel-syncs/my-video-channel-syncs.component.scss b/client/src/app/+my-library/my-video-channel-syncs/my-video-channel-syncs.component.scss
index 88738e54d..6c09cc9ef 100644
--- a/client/src/app/+my-library/my-video-channel-syncs/my-video-channel-syncs.component.scss
+++ b/client/src/app/+my-library/my-video-channel-syncs/my-video-channel-syncs.component.scss
@@ -1,5 +1,5 @@
-@use '_mixins' as *;
 @use '_variables' as *;
+@use '_mixins' as *;
 @use '_actor' as *;
 
 .add-sync {
diff --git a/client/src/app/+stats/video/video-stats.component.scss b/client/src/app/+stats/video/video-stats.component.scss
index 007d5fa0e..ea75a48d3 100644
--- a/client/src/app/+stats/video/video-stats.component.scss
+++ b/client/src/app/+stats/video/video-stats.component.scss
@@ -1,6 +1,6 @@
 @use '_variables' as *;
 @use '_mixins' as *;
-@use '_nav' as *;
+@use 'nav' as *;
 
 .stats-embed {
   display: flex;
diff --git a/client/src/app/+videos/+video-edit/video-add.component.scss b/client/src/app/+videos/+video-edit/video-add.component.scss
index 461a38204..7e766a818 100644
--- a/client/src/app/+videos/+video-edit/video-add.component.scss
+++ b/client/src/app/+videos/+video-edit/video-add.component.scss
@@ -1,6 +1,6 @@
 @use '_variables' as *;
 @use '_mixins' as *;
-@use '_nav' as *;
+@use 'nav' as *;
 
 $border-width: 3px;
 $border-type: solid;
diff --git a/client/src/app/header/search-typeahead.component.scss b/client/src/app/header/search-typeahead.component.scss
index ae0f1547e..48b61cf3f 100644
--- a/client/src/app/header/search-typeahead.component.scss
+++ b/client/src/app/header/search-typeahead.component.scss
@@ -1,5 +1,5 @@
-@use '_mixins' as *;
 @use '_variables' as *;
+@use '_mixins' as *;
 
 #search-video {
   @include peertube-input-text($search-input-width);
diff --git a/client/src/app/modal/account-setup-warning-modal.component.scss b/client/src/app/modal/account-setup-warning-modal.component.scss
index 25e67b08f..dbaf0f4e8 100644
--- a/client/src/app/modal/account-setup-warning-modal.component.scss
+++ b/client/src/app/modal/account-setup-warning-modal.component.scss
@@ -1,5 +1,5 @@
-@use '_mixins' as *;
 @use '_variables' as *;
+@use '_mixins' as *;
 
 .modal-body {
   display: flex;
diff --git a/client/src/app/modal/admin-welcome-modal.component.scss b/client/src/app/modal/admin-welcome-modal.component.scss
index 716f1fff0..d19ff9bde 100644
--- a/client/src/app/modal/admin-welcome-modal.component.scss
+++ b/client/src/app/modal/admin-welcome-modal.component.scss
@@ -1,5 +1,5 @@
-@use '_mixins' as *;
 @use '_variables' as *;
+@use '_mixins' as *;
 
 .two-columns {
   display: flex;
diff --git a/client/src/app/modal/custom-modal.component.scss b/client/src/app/modal/custom-modal.component.scss
index c5b77994e..757b9ac66 100644
--- a/client/src/app/modal/custom-modal.component.scss
+++ b/client/src/app/modal/custom-modal.component.scss
@@ -1,5 +1,5 @@
-@use '_mixins' as *;
 @use '_variables' as *;
+@use '_mixins' as *;
 
 li {
   margin-bottom: 10px;
diff --git a/client/src/app/modal/instance-config-warning-modal.component.scss b/client/src/app/modal/instance-config-warning-modal.component.scss
index b650f4e69..61ac955fc 100644
--- a/client/src/app/modal/instance-config-warning-modal.component.scss
+++ b/client/src/app/modal/instance-config-warning-modal.component.scss
@@ -1,5 +1,5 @@
-@use '_mixins' as *;
 @use '_variables' as *;
+@use '_mixins' as *;
 
 li {
   margin-bottom: 10px;
diff --git a/client/src/app/shared/shared-abuse-list/abuse-list-table.component.scss b/client/src/app/shared/shared-abuse-list/abuse-list-table.component.scss
index 4852f2e8b..2d5c77ea4 100644
--- a/client/src/app/shared/shared-abuse-list/abuse-list-table.component.scss
+++ b/client/src/app/shared/shared-abuse-list/abuse-list-table.component.scss
@@ -1,5 +1,5 @@
-@use '_mixins' as *;
 @use '_variables' as *;
+@use '_mixins' as *;
 
 .comment-flagged-account,
 .account-flagged-handle {
diff --git a/client/src/app/shared/shared-main/video/embed.component.scss b/client/src/app/shared/shared-main/video/embed.component.scss
index 420ba6f23..23ec23e8b 100644
--- a/client/src/app/shared/shared-main/video/embed.component.scss
+++ b/client/src/app/shared/shared-main/video/embed.component.scss
@@ -1,5 +1,5 @@
-@use '_mixins' as *;
 @use '_variables' as *;
+@use '_mixins' as *;
 
 .screenratio {
   @include block-ratio($selector: 'div, ::ng-deep iframe') {
diff --git a/client/src/app/shared/shared-moderation/moderation.scss b/client/src/app/shared/shared-moderation/moderation.scss
index 7c1e308cf..6aa277260 100644
--- a/client/src/app/shared/shared-moderation/moderation.scss
+++ b/client/src/app/shared/shared-moderation/moderation.scss
@@ -1,6 +1,6 @@
 @use 'sass:math';
-@use '_mixins' as *;
 @use '_variables' as *;
+@use '_mixins' as *;
 @use '_miniature' as *;
 
 .moderation-expanded {
diff --git a/client/src/app/shared/shared-share-modal/video-share.component.scss b/client/src/app/shared/shared-share-modal/video-share.component.scss
index 6e80f8c76..7b6009f5a 100644
--- a/client/src/app/shared/shared-share-modal/video-share.component.scss
+++ b/client/src/app/shared/shared-share-modal/video-share.component.scss
@@ -1,5 +1,5 @@
-@use '_mixins' as *;
 @use '_variables' as *;
+@use '_mixins' as *;
 
 my-input-text {
   width: 100%;
diff --git a/client/src/app/shared/shared-tables/video-cell.component.scss b/client/src/app/shared/shared-tables/video-cell.component.scss
index 5d26b02ef..e0676ce07 100644
--- a/client/src/app/shared/shared-tables/video-cell.component.scss
+++ b/client/src/app/shared/shared-tables/video-cell.component.scss
@@ -1,6 +1,6 @@
 @use 'sass:math';
-@use '_mixins' as *;
 @use '_variables' as *;
+@use '_mixins' as *;
 @use '_miniature' as *;
 
 .table-video-link {
diff --git a/client/src/sass/application.scss b/client/src/sass/application.scss
index 1297855da..ba4df57c9 100644
--- a/client/src/sass/application.scss
+++ b/client/src/sass/application.scss
@@ -6,7 +6,6 @@
 
 @use '_fonts';
 
-@use './class-helpers';
 @use './custom-markup';
 @use './ng-select';
 
diff --git a/client/src/sass/class-helpers/_common.scss b/client/src/sass/class-helpers/_common.scss
index 5fe8af26f..0a81a415d 100644
--- a/client/src/sass/class-helpers/_common.scss
+++ b/client/src/sass/class-helpers/_common.scss
@@ -1,7 +1,7 @@
 @use '_badges' as *;
 @use '_icons' as *;
-@use '_mixins' as *;
 @use '_variables' as *;
+@use '_mixins' as *;
 
 .link-orange {
   color: pvar(--mainForegroundColor);
diff --git a/client/src/sass/include/_mixins.scss b/client/src/sass/include/_mixins.scss
index 3941cf374..cbf86040d 100644
--- a/client/src/sass/include/_mixins.scss
+++ b/client/src/sass/include/_mixins.scss
@@ -3,7 +3,6 @@
 
 @import '_bootstrap-mixins';
 
-
 @mixin disable-default-a-behaviour {
   &:hover,
   &:focus,