(core) Make mobile the default mode.

Summary:
- Make unsupported browser warning into an unobtrusive one-liner, similar in
  style to notifications.
- Move browser warning details into a support page, linked from "Learn more" link.
- Show different mobile and desktop warnings.
- Once dismissed, remember dismissal for a year rather than just for the session.
- Turn the Sign-In button (for anon users) into a menu (for the sake of exposing
  the Toggle Mobile Mode option)
- Improve styling of HomeIntro screens when on small screen.
- Flip the default for setting mobile viewport to true

Test Plan: Added minor unittest for localStorageBoolObs; fixed other affected tests.

Reviewers: paulfitz

Reviewed By: paulfitz

Differential Revision: https://phab.getgrist.com/D2738
This commit is contained in:
Dmitry S
2021-02-25 11:11:59 -05:00
parent 31ffd21b4e
commit d8d1a91beb
8 changed files with 119 additions and 76 deletions

View File

@@ -48,11 +48,15 @@ function createStorage(): Storage {
/**
* Helper to create a boolean observable whose state is stored in localStorage.
*
* Optionally, a default value of true will make the observable start off as true. Note that the
* same default value should be used for an observable every time it's created.
*/
export function localStorageBoolObs(key: string): Observable<boolean> {
export function localStorageBoolObs(key: string, defValue = false): Observable<boolean> {
const store = getStorage();
const obs = Observable.create(null, Boolean(store.getItem(key)));
obs.addListener((val) => val ? store.setItem(key, 'true') : store.removeItem(key));
const storedNegation = defValue ? 'false' : 'true';
const obs = Observable.create(null, store.getItem(key) === storedNegation ? !defValue : defValue);
obs.addListener((val) => val === defValue ? store.removeItem(key) : store.setItem(key, storedNegation));
return obs;
}