Styling adjustments to timeline notifications

This commit is contained in:
Evan Hahn 2021-09-07 14:55:03 -05:00 committed by GitHub
parent 4bed918cf8
commit 7f34bedd87
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
22 changed files with 437 additions and 360 deletions

View file

@ -0,0 +1,38 @@
// Copyright 2021 Signal Messenger, LLC
// SPDX-License-Identifier: AGPL-3.0-only
import React, { ReactNode, forwardRef } from 'react';
import classNames from 'classnames';
type PropsType = {
icon: string;
contents: ReactNode;
button?: ReactNode;
isError?: boolean;
};
export const SystemMessage = forwardRef<HTMLDivElement, PropsType>(
({ icon, contents, button, isError }, ref) => {
return (
<div
className={classNames(
'SystemMessage',
isError && 'SystemMessage--error'
)}
ref={ref}
>
<div
className={classNames(
'SystemMessage__contents',
`SystemMessage__contents--icon-${icon}`
)}
>
{contents}
</div>
{button && (
<div className="SystemMessage__button-container">{button}</div>
)}
</div>
);
}
);