Introduce a new design for the left pane

This commit is contained in:
Evan Hahn 2021-10-12 18:59:08 -05:00 committed by GitHub
parent d60600d6fb
commit 35a54cdc02
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
63 changed files with 1205 additions and 576 deletions

View file

@ -8,8 +8,10 @@ import { DialogType } from '../types/Dialogs';
import { LocalizerType } from '../types/Util';
import { Intl } from './Intl';
import { LeftPaneDialog } from './LeftPaneDialog';
import type { WidthBreakpoint } from './_util';
export type PropsType = {
containerWidthBreakpoint: WidthBreakpoint;
dialogType: DialogType;
didSnooze: boolean;
dismissDialog: () => void;
@ -24,6 +26,7 @@ export type PropsType = {
};
export const DialogUpdate = ({
containerWidthBreakpoint,
dialogType,
didSnooze,
dismissDialog,
@ -49,7 +52,11 @@ export const DialogUpdate = ({
if (dialogType === DialogType.Cannot_Update) {
return (
<LeftPaneDialog type="warning" title={i18n('cannotUpdate')}>
<LeftPaneDialog
containerWidthBreakpoint={containerWidthBreakpoint}
type="warning"
title={i18n('cannotUpdate')}
>
<span>
<Intl
components={[
@ -73,6 +80,7 @@ export const DialogUpdate = ({
if (dialogType === DialogType.MacOS_Read_Only) {
return (
<LeftPaneDialog
containerWidthBreakpoint={containerWidthBreakpoint}
type="warning"
title={i18n('cannotUpdate')}
hasXButton
@ -113,7 +121,12 @@ export const DialogUpdate = ({
);
return (
<LeftPaneDialog icon="update" title={title} hoverText={versionTitle}>
<LeftPaneDialog
containerWidthBreakpoint={containerWidthBreakpoint}
icon="update"
title={title}
hoverText={versionTitle}
>
<div className="LeftPaneDialog__progress--container">
<div
className="LeftPaneDialog__progress--bar"
@ -133,6 +146,7 @@ export const DialogUpdate = ({
return (
<LeftPaneDialog
containerWidthBreakpoint={containerWidthBreakpoint}
icon="update"
title={title}
hoverText={versionTitle}