refactor(build): replace paths aliases with relative paths

Using paths aliases starting with "@" can be confusing and can lead to
conflict with existings modules. I prefer to use relative paths to
avoid extra configuration in tools because of these aliases.

23 files changed, 37 insertions, 39 deletions

diff --git a/src/styles/abstracts/_variables.scss b/src/styles/abstracts/_variables.scss
index fc28e7b..d56ba18 100644
--- a/src/styles/abstracts/_variables.scss
+++ b/src/styles/abstracts/_variables.scss
@@ -1,6 +1,6 @@
 @use "sass:map";
 @use "sass:math";
-@use "@styles/abstracts/functions" as fun;
+@use "./functions" as fun;
 
 //===========================================================================
 // Ratios
diff --git a/src/styles/abstracts/mixins/_media-queries.scss b/src/styles/abstracts/mixins/_media-queries.scss
index e72f572..021b4c8 100644
--- a/src/styles/abstracts/mixins/_media-queries.scss
+++ b/src/styles/abstracts/mixins/_media-queries.scss
@@ -1,5 +1,5 @@
-@use "../variables" as var;
 @use "sass:map";
+@use "../variables" as var;
 
 /// Media query: media type
 /// @param {String} $type - Media type: all, screen, print, retina.
diff --git a/src/styles/abstracts/placeholders/_layout.scss b/src/styles/abstracts/placeholders/_layout.scss
index 1a28acb..94db45d 100644
--- a/src/styles/abstracts/placeholders/_layout.scss
+++ b/src/styles/abstracts/placeholders/_layout.scss
@@ -1,4 +1,4 @@
-@use "@styles/abstracts/mixins" as mix;
+@use "../mixins" as mix;
 
 %grid {
   display: grid;
diff --git a/src/styles/base/_animations.scss b/src/styles/base/_animations.scss
index ad870e9..21e1b47 100644
--- a/src/styles/base/_animations.scss
+++ b/src/styles/base/_animations.scss
@@ -1,4 +1,4 @@
-@use "@styles/abstracts/functions" as fun;
+@use "../abstracts/functions" as fun;
 
 @keyframes pulse {
   from {
diff --git a/src/styles/base/_base.scss b/src/styles/base/_base.scss
index b6a6082..91989bd 100644
--- a/src/styles/base/_base.scss
+++ b/src/styles/base/_base.scss
@@ -1,5 +1,5 @@
-@use "@styles/abstracts/functions" as fun;
-@use "@styles/abstracts/mixins" as mix;
+@use "../abstracts/functions" as fun;
+@use "../abstracts/mixins" as mix;
 
 audio,
 button,
diff --git a/src/styles/base/_colors.scss b/src/styles/base/_colors.scss
index 4db97d9..eed7a9a 100644
--- a/src/styles/base/_colors.scss
+++ b/src/styles/base/_colors.scss
@@ -1,4 +1,4 @@
-@use "@styles/abstracts/variables" as var;
+@use "../abstracts/variables" as var;
 
 :root {
   --color-bg: #{var.$light-theme_white};
diff --git a/src/styles/base/_fonts.scss b/src/styles/base/_fonts.scss
index c8695d4..69c0a70 100644
--- a/src/styles/base/_fonts.scss
+++ b/src/styles/base/_fonts.scss
@@ -1,5 +1,5 @@
-@use "@styles/abstracts/variables" as var;
 @use "sass:math";
+@use "../abstracts/variables" as var;
 
 @font-face {
   font-family: Kanit;
diff --git a/src/styles/base/_helpers.scss b/src/styles/base/_helpers.scss
index 381154f..e38d398 100644
--- a/src/styles/base/_helpers.scss
+++ b/src/styles/base/_helpers.scss
@@ -1,5 +1,5 @@
-@use "@styles/abstracts/functions" as fun;
-@use "@styles/abstracts/mixins" as mix;
+@use "../abstracts/functions" as fun;
+@use "../abstracts/mixins" as mix;
 
 /*=========================================================================
 >>> TABLE OF CONTENTS:
diff --git a/src/styles/base/_spacings.scss b/src/styles/base/_spacings.scss
index 7c8b210..3cff009 100644
--- a/src/styles/base/_spacings.scss
+++ b/src/styles/base/_spacings.scss
@@ -1,7 +1,7 @@
-@use "@styles/abstracts/functions" as fun;
-@use "@styles/abstracts/mixins" as mix;
-@use "@styles/abstracts/variables" as var;
 @use "sass:math";
+@use "../abstracts/functions" as fun;
+@use "../abstracts/mixins" as mix;
+@use "../abstracts/variables" as var;
 
 :root {
   --spacing-2xs: clamp(
diff --git a/src/styles/base/_typography.scss b/src/styles/base/_typography.scss
index 2c3c8cc..dc958c4 100644
--- a/src/styles/base/_typography.scss
+++ b/src/styles/base/_typography.scss
@@ -1,4 +1,4 @@
-@use "@styles/abstracts/functions" as fun;
+@use "../abstracts/functions" as fun;
 
 h1 {
   font-size: var(--font-size-3xl);
diff --git a/src/styles/layout/_grid.scss b/src/styles/layout/_grid.scss
index 7948c5f..3e6e7de 100644
--- a/src/styles/layout/_grid.scss
+++ b/src/styles/layout/_grid.scss
@@ -1,4 +1,4 @@
-@use "@styles/abstracts/mixins" as mix;
+@use "../abstracts/mixins" as mix;
 
 .grid {
   --grid-gap: var(--spacing-md);
diff --git a/src/styles/pages/Page.module.scss b/src/styles/pages/Page.module.scss
index 6aadff6..24fc1eb 100644
--- a/src/styles/pages/Page.module.scss
+++ b/src/styles/pages/Page.module.scss
@@ -1,9 +1,8 @@
-@use "@styles/abstracts/functions" as fun;
-@use "@styles/abstracts/mixins" as mix;
-@use "@styles/abstracts/placeholders";
+@use "../abstracts/functions" as fun;
+@use "../abstracts/placeholders";
 
 .article {
-  composes: grid from "@styles/layout/_grid.scss";
+  composes: grid from "../layout/_grid.scss";
   align-items: start;
 
   > header {
@@ -37,7 +36,7 @@ li.item {
 
 .comments {
   grid-column: 1 / -1;
-  composes: grid from "@styles/layout/_grid.scss";
+  composes: grid from "../layout/_grid.scss";
   margin: var(--spacing-md) 0 0;
   padding: var(--spacing-md) 0 var(--spacing-lg);
   background: var(--color-bg-secondary);
diff --git a/src/styles/pages/article.module.scss b/src/styles/pages/article.module.scss
index a5299fe..48aed79 100644
--- a/src/styles/pages/article.module.scss
+++ b/src/styles/pages/article.module.scss
@@ -1,6 +1,5 @@
-@use "@styles/abstracts/functions" as fun;
-@use "@styles/abstracts/mixins" as mix;
-@use "@styles/abstracts/variables" as var;
+@use "../abstracts/functions" as fun;
+@use "../abstracts/mixins" as mix;
 @use "partials/article-links";
 @use "partials/article-lists";
 @use "partials/article-media";
diff --git a/src/styles/pages/home.module.scss b/src/styles/pages/home.module.scss
index 873a5a9..59c8c6f 100644
--- a/src/styles/pages/home.module.scss
+++ b/src/styles/pages/home.module.scss
@@ -1,5 +1,5 @@
-@use "@styles/abstracts/functions" as fun;
-@use "@styles/abstracts/mixins" as mix;
+@use "../abstracts/functions" as fun;
+@use "../abstracts/mixins" as mix;
 
 .section {
   --card-width: 25ch;
diff --git a/src/styles/pages/partials/_article-headings.scss b/src/styles/pages/partials/_article-headings.scss
index c0c3519..dfeceb7 100644
--- a/src/styles/pages/partials/_article-headings.scss
+++ b/src/styles/pages/partials/_article-headings.scss
@@ -1,4 +1,4 @@
-@use "@styles/abstracts/functions" as fun;
+@use "../../abstracts/functions" as fun;
 
 @mixin styles {
   h1 {
diff --git a/src/styles/pages/partials/_article-links.scss b/src/styles/pages/partials/_article-links.scss
index 543337a..e88b81e 100644
--- a/src/styles/pages/partials/_article-links.scss
+++ b/src/styles/pages/partials/_article-links.scss
@@ -1,5 +1,5 @@
-@use "@styles/abstracts/functions" as fun;
-@use "@styles/abstracts/variables" as var;
+@use "../../abstracts/functions" as fun;
+@use "../../abstracts/variables" as var;
 
 @mixin styles {
   a {
diff --git a/src/styles/pages/partials/_article-media.scss b/src/styles/pages/partials/_article-media.scss
index 0cd3654..2fd6fe4 100644
--- a/src/styles/pages/partials/_article-media.scss
+++ b/src/styles/pages/partials/_article-media.scss
@@ -1,4 +1,4 @@
-@use "@styles/abstracts/functions" as fun;
+@use "../../abstracts/functions" as fun;
 
 @mixin styles {
   figure {
diff --git a/src/styles/pages/partials/_article-prism.scss b/src/styles/pages/partials/_article-prism.scss
index a714eb6..7d23e38 100644
--- a/src/styles/pages/partials/_article-prism.scss
+++ b/src/styles/pages/partials/_article-prism.scss
@@ -1,5 +1,5 @@
-@use "@styles/abstracts/functions" as fun;
-@use "@styles/abstracts/mixins" as mix;
+@use "../../abstracts/functions" as fun;
+@use "../../abstracts/mixins" as mix;
 
 @mixin styles {
   .code-toolbar {
diff --git a/src/styles/pages/partials/_article-wp-blocks.scss b/src/styles/pages/partials/_article-wp-blocks.scss
index 86be062..6a847b1 100644
--- a/src/styles/pages/partials/_article-wp-blocks.scss
+++ b/src/styles/pages/partials/_article-wp-blocks.scss
@@ -1,6 +1,6 @@
-@use "@styles/abstracts/functions" as fun;
-@use "@styles/abstracts/mixins" as mix;
-@use "@styles/abstracts/placeholders";
+@use "../../abstracts/functions" as fun;
+@use "../../abstracts/mixins" as mix;
+@use "../../abstracts/placeholders";
 
 @mixin styles {
   .wp-block-quote {
diff --git a/src/styles/pages/project.module.scss b/src/styles/pages/project.module.scss
index 3b1b5cc..0bbd77d 100644
--- a/src/styles/pages/project.module.scss
+++ b/src/styles/pages/project.module.scss
@@ -1,4 +1,4 @@
-@use "@styles/abstracts/mixins" as mix;
+@use "../abstracts/mixins" as mix;
 
 .widget {
   @include mix.media("screen") {
diff --git a/src/styles/pages/projects.module.scss b/src/styles/pages/projects.module.scss
index fde1f31..f72c573 100644
--- a/src/styles/pages/projects.module.scss
+++ b/src/styles/pages/projects.module.scss
@@ -1,4 +1,4 @@
-@use "@styles/abstracts/mixins" as mix;
+@use "../abstracts/mixins" as mix;
 
 .list {
   margin-top: var(--spacing-sm);
diff --git a/src/styles/pages/topic.module.scss b/src/styles/pages/topic.module.scss
index fd5f742..bec4ba2 100644
--- a/src/styles/pages/topic.module.scss
+++ b/src/styles/pages/topic.module.scss
@@ -1,4 +1,4 @@
-@use "@styles/abstracts/functions" as fun;
+@use "../abstracts/functions" as fun;
 
 .logo {
   max-width: fun.convert-px(50);
diff --git a/src/styles/themes/_dark.scss b/src/styles/themes/_dark.scss
index 946403a..d689bcc 100644
--- a/src/styles/themes/_dark.scss
+++ b/src/styles/themes/_dark.scss
@@ -1,5 +1,5 @@
-@use "@styles/abstracts/functions" as fun;
-@use "@styles/abstracts/variables" as var;
+@use "../abstracts/functions" as fun;
+@use "../abstracts/variables" as var;
 
 [data-theme="dark"] {
   * {