-
Notifications
You must be signed in to change notification settings - Fork 37
Next release
Alexandre Asselin edited this page Dec 14, 2022
·
81 revisions
This release is the phase 1 of the redesign. It introduces the required stepping blocks to tokens and component styles in order to do the relooking of the apps.
-
bg-alias-default
token has been removed, it has been replaced bybg-alias-surface
to acknowledge the design update. You can usebg-alias-surface
on your appbody/html
element before implementing the new design. - Reduced the number of shadow tokens from 4 to 2. This will simplify the process of applying shadows to your components, while having no reduction in visual impact.
--o-ui-bs-alias-lifted
is used for anything above the app's background level, and--o-ui-bs-alias-floating
is used for anything that is over other content.
-
bg-alias-surface
token has been added, this background colour should be used on anything that is one layer above the page body. -
bg-alias-body
token has been added, this background colour should only be used on the body, html tag of an app. -
bg-alias-underlay
token has been added which allows you to specify a background-color for the underlay of an element. -
b-alias-accent
token value has been modified to a darker shade of purple (purple-4
=>purple-6
). - Accordion box shadow has been modified to match the new look and feel of the theme.
- Added shadow to default card it now has a box shadow by default.
- Added a variant
outline
to the card component use on the card component to create cards with an outline style, which is ideal for use in sections. - Increased tab underline from 2px to 4px, providing a more prominent visual indication of the active tab.
- The look of the tile component has been updated to match the new theme.
- The close button on popover has been moved slightly since the border radius changed.
- We don't introduce bugs, who am I kidding. This release is not fixing any bugs.
- Your app body is most likely using
bg-alias-default
replace it withbg-alias-surface
this is a temporary step as eventually your app should usebg-alias-body
which is a light gray colour. - Replace all usages of the
bg-alias-default
token tobg-alias-surface
. - If you are using box shadows tokens in your app, we simplified them if something is floating on the page (Modal, Popover) use
floating
, otherwise uselifted
. Here's the old mapping in case you are not using the named shadows.