diff --git a/src/organisms/Carousel.svelte b/src/organisms/Carousel.svelte index c673a53..a83e8a6 100644 --- a/src/organisms/Carousel.svelte +++ b/src/organisms/Carousel.svelte @@ -36,20 +36,20 @@ currentIndex = photos.findIndex(photo => photo.slug === init.params.photo) } - // Change the current index depending on direction - const goToPhoto = direction => { - if (direction === 'prev') { + // Change current index from param + const goToPhoto = to => { + if (to === 'prev') { currentIndex-- currentIndex = (currentIndex < 0) ? photos.length - 1 : currentIndex - } else if (direction === 'next') { + } else if (to === 'next') { currentIndex++ currentIndex = (currentIndex >= photos.length) ? 0 : currentIndex } else { - currentIndex = direction + currentIndex = to } - // Send current photo to event - sendCurrentPhoto({ init: false }) + // Dispatch current photo + sendCurrentPhoto() } // Send current photo to event @@ -94,7 +94,7 @@ /* - ** Run code on browser only + ** Run code when mounted */ onMount(() => { // Entering transition @@ -124,7 +124,7 @@ } } - // Send current photo to event for init + // Dispatch current photo for init sendCurrentPhoto({ init: true }) }) diff --git a/src/style/_base.scss b/src/style/_base.scss index 0cfe724..1362ce4 100644 --- a/src/style/_base.scss +++ b/src/style/_base.scss @@ -191,9 +191,11 @@ button { color: $color-tertiary; text-transform: uppercase; letter-spacing: 1px; -} -.style-caps--transparent { - color: rgba($color-tertiary, 0.5); + + // Transparent variant + &--transparent { + color: rgba($color-tertiary, 0.5); + } } .style-description { diff --git a/src/style/molecules/_globe.scss b/src/style/molecules/_globe.scss index 88b0368..0381ba0 100644 --- a/src/style/molecules/_globe.scss +++ b/src/style/molecules/_globe.scss @@ -65,25 +65,25 @@ background-color: $color-secondary; border-radius: 100%; } - } - // Place - .pin--place { - font-family: $font-serif; + // Place pin + &--place { + font-family: $font-serif; - a { - color: $color-secondary; - text-decoration: none; + a { + color: $color-secondary; + text-decoration: none; + } } - } - // Country - .pin--country { - font-family: $font-sans; - font-size: rem(10px); - color: rgba(#fff, 0.5); - text-transform: uppercase; - letter-spacing: 1px; + // Country text + &--country { + font-family: $font-sans; + font-size: rem(10px); + color: rgba(#fff, 0.5); + text-transform: uppercase; + letter-spacing: 1px; + } } } diff --git a/src/utils/store.js b/src/utils/store.js index 909725f..0555684 100644 --- a/src/utils/store.js +++ b/src/utils/store.js @@ -26,7 +26,6 @@ export let currentLocation = writable() export let currentPhotos = writable() // State -// export let ready = writable(false) export let pageReady = writable(false) export const pageTransition = { onAnimationEnd () {}