Updated all scss imports to be relative from src alias

Alias defined in webpack.config.js

src/components/ui/Hamburger.vue

@@ -20,7 +20,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-@import "./src/scss/media-queries";
+@import "src/scss/media-queries";
 
 .nav__hamburger {
   display: block;

src/components/ui/Loader.vue

@@ -7,7 +7,7 @@
 </template>
 
 <style lang="scss" scoped>
-@import "./src/scss/variables";
+@import "src/scss/variables";
 
 .loader {
   display: flex;
@@ -16,7 +16,7 @@
   justify-content: center;
   align-items: center;
 
-  &--icon{
+  &--icon {
     border: 2px solid $text-color-70;
     border-radius: 50%;
     display: block;
@@ -32,7 +32,7 @@
       &:after {
         border: 7px solid $green-90;
         border-radius: 50%;
-        content: '';
+        content: "";
         left: 8px;
         position: absolute;
         top: 22px;
@@ -40,7 +40,9 @@
     }
   }
   @keyframes load {
-    100% { transform: rotate(360deg); }
+    100% {
+      transform: rotate(360deg);
+    }
   }
 }
-</style>
+</style>

src/components/ui/LoadingPlaceholder.vue

@@ -22,6 +22,5 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-@import "./src/scss/loading-placeholder";
-
-</style>
+@import "src/scss/loading-placeholder";
+</style>

src/components/ui/MovieDescription.vue

@@ -64,7 +64,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-@import "./src/scss/media-queries";
+@import "src/scss/media-queries";
 
 .movie-description {
   font-weight: 300;

src/components/ui/MovieDetail.vue

@@ -23,7 +23,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-@import "./src/scss/media-queries";
+@import "src/scss/media-queries";
 
 .movie-detail {
   margin-bottom: 20px;

src/components/ui/NavigationIcon.vue

@@ -35,7 +35,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-@import "./src/scss/media-queries";
+@import "src/scss/media-queries";
 
 .navigation-link {
   display: grid;

src/components/ui/SeasonedButton.vue

@@ -32,8 +32,8 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-@import "./src/scss/variables";
-@import "./src/scss/media-queries";
+@import "src/scss/variables";
+@import "src/scss/media-queries";
 
 button {
   display: inline-block;

src/components/ui/SeasonedInput.vue

@@ -68,8 +68,8 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-@import "./src/scss/variables";
-@import "./src/scss/media-queries";
+@import "src/scss/variables";
+@import "src/scss/media-queries";
 
 .group {
   display: flex;

src/components/ui/SeasonedMessages.vue

@@ -47,8 +47,8 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-@import "./src/scss/variables";
-@import "./src/scss/media-queries";
+@import "src/scss/variables";
+@import "src/scss/media-queries";
 
 .fade-enter-active {
   transition: opacity .4s;

src/components/ui/ToggleButton.vue

@@ -45,7 +45,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-@import "./src/scss/variables";
+@import "src/scss/variables";
 
 $background: $background-ui;
 $background-selected: $background-color-secondary;

src/components/ui/sidebarListElem.vue

@@ -24,7 +24,7 @@ export default {
 </script>
 
 <style lang="scss">
-@import "./src/scss/media-queries";
+@import "src/scss/media-queries";
 
 li.sidebar-list-element {
   display: flex;