Skip to content

fix: Match the response action icons to the Bruno app (BRU-3765) - #31

Open
vasharma05-bruno wants to merge 5 commits into
usebruno:mainfrom
vasharma05-bruno:fix-response-action-buttons
Open

fix: Match the response action icons to the Bruno app (BRU-3765)#31
vasharma05-bruno wants to merge 5 commits into
usebruno:mainfrom
vasharma05-bruno:fix-response-action-buttons

Conversation

@vasharma05-bruno

Copy link
Copy Markdown
Contributor

Description

This PR resolves the size difference of response action buttons in Response Pane of the playground app (24px in Bruno app vs 28px in Bruno API Docs Playground)

Reason of regression

The initial idea was to reuse the IconButton which is currently being used at multiple places in the app. By design, the IconButton has the styles:

  1. Width = 28px
  2. Height = 28px
  3. SVG size = 18px

Needed Sizes:

  1. Width = 24px
  2. Height = 24px
  3. SVG size = whatever the svg size is present

Since these styling configuration is needed only for the Action Buttons, a new component is created for the same.

Another changes:

  1. The Response status and text are not mono font, and is bold
  2. The Response duration and size's font-weight is now medium 500.
  3. Added a border to the more actions button
  4. Matched the spacings between the dropdown, the response info and Action buttons to the app (0.75rem)
  5. Matched the spacings between the action buttons (0.125rem)

Before

image image

After

image image

@vasharma05-bruno
vasharma05-bruno marked this pull request as draft August 7, 2026 11:44
@vasharma05-bruno
vasharma05-bruno marked this pull request as ready for review August 7, 2026 11:50

describe('ActionIconButton', () => {
it('renders a button with the accessible label and its child glyph', () => {
const html = renderToStaticMarkup(

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please use UserenderToDOM everywhere for consistency

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Updated the tests

@vasharma05-bruno
vasharma05-bruno changed the base branch from main to release/v0.2.0 August 7, 2026 12:27
@arpit-bruno
arpit-bruno changed the base branch from release/v0.2.0 to main August 7, 2026 13:10
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants