The new Bookmarks feature makes it easier to focus on important things, but it is still possible to create too many bookmarks and get lost between them. And bookmark groups, as cool and useful as they are, can turn into just another infinite tree. It occurred to me, that it would be really helpful to have separate bookmarks sets for separate workspaces. This way you should always see only the things you need right now.
Currently it is not an option, but I figured out how to do something like this using bookmarks groups, Workspaces Plus plugin and some custom css snippets.
First we need to install the Workspaces Plus plugin. It is allowing us to use different css for different workspaces.
Next create some workspaces and some bookmarks groups and add bookmarks to them.
Now what we will do is to hide certain bookmarks groups from certain workspaces using css. For example, we have a workspace called “Work” and a bookmarks group called “Fun bookmarks”. To hide this group and all bookmarks in it from this workspace we can use this css snippet:
body[data-workspace-name="Work"]
.workspace-leaf-content[data-type="bookmarks"] > .view-content > div >
.tree-item[data-path="Fun bookmarks"] div {
font-size: 0;
padding: 0;
margin: 0;
}
body[data-workspace-name="Work"]
.workspace-leaf-content[data-type="bookmarks"] > .view-content > div >
.tree-item[data-path="Fun bookmarks"] svg {
display: none;
}
We can use different approach and instead hide all other bookmarks groups except one. For example, we have a group called “Work bookmarks” and want it to be the only group visible. We will need this css:
body[data-workspace-name="Work"]
.workspace-leaf-content[data-type="bookmarks"] > .view-content > div >
.tree-item:not([data-path="Work bookmarks"]) div {
font-size: 0;
padding: 0;
margin: 0;
}
body[data-workspace-name="Work"]
.workspace-leaf-content[data-type="bookmarks"] > .view-content > div >
.tree-item:not([data-path="Work bookmarks"]) svg {
display: none;
}
Now we can change what bookmarks we can see by simply switching workspaces. It can be useful to have at least one workspace where all bookmarks are visible, so we can easily manage them.
This css examples only affect top-level bookmarks and bookmark groups. It should be edited if you want to hide some of nested elements separately.
Note that I am using font-size, margins and paddings to hide elements. Do not use display: none, except for icons, because it would make the bookmark tree to act weird.