style: tailwind classname sorting (#1169)

This commit is contained in:
Aman Harwara
2022-06-28 13:37:38 +05:30
committed by GitHub
parent 15ca2d358b
commit ee5b6627da
159 changed files with 565 additions and 549 deletions

View File

@@ -21,7 +21,7 @@ const Advanced: FunctionComponent<Props> = ({ application, viewControllerManager
<PreferencesSegment>
<AccordionItem title={'Advanced Settings'}>
<div className="flex flex-row items-center">
<div className="flex-grow flex flex-col">
<div className="flex flex-grow flex-col">
<OfflineSubscription application={application} viewControllerManager={viewControllerManager} />
<Extensions
className={'mt-3'}

View File

@@ -33,13 +33,13 @@ const Authentication: FunctionComponent<Props> = ({ viewControllerManager }) =>
<div className="flex flex-col items-center px-12">
<AccountIllustration className="mb-3" />
<Title>You're not signed in</Title>
<Text className="text-center mb-3">
<Text className="mb-3 text-center">
Sign in to sync your notes and preferences across all your devices and enable end-to-end encryption.
</Text>
<Button primary label="Create free account" onClick={clickRegister} className="mb-3" />
<div className="text-sm">
Already have an account?{' '}
<button className="border-0 p-0 bg-default text-info underline cursor-pointer" onClick={clickSignIn}>
<button className="cursor-pointer border-0 bg-default p-0 text-info underline" onClick={clickSignIn}>
Sign in
</button>
</div>

View File

@@ -142,7 +142,7 @@ const ChangeEmail: FunctionComponent<Props> = ({ onCloseDialog, application }) =
<div>
<ModalDialog>
<ModalDialogLabel closeDialog={handleDialogClose}>Change Email</ModalDialogLabel>
<ModalDialogDescription className="px-4.5 flex flex-row items-center">
<ModalDialogDescription className="flex flex-row items-center px-4.5">
{currentStep === Steps.InitialStep && (
<ChangeEmailForm setNewEmail={setNewEmail} setCurrentPassword={setCurrentPassword} />
)}

View File

@@ -11,7 +11,7 @@ const labelClassName = 'block mb-1'
const ChangeEmailForm: FunctionComponent<Props> = ({ setNewEmail, setCurrentPassword }) => {
return (
<div className="w-full flex flex-col">
<div className="flex w-full flex-col">
<div className="mt-2 mb-3">
<label className={labelClassName} htmlFor="change-email-email-input">
New Email:

View File

@@ -3,7 +3,7 @@ import { FunctionComponent } from 'react'
const ChangeEmailSuccess: FunctionComponent = () => {
return (
<div>
<div className={'font-bold text-info mb-2'}>Your email has been successfully changed.</div>
<div className={'mb-2 font-bold text-info'}>Your email has been successfully changed.</div>
<p>
Please ensure you are running the latest version of Standard Notes on all platforms to ensure maximum
compatibility.

View File

@@ -40,10 +40,10 @@ const Credentials: FunctionComponent<Props> = ({ application }: Props) => {
<Title>Credentials</Title>
<Subtitle>Email</Subtitle>
<Text>
You're signed in as <span className="font-bold wrap">{user?.email}</span>
You're signed in as <span className="wrap font-bold">{user?.email}</span>
</Text>
<Button
className="min-w-20 mt-3"
className="mt-3 min-w-20"
label="Change email"
onClick={() => {
setIsChangeEmailDialogOpen(true)
@@ -54,7 +54,7 @@ const Credentials: FunctionComponent<Props> = ({ application }: Props) => {
<Text>
Current password was set on <span className="font-bold">{passwordCreatedOn}</span>
</Text>
<Button className="min-w-20 mt-3" label="Change password" onClick={presentPasswordWizard} />
<Button className="mt-3 min-w-20" label="Change password" onClick={presentPasswordWizard} />
{isChangeEmailDialogOpen && (
<ChangeEmail onCloseDialog={() => setIsChangeEmailDialogOpen(false)} application={application} />
)}

View File

@@ -45,7 +45,7 @@ const FilesSection: FunctionComponent<Props> = ({ application }) => {
<Subtitle>Storage Quota</Subtitle>
{isLoading ? (
<div className="mt-2">
<Spinner className="w-3 h-3" />
<Spinner className="h-3 w-3" />
</div>
) : (
<>
@@ -54,7 +54,7 @@ const FilesSection: FunctionComponent<Props> = ({ application }) => {
<span>{formatSizeToReadableString(filesQuotaTotal)}</span> used
</div>
<progress
className="w-full progress-bar"
className="progress-bar w-full"
aria-label="Files storage used"
value={filesQuotaUsed}
max={filesQuotaTotal}

View File

@@ -79,7 +79,7 @@ const OfflineSubscription: FunctionComponent<Props> = ({ application }) => {
return (
<>
<div className="flex items-center justify-between">
<div className="flex flex-col mt-3 w-full">
<div className="mt-3 flex w-full flex-col">
<Subtitle>{!hasUserPreviouslyStoredCode && 'Activate'} Offline Subscription</Subtitle>
<form onSubmit={handleSubscriptionCodeSubmit}>
<div className={'mt-2'}>
@@ -94,7 +94,7 @@ const OfflineSubscription: FunctionComponent<Props> = ({ application }) => {
)}
</div>
{(isSuccessfullyActivated || isSuccessfullyRemoved) && (
<div className={'mt-3 mb-3 info'}>
<div className={'info mt-3 mb-3'}>
Your offline subscription code has been successfully {isSuccessfullyActivated ? 'activated' : 'removed'}
.
</div>

View File

@@ -23,7 +23,7 @@ const SignOutView: FunctionComponent<Props> = observer(({ application, viewContr
<Title>Sign out</Title>
<Subtitle>Other devices</Subtitle>
<Text>Want to sign out on all devices except this one?</Text>
<div className="flex flex-row mt-3">
<div className="mt-3 flex flex-row">
<Button
className="mr-3"
label="Sign out other sessions"

View File

@@ -32,9 +32,9 @@ const NoSubscription: FunctionComponent<Props> = ({ application }) => {
{isLoadingPurchaseFlow && <Text>Redirecting you to the subscription page...</Text>}
{purchaseFlowError && <Text className="text-danger">{purchaseFlowError}</Text>}
<div className="flex">
<LinkButton className="min-w-20 mt-3 mr-3" label="Learn More" link={window.plansUrl as string} />
<LinkButton className="mt-3 mr-3 min-w-20" label="Learn More" link={window.plansUrl as string} />
{application.hasAccount() && (
<Button className="min-w-20 mt-3" primary label="Subscribe" onClick={onPurchaseClick} />
<Button className="mt-3 min-w-20" primary label="Subscribe" onClick={onPurchaseClick} />
)}
</div>
</>

View File

@@ -23,7 +23,7 @@ const Subscription: FunctionComponent<Props> = ({ application, viewControllerMan
<PreferencesGroup>
<PreferencesSegment>
<div className="flex flex-row items-center">
<div className="flex-grow flex flex-col">
<div className="flex flex-grow flex-col">
<Title>Subscription</Title>
{userSubscription && userSubscription.endsAt > now ? (
<SubscriptionInformation subscriptionState={subscriptionState} application={application} />

View File

@@ -18,7 +18,7 @@ const SubscriptionInformation = ({ subscriptionState, application }: Props) => {
return (
<>
<StatusText subscriptionState={subscriptionState} />
<Button className="min-w-20 mt-3 mr-3" label="Manage subscription" onClick={manageSubscription} />
<Button className="mt-3 mr-3 min-w-20" label="Manage subscription" onClick={manageSubscription} />
</>
)
}

View File

@@ -36,13 +36,13 @@ const Sync: FunctionComponent<Props> = ({ application }: Props) => {
<PreferencesGroup>
<PreferencesSegment>
<div className="flex flex-row items-center">
<div className="flex-grow flex flex-col">
<div className="flex flex-grow flex-col">
<Title>Sync</Title>
<Text>
Last synced <span className="font-bold">on {lastSyncDate}</span>
</Text>
<Button
className="min-w-20 mt-3"
className="mt-3 min-w-20"
label="Sync now"
disabled={isSyncingInProgress}
onClick={doSynchronization}