Nitpick: Increase margin between consecutive markdown cells

[wasimsandhu]

This is a major nitpick, but the margin between consecutive markdown cell outputs (in run mode) is smaller than they would be if all the markdown was in one cell.

Here is the output split between two cells. The top margin of the last H1 heading is slightly smaller...

...than when the markdown text is in one cell:

The difference is incredibly small, but unfortunately noticeable to me.

The reason I can't put everything in one cell is because I'm making a notebook with lots of sections. I'd like to colocate the markdown text for the section with the variables interpolated in the text, so each section is in its own cell.

[mscolnick]

I noticed this too - I agree with should increase it. It might just be fiddling with the H1/H2 margins, if you (or anyone else) would like to make the change.

[Light2Dark]

hmm, I was thinking of increasing the margin between cells instead, to differentiate more between each cell. But, this is more universal.

// frontend/src/components/editor/output/Outputs.css
.Cell.published .output-area .output {
  margin-top: 1rem;
  margin-bottom: 1.5rem; // from 1rem
}

we could target h1/h2/h3 but it would need to be if they had no content before(?), eg. not all headings.

[mscolnick]

@Light2Dark, yea my original comment was to add a gap in VerticalLayoutRenderer:

    <VerticalLayoutWrapper invisible={invisible} appConfig={appConfig}
innerClassName={<do something here>}
>
      {showCode && canShowCode ? (
        <div className="flex flex-col gap-5"> {verticalCells}</div>
      ) : (
        verticalCells 
      )}

not sure if that would make other things look weird

[wasimsandhu]

Awesome thanks. I'll fiddle around with this at some point