Andy Matuschak mode - V2.7 (updated for 0.7+ new panes)

[Wet]

@death.au

/* Andy Matuschak mode! modified so that the first pane is "sticky" */

/* everything under .mod-root now. Don't want Andy messing with sidebars */
/* also, Andy only makes sense for vertical splits, at the root level, right? */
.mod-root.workspace-split.mod-vertical {
  overflow-x: auto;
  --header-width: 36px;
  --pane-width: 700px;
  /* <- 36px is the header height in the default theme */
  --padding: 10px;
  background-color: var(--background-secondary);
}

.mod-root.workspace-split.mod-vertical>div {
  min-width: calc(var(--pane-width) + var(--header-width));
  /* <-- 700px is the default theme's "readable" max-width */
  box-shadow: 0px 0px 20px 20px rgba(0, 0, 0, 0.25);
  position: sticky;
  left: 0;
}

.mod-root.workspace-split.mod-vertical .workspace-leaf.mod-active,
.mod-root.workspace-split.mod-vertical>div:first-of-type {
  z-index:1;
}

/* shift sticky position, so titles will stack up to the left */
/* This will currently stack to a maximum of 10 before resetting */
.mod-root.workspace-split.mod-vertical>div:not(:first-of-type) {
  left: calc((var(--header-width) * 0) + var(--pane-width) + var(--header-width) + var(--padding));
  margin: var(--padding);
  max-height: calc(100% - var(--padding) - var(--padding));
}

/* make the fake drop target overlay have a background so you can see it. */
/* TODO: figure out how the fake target overlay works so we can put the title back, too */
.workspace-leaf:not(:first-of-type) .workspace-fake-target-overlay {
  background-color: var(--background-primary);
}

Awesome! I removed most of the box shadow, the padding at the top right pane and the line which made the active right pane sit on top of the others.
Then I adapted the pane width a bit.

This is exactly how I want it.
Thanks a lot. Looking forward to the plugin.

[jacklaing]

Awesome work as always! I also got rid of the focusing on the right panels and the padding, because it looks cleaner and in practice I think it’ll be less complicated to handle scrolling between them.

The main thing I was looking for was a “main panel” and the ability to have limitless pages on the right hand side.

I think I can now rest happy with it as it is for my workflow, so thanks again

[santi]

@death.au

This code forgoes the stacking titles, and allows the active pane to sit on top of all the others, while keeping a left “main” pane.

This is by far my favorite version of Andy Mode. Thank you so much for putting this together it works perfectly with version 0.9.6

[yalcin]

How do we actually activate this feature?

[ryanjamurphy]

With Custom CSS enabled in Preferences → Appearance, copy the CSS above (e.g., the code in death’s reply above) onto the end of obsidian.css at the root of your vault. Then, reload Obsidian (e.g., cmd+r).

[death.au]

The plugin API is available for insiders now, so I’m most likely going to be working on the plugin version of this from now on: Sliding Panes (Andy Matushcak Mode) Plugin

Of course, as a plugin it will be that little bit harder to customize to your own personal tastes, as I know a few of you have done. I also plan to introduce new options and features down the line like having a ‘main’ panel and/or pinning panels (these kinds of things are probably a while off yet — I suddenly find myself with a lot of projects going on at once ).
All that is to say that this thread isn’t necessarily dead yet, and if you have questions or comments or want to use this CSS and tweak it to your liking, I’ll still be happy to help.

[ajstont]

@death.au Nice work, this is really helpful. Thank you!

[Yllis]

@death.au Thanks for this awesome job !
Don’t know why sliding windows doesn’t work in my obsidian (O.9.7 in Ubuntu/Gnome). When I open a file (clicking in the left panel or with a link, it close the one already opened).

[Klaas]

@Yllis: do you have 3rd party plugins enabled in the settings?

[Yllis]

@Klaas No I don’t

[death.au]

@Yllis

When I open a file (clicking in the left panel or with a link, it close the one already opened).

This is normal behaviour. Obsidian opens links in the current pane by default — you have to shift+click to open in a new pane.

[Yllis]

@death.au OK. Thanks

But what I don’t understand is how the sliding effect works ?
One of the big power of the Andy Matushak is the possibilty to slide the pane.

[ryanjamurphy]

Open multiple panes with shift+click, then use horizontal scrolling to slide back and forth.

https://i.imgur.com/Pj5ETaB.gif(image larger than 4096KB)

[Yllis]

Thanks very much !

[apris]

Thank you for the greate tip.Maybe silly question - where should past all this code to get panes working?

[ryanjamurphy]

In the upcoming public release, you’ll be able to enable it natively as a plugin. If you don’t want to wait, you can paste it in a file titled obsidian.css in the root directory of your vault. If it doesn’t exist, create it!

[apris]

Thank you for your fast help!

[BoatyMcBoatface]

A bit late to the party on this one… This looks great and I would really like to try it out, but I cannot get the “scroll” like feature to work in the original post. My pages are just opening as normal side-by-side. I’ve tried on Linux and Windows machines.

I’ve copied the css, and notice a slight change in the UI (so it looks like it is taking the updated css code) - also I’ve not added any other custom css.

What am I missing here?

[kimstacks]

Is there an official API for this yet?

[ryanjamurphy]

By API, do you mean plugin? If so, yes. Check the plugin marketplace available in the latest Insider build!