-
Notifications
You must be signed in to change notification settings - Fork 67
Open
Labels
blockedbugSomething isn't workingSomething isn't workingcomponentNew or changes to componentsNew or changes to components
Description
What package has an issue
@svelteuidev/core
A clear and concise description of what the bug is
When setting up a custom UI theme I've noticed the set fonts aren't applied to all components.
While many components apply the fonts properly, some either fail to apply them to all individual parts or don't apply them at all. There's no override in place, that's just their native browser style/font.
For example, a TextInput
component applies the font to its description, but neither to it's label or the actual input element (see following screenshot).
It's totally possible I'm missing something, but so far can't tell.
In which browser(s) did the problem occur?
Firefox, Chrome, Microsoft Edge
Steps To Reproduce
Code:
(Stitches output etc. is properly inserted.)
<script lang="ts">
import { Button, Checkbox, Flex, Paper, Text, TextInput, Title } from '@svelteuidev/core';
import { createTheme } from '@svelteuidev/core';
const theme = createTheme('custom', {
fonts: { // Just setting something ridiculous/easy to spot
standard: 'Comic Sans MS, Comic Sans, cursive',
mono: 'Comic Sans MS, Comic Sans, cursive',
fallback: 'Comic Sans MS, Comic Sans, cursive'
}
});
</script>
<SvelteUIProvider class={theme}>
<Title>Title</Title>
<hr />
<Text>Text</Text>
<hr />
<Button>Button</Button>
<hr />
<TextInput value="TextInput" label="TextInput Label" description="TextInput Description" />
<hr />
<Flex>Flex</Flex>
<hr />
<Checkbox label="Checkbox" />
</SvelteUIProvider>
Do you know how to fix the issue
No
Are you willing to participate in fixing this issue and create a pull request with the fix
Yes
Relevant Assets
No response
Metadata
Metadata
Assignees
Labels
blockedbugSomething isn't workingSomething isn't workingcomponentNew or changes to componentsNew or changes to components
Type
Projects
Status
Next