Alert box with quite lengthy content cannot be closed

[luixxiul]

Test plan

#8475 (comment)

---

Describe the issue you encountered:
Alert box with quite lenghty content cannot be closed. This could be used by an attacker (despite of low security concern).

• Brave Version (revision SHA): 0.13.5

• Steps to reproduce:

  1. Open https://jsfiddle.net/c5o7arqu/
  2. Make the browser window small
  3. Click "OK"

• Actual result: You cannot scroll the alert box to the "OK" button

• Expected result: It should be possible to scroll the alert box to the button

• Screenshot if needed:

• Any related issues: Display menubar on hover in fullscreen mode (on Windows) #2775 Rework alert/confirm to be tab-modal (instead of application-modal) #7107

[NejcZdovc]

Looks ok on macOS, 0.13.5 or maybeI didn't understand the issue

[luixxiul]

It is because the monitor resolution on macOS is higher than Windows. On macOS you can reproduce the issue by adding more text via devtool.

On Windows 7 on 1152x864 monitor I get this:

What we would like to have is:

Is it clear?

[NejcZdovc]

Got it. We need overflow. Should be an easy fix

[srirambv]

Its really bad on Windows. This is on maximized window

[NejcZdovc]

We should also add some margin on the side

[bsclifton]

Good catch @luixxiul! I'll pull this into 0.14.2 😄

[luixxiul]

ReleaseNote should be fixed as well:

STR:

1. Set BRAVE_UPDATE_VERSION=0.8.3
2. Start the browser
3. Update the browser

Currently ReleaseNote is so simply coded that we should upgrade it in a future:

browser-laptop/app/renderer/components/releaseNotes.js

Line 24 in b005933

<div>{this.props.metadata.get('notes')}</div>

[jonathansampson]

The dialog also needs to have a max-width, IMHO:

Supporting a scrollbar would be idea, but the content itself should be the only thing to scroll. The dialog itself should probably have a fixed height too.

[cezaraugusto]

I know this is supposed to be a low hanging fruit for first-time contribs but this is really bad UI so I'm taking