refactor: use classic for conditional classes
This commit is contained in:
@@ -6,6 +6,7 @@
|
||||
import { getContext } from 'svelte'
|
||||
import { spring } from 'svelte/motion'
|
||||
import dayjs from 'dayjs'
|
||||
import { cx } from 'classix'
|
||||
import { lerp } from 'utils/math'
|
||||
import { PUBLIC_PREVIEW_COUNT } from '$env/static/public'
|
||||
import { seenLocations } from '$utils/stores'
|
||||
@@ -110,7 +111,7 @@
|
||||
<div class="location__photos">
|
||||
{#each location.photos as { image }, index}
|
||||
{#if image}
|
||||
{@const classes = ['location__photo', index === photoIndex ? 'is-visible' : null].join(' ').trim()}
|
||||
{@const classes = cx('location__photo', index === photoIndex && 'is-visible')}
|
||||
<Image
|
||||
class={classes}
|
||||
id={image.id}
|
||||
|
||||
@@ -3,6 +3,7 @@
|
||||
</style>
|
||||
|
||||
<script lang="ts">
|
||||
import { cx } from 'classix'
|
||||
import Image from '$components/atoms/Image.svelte'
|
||||
|
||||
export let street: string
|
||||
@@ -13,11 +14,11 @@
|
||||
export let size: string = undefined
|
||||
|
||||
const className = 'postcard'
|
||||
$: classes = [
|
||||
$: classes = cx(
|
||||
className,
|
||||
...[size].map(variant => variant && `${className}--${variant}`),
|
||||
$$props.class
|
||||
].join(' ').trim()
|
||||
)
|
||||
</script>
|
||||
|
||||
<div class={classes}>
|
||||
|
||||
@@ -5,6 +5,7 @@
|
||||
<script lang="ts">
|
||||
import { goto } from '$app/navigation'
|
||||
import { getContext, tick } from 'svelte'
|
||||
import { cx } from 'classix'
|
||||
import { shopCurrentProductSlug } from '$utils/stores/shop'
|
||||
import { smoothScroll } from '$utils/stores'
|
||||
|
||||
@@ -12,11 +13,11 @@
|
||||
|
||||
const { shopLocations }: any = getContext('shop')
|
||||
|
||||
const classes = [
|
||||
const classes = cx(
|
||||
'shop-locationswitcher',
|
||||
isOver && 'is-over',
|
||||
$$props.class
|
||||
].join(' ').trim()
|
||||
)
|
||||
|
||||
|
||||
// Quick location change
|
||||
|
||||
Reference in New Issue
Block a user