Fix Photos grid bottom elements
This commit is contained in:
@@ -10,12 +10,12 @@
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
{#if tag === 'button'}
|
{#if tag === 'button'}
|
||||||
<button class={classes}>
|
<button class={classes} on:click>
|
||||||
<slot />
|
<slot />
|
||||||
{text}
|
{text}
|
||||||
</button>
|
</button>
|
||||||
{:else if tag === 'a'}
|
{:else if tag === 'a'}
|
||||||
<a href={url} class={classes}>
|
<a href={url} class={classes} on:click>
|
||||||
<slot />
|
<slot />
|
||||||
<span>{text}</span>
|
<span>{text}</span>
|
||||||
</a>
|
</a>
|
||||||
|
|||||||
@@ -67,6 +67,15 @@
|
|||||||
filtered = false
|
filtered = false
|
||||||
filterCountry = defaultCountry
|
filterCountry = defaultCountry
|
||||||
filterSort = defaultSort
|
filterSort = defaultSort
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Load more photos from CTA
|
||||||
|
*/
|
||||||
|
const loadMorePhotos = () => {
|
||||||
|
console.log('load more photos')
|
||||||
|
// TODO: Append more photos from API including options and page
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@@ -158,9 +167,10 @@
|
|||||||
|
|
||||||
<div class="controls grid">
|
<div class="controls grid">
|
||||||
<p class="controls__date">Last updated: 4 days ago</p>
|
<p class="controls__date">Last updated: 4 days ago</p>
|
||||||
<Button url="#" text="See more photos" />
|
<Button text="See more photos" tag="button" on:click={loadMorePhotos} />
|
||||||
<div class="controls__count">
|
<div class="controls__count">
|
||||||
<span class="current">21/</span>
|
<span class="current">21</span>
|
||||||
|
<span>/</span>
|
||||||
<span class="total">129</span>
|
<span class="total">129</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user