changing the tab thumbnails position and size



  • hey everyone , you got a real nice browser here with a moderately big community this could become THE best browser , its very nice that the ui and funcyionality is customizable like that .

    i would like to change the thumbnails ..in vertical mode they really take away alot of space .. on my firefox i have it like this:
    alt text

    thats waht i wanna achieve with custom css , withose really small thumbnails in the same row as the tab title..

    which classnames/ids do i have to look out for ?

    thanx



  • You can look for all the element names yourself pretty comfortable. If you need further help just ask here.
    Inspecting with devtools



  • ey very cool that helped me very much . thank you

    i slapped this together, looks good so far :
    alt text

    but now the problem is that the drag and drop function still uses the old sizes for the tabs. i bet thats a bit harder to mod , any idea where the code for that is ? maybe i can inject a variable with value "40px" instead of the computed one from the tabs script

    code:

    .tab-position {
    height: 40px !important;
    position: static !important;
    }
    .tab-header{
    flex: 4 1 40px !important;
    padding: 0 0 0 0 !important;
    }
    .tab{
    font-size: 12px !important;
    flex-flow: row-reverse wrap !important;
    }
    .tab .thumbnail-image {
    margin-left: 0px !important;
    margin-right: 0px !important;
    margin-bottom: 0px !important;
    width: 45px !important;
    height: 40px !important;
    }



  • I really like the idea, it looks better than the standard implementation for tabs on the side with tab thumbnails enabled. I think most people just have them disabled and use popup thumbnails with this setup instead.

    And yeah, I think you are right and you need javascript to accomplish this. The Vivaldi code for automatically resizing the height of the tabs (with thumbnails enabled) probably can't be adjusted with css. Not only drag and drop, but stacking tabs is also affected.

    You can put .tabs-right in front of your elements to only have it customise this specific tab position. And I see that you are using tree style tabs on Firefox -- you can take a look at this extension, if you want something similar for Vivaldi too. Other than that I don't think I can be of much help. :/



  • @luetage said in changing the tab thumbnails position and size:

    I really like the idea, it looks better than the standard implementation for tabs on the side with tab thumbnails enabled. I think most people just have them disabled and use popup thumbnails with this setup instead.

    And yeah, I think you are right and you need javascript to accomplish this. The Vivaldi code for automatically resizing the height of the tabs (with thumbnails enabled) probably can't be adjusted with css. Not only drag and drop, but stacking tabs is also affected.

    You can put .tabs-right in front of your elements to only have it customise this specific tab position. And I see that you are using tree style tabs on Firefox -- you can take a look at this extension, if you want something similar for Vivaldi too. Other than that I don't think I can be of much help. :/

    that extension doesn´t seem to work anymore
    There were warnings when trying to install this extension:
    Unrecognized manifest key 'sidebar_action'.

    but i also think that doesn´t cut it ... id rather use the native tabs

    im not yet ready to switch over from firefox but i already made some modifications and over the year i hope we get maybe native tree tabs.

    since the creators are actively asking for feature requests , i see a good future for this browser.


Log in to reply
 

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