Skip to content

Conversation

@qt-dork
Copy link

@qt-dork qt-dork commented Nov 3, 2025

Apologies for the stray commit. Finally finished writing it and writing all the documentation for it. Hoping it's all good?

import remarkGfm from 'remark-gfm';

const config: StorybookConfig = {
"stories": [
Copy link
Collaborator

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);
Copy link
Collaborator

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;
Copy link
Collaborator

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' }))
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
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]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants