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

style: tailwind classname sorting (#1169)

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

34
packages/web/src/javascripts/Components/PurchaseFlow/Panes/CreateAccount.tsx
View File

@@ -105,21 +105,21 @@ const CreateAccount: FunctionComponent<Props> = ({ viewControllerManager, applic
return (
<div className="flex items-center">
<CircleIcon className="absolute w-8 h-8 top-[40%] -left-28" />
<BlueDotIcon className="absolute w-4 h-4 top-[35%] -left-10" />
<DiamondIcon className="absolute w-26 h-26 -bottom-5 left-0 -translate-x-1/2 -z-[1]" />
<CircleIcon className="absolute top-[40%] -left-28 h-8 w-8" />
<BlueDotIcon className="absolute top-[35%] -left-10 h-4 w-4" />
<DiamondIcon className="absolute -bottom-5 left-0 -z-[1] h-26 w-26 -translate-x-1/2" />
<CircleIcon className="absolute w-8 h-8 bottom-[35%] -right-20" />
<BlueDotIcon className="absolute w-4 h-4 bottom-[25%] -right-10" />
<DiamondIcon className="absolute w-18 h-18 top-0 -right-2 translate-x-1/2 -z-[1]" />
<CircleIcon className="absolute bottom-[35%] -right-20 h-8 w-8" />
<BlueDotIcon className="absolute bottom-[25%] -right-10 h-4 w-4" />
<DiamondIcon className="absolute top-0 -right-2 -z-[1] h-18 w-18 translate-x-1/2" />
<div className="mr-0 md:mr-12">
<h1 className="mt-0 mb-2 font-bold text-2xl">Create your free account</h1>
<div className="mb-4 font-medium text-sm">to continue to Standard Notes.</div>
<h1 className="mt-0 mb-2 text-2xl font-bold">Create your free account</h1>
<div className="mb-4 text-sm font-medium">to continue to Standard Notes.</div>
<form onSubmit={handleCreateAccount}>
<div className="flex flex-col">
<FloatingLabelInput
className={`md:min-w-90 min-w-auto ${isEmailInvalid ? 'mb-2' : 'mb-4'}`}
className={`min-w-auto md:min-w-90 ${isEmailInvalid ? 'mb-2' : 'mb-4'}`}
id="purchase-sign-in-email"
type="email"
label="Email"
@@ -129,9 +129,9 @@ const CreateAccount: FunctionComponent<Props> = ({ viewControllerManager, applic
disabled={isCreatingAccount}
isInvalid={isEmailInvalid}
/>
{isEmailInvalid ? <div className="text-danger mb-4">Please provide a valid email.</div> : null}
{isEmailInvalid ? <div className="mb-4 text-danger">Please provide a valid email.</div> : null}
<FloatingLabelInput
className="md:min-w-90 min-w-auto mb-4"
className="min-w-auto mb-4 md:min-w-90"
id="purchase-create-account-password"
type="password"
label="Password"
@@ -141,7 +141,7 @@ const CreateAccount: FunctionComponent<Props> = ({ viewControllerManager, applic
disabled={isCreatingAccount}
/>
<FloatingLabelInput
className={`md:min-w-90 min-w-auto ${isPasswordNotMatching ? 'mb-2' : 'mb-4'}`}
className={`min-w-auto md:min-w-90 ${isPasswordNotMatching ? 'mb-2' : 'mb-4'}`}
id="create-account-confirm"
type="password"
label="Repeat password"
@@ -152,29 +152,29 @@ const CreateAccount: FunctionComponent<Props> = ({ viewControllerManager, applic
isInvalid={isPasswordNotMatching}
/>
{isPasswordNotMatching ? (
<div className="text-danger mb-4">Passwords don't match. Please try again.</div>
<div className="mb-4 text-danger">Passwords don't match. Please try again.</div>
) : null}
</div>
</form>
<div className="flex flex-col-reverse md:flex-row items-start md:items-center justify-between">
<div className="flex flex-col-reverse items-start justify-between md:flex-row md:items-center">
<div className="flex flex-col">
<button
onClick={handleSignInInstead}
disabled={isCreatingAccount}
className="flex items-start p-0 mb-2 bg-default border-0 font-medium text-info cursor-pointer hover:underline"
className="mb-2 flex cursor-pointer items-start border-0 bg-default p-0 font-medium text-info hover:underline"
>
Sign in instead
</button>
<button
onClick={subscribeWithoutAccount}
disabled={isCreatingAccount}
className="flex items-start p-0 bg-default border-0 font-medium text-info cursor-pointer hover:underline"
className="flex cursor-pointer items-start border-0 bg-default p-0 font-medium text-info hover:underline"
>
Subscribe without account
</button>
</div>
<Button
className="py-2.5 mb-4 md:mb-0"
className="mb-4 py-2.5 md:mb-0"
primary
label={isCreatingAccount ? 'Creating account...' : 'Create account'}
onClick={handleCreateAccount}

24
packages/web/src/javascripts/Components/PurchaseFlow/Panes/SignIn.tsx
View File

@@ -95,21 +95,21 @@ const SignIn: FunctionComponent<Props> = ({ viewControllerManager, application }
return (
<div className="flex items-center">
<CircleIcon className="absolute w-8 h-8 top-[35%] -left-56" />
<BlueDotIcon className="absolute w-4 h-4 top-[30%] -left-40" />
<DiamondIcon className="absolute w-26 h-26 -bottom-5 left-0 -translate-x-1/2 -z-[1]" />
<CircleIcon className="absolute top-[35%] -left-56 h-8 w-8" />
<BlueDotIcon className="absolute top-[30%] -left-40 h-4 w-4" />
<DiamondIcon className="absolute -bottom-5 left-0 -z-[1] h-26 w-26 -translate-x-1/2" />
<CircleIcon className="absolute w-8 h-8 bottom-[30%] -right-56" />
<BlueDotIcon className="absolute w-4 h-4 bottom-[20%] -right-44" />
<DiamondIcon className="absolute w-18 h-18 top-0 -right-2 translate-x-1/2 -z-[1]" />
<CircleIcon className="absolute bottom-[30%] -right-56 h-8 w-8" />
<BlueDotIcon className="absolute bottom-[20%] -right-44 h-4 w-4" />
<DiamondIcon className="absolute top-0 -right-2 -z-[1] h-18 w-18 translate-x-1/2" />
<div>
<h1 className="mt-0 mb-2 text-2xl font-bold">Sign in</h1>
<div className="mb-4 font-medium text-sm">to continue to Standard Notes.</div>
<div className="mb-4 text-sm font-medium">to continue to Standard Notes.</div>
<form onSubmit={handleSignIn}>
<div className="flex flex-col">
<FloatingLabelInput
className={`sm:min-w-90 min-w-auto ${isEmailInvalid && !otherErrorMessage ? 'mb-2' : 'mb-4'}`}
className={`min-w-auto sm:min-w-90 ${isEmailInvalid && !otherErrorMessage ? 'mb-2' : 'mb-4'}`}
id="purchase-sign-in-email"
type="email"
label="Email"
@@ -120,10 +120,10 @@ const SignIn: FunctionComponent<Props> = ({ viewControllerManager, application }
isInvalid={isEmailInvalid}
/>
{isEmailInvalid && !otherErrorMessage ? (
<div className="text-danger mb-4">Please provide a valid email.</div>
<div className="mb-4 text-danger">Please provide a valid email.</div>
) : null}
<FloatingLabelInput
className={`sm:min-w-90 min-w-auto ${otherErrorMessage ? 'mb-2' : 'mb-4'}`}
className={`min-w-auto sm:min-w-90 ${otherErrorMessage ? 'mb-2' : 'mb-4'}`}
id="purchase-sign-in-password"
type="password"
label="Password"
@@ -133,10 +133,10 @@ const SignIn: FunctionComponent<Props> = ({ viewControllerManager, application }
disabled={isSigningIn}
isInvalid={isPasswordInvalid}
/>
{otherErrorMessage ? <div className="text-danger mb-4">{otherErrorMessage}</div> : null}
{otherErrorMessage ? <div className="mb-4 text-danger">{otherErrorMessage}</div> : null}
</div>
<Button
className={`${isSigningIn ? 'min-w-30' : 'min-w-24'} py-2.5 mb-5`}
className={`${isSigningIn ? 'min-w-30' : 'min-w-24'} mb-5 py-2.5`}
primary
label={isSigningIn ? 'Signing in...' : 'Sign in'}
onClick={handleSignIn}

4
packages/web/src/javascripts/Components/PurchaseFlow/PurchaseFlowView.tsx
View File

@@ -33,9 +33,9 @@ const PurchaseFlowView: FunctionComponent<PurchaseFlowViewProps> = ({ viewContro
const { currentPane } = viewControllerManager.purchaseFlowController
return (
<div className="flex items-center justify-center overflow-hidden h-full w-full absolute top-0 left-0 z-purchase-flow bg-passive-super-light">
<div className="absolute top-0 left-0 z-purchase-flow flex h-full w-full items-center justify-center overflow-hidden bg-passive-super-light">
<div className="relative w-fit">
<div className="relative w-full md:p-12 px-8 py-8 mb-4 bg-default border border-solid border-border md:rounded rounded-0">
<div className="rounded-0 relative mb-4 w-full border border-solid border-border bg-default px-8 py-8 md:rounded md:p-12">
<SNLogoFull className="mb-5" />
<PurchaseFlowPaneSelector
currentPane={currentPane}