Stop chat pane from getting overly tall in Chrome

Addressing 14589-gh-Automattic/woocommerce.com – HappyChat client on WooCommerce.com is getting inordinately big in some browsers.

I'm not able to reproduce this exactly, and I still have no idea what causes it – although I've observed two possibly related phenomena:

If the I need help with: search input dropdown list is very tall, it makes the iframe a lot taller.
If you remove the max height on .happychat__page some JS keeps incrementing the iframe's height attribute.

Changes in this PR

Changed max height of .happychat__page from 99vh to 768px, to avoid chat pane getting too tall.
Removed 18vh height of .happychat__composer, to avoid composer pane getting too tall.
Changed flex grow rule for .happychat__conversation::after element, so messages align to the bottom of the conversation window.
Replaced node-sass with sass – M1 macs don't support node-sass very well.
Updated version to 0.1.7.
Related diff and WCCOM PR.

Log in to Happy Chat staging environment. Accept chats and make sure you have English, WordPress.com and WooCommerce.com selected in Preferences.
If you don't have a file src/config/development.local.json, create it, and paste this in:

{
  "css_url": "http://localhost:9000/"
}

Run npm install && npm start.
View http://localhost:9000/example-woo.html in Chrome.
Open dev tools and add a rule height: 1500px; outline: 1px solid red; to the iframe, to mimic an overly tall container.
Enter some messages in the chat window. The conversation should be aligned to the bottom. The chat pane should be no taller than 768px.
If you want to see the initial support request form in the Happy Chat client again, end the chat in Happy Chat with the command /end.
If for some reason you can't get the chat session to start, add this around line 30 of targets/standalone/example-woo.html:

canChat: true,
entry: 'ENTRY_CHAT',

D89154-code