We need variable-height paragraphs and revised flex-css for tables

[schanzer]

The fall2022-flex merger bought us horizontal flexibility: blank lines can now stretch to the end of the page, regardless of where they began.

However, this came at a cost: we lost vertical flexibility, so every line has a fixed height. 99% of the time this is fine, but there are several corner cases where we'd like the lines to be taller (e.g. - "what's on your mind?" pages, and others). So far, the only CSS solution I've found requires a fixed minimum height -- it solves all of our problems, but empty lines that used to take up no vertical space now do. And that breaks a lot of pages, by added extra height.

[ds26gte]

Actually, @include very religiously does not insert any extraneous newlines. I suspect there is an actual extra newline in the included file or newlines flanking the @include call. Please give an example where an unwanted newline is sneaking in and I'll investigate.

[schanzer]

@ds26gte see the file I checked in with a185f6dde2c911c8cac05cfc5a76ba459dd96bd3. When I open the inspector, here's what I see:

(I can confirm that the inline <style> tag is not the culprit - removing it does not remove the paragraph tag)

[schanzer]

There's been a regression in CSS-flex -- we need to revisit notice and wonder pages, as well as order-of-operation tables.

[schanzer]

After nearly a week of testing and reading StackOverflow threads, it appears that a table cannot be stretched to fill its container! I was able to construct a horrifically ugly hack that works for Notice and Wonder pages (only one body cell), but fails miserably for the many other workbook pages that involve tables. I think we may need to stick with fixed-height tables for the foreseeable future.

[schanzer]

AHA!! Maybe there's a way to make tables work after all -- by treating them as grids

[schanzer]

Some pages needed to drop a blank line to fit after tables were made adaptive. Keeping note of them for fixing once we have variable-height lines

• [x] computing-needs-all-voices/pages/advantages-of-diverse-teams
• [x] functions-make-life-easier/pages/sun
• [x] functions-dr/pages/fixing-purpose
• [x] linear-regression/pages/interpreting-regression-lines-n-rvalues
• [x] custom-scatter-plots/pages/defining-row-consuming-functions

Other issues:

• [x] Explore creating a separate class for FillVerticalSpace with headers
• [x] Landscape Pages aren't respecting margins
• [x] WBPages with multiple subsections have extra space (see functions-examples-definitions/pages/name)
• [x] Explore positioning all grid tds with relative

[schanzer]

Making notes for CSS cleanup:

• [x] See if we still need custom line heights in Design Recipes
• [x] See if we still need position:relative for body:not(.LessonPlan, .narrativepage) p
• [x] Investigate .fitb, .fitbruby, and .studentAnswer classes, which serve similar purposes and could probably share more CSS rules
• [x] See if there's a way to make DR heights more consistent
• [x] Can we use CSS display:grid to handle piecewise functions?

Build script changes:

• [x] Also, maybe see we can remove .clear from DR generation?

[schanzer]

These are fixed in #1148, pending review and approval