Delete and search icons are overlapping in brave://history

[dryspeed]

Description

The Delete and Search icons overlap, leading to unexpected behavior in Brave History.

Steps to Reproduce

1. Open Brave history settings by visiting 'brave://history/'.
2. Open the history settings in a minimized window.
3. Attempt to delete a specific website from your history.
4. Notice that the delete and search icons overlap.

Actual result:

In a minimized window, the issue can be observed:

https://github.com/brave/brave-browser/assets/142707208/fe5a3bc4-2d60-462d-a7ea-e7b5917ef2ee

Expected result:

In fullscreen mode, the icons display correctly:

https://github.com/brave/brave-browser/assets/142707208/49fe24f7-e1db-4bfe-b77b-1ce66cb60154

Reproduces how often:

Consistently, Every time.

Brave version (brave://version info)

Brave: 1.57.47 Chromium: 116.0.5845.96 (Official Build) (arm64) Operating System: macOS Ventura

Version/Channel Information:

The issue is reproducible with the current release.

### Tasks

[bsclifton]

cc: @fallaciousreasoning

[fallaciousreasoning]

That's not ideal! Thanks for reporting @nutscreams

[FortisLeo]

@fallaciousreasoning sir I am unable to find the file in which I have to make changes to fix this issue I will truly appreciate your help.

[Nishchay1571999]

Hi fallaciousreasoning What should actually happen to the search and the Delete Button. when the App is minimized? Its probably happening because there might be no styles for that perticular size ratio given to those button. I would like to take this issue.

[KSSaiTeja]

can i work on this issue to fix it..

[fallaciousreasoning]

@Nishchay1571999 there should be some minimum gap between the search button and the delete button (probably 8px)

[priyankuhazarika]

@bsclifton @fallaciousreasoning can you assign this to me, i can work on it!

[harshul786]

Hello Maintainers! @rebron @bsclifton @fallaciousreasoning

I'm pleased to let you know that I've fixed the overlapping bug described in this issue. I've created a pull request that addresses the problem.

You can review the changes in the PR above!

If there are any specific details or test cases you'd like me to provide, please feel free to let me know. I'm here to assist with any additional information or adjustments needed to get this issue resolved.

Thank you for maintaining this project, and I look forward to your feedback on the proposed fix!

Best regards.

[fallaciousreasoning]

Awesome, thanks @harshul786! That looks great - I'll just create a fork of your branch to run CI!

[fallaciousreasoning]

Sorry, I just had a look and noticed you've forked https://github.com/brave/chromium, rather than https://github.com/brave/brave-core - we don't actually modify that project directly, our patches live in https://github.com/brave/brave-core.

That said, it should be possible to make a very similar change in https://github.com/brave/brave-core. It looks like we already patch ui/webui/resources/cr_elements/cr_toolbar/cr_toolbar_selection_overlay.html with br_toolbar_selection_overlay_overrides.css, so it should be possible to add your CSS there directly (you'll have to include the selector).

Thanks for making a patch!

[harshul786]

@fallaciousreasoning I've implemented the changes as per your previous advice. Could you please review the updates? Thanks!

[GouravKumar13]

@bsclifton @fallaciousreasoning can you assign this to me, I can work on it!

[Dhanush-4554]

Hey! I think I can resolve this issue. Can you assign it to me @fallaciousreasoning, I can change the css here in right way. Thank you!

[trana5197]

@bsclifton @fallaciousreasoning I can work on it! Can you assign it to me? Thank you! Looking forward to make my first contribution.

[IAmRiteshKoushik]

Has this issue been resolved or is it still up for grabs ?

[fallaciousreasoning]

The issue is still up for grabs. There seems to be a lot of interest in working on it but @harshul786 has a partially finished PR, so if he's still working on it, I think we should let him finish it.

[harshul786]

I am working on it 🫡

[sabasyedcodes]

Hello I would love to contribute ! I think I can solve this issue. Can you please assign to me ?

[sabasyedcodes]

@harshul786 are you still working on it ?

[Rohankumarmenu]

I would like to work upon this. Can you assign the task to me.

[fallaciousreasoning]

@ImtiyazAly if you submit a PR, I'm happy to help you get it merged :smile:

[Hitanshu5979]

Hey @fallaciousreasoning I see that the overlapping issue is yet to be resolved. Do you mind if I try to fix this?

[bsclifton]

@Hitanshu5979 please do 😄 Ping us if you have a pull request or question

[Prashanthsai525]

@fallaciousreasoning is the issue fixed??

[esuleman]

is this issue fixed? if not I am willing to work on it

[fallaciousreasoning]

Not fixed yet :)

[Vedant767]

@fallaciousreasoning please assign it to me, I will fix it.

[fallaciousreasoning]

@Vedant767 if you (or anyone else) provides a PR I'm happy to review/merge it.

[Gajmain2020]

is this issue yet open? I want to contribute to this repo.

[bsclifton]

Yes hi folks - please do work on a fix and then share a link to the pull request here 😄 No need for assignment