move the nav controls to left in full screen mode - in macOS Fix #7872

[kumarrishav]

Test plan

1. Launch Brave on macOS
2. Click the green button in the top left to trigger full screen mode
3. Notice the back/forward arrows move after the traffic lights disappear
4. Move mouse into top left corner, hit green button to un-trigger full screen mode
5. Notice traffic lights appear again and back/forward arrows pop to the right again

Description

• Submitted a ticket for my issue if one did not already exist.
• Used Github auto-closing keywords in the commit message.
• Added/updated tests for this change (for new code or code which already has tests).
• Ran git rebase -i to squash commits (if needed).

Resolves #7872

Test Plan:

[cndouglas]

Unfortunately, this causes the back/forward buttons to be underneath the window controls in normal (non-fullscreen) mode.

[luixxiul]

Please look for something like :not(.fullscreen).

[kumarrishav]

@luixxiul How should i check, if screen is in full screen mode or not?
Update : i found it :)

[NejcZdovc]

@kumarrishav so instead of modifying less file, you need to modify some js file. More specifically app/renderer/components/navigation/navigator.js. Here you need to check if window is maximized and if so you need to adjust margin-left for div with class backforward. Here you can see our state file. Checkout isMaximized in ui section.

[kumarrishav]

@Liunkae review?

[NejcZdovc]

Please use cx syntax for class name, you can see example bellow. Thank you

[kumarrishav]

fixed. I wasn't aware of this utility func. @NejcZdovc Thanks .

[cndouglas]

Great job! Works for me. It even animates when you toggle fullscreen.

[bsclifton]

Very nice- works great 😄 Well done