Is it possible to get something like this?


  • Vivaldi Translator

    The start page should have a transparent tab bar (maybe with a bit of glassy effect but not too shiny or vista like).

    I'm talking about a vertical tab bar here.
    If you set an image as the start page background, the transparent tab bar sits on top of the image just like the MS Windows' task bar's behaviour with the desktop wallpaper. On switching to a webpage, the tab bar should behave normally. The transparent effect disappears and looks how it is currently set and if the user has defined it to take the colour of the webpage, it should do that.

    So, the glassy tab bar can only be seen on the start page.
    The text colour (tab bar's) should switch between dark and white automatically based on the colour below the task bar.

    And, things should be resource friendly too 😃



  • Do you want a custom mod for this? If so you have posted in the wrong forum. Generally it has to be an overlay, since otherwise the tab-bar doesn't have the startpage background beneath, there is no other option. Then you need the overlay for the tab bar, which is available here: https://forum.vivaldi.net/topic/21528/animated-overlays. If you have that implemented to your liking you can set the #tabs-container background color to something rgba and play with the opacity, for simplicities sake, If you get all of this working we can talk about making this exclusive to the startpage, but no idea if that's possible.


  • Vivaldi Translator

    @luetage Yeah but, having the tab bar as an overlay will cause the web pages to malfunction right?

    My request is like:
    Transparent tab bar on the start page
    Normal tab bar on web pages

    I understand the issue now. What I am looking for is completely opposite to the way the tab bar functions.



  • @yes-aravind Well, not really, but if you want it exclusive the problem is that both the webview container and the tabs container are children of the inner class. Maybe you could detect this with javascript, but it's not simple.


  • Vivaldi Translator

    @luetage Nice to hear that!. I kindly request you to add this to your future MOD project list.. Would be great to see it go live some day 🙂



  • Close, but not quite. You can do it for side tabs and anything that's an internal page.

    0_1517683990422_close.gif

    Unfortunately, I don't see an esay to way differentiate between the tab page and the settings page, so you would need to disable the option for "open settings in a tab".

    Note: this is not tested beyond a basic check of a tab switch between an basic tab, the start page and the settings page. Also, you'll need to fiddle with the "180px" until it matches however wide your tabs are.

    #tabs-container {
        z-index: 1;
        background: transparent !important;
    }
    .active.internal.visible.webpageview {
        left: -180px
    }
    .active.visible.webpageview:not(.internal) {
        background: var(--colorAccentBg);
        padding-left: 180px;
        left: -180px;
    }
    .startpage {
        padding-left: 180px;
    }
    

  • Vivaldi Translator

    @lonm Thank you so much for coming forward. I just tested it and this is what I've got so far. And, as you told, I'll just try to play with the code you have provided.

    Web page
    0_1517729431454_97f4c081-c239-4443-8e32-4f2cd7e57067-image.png

    Start page
    0_1517729498401_442cb9e8-31cf-4ac4-84f4-d84a71794a0a-image.png



  • @yes-aravind If your tabs are on the right then it may be necessary to "flip" all the values from being left to right.


  • Vivaldi Translator

    @lonm I'll let you know the result.


  • Vivaldi Translator

    @lonm Got it! 🙂

    Start page:
    0_1517738661426_ae5ff754-e647-46d9-b694-73c42bd91a45-image.png

    Webpage:
    0_1517738760817_9560cf83-d1d2-453e-990f-0ca2ca08d44e-image.png

    That was lovely! Thank you so much for your effort @LonM


 

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