• Browser
  • Mail
  • News
  • Community
  • About
Register Login
HomeBlogsForumThemesContributeSocial

Vivaldi

  • Browser
  • Mail
  • News
  • Community
  • About

Navigation

    • Home
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    1. Home
    2. Desktop
    3. Desktop Feature Requests
    4. Done
    5. Combine Window Title and Address Bar when Tabs are on the Side

    Solved Combine Window Title and Address Bar when Tabs are on the Side

    Done
    37
    66
    12.2k
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • scw1611
      S
      scw1611 @bimlas
      last edited by

      @bimlas Can you share this css code

      1 Reply Last reply Reply Quote 0
      • geektbee
        G
        geektbee
        last edited by

        The code at
        https://github.com/Sporif/CustomHooks/blob/master/hooks/combine-header-toolbar.css
        was working perfectly wonderful for me for almost the past year. But, today..... I clicked Update on my browser to bring it up to 3.3.2022.36, and now, it looks silly. The Vivaldi Menu and Minimize, Maximize, and Exit buttons are overlaying on top of some of the other items. I attempted to modify the code on my side to see about fixing it, but to no avail, b/c I'm no programmer/developer. If any one has any insight to get this back to proper appearance, I would not be sad for you to take a crack at it.

        After failing at modifying the css, I thought to try to customize the toolbar, and add spacers to each end of the toolbar itself, but couldn't find how to do that. Otherwise, that'd've been a reasonable solution.
        Thanks everyone!

        1 Reply Last reply Reply Quote 0
        • Steffie
          S
          Steffie
          last edited by

          I have been using @LonM's piece of magic since 5/6/20, & it continues to work brilliantly for my Snapshots & Stables.

          https://forum.vivaldi.net/post/375845

          https://forum.vivaldi.net/topic/47673/move-v-menu-to-bar-below-then-eliminate-entire-wasted-row-space/7?_=1591365308113

          โ™€ ๐Ÿ‡ฆ๐Ÿ‡บ

          geektbee
          G
          1 Reply Last reply
          Reply Quote 0
          • geektbee
            G
            geektbee @Steffie
            last edited by geektbee

            @Steffie
            I just tried that, thanks, but the V icon (and the hamburger) are still laying on top of the Back button.

            92329e93-28b4-4a05-8719-6ba3143685a0-image.png

            d1aec705-f431-475e-99ad-64105cce3512-image.png

            Steffie
            S
            2 Replies Last reply
            Reply Quote 0
            • Steffie
              S
              Steffie @geektbee
              last edited by Steffie

              @geektbee

              4f285b93-7055-440c-bc3c-cb1892ca5f61-image.png

              0311f9e9-8702-4398-8a57-e46e2cf78406-image.png

              โ™€ ๐Ÿ‡ฆ๐Ÿ‡บ

              1 Reply Last reply Reply Quote 0
              • Steffie
                S
                Steffie @geektbee
                last edited by

                @geektbee said in Combine Window Title and Address Bar when Tabs are on the Side:

                the V icon (and the hamburger) are still laying on top of the Back button

                Aha, now i see what you mean, but it's simple to work around via a kludge.

                1. I temporarily disabled Native Window & relaunched so i could see what's happening -- this showed me:what you said is true & i'd not noticed before, coz i long ago customised this bar.
                2. So i Shift-dragged a useless-to-me icon up from the Status Bar, & placed it where the V will end up.
                  a151b033-c92d-4bd2-8f5f-4bb3e3e489c1-image.png
                3. Re-enabled NW then relaunched.
                4. Huzzah!
                  83265032-1e61-406b-a2b4-233841976df1-image.png

                โ™€ ๐Ÿ‡ฆ๐Ÿ‡บ

                geektbee
                G
                1 Reply Last reply
                Reply Quote 0
                • geektbee
                  G
                  geektbee @Steffie
                  last edited by

                  @Steffie
                  Yeah, that's takes care of the left side.... but not the right ๐Ÿ˜ž Minimize, Restore, & Exit are overlaying the end of the address bar, Profile options, and Extension Expander. I can't win.....

                  342655c5-8da7-4f8d-90a5-68cc612ff77e-image.png

                  Steffie
                  S
                  T
                  2 Replies Last reply
                  Reply Quote 0
                  • Steffie
                    S
                    Steffie @geektbee
                    last edited by

                    @geektbee I'm not seeing that effect here, so i'll bow out. Good luck.

                    โ™€ ๐Ÿ‡ฆ๐Ÿ‡บ

                    1 Reply Last reply Reply Quote 0
                    • T
                      tellah @geektbee
                      last edited by

                      @geektbee I'm using the same css as you and getting the same issue (both left and right). Did you find any fix?

                      1 Reply Last reply Reply Quote 0
                      • zo1d
                        Z
                        zo1d
                        last edited by zo1d

                        @geektbee @tellah

                        I've also been using the script from the first post for a long time and it stopped working with 3.3. The reason is that some of the elements in the browser were renamed.

                        I just had a look, and for me, the fix was as simple as replacing all instances of the following in the base script:

                        .toolbar.toolbar-addressbar
                        

                        with:

                        .UrlBar.toolbar.toolbar-mainbar.toolbar-large
                        

                        Now (everything that I use) looks just like it did before 3.3.

                        I hope that helps you both.

                        scampbll
                        S
                        C
                        3 Replies Last reply
                        Reply Quote 3
                        • scampbll
                          S
                          scampbll @zo1d
                          last edited by scampbll

                          @zo1d

                          This kept them from completely overlapping, thanks.

                          They were still pretty crowded, but tweaking padding-left from 24px to 40px under "Reduce toolbar size for vivaldi button" gave them a comfortable margin. Probably dependent on screen resolution.

                          1 Reply Last reply Reply Quote 1
                          • C
                            chiefsucker @zo1d
                            last edited by

                            @zo1d Unfortunately this doesnโ€™t work on macOS. Is there any way to merge the window title & address bar into one on the Mac?

                            hlehyaric
                            H
                            1 Reply Last reply
                            Reply Quote 0
                            • hlehyaric
                              H
                              hlehyaric @chiefsucker
                              last edited by

                              @chiefsucker It's better to ask for a mod on Modification forum board than on FR board.

                              1 Reply Last reply Reply Quote 4
                              • A
                                andjil
                                last edited by

                                This is a great request to make Vivaldi stand out in the browser wars. Should be marketed as Laptop Mode, as it's most usable on laptops with limited vertical pixels, like 1920x1080. I'm using combine-header-toolbar.css with the bookmarks and tabs to the left, with the regular tabs panel removed. Absolutely love it!

                                1 Reply Last reply Reply Quote 0
                                • C
                                  CubeApril
                                  last edited by

                                  This worked great for me on macOS:

                                  #browser #header {
                                    display: none;
                                  }
                                  
                                  mzayani
                                  M
                                  2 Replies Last reply
                                  Reply Quote 1
                                  • mzayani
                                    M
                                    mzayani @CubeApril
                                    last edited by

                                    This post is deleted!
                                    1 Reply Last reply Reply Quote 0
                                    • mzayani
                                      M
                                      mzayani @CubeApril
                                      last edited by

                                      @cubeapril now when you open the preferences you cannot close it !!!

                                      D
                                      1 Reply Last reply
                                      Reply Quote 0
                                      • D
                                        dude99 @mzayani
                                        last edited by

                                        @mzayani add :not(.is-settingspage) after #browser

                                        Sorry, I'm currently hiatus from updating any of my CSS mod until further notice...
                                        1 Reply Last reply Reply Quote 2
                                        • N
                                          ngburke
                                          last edited by

                                          I have made some modifications to the original based on comments in this thread and posted it in a github repo. You can see it here: https://github.com/ngburke/vivaldi-custom-ui. Only tested on windows so far.

                                          sedative29rus
                                          S
                                          valsuraev
                                          V
                                          J
                                          3 Replies Last reply
                                          Reply Quote 3
                                          • sedative29rus
                                            S
                                            sedative29rus @ngburke
                                            last edited by

                                            @ngburke This works fine on Linux (XFCE). Thank you.

                                            1 Reply Last reply Reply Quote 1
                                            Loading More Posts
                                            • Oldest to Newest
                                            • Newest to Oldest
                                            • Most Votes
                                            Reply
                                            • Reply as topic
                                            Log in to reply
                                            • 1
                                            • 2
                                            • 3
                                            • 4
                                            • 1 / 4
                                            • First post
                                              Last post

                                            Looks like your connection to Vivaldi Forum was lost, please wait while we try to reconnect.

                                            Copyright © Vivaldi Technologies™ โ€” All rights reserved. Privacy Policy | Code of conduct | Terms of use | Vivaldi Status