rmorawski/standardnotes-app-web
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

refactor: alert styles

Browse Source
This commit is contained in:
Aman Harwara
2023-01-16 19:52:10 +05:30
parent dfa0e164bb
commit bb6e655d2f
7 changed files with 72 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
packages/web/src/javascripts/Components/ConfirmDeleteAccountModal/ConfirmDeleteAccountModal.tsx
View File

@@ -25,22 +25,20 @@ const ConfirmDeleteAccountModal = ({ application, viewControllerManager }: Props
<div className="sk-panel">
<div className="sk-panel-content">
<div className="sk-panel-section">
<AlertDialogLabel className="sk-h3 sk-panel-section-title">Delete account?</AlertDialogLabel>
<AlertDialogLabel className="text-lg font-bold">Delete account?</AlertDialogLabel>
<AlertDialogDescription className="sk-panel-row">
<div>
<p className="text-foreground">{STRING_DELETE_ACCOUNT_CONFIRMATION}</p>
<p className="text-base text-foreground lg:text-sm">{STRING_DELETE_ACCOUNT_CONFIRMATION}</p>
</div>
</AlertDialogDescription>
<div className="my-1 mt-4 flex gap-2">
<Button primary small colorStyle="neutral" rounded={false} ref={cancelRef} onClick={closeDialog}>
<div className="my-1 mt-4 flex justify-end gap-2">
<Button ref={cancelRef} onClick={closeDialog}>
Cancel
</Button>
<Button
primary
small
colorStyle="danger"
rounded={false}
onClick={() => {
application.user.deleteAccount().catch(console.error)
closeDialog()

12
packages/web/src/javascripts/Components/ConfirmSignoutModal/ConfirmSignoutModal.tsx
View File

@@ -38,14 +38,14 @@ const ConfirmSignoutModal: FunctionComponent<Props> = ({ application, viewContro
<div className="sk-panel">
<div className="sk-panel-content">
<div className="sk-panel-section">
<AlertDialogLabel className="sk-h3 sk-panel-section-title">Sign out workspace?</AlertDialogLabel>
<AlertDialogLabel className="text-lg font-bold">Sign out workspace?</AlertDialogLabel>
<AlertDialogDescription className="sk-panel-row">
<div>
<p className="text-foreground">{STRING_SIGN_OUT_CONFIRMATION}</p>
<p className="text-base text-foreground lg:text-sm">{STRING_SIGN_OUT_CONFIRMATION}</p>
{showWorkspaceWarning && (
<>
<br />
<p className="text-foreground">
<p className="text-base text-foreground lg:text-sm">
<strong>Note: </strong>
Because you have other workspaces signed in, this sign out may leave logs and other metadata
of your session on this device. For a more robust sign out that performs a hard clear of all
@@ -83,15 +83,13 @@ const ConfirmSignoutModal: FunctionComponent<Props> = ({ application, viewContro
</div>
)}
<div className="my-1 mt-4 flex gap-2">
<Button primary small colorStyle="neutral" rounded={false} ref={cancelRef} onClick={closeDialog}>
<div className="my-1 mt-4 flex justify-end gap-2">
<Button ref={cancelRef} onClick={closeDialog}>
Cancel
</Button>
<Button
primary
small
colorStyle="danger"
rounded={false}
onClick={() => {
if (deleteLocalBackups) {
application.signOutAndDeleteLocalBackups().catch(console.error)

12
packages/web/src/javascripts/Components/OtherSessionsSignOut/OtherSessionsSignOut.tsx
View File

@@ -24,25 +24,21 @@ const ConfirmOtherSessionsSignOut = observer(({ application, viewControllerManag
<div className="sk-panel">
<div className="sk-panel-content">
<div className="sk-panel-section">
<AlertDialogLabel className="sk-h3 sk-panel-section-title capitalize">
End all other sessions?
</AlertDialogLabel>
<AlertDialogLabel className="text-lg font-bold capitalize">End all other sessions?</AlertDialogLabel>
<AlertDialogDescription className="sk-panel-row">
<p className="text-foreground">
<p className="text-base text-foreground lg:text-sm">
This action will sign out all other devices signed into your account, and remove your data from
those devices when they next regain connection to the internet. You may sign back in on those
devices at any time.
</p>
</AlertDialogDescription>
<div className="my-1 mt-4 flex gap-2">
<Button primary small colorStyle="neutral" rounded={false} ref={cancelRef} onClick={closeDialog}>
<div className="my-1 mt-4 flex justify-end gap-2">
<Button ref={cancelRef} onClick={closeDialog}>
Cancel
</Button>
<Button
primary
small
colorStyle="danger"
rounded={false}
onClick={() => {
application.revokeAllOtherSessions().catch(console.error)
closeDialog()

19
packages/web/src/javascripts/Components/SessionsModal/SessionsModal.tsx
View File

@@ -166,28 +166,17 @@ const SessionsModalContent: FunctionComponent<{
<div className="sk-panel">
<div className="sk-panel-content">
<div className="sk-panel-section">
<AlertDialogLabel className="sk-h3 sk-panel-section-title">
{SessionStrings.RevokeTitle}
</AlertDialogLabel>
<AlertDialogLabel className="text-lg font-bold">{SessionStrings.RevokeTitle}</AlertDialogLabel>
<AlertDialogDescription className="sk-panel-row">
<p>{SessionStrings.RevokeText}</p>
<p className="text-base text-foreground lg:text-sm">{SessionStrings.RevokeText}</p>
</AlertDialogDescription>
<div className="my-1 flex gap-2">
<Button
primary
small
colorStyle="neutral"
rounded={false}
ref={cancelRevokeRef}
onClick={closeRevokeSessionAlert}
>
<div className="my-1 mt-4 flex justify-end gap-2">
<Button ref={cancelRevokeRef} onClick={closeRevokeSessionAlert}>
<span>{SessionStrings.RevokeCancelButton}</span>
</Button>
<Button
primary
small
colorStyle="danger"
rounded={false}
onClick={() => {
closeRevokeSessionAlert()
revokeSession(confirmRevokingSessionUuid).catch(console.error)