This commit restyles the profile, account and privacy settings buttons
as follows:
- "Preview profile": action-button-quiet-brand
- Pencil for email editing: icon-button-brand
- "Change your password": action-button-quiet-brand
- "Deactivate account": action-button-quiet-danger
- "Manage your API key": action-button-quiet-brand
Fixes part of #33130.
This commit restyles the profile, account and privacy settings buttons
as follows:
- "Add a new bot": action-button-quiet-brand
- "Add alert word": action-button-quiet-brand
Fixes part of #33130.
This commit improves the design of the inline topic edit UI by making
the following changes:
- Increases the dimensions of the text input element.
- Fixes the font scaling inside text input element.
- Replaces the old save and cancel buttons with the new icon buttons.
Fixes#33155.
As part of the banner redesign project, this commit applies the new
banner styles to the desktop notifications navbar banner.
This commit also acts as a base for the following banner redesign
commits by defining the `banners.ts` module, which now acts as the
centralized module to handle the banner rendering and sets up the
common event listeners.
This commit adds the redesigned banner component to the codebase along
with a storybook-style page in /devtools/banners to view and test the
redesigned banner component.
Any banner using the new redesigned styles, requires two classes,
- First, the base `banner` class which defines the structure and
behavior of the banner.
- Second, a modifier class like `banner-info` which defines the styles
for the particular banner type.
The navbar alert banners also have a custom class `navbar-alert-banner`
which is used to define the specific style and structure for these
banner types.
This commit also makes the `banner`, `action-button` and `icon-button`
components into handlebar templates to maintain consistency in their
usage in the codebase.