Updated all scss imports to be relative from src alias
Alias defined in webpack.config.js
This commit is contained in:
@@ -31,8 +31,8 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/variables";
|
@import "src/scss/variables";
|
||||||
@import "./src/scss/media-queries";
|
@import "src/scss/media-queries";
|
||||||
|
|
||||||
.button {
|
.button {
|
||||||
font-size: 1.2rem;
|
font-size: 1.2rem;
|
||||||
|
|||||||
@@ -287,7 +287,7 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/variables";
|
@import "src/scss/variables";
|
||||||
|
|
||||||
.wrapper {
|
.wrapper {
|
||||||
padding: 2rem;
|
padding: 2rem;
|
||||||
|
|||||||
@@ -5,9 +5,9 @@
|
|||||||
v-for="result in searchResults"
|
v-for="result in searchResults"
|
||||||
:key="`${result.index}-${result.title}-${result.type}`"
|
:key="`${result.index}-${result.title}-${result.type}`"
|
||||||
@click="openPopup(result)"
|
@click="openPopup(result)"
|
||||||
:class="`result di-${result.index} ${
|
:class="
|
||||||
result.index === index ? 'active' : ''
|
`result di-${result.index} ${result.index === index ? 'active' : ''}`
|
||||||
}`"
|
"
|
||||||
>
|
>
|
||||||
<IconMovie v-if="result.type == 'movie'" class="type-icon" />
|
<IconMovie v-if="result.type == 'movie'" class="type-icon" />
|
||||||
<IconShow v-if="result.type == 'show'" class="type-icon" />
|
<IconShow v-if="result.type == 'show'" class="type-icon" />
|
||||||
@@ -131,9 +131,9 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/variables";
|
@import "src/scss/variables";
|
||||||
@import "./src/scss/media-queries";
|
@import "src/scss/media-queries";
|
||||||
@import "./src/scss/main";
|
@import "src/scss/main";
|
||||||
$sizes: 22;
|
$sizes: 22;
|
||||||
|
|
||||||
@for $i from 0 through $sizes {
|
@for $i from 0 through $sizes {
|
||||||
@@ -223,7 +223,6 @@ li.result {
|
|||||||
&:hover,
|
&:hover,
|
||||||
&:active {
|
&:active {
|
||||||
color: var(--text-color);
|
color: var(--text-color);
|
||||||
// background-color: var(--background-color-secondary);
|
|
||||||
border-bottom: 2px solid var(--color-green);
|
border-bottom: 2px solid var(--color-green);
|
||||||
|
|
||||||
.type-icon {
|
.type-icon {
|
||||||
|
|||||||
@@ -55,8 +55,8 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/variables";
|
@import "src/scss/variables";
|
||||||
@import "./src/scss/media-queries";
|
@import "src/scss/media-queries";
|
||||||
|
|
||||||
header {
|
header {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|||||||
@@ -42,9 +42,9 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/variables";
|
@import "src/scss/variables";
|
||||||
@import "./src/scss/media-queries";
|
@import "src/scss/media-queries";
|
||||||
@import "./src/scss/main";
|
@import "src/scss/main";
|
||||||
|
|
||||||
header {
|
header {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|||||||
@@ -329,10 +329,10 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/loading-placeholder";
|
@import "src/scss/loading-placeholder";
|
||||||
@import "./src/scss/variables";
|
@import "src/scss/variables";
|
||||||
@import "./src/scss/media-queries";
|
@import "src/scss/media-queries";
|
||||||
@import "./src/scss/main";
|
@import "src/scss/main";
|
||||||
|
|
||||||
header {
|
header {
|
||||||
$duration: 0.2s;
|
$duration: 0.2s;
|
||||||
|
|||||||
@@ -63,8 +63,8 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
@import "./src/scss/variables";
|
@import "src/scss/variables";
|
||||||
@import "./src/scss/media-queries";
|
@import "src/scss/media-queries";
|
||||||
|
|
||||||
.movie-popup {
|
.movie-popup {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
|
|||||||
@@ -110,9 +110,9 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/variables";
|
@import "src/scss/variables";
|
||||||
@import "./src/scss/media-queries";
|
@import "src/scss/media-queries";
|
||||||
@import "./src/scss/main";
|
@import "src/scss/main";
|
||||||
|
|
||||||
.movie-item {
|
.movie-item {
|
||||||
padding: 15px;
|
padding: 15px;
|
||||||
@@ -190,7 +190,7 @@ export default {
|
|||||||
</style>
|
</style>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/variables";
|
@import "src/scss/variables";
|
||||||
|
|
||||||
.progress {
|
.progress {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|||||||
@@ -63,8 +63,8 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/variables";
|
@import "src/scss/variables";
|
||||||
@import "./src/scss/media-queries";
|
@import "src/scss/media-queries";
|
||||||
|
|
||||||
.spacer {
|
.spacer {
|
||||||
@include mobile-only {
|
@include mobile-only {
|
||||||
|
|||||||
@@ -91,7 +91,7 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/media-queries";
|
@import "src/scss/media-queries";
|
||||||
|
|
||||||
.navigation-icons {
|
.navigation-icons {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
|
|||||||
@@ -131,8 +131,8 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/variables";
|
@import "src/scss/variables";
|
||||||
@import "./src/scss/media-queries";
|
@import "src/scss/media-queries";
|
||||||
|
|
||||||
.button--group {
|
.button--group {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|||||||
@@ -105,7 +105,7 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/variables";
|
@import "src/scss/variables";
|
||||||
|
|
||||||
section {
|
section {
|
||||||
padding: 1.3rem;
|
padding: 1.3rem;
|
||||||
|
|||||||
@@ -141,7 +141,7 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/media-queries";
|
@import "src/scss/media-queries";
|
||||||
|
|
||||||
.load-button {
|
.load-button {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|||||||
@@ -156,9 +156,9 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/variables";
|
@import "src/scss/variables";
|
||||||
@import "./src/scss/media-queries";
|
@import "src/scss/media-queries";
|
||||||
@import "./src/scss/main";
|
@import "src/scss/main";
|
||||||
|
|
||||||
.close-icon {
|
.close-icon {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|||||||
@@ -153,8 +153,8 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/variables";
|
@import "src/scss/variables";
|
||||||
@import "./src/scss/media-queries";
|
@import "src/scss/media-queries";
|
||||||
|
|
||||||
a {
|
a {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
|||||||
@@ -95,7 +95,7 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/variables";
|
@import "src/scss/variables";
|
||||||
|
|
||||||
section {
|
section {
|
||||||
padding: 1.3rem;
|
padding: 1.3rem;
|
||||||
|
|||||||
@@ -286,7 +286,7 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/variables";
|
@import "src/scss/variables";
|
||||||
.expanded {
|
.expanded {
|
||||||
display: flex;
|
display: flex;
|
||||||
padding: 0.25rem 1rem;
|
padding: 0.25rem 1rem;
|
||||||
|
|||||||
@@ -20,7 +20,7 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/media-queries";
|
@import "src/scss/media-queries";
|
||||||
|
|
||||||
.nav__hamburger {
|
.nav__hamburger {
|
||||||
display: block;
|
display: block;
|
||||||
|
|||||||
@@ -7,7 +7,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/variables";
|
@import "src/scss/variables";
|
||||||
|
|
||||||
.loader {
|
.loader {
|
||||||
display: flex;
|
display: flex;
|
||||||
@@ -16,7 +16,7 @@
|
|||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
||||||
&--icon{
|
&--icon {
|
||||||
border: 2px solid $text-color-70;
|
border: 2px solid $text-color-70;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
display: block;
|
display: block;
|
||||||
@@ -32,7 +32,7 @@
|
|||||||
&:after {
|
&:after {
|
||||||
border: 7px solid $green-90;
|
border: 7px solid $green-90;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
content: '';
|
content: "";
|
||||||
left: 8px;
|
left: 8px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 22px;
|
top: 22px;
|
||||||
@@ -40,7 +40,9 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
@keyframes load {
|
@keyframes load {
|
||||||
100% { transform: rotate(360deg); }
|
100% {
|
||||||
|
transform: rotate(360deg);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -22,6 +22,5 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/loading-placeholder";
|
@import "src/scss/loading-placeholder";
|
||||||
|
</style>
|
||||||
</style>
|
|
||||||
|
|||||||
@@ -64,7 +64,7 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/media-queries";
|
@import "src/scss/media-queries";
|
||||||
|
|
||||||
.movie-description {
|
.movie-description {
|
||||||
font-weight: 300;
|
font-weight: 300;
|
||||||
|
|||||||
@@ -23,7 +23,7 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/media-queries";
|
@import "src/scss/media-queries";
|
||||||
|
|
||||||
.movie-detail {
|
.movie-detail {
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
|
|||||||
@@ -35,7 +35,7 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/media-queries";
|
@import "src/scss/media-queries";
|
||||||
|
|
||||||
.navigation-link {
|
.navigation-link {
|
||||||
display: grid;
|
display: grid;
|
||||||
|
|||||||
@@ -32,8 +32,8 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/variables";
|
@import "src/scss/variables";
|
||||||
@import "./src/scss/media-queries";
|
@import "src/scss/media-queries";
|
||||||
|
|
||||||
button {
|
button {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
|
|||||||
@@ -68,8 +68,8 @@ export default {
|
|||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/variables";
|
@import "src/scss/variables";
|
||||||
@import "./src/scss/media-queries";
|
@import "src/scss/media-queries";
|
||||||
|
|
||||||
.group {
|
.group {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|||||||
@@ -47,8 +47,8 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/variables";
|
@import "src/scss/variables";
|
||||||
@import "./src/scss/media-queries";
|
@import "src/scss/media-queries";
|
||||||
|
|
||||||
.fade-enter-active {
|
.fade-enter-active {
|
||||||
transition: opacity .4s;
|
transition: opacity .4s;
|
||||||
|
|||||||
@@ -45,7 +45,7 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "./src/scss/variables";
|
@import "src/scss/variables";
|
||||||
|
|
||||||
$background: $background-ui;
|
$background: $background-ui;
|
||||||
$background-selected: $background-color-secondary;
|
$background-selected: $background-color-secondary;
|
||||||
|
|||||||
@@ -24,7 +24,7 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
@import "./src/scss/media-queries";
|
@import "src/scss/media-queries";
|
||||||
|
|
||||||
li.sidebar-list-element {
|
li.sidebar-list-element {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
@import "./src/scss/variables";
|
@import "src/scss/variables";
|
||||||
@import "./src/scss/media-queries";
|
@import "src/scss/media-queries";
|
||||||
|
|
||||||
.filter {
|
.filter {
|
||||||
margin: 1rem;
|
margin: 1rem;
|
||||||
|
|||||||
@@ -1,4 +1,4 @@
|
|||||||
@import "./src/scss/variables";
|
@import "src/scss/variables";
|
||||||
|
|
||||||
// Loading placeholder styling
|
// Loading placeholder styling
|
||||||
@mixin nth-children($points...) {
|
@mixin nth-children($points...) {
|
||||||
|
|||||||
@@ -1,4 +1,4 @@
|
|||||||
@import "./src/scss/variables";
|
@import "src/scss/variables";
|
||||||
|
|
||||||
.noselect {
|
.noselect {
|
||||||
-webkit-touch-callout: none; /* iOS Safari */
|
-webkit-touch-callout: none; /* iOS Safari */
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
// Colors
|
// Colors
|
||||||
// @import "./media-queries";
|
// @import "./media-queries";
|
||||||
@import "./src/scss/media-queries";
|
@import "src/scss/media-queries";
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
color-scheme: light;
|
color-scheme: light;
|
||||||
|
|||||||
Reference in New Issue
Block a user