Menu Button | Move to Right
-
Lost my ability to move menu option to the right
HI Guys
I have some css that allows me to remove the min/max/close as it has no use on my system using a WTM.
I also have a float out side menu. But forpast 4 months i was able to have my menu bar on the right. After last update i can no longer drag it i asked in Linux forums see here for reference.
Please can somebody help me move it back over to the right i have added my current css here--
ModEdit: Title
-
Try this
#browser .window-buttongroup { display: none; } .vivaldi { order: 2; }
-
@sjudenim
HI
That is great and worked cheers.
Can i ask another query to see if this is possible.
With my current css the bottom icons stack tightly and out of order compared to no cssi would like the gaps to be a little bigger but i want the new tab + icon on the top
-
Looks like you're using vertical tabs and that you've moved the trash container. I haven't tested this with your layout but it should get it closer to what you want. Might need a little bit of tweaking but let's see
Try this
.tabs-left .toolbar-tabbar.sync-and-trash-container, .tabs-right .toolbar-tabbar.sync-and-trash-container { margin: unset !important; justify-content: space-evenly; } #tabs-tabbar-container .newtab { order: -1; }
-
@sjudenim the normal view without css is like this which is correct
But my css mod changes it for some reason but let me try your option and mess with it to see it it works. I will get back to you with a updateAs mentioned with no css mod it looks perfect but with mod even adding your suggestion not working yet
Here is what i am tryinghttps://logs.notifiarr.com/?4a72e60b8668f284#ACg6fGHdqXK3tnDumQTycTddCDcWbM5YoQ2cN4YKPwe6
-
Well if it's your code that is causing it, I would adjust it or remove the bit that is causing it. It looks like a resizing issue so check those widths that you are setting
-
@sjudenim
Hi how do i find the correct css name for the 3 icons in the side panelOpen New Tab
Synced Tabs
Show Closed Tabs -
-
Its not the trash can the names are
Open a New Tab
Show Closed Tabs
Synced TabsThese 2 icons are surrounding the "title open a new tab" button and you cannot even inspect the new tab when my css is in place.
I have edited the css to the correct names and i can now seperate them.
But now the issue i have is Vivaldi opens correctly the bar looks fine on hover it look ok but whe i take hover off the bar does not close correctly ./* Transition for tab containers */ #tabs-container.left, #tabs-subcontainer.left, #tabs-container.right, #tabs-subcontainer.right { min-width: 32px; transition: min-width 300ms ease-out; } /* Hover effect for expanding tab containers */ #tabs-container.left:hover, #tabs-subcontainer.left:hover, #tabs-container.right:hover, #tabs-subcontainer.right:hover { min-width: 150px !important; } /* Adjust width for tab workspace button */ .tabbar-workspace-button { width: 100% !important; } /* Adjust tabbar container width */ #tabs-tabbar-container.left, #tabs-tabbar-container.right { width: auto !important; min-width: 32px; } /* Adjust new tab button toolbar */ .button-toolbar.newtab { position: absolute; bottom: 0; /* Align at the bottom */ width: 32px; transition: width 300ms ease-out, left 300ms ease-out; } /* Expanded tabbar styling */ #main > .inner > div:has(#tabs-tabbar-container:is(.left, .right)) { position: absolute; z-index: 2; opacity: 1; background-color: rgba(255, 255, 255, 0.7); height: 100% !important; } /* Styling for transparent tabbar */ #browser.transparent-tabbar .inner > div:has(#tabs-tabbar-container:is(.left, .right)) { background-color: rgba(0, 0, 0, 0.5); } /* Margin adjustment for webpage stack */ .inner #webpage-stack { margin-left: 32px; } /* Margin adjustment for webpage stack when tabs are on the side */ .inner:has(#tabs-subcontainer:is(.left, .right)) #webpage-stack { margin-left: 64px; } /* Hide Window Close, Minimize & Maximize Buttons */ .window-minimize, .window-maximize, .window-close { display: none !important; } #browser .window-buttongroup { display: none; } .vivaldi { order: 2; } /* New tab button and other icons order */ .newtab { order: -1; position: relative; z-index: 3; } .synced-tabs-button { order: 1; position: relative; z-index: 2; } .toggle-trash { order: 2; position: relative; z-index: 2; } /* Ensure new tab button is not enclosed by other elements */ .toolbar-tabbar .newtab, #tabs-tabbar-container .newtab { position: relative; bottom: 0; margin: 0 auto; display: flex; align-items: center; justify-content: center; overflow: hidden; } /* Ensure proper transition for tab container */ #tabs-container.left:hover .button-toolbar.newtab, #tabs-subcontainer.left:hover .button-toolbar.newtab { width: 150px; } #tabs-container.left:not(:hover) .button-toolbar.newtab, #tabs-subcontainer.left:not(:hover) .button-toolbar.newtab { width: 32px; transition: width 300ms ease-out; } /* Additional fix to ensure the tab closes properly */ #tabs-container.left:hover .button-toolbar.newtab:hover, #tabs-subcontainer.left:hover .button-toolbar.newtab:hover { width: 150px !important; }