This is a small css snippet to enable a columns/cards/kanban view of the current document.
It’s only a viewing layout hack, so don’t expect too much. It’s still useful for quick kanban or viewing lists side by side.
before/after gif (and with the base theme)
tweaking the cards size and spacing
I use it with the Stylus extension but it should work in a custom .css too (although I recommend the stylus addon so you can quickly enable/disable the view mode at will)
- grab it from github : logseq-dark-hpx/logseq-columns-mod.css at master · cannibalox/logseq-dark-hpx · GitHub
- if you use stylus, just click the ‘raw’ button, it should auto install
you can tweak the settings at the top of the css to define the size of the cards and the width of your page (it will modify the number of ‘cards’ par row). To adjustt the spacing and margins of each card, see the gif above.
- images can be resized to overlap multiple cards
- long embeds may go beyond the cards bottom edge
- when editing long blocks, the top lines may scroll out of view, it’s ok once editing is done, see the gif below (the height seems to be auto-calculated, I need to inspect that further)
the custom theme in the pics is
logseq-darker-hpx.user.css inside the same repo : GitHub - cannibalox/logseq-dark-hpx: CSS snippets and themes for www.logseq.com