Implement bottom toolbar option

[gh0sti]

Problem Description

Setting to change UI to have searchbar/omnibox and Tabs on bottom of the screen just above settings

Feature Overview

similar to Apple's new Safari iOS 15 update, the search bar is now on the bottom of the page.

Design

Implementation Details

User Experience

1. with phone screens getting even bigger this would allow end users to be able to reach and touch the search bar for quicker typing of URLs.
2. This would also allow moving between tabs to be easier by having navigation closer to the bottom of the screen or even having similar iOS 15 safari feature to swipe between tabs.

Additional information

[TaxingAuthority]

I know this feature request is six months old but I want to add another plug for the feature. The Firefox iOS app just implemented this option in their latest release. Really helps with navigation while web browsing.

[riddlerboss248]

Posting a quick design idea for the bottom adressbar (see attached images). Originally posted on reddit ( https://www.reddit.com/r/brave_browser/comments/u3pfph/my_take_on_bottom_placed_adressbar_on_brave_ios/i4qosq2/?context=3 )

[iccub]

Thank you :)

[foliot]

It was a weird transition at first when Safari moved the address bar to the bottom, but it turned out to be a wonderful change that made the controls more reachable, especially in one-handed operation. I think replicating the iOS interface as much as possible would be a nice improvement here.

[iccub]

Good news: the bottom toolbar is ready and can be tested in public beta :) build number 1.44 (22.9.27.21)

You can use this link to give it a try https://testflight.apple.com/join/Trcbh1o3 The feature should go live early next next month

[gh0sti]

@iccub thanks, looks good so far. Would it be possible to get the swipe feature similar to safari where I can swipe up to go into the tab switcher? Or possible to also include tab hider when not touching the omnibox?

[kylehickinson]

@gh0sti If you swipe up on the URL bar it will already bring up the tab switcher, there is just no interactive aspect to it. Not sure what you mean by tab hider.

[gh0sti]

@gh0sti If you swipe up on the URL bar it will already bring up the tab switcher, there is just no interactive aspect to it. Not sure what you mean by tab hider.

so that makes it easy to move into tab switcher. However when you want tabs shown above omnibox in portrait mode they take up some screen realestate. Is there a way to allow for tabs in portrait mode but to hide/unhide them when you want to see open tabs on a webpage above the omnibox?

[iccub]

hi @gh0sti maybe you can show us what do you mean? post a screenshot or a short recording we are pretty close to what Safari currently offers

[Uni-verse]

Verified using 1.44 (22.10.10.19) & 1.44 (22.10.13.13) using the following device(s):

iPhone 12 | iOS 16.x iPhone XR | iOS 15.x iPhone X | iOS 14.x iPad (7th Gen) | iPadOS 15.x

Bottom tool bar

- Verified bottom tool bar is enabled by default - Verified tabs bar is set to landscape by default - Verified the following scenarios while bottom bar is enabled: 1. Turning off tabs bar 2. Setting tabs to `On` 3. Changing device orientation with default settings 4. Using `Find in Page` 5. Using `Reader mode` with tabs On/Off 6. `Switching tabs` via the tabs bar 7. Enabling bookmarks shortcut 8. Hiding Rewards Example | Example | Example -|-|-  |  | 

Top Tool bar

- Verified changing Tabs settings to Top Bar will move the url + tabs bar to the top - Verified the following scenarios while Top Bar is enabled: 1. Turning off tabs bar 2. Setting tabs to `On` 3. Changing device orientation with default settings 4. Using `Find in Page` 5. Using `Reader mode` with tabs On/Off 6. `Switching tabs` via the tabs bar 7. Enabling bookmarks shortcut 8. Hiding Rewards 9. Private Browsing Mode/Private Tabs Example | Example | Example | Example -|-|-|-  |  |  | 

Settings Menu

- Verified added switch under Tabs with options for url bar configuration - Verified Tabs menu is displayed in landscape orientation - Verified Tabs section allows user to switch between Bottom and Top Bar - Verified option contains checkmark to indicate which option is currently selected Example | Example -|-  | 

iPad

- Verified `Tabs Bar` switch moved to `Tabs` section - Verified enabled `Tabs Bar` will show tabs below the url bar - Verified Tab settings are retained when upgrading from 1.43.x Example | Example -|-  | 

Upgraded Profile (Tabs in Landscape Only)

- Ensured that Tabs bar settings will be retained when upgrading from version 1.43 - Ensured that user is able to switch to using Bottom Bar after upgrading the app - Ensured that changing tabs setting from landscape to On/Off is working and user is able to open new tabs as well as switch between tabs via the tabs bar. 

Upgraded Profile (Always Show Tabs)

- Ensured that Tabs bar settings will be retained when upgrading from version 1.43 - Ensured that user is able to switch to using Bottom Bar after upgrading the app - Ensured that changing tabs setting from landscape to On/Off is working and user is able to open new tabs as well as switch between tabs via the tabs bar. - Ensured that hiding rewards option and as well as showing bookmarks is retained when upgraded 

Upgraded Profile (Never Show Tabs)

- Ensured that Tabs bar settings will be retained when upgrading from version 1.43 - Ensured that user is able to switch to using Bottom Bar after upgrading the app - Ensured that changing tabs setting from landscape to On/Off is working and user is able to open new tabs as well as switch between tabs via the tabs bar. 

Upgraded Profile (Private Browsing Mode Enabled)

- Ensured that Tabs bar settings will be retained when upgrading from version 1.43 - Ensured that user is able to switch to using Bottom Bar after upgrading the app - Ensured that changing tabs setting from landscape to On/Off is working and user is able to open new tabs as well as switch between tabs via the tabs bar.