All notable changes to this project will be documented in this file.
The format is based on Keep a Changelog ,
and this project adheres to Semantic Versioning .
Set the default variant
for Button
to primary
from solid
.
Use a more subtle placeholder color for the filled.accent
variant of the Input
component.
Revise Drawer
to have a more consistent spacing with the rest of the components.
Fixed an issue with the Button
component where the text
variant had the wrong line height.
Revise IconButton
to have a more consistent look with the rest of the components.
Tweak CloseButton
to visually align with the IconButton
component.
Set flexShrink
to 0
for Button
variants to prevent it from shrinking when used in a flex container.
Revise CloseButton
to have a more consistent look with the rest of the components.
Added border.active
token to help with conveying the status of a component.
Added underline
variant for Link
component.
Tweaked border.default
and border.emphasized
token to have a more subtle color in dark mode.
Added semantic token success
and error
to help with conveying the status of a component.
Added filled.accent
variant for Input
component.
Removed boxShadow
from Button
variant primary
and secondary
to make the component more consistent with the rest of the components.
Tone down the boxShadow
for Tabs
variant inidcator
.
Removed outline-on-accent
variant for Input
component as it was barely used.
Removed filled
styles from the Input
component. The default variant from the Chakra UI theme will be used.
Fixed an issue with the FormLabel
, Progress
and Table
component not having the correct color
.
Added selected
styles for the secondary Button
variant.
Switched the body
font family to Open Sans Variable
from Inter Variable
and updated the heading
font family to Spline Sans Variable
from Inter Variable
. This modification was made to enhance readability and provide a more distinctive aesthetic appeal to our site.
Added new Tabs
variant indicator
.
Renamed and re-designed Tabs
variant with-line
to underline
.
Changed the default colorScheme
for Badge
from gray
to brand
.
Removed enclosed
styles from the Tabs
component. The default variant from the Chakra UI theme will be used.
Tabs
styles no longer override the default Chakra UI theme styles.
Tweaked Button
variant text
to have a more subtle color.
Fixed an issue with the Input
component where the outline-on-accent
variant would not have the correct colors.
Fixed an issue with the Link
component where the menu
variant would not have the correct colors.
Fixed an issue with the Popover
, Table
and RadioCard
component not having the correct background-color
.
Fixed Checkbox
to have the correct font size
Added missing activeLink
styles for Button
variants tertiary
and tertiary.accent
.
The default colorScheme
property for Button
has been changed from 'teal' to 'brand'.
Introduced gray.25
with the hexadecimal value #fcfdfe
.
Introduced gray.950
with the hexadecimal value #14151e
.
Introduced a new semantic token border.emphasized
.
Introduced new Badge
variant pill
.
Renamed variant primary-on-accent
to primary.accent
.
Renamed variant secondary-on-accent
to secondary.accent
.
Renamed variant outline
to tertiary
.
Renamed variant ghost-on-accent
to tertiary.accent
.
Renamed variant link
to text
.
Renamed variant link-on-accent
to text.accent
.
Renamed default font family to Inter Variable
from InterVariable
.
Adjusted gray.50
to better fit into lower hues. gray.50
color hex value has been changed from #F7FAFC to #f4f8fa.
Renamed several SemanticTokens
to improve their intuitiveness and self-explanatory nature.
Background related tokens:
Before
After
bg-canvas
bg.canvas
bg-surface
bg.surface
bg-subtle
bg.subtle
bg-muted
bg.muted
bg-accent
bg.accent.default
bg-accent-subtle
bg.accent.subtle
bg-accent-muted
bg.accent.muted
Foreground related tokens:
Before
After
default
fg.default
emphasized
fg.emphasized
muted
fg.muted
subtle
fg.subtle
inverted
fg.inverted
on-accent-subtle
fg.accent.subtle
on-accent-muted
fg.accent.muted
on-accent
fg.accent.default
Before
After
border
border.default
Removed custom styles for Button
variants link
, ghost
and outline
. The default variant from the Chakra UI theme will be used.
Removed subtle
styles from the Badge
component. The default variant from the Chakra UI theme will be used.
Remove engines
from package.json
to allow for more flexibility
Added new Input
size: xl
with 48px height.
Added new Button
sizes: 2xs
and 2xl
with corresponding sizes:
Modified existing Input
heights for more precise control over the input dimensions.
Size
Before
After
sm
32px
36px
md
40px
40px
lg
48px
44px
xl
n/A
48px
Modified existing Button
heights for more precise control over the button dimensions.
Size
Before
After
2xs
n/A
24px
xs
24px
32px
sm
32px
36px
md
40px
40px
lg
48px
44px
xl
60px
48px
2xl
n/A
60px