bookmarks side bar - 2 things i cannot solve

[adacom]

1 - vertical spacing of the bookmarks - this was done to death when i first joined and understood at that time that it was the way the bookmarks were coded - theres been many update to the browser and to the UI so just asking the question again - can the vertical spacing be changed or has nothing changed to allow that

2 - width of the side bar - all side bars can be changed in width and each one saved at any new setting BUT the smallest width is too wide for me - i run a js mod - shown below to reduce the width below the hard coded minimum - it works to a great degree but sometimes if i click in an area near the sidebar the sidebar width changes to the hard coded minimum - sorry not easy to describe

i can also reduce the min width using css but thats no better

part of the problem [i think] is the fact i change the page width to fill the gap left in reducing the sidebar below whats hard coded - the problem may be my code in that i am not widening the main window correctly>

code to reduce the bookmarks sidebar

/* Bookmarks width */

chrome.storage.local.get('REG_PANEL_LIST', function (pl) {
let lst = pl.REG_PANEL_LIST;
lst.forEach(function(panel) {
if (panel.id === "bookmarks")
panel.width = 170;
});
chrome.storage.local.set({REG_PANEL_LIST: lst});
})

code to widen the main page

/* moves main window left to fill gap left by reducing left toolbar */
#webview-container {
       margin-left: -33px !important;
}

any insight or help appreciated

[A Former User]

1. Yes, it has changed. Now it could require some tweaking, but it seems that all items are loaded now.
2. Sorry, what's the question? Also, I don't see any reason to move the #webview-container.

[adacom]

@potmeklecbohdan

will look at 1 - thanks

2 - i move/widen the webview container to fill the gap left by the narrowing of the bookmarks bar below what can be done manually - by doing that the webpage fills that gap rather than there being a stripe of the background colour - i may be doing it all wrong to achieve what i want as whilst it works its not without fault

with cssc code above

without css code

[adacom]

@potmeklecbohdan

well i tried the line spacing and got not very far - any clues or thoughts

[A Former User]

@adacom said:

2 - i move/widen the webview container to fill the gap left by the narrowing of the bookmarks bar below what can be done manually - by doing that the webpage fills that gap rather than there being a stripe of the background colour - i may be doing it all wrong to achieve what i want as whilst it works its not without fault

You must be using something another that causes the gap—with all mods disabled it's not there on my Vivaldi. Anyway—the best way how to solve this would probably be placing the code into a button (so that you could click it at any time).

[A Former User]

@adacom said:

well i tried the line spacing and got not very far - any clues or thoughts

This is probably the base (all the .React... are there just for fun)

.panel.panel-bookmarks .vivaldi-tree .ReactVirtualized__Grid.ReactVirtualized__List .ReactVirtualized__Grid__innerScrollContainer .tree-item {
    height: 20px !important;
    position: unset !important;
}

[adacom]

@potmeklecbohdan

that nearly works but like all other attempts i have seen fails when the sidebar is scrolles - the new items show but flash

[A Former User]

@adacom Ah, right, I didn't check it very well. It seems they did something very special: they load all items, but as soon it's scrolled, they load only those that should be viewed

[adacom]

@potmeklecbohdan

there have been a few attempts to solve this and yours is the simplest i have seen but all have the same result

the only other thing i have seen is that it could possibly be done using js - but thats way beyond me - it would be nice to have but sometimes second best is good enough

[A Former User]

OK, now I found a way, but it is quite tricky (I don't know how to put it into a mod and if this will work every time). For those interested—I executed

$0.__reactInternalInstance$q26lgiggg8.memoizedProps.children[0]._owner.memoizedProps.rowHeight = 20

on .panel-bookmarks .vivaldi-tree > .ReactVirtualized__Grid.ReactVirtualized__List

[adacom]

@potmeklecbohdan

that must be a step forward - i have no idea how to 'execute' something but the hopefully the collective brains here can help making that into a mod

[A Former User]

@adacom So, I have done something, but it more doesn't work than it works — see tree_view_spacing.js. If you have any idea how to fix it, I'll be very happy.

[adacom]

@potmeklecbohdan

not working for me but only tried it on my modified theme - will just add that mod later

going back to the narrow bookmarks bar and the space i showed above - i tried things with just that mod and everything else removed and still had problems - as ever that may be me so will try again

[A Former User]

@adacom said:

not working for me but only tried it on my modified theme - will just add that mod later

As I said: it more doesn't work than it works

[adacom]

@potmeklecbohdan

played with adding your code on various installs and as you say it works some of the time - when it does it seems to answer all questions but then it fails

way beyond me to even add comment on the code - you certainly have got further than anyone else on this - maybe its a simple fix - down to js experts to comment if anyone looks in here

[A Former User]

@adacom I think I finally found the way. It also changes the spacing of other trees (I haven’t tried fixing this issue yet). You need to have VHooks running to get this working.

vivaldi.jdhooks.onUIReady(() => vivaldi.jdhooks.require('common_VivaldiTreeList').defaultProps.rowHeight = 16);

[adacom]

@potmeklecbohdan

thanks - i think - just looked at vhooks and am totally confused but will see it i can work it out - if not you might be getting lots more questions

[adacom]

@potmeklecbohdan

ok - i found vhooks and downloaded the .bat file and jdhooks.js - after a few attemps i got the install to work [i think]

i now have a modified browser.html file calling jdhooks.js which is in the resources/vivaldi dir

and i am stuck - what do i do with your code above - theres a 10 page thread on hooks - i have read some of it and read the github page but its as clear as mud at the moment

[den_po]

@adacom download the whole zip archive from github, there is a green download button

[adacom]

@den_po

i have done that but still have no idea what to do with the code above - its late here so its for another day!