Hover to open collapsed blocks

  • Add the following CSS rules inside file custom.css:
    .ls-block:has( > div > div > .ls-block > div > div > div > div > div > div > div > span > div > div > span.show-on-hover ) > div > div > a > span.control-hide {
      display: inline;
    }
    .ls-block > div > div > .ls-block:has( > div > div > div > div > div > div > div > span > div > div > span.show-on-hover ) {
      display: none;
    }
    .ls-block:hover > div > div > .ls-block:has( > div > div > div > div > div > div > div > span > div > div > span.show-on-hover ) {
      display: block;
    }
    
  • Add this simple macro in file config.edn inside :macros { }:
    :collapse "<span class='show-on-hover' />"
    
  • Use the defined macro somewhere inside the block you want to hide, e.g.: {{collapse}}
  • To show the hidden block, hover on its parent block.
    • The parent block will indicate the presence of hidden block(s) with its arrow.
    • Obviously this won’t work for top-level blocks.