Delrifai/#420 navbar revamp

Dima Rifairequested to merge
delrifai/#420_navbar_revamp into develop

Hi Mohammad,

Per our conversation, the following are the changes :

  1. Convert the sync info into a button/icon => Done, also revamped the sync info dialogue (opens on click)
  2. Remove the witnesses link and add it to the Top Witnesses Card => Added this, to the top of the witnesses card and kept the see more link
  3. Push the Logo to the Left => Done
  4. Revamp the toggle switch of the theme into a button/icon => Done, used two types of icons here since the sun icon in fontawesome was not as friendly as the one used
  5. Revamp styles of the ViewPopper => Done
  6. Push all buttons/icons to the right before searchbar =>Done
  7. Revamp the search bar so that it has a standard width and is expanded on click => Done . I have updated the autocomplete input here which might affect the autocomplete under the search section to fulfill the requirements. I have also updated the styles of the autocomplete input to match the navbar. In addition, I trimmed that trx # to show in the results of the search as 10 characters instead full hash so I don't have a horizontal scroll bar.

Tests :

  1. Tested on Chrome and Mobile
  2. Sanity Check on Brave/FF
  3. All previous functionalities were preserved, including the block sync, the autocomplete inputs, and the viewpopper.
  4. NB: I tried to make minimal changes to the code without re-writes
  5. On Mobile, the side menu changed automatically with the changes

Merge request reports