Commit Graph

10 Commits

Author SHA1 Message Date
Maneesh Shukla
b5dec3258f personal_settings: Restyle the profile, account & privacy settings btns.
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.
2025-03-03 12:43:59 -08:00
Maneesh Shukla
78bd2dd5c0 personal_settings: Restyle "Add a new bot" and "Add alert word" button.
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.
2025-03-03 12:43:59 -08:00
Maneesh Shukla
8a571a7ca2 button_properties: Add aria-label to buttons and aria-hidden to icons. 2025-03-03 12:43:59 -08:00
Sayam Samal
bd1ccfbf6d inline_topic_edit: Update styling for confirm and cancel buttons. 2025-02-26 17:26:35 -08:00
Sayam Samal
e729020d13 buttons: Set "button" type to prevent default submission in forms. 2025-02-26 17:26:35 -08:00
Sayam Samal
2723adac54 inline_topic_edit: Improve design of inline topic edit UI.
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.
2025-02-26 17:26:35 -08:00
Sayam Samal
97bbff54f4 buttons: Add option in hbs template to enable squared icon buttons. 2025-02-26 17:26:35 -08:00
Sayam Samal
c05bfba151 buttons: Use snake_case for the button handlebars template filenames.
This renames the button handlebars template filenames to follow the
snake_case naming convention used throughout the codebase.
2025-02-26 17:26:35 -08:00
Sayam Samal
028e9dc58a banners: Redesign desktop notifications navbar banner.
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.
2025-01-30 10:17:39 -08:00
Sayam Samal
6dabfa02cb banners: Add new redesigned banner component.
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.
2025-01-13 17:46:13 -08:00