Change lettersToSpan name to charsToSpan
This commit is contained in:
@@ -1,6 +1,6 @@
|
|||||||
<script>
|
<script>
|
||||||
import { onMount } from 'svelte'
|
import { onMount } from 'svelte'
|
||||||
import { lettersToSpan } from '../utils/functions'
|
import { charsToSpan } from '../utils/functions'
|
||||||
|
|
||||||
// Animations
|
// Animations
|
||||||
import { animateIn } from '../animations/TitleSite.js'
|
import { animateIn } from '../animations/TitleSite.js'
|
||||||
@@ -21,7 +21,7 @@
|
|||||||
<div class="title-location title-location--inline" bind:this={scope}>
|
<div class="title-location title-location--inline" bind:this={scope}>
|
||||||
<div role="heading" aria-level="1" aria-label="Houses">
|
<div role="heading" aria-level="1" aria-label="Houses">
|
||||||
<div class="anim-mask">
|
<div class="anim-mask">
|
||||||
{@html lettersToSpan('Houses')}
|
{@html charsToSpan('Houses')}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -32,7 +32,7 @@
|
|||||||
|
|
||||||
<div aria-label="World">
|
<div aria-label="World">
|
||||||
<div class="anim-mask">
|
<div class="anim-mask">
|
||||||
{@html lettersToSpan('World')}
|
{@html charsToSpan('World')}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -33,7 +33,7 @@
|
|||||||
pageReady,
|
pageReady,
|
||||||
pageTransition
|
pageTransition
|
||||||
} from '../utils/store'
|
} from '../utils/store'
|
||||||
import { lettersToSpan } from '../utils/functions'
|
import { charsToSpan } from '../utils/functions'
|
||||||
|
|
||||||
// Dependencies
|
// Dependencies
|
||||||
import zenscroll from 'zenscroll'
|
import zenscroll from 'zenscroll'
|
||||||
@@ -87,7 +87,7 @@
|
|||||||
<div class="anim-mask">
|
<div class="anim-mask">
|
||||||
<div class="anim title-parallax" id="title-houses">
|
<div class="anim title-parallax" id="title-houses">
|
||||||
<h1 class="title-massive" aria-label="Houses">
|
<h1 class="title-massive" aria-label="Houses">
|
||||||
{@html lettersToSpan('Houses')}
|
{@html charsToSpan('Houses')}
|
||||||
</h1>
|
</h1>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -110,7 +110,7 @@
|
|||||||
<section class="explore explore--homepage">
|
<section class="explore explore--homepage">
|
||||||
<div class="of" id="title-of" aria-label="of">
|
<div class="of" id="title-of" aria-label="of">
|
||||||
<div class="anim-mask">
|
<div class="anim-mask">
|
||||||
{@html lettersToSpan('of')}
|
{@html charsToSpan('of')}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -122,7 +122,7 @@
|
|||||||
|
|
||||||
<div class="anim-mask anim-title">
|
<div class="anim-mask anim-title">
|
||||||
<h1 class="title-massive title-parallax" id="title-world" aria-label="World">
|
<h1 class="title-massive title-parallax" id="title-world" aria-label="World">
|
||||||
{@html lettersToSpan('World')}
|
{@html charsToSpan('World')}
|
||||||
</h1>
|
</h1>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|||||||
@@ -45,7 +45,7 @@ export function throttle (fn, delay) {
|
|||||||
/*
|
/*
|
||||||
** Wrap string's each letters into a span
|
** Wrap string's each letters into a span
|
||||||
*/
|
*/
|
||||||
export const lettersToSpan = string => {
|
export const charsToSpan = string => {
|
||||||
return string
|
return string
|
||||||
.replace(/(<.*?>)|(.)/g, letter => letter.replace(/./g, '<span>$&</span>'))
|
.replace(/(<.*?>)|(.)/g, letter => letter.replace(/./g, '<span>$&</span>'))
|
||||||
.replace(/ /g, '\u00a0')
|
.replace(/ /g, '\u00a0')
|
||||||
|
|||||||
Reference in New Issue
Block a user