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

@@ -171,7 +171,7 @@ const CloudBackupProvider: FunctionComponent<Props> = ({ application, providerNa
return (
<div
className={`mr-1 ${isExpanded ? 'expanded' : ' '} ${
shouldShowEnableButton || backupFrequency ? 'flex justify-between items-center' : ''
shouldShowEnableButton || backupFrequency ? 'flex items-center justify-between' : ''
}`}
>
<div>
@@ -200,7 +200,7 @@ const CloudBackupProvider: FunctionComponent<Props> = ({ application, providerNa
<div>
<Button
label="Enable"
className={`px-1 text-xs min-w-40 ${additionalClass}`}
className={`min-w-40 px-1 text-xs ${additionalClass}`}
onClick={installIntegration}
disabled={!isEntitledToCloudBackups}
/>
@@ -209,7 +209,7 @@ const CloudBackupProvider: FunctionComponent<Props> = ({ application, providerNa
{backupFrequency && (
<div className={'flex flex-col items-end'}>
<Button className={`min-w-40 mb-2 ${additionalClass}`} label="Perform Backup" onClick={performBackupNow} />
<Button className={`mb-2 min-w-40 ${additionalClass}`} label="Perform Backup" onClick={performBackupNow} />
<Button className="min-w-40" label="Disable" onClick={disable} />
</div>
)}

View File

@@ -131,12 +131,12 @@ const CloudLink: FunctionComponent<Props> = ({ application }) => {
<div className={additionalClass}>
<Subtitle>Email preferences</Subtitle>
<div className="flex items-center justify-between mt-1">
<div className="mt-1 flex items-center justify-between">
<div className="flex flex-col">
<Text>Receive a notification email if a cloud backup fails.</Text>
</div>
{isLoading ? (
<Spinner className="w-4 h-4" />
<Spinner className="h-4 w-4" />
) : (
<Switch
onChange={toggleMuteFailedCloudBackupEmails}

View File

@@ -167,11 +167,11 @@ const DataBackups = ({ application, viewControllerManager }: Props) => {
<div className="flex items-center gap-2">
<label className="flex items-center gap-2">
<input type="radio" onChange={() => setIsBackupEncrypted(true)} checked={isBackupEncrypted} />
<span className="font-medium text-sm">Encrypted</span>
<span className="text-sm font-medium">Encrypted</span>
</label>
<label className="flex items-center gap-2">
<input type="radio" onChange={() => setIsBackupEncrypted(false)} checked={!isBackupEncrypted} />
<span className="font-medium text-sm">Decrypted</span>
<span className="text-sm font-medium">Decrypted</span>
</label>
</div>
</form>
@@ -183,7 +183,7 @@ const DataBackups = ({ application, viewControllerManager }: Props) => {
<PreferencesSegment>
<Subtitle>Import a previously saved backup file</Subtitle>
<div className="flex flex-row items-center mt-3">
<div className="mt-3 flex flex-row items-center">
<Button label="Import backup" onClick={handleImportFile} />
<input type="file" ref={fileInputRef} onChange={importFileSelected} className="hidden" />
{isImportDataLoading && <Spinner className="ml-4" />}

View File

@@ -114,7 +114,7 @@ const EmailBackups = ({ application }: Props) => {
<Text>How often to receive backups.</Text>
<div className="mt-2">
{isLoading ? (
<Spinner className="w-4 h-4" />
<Spinner className="h-4 w-4" />
) : (
<Dropdown
id="def-editor-dropdown"
@@ -132,7 +132,7 @@ const EmailBackups = ({ application }: Props) => {
<Text>Receive a notification email if an email backup fails.</Text>
</div>
{isLoading ? (
<Spinner className="w-4 h-4" />
<Spinner className="h-4 w-4" />
) : (
<Switch onChange={toggleMuteFailedBackupEmails} checked={!isFailedBackupEmailMuted} />
)}

View File

@@ -149,23 +149,23 @@ const BackupsDropZone: FunctionComponent<Props> = ({ application }) => {
<EncryptionStatusItem
status={decryptedFileItem.name}
icon={<Icon type="attachment-file" className="min-w-5 min-h-5" />}
icon={<Icon type="attachment-file" className="min-h-5 min-w-5" />}
checkmark={true}
/>
<HorizontalSeparator classes={'mt-3 mb-3'} />
<div className="flex justify-between items-center">
<div className="flex items-center justify-between">
<div>
<Subtitle>1. Choose related data file</Subtitle>
<Text className={`text-xs mr-3 em ${binaryFile ? 'font-bold success' : ''}`}>
<Text className={`em mr-3 text-xs ${binaryFile ? 'success font-bold' : ''}`}>
{droppedFile.file.uuid}/{FileBackupsConstantsV1.BinaryFileName}
</Text>
</div>
<div>
<Button
label="Choose"
className={'px-1 text-xs min-w-40'}
className={'min-w-40 px-1 text-xs'}
onClick={chooseRelatedBinaryFile}
disabled={!!binaryFile}
/>
@@ -174,19 +174,19 @@ const BackupsDropZone: FunctionComponent<Props> = ({ application }) => {
<HorizontalSeparator classes={'mt-3 mb-3'} />
<div className="flex justify-between items-center">
<div className="flex items-center justify-between">
<Subtitle>2. Decrypt and save file to your computer</Subtitle>
<div>
<Button
label={isSavingAsDecrypted ? undefined : 'Save'}
className={'px-1 text-xs min-w-40'}
className={'min-w-40 px-1 text-xs'}
onClick={downloadBinaryFileAsDecrypted}
disabled={isSavingAsDecrypted || !binaryFile}
>
{isSavingAsDecrypted && (
<div className="flex justify-center w-full">
<Spinner className="w-5 h-5" />
<div className="flex w-full justify-center">
<Spinner className="h-5 w-5" />
</div>
)}
</Button>

View File

@@ -57,7 +57,7 @@ const FileBackupsDesktop = ({ application, backupsService }: Props) => {
<Title>File Backups</Title>
<div className="flex items-center justify-between">
<div className="flex flex-col mr-10">
<div className="mr-10 flex flex-col">
<Subtitle>
Automatically save encrypted backups of files uploaded on any device to this computer.
</Subtitle>
@@ -86,11 +86,11 @@ const FileBackupsDesktop = ({ application, backupsService }: Props) => {
<EncryptionStatusItem
status={backupsLocation}
icon={<Icon type="attachment-file" className="min-w-5 min-h-5" />}
icon={<Icon type="attachment-file" className="min-h-5 min-w-5" />}
checkmark={false}
/>
<div className="flex flex-row mt-2.5">
<div className="mt-2.5 flex flex-row">
<Button label="Open Backups Location" className={'mr-3 text-xs'} onClick={openBackupsLocation} />
<Button label="Change Backups Location" className={'mr-3 text-xs'} onClick={changeBackupsLocation} />
</div>