Skip to content

Instantly share code, notes, and snippets.

@kovchiy
Created April 22, 2018 17:58
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save kovchiy/1618b02d5a1560c039fb31b81958c33b to your computer and use it in GitHub Desktop.
Save kovchiy/1618b02d5a1560c039fb31b81958c33b to your computer and use it in GitHub Desktop.
/* CSS
.Loader
color gray-300
&__letter
display inline-block
transition color 500ms
&_state_active
color black
*/
Beast.decl({
Loader: {
mix: 'typo_text',
expand: function () {
this.append(
(this.text() + '...').replace(/ /, ' ').split('').map(
letter => <letter>{letter}</letter>
)
)
}
},
Loader__letter: {
mod: {
state: 'release',
},
domInit: function () {
let interval = 1000
let act = () => {
this.toggleMod('state', 'active', 'release')
}
setTimeout(
() => {
act()
setInterval(act, interval)
},
this.index() * 100
)
}
}
})
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment