-
Notifications
You must be signed in to change notification settings - Fork 0
Sparkly Text component #2
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: main
Are you sure you want to change the base?
Conversation
| import remarkGfm from 'remark-gfm'; | ||
|
|
||
| const config: StorybookConfig = { | ||
| "stories": [ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
are these prettier changes?
| @@ -60,12 +62,11 @@ class SparklyText extends HTMLElement { | |||
| --_sparkle-base-size: var(--sparkly-text-size, 15px); | |||
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
can we default this to inherit instead? And generally do font sizes in rem so they work nicely with assistive tech that increases font size?
|
|
||
| <style> | ||
| sparkly-text { | ||
| font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
can this also inherit? makes it easier to use
| } | ||
| }, | ||
| args: { | ||
| children: createRawSnippet(() => ({ render: () => 'Sparkly Text' })) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
| children: createRawSnippet(() => ({ render: () => 'Sparkly Text' })) | |
| children: createRawSnippet(() => ({ render: () => 'Sparkly Text' })), | |
| sparkleAmount: 8, | |
| sparkleRate: 250, | |
| sparkleVariance: 200, | |
| disabled: false, | |
| allowPausing: true, | |
| size: '1rem', | |
| animationLength: '900ms', | |
| color: '#FFC700', | |
| textShadowColor: 'none' |
Co-authored-by: Miguel de los Reyes <[email protected]>
Apologies for the stray commit. Finally finished writing it and writing all the documentation for it. Hoping it's all good?