Fix DataHarmonizer scrolling issue

[pkalita-lbl]

Fixes https://github.com/microbiomedata/issues/issues/701

Testing instructions

• Create a new submission portal entry or open an existing one that you can edit, just ensure that in Step 4 (Multi-omics Data) the Metagenome checkbox under JGI is selected
• On Step 6 (the DataHarmonizer screen), ensure there are at least ~100 rows are filled out with at least an ID and that they all have "metagenomics" filled out in the "analysis/data type" column
• Click on the "JGI MG" tab
• Verify that you can scroll to the bottom and see all rows

Details

Previously we set a fixed height directly on the element (#harmonizer-root) where the DataHarmonizer instance is mounted. This was a bit janky because the 362px offset is a bit too brittle to changes in surrounding elements and it doesn't interact well with DataHarmonizer's (sort of odd) choice to have the height of its Handsontable instance be 75vh. So these changes:

• Override DataHarmoinzer's 75vh choice by telling the Handsontable instance to have a width and height setting of auto.
• Make the entire DataHarmonizer screen have a fixed heigh based on the height of the site's v-app-bar -- both controlled by the same variable.
• Set various flexbox and overflow settings to let the actual DataHarmonizer container shrink/grow to take up as much space as it can within the bounds of the fixed height element.

This also fixes the minor annoyance that when the red validation result box appears it doesn't push the row with the color key and submit button slightly off the bottom of the page.

[pkalita-lbl]

Okay addressing @marySalvi's comments:

• Yes, 100% is a better option than auto. That was the reason that the header row was being scrolled out of view in the video you posted. I guess I missed that because...
• The height and width settings on the Handsontable instance need to be set after every template update. I forgot that DataHarmonizer resets a bunch of Handsontable properties -- including height -- after you change templates. That's why the header would stay stuck at the top after changing tabs.
• With those changes made, the overflow: auto on #harmonizer-root is actually superfluous so it can be removed.

Just to make the intention of these changes more clear, the green box should be the only thing on the page that scrolls. Everything else on the page should be fixed. If any other element scrolls or if you ever get more than one set of scrollbars something is wrong.

[mslarae13]

Tested in dev. Looks fixed! When should I expect to see the fix in prod?

[pkalita-lbl]

June 24