Try: Make Quick Toolbar styles feel more platform-specific

[iamthomasbishop]

Although we are building cross-platform with mobile Gutenberg, I think there are some things we can do to make the editor feel more "at-home" on each platform. As a "pilot", I propose we try styling the Quick Toolbar distinctly different so that it feels very native on each platform.

Note: disregard the icons/buttons on the toolbar – they're part of a separate exploration and irrelevant to this issue.

Current State

Currently, the Quick Toolbar looks like this:

It has a subtle border on top, and a fully opaque background. It feels very neutral, and maybe leaning towards Android slightly.

Proposal for iOS

A common tool in the iOS toolbelt is translucency. Let's try to utilize that design pattern – it looks like this:

Differences from current:

• Background opacity: 82%
• Background blur: 10
• No border-top, at any time

Proposal for Android

Diffs from current:

• When user is at the bottom of the post, there is no border-top
• When the user scrolls through the content, we add a subtle box-shadow. The CSS equivalent would be box-shadow: 0 -1px 1px rgba(0,0,0,0.1);