Ryan/documenso
1
0
Fork 1
mirror of https://github.com/documenso/documenso.git synced 2026-06-22 04:12:06 +10:00
Code Issues Packages Projects Releases Wiki Activity

chore: migrate linting and formatting to oxlint and oxfmt

Browse Source
This commit is contained in:
ephraimduncan
2026-03-05 19:09:19 +00:00
parent 406e77e4be
commit ae02169e97
250 changed files with 7228 additions and 14870 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.eslintignore
-8
View File
@@ -1,8 +0,0 @@
# Config files
*.config.js
*.config.cjs
# Statically hosted javascript files
apps/*/public/*.js
apps/*/public/*.cjs
scripts/
.eslintrc.cjs
-16
View File
@@ -1,16 +0,0 @@
/** @type {import('eslint').Linter.Config} */
module.exports = {
root: true,
extends: ['@documenso/eslint-config'],
rules: {
'@next/next/no-img-element': 'off',
'no-unreachable': 'error',
'react-hooks/exhaustive-deps': 'off',
},
settings: {
next: {
rootDir: ['apps/*/'],
},
},
ignorePatterns: ['lingui.config.ts', 'packages/lib/translations/**/*.js'],
};
.oxfmtrc.json
+33
View File
@@ -0,0 +1,33 @@
{
"$schema": "./node_modules/oxfmt/configuration_schema.json",
"printWidth": 100,
"tabWidth": 2,
"semi": true,
"singleQuote": true,
"trailingComma": "all",
"arrowParens": "always",
"importOrder": [
"^server-only|client-only$",
"^react$",
"^next(/.*)?$",
"<THIRD_PARTY_MODULES>",
"^@documenso/(.*)$",
"^~/(.*)$",
"^[./]"
],
"importOrderSeparation": true,
"importOrderSortSpecifiers": true,
"sortTailwindcss": {
"functions": ["cn", "cva"]
},
"sortPackageJson": false,
"ignorePatterns": [
"packages/lib/translations/**/*.js",
"*.test.ts",
"apps/docs/content/**/*.mdx",
"*.css",
"*.po",
"*.md",
"*.json"
]
}
.oxlintrc.json
+50
View File
@@ -0,0 +1,50 @@
{
"$schema": "./node_modules/oxlint/configuration_schema.json",
"plugins": ["typescript", "import", "react", "nextjs", "promise"],
"env": { "browser": true, "node": true, "es2022": true },
"categories": { "correctness": "error" },
"rules": {
"eslint/no-unused-vars": [
"warn",
{
"vars": "all",
"varsIgnorePattern": "^_",
"args": "after-used",
"argsIgnorePattern": "^_",
"destructuredArrayIgnorePattern": "^_"
}
],
"eslint/no-promise-executor-return": "error",
"eslint/prefer-promise-reject-errors": "error",
"eslint/no-unreachable": "error",
"typescript/no-floating-promises": "error",
"typescript/no-misused-promises": ["error", { "checksVoidReturn": { "attributes": false } }],
"typescript/promise-function-async": "error",
"typescript/require-await": "error",
"typescript/consistent-type-assertions": ["warn", { "assertionStyle": "never" }],
"typescript/consistent-type-imports": [
"warn",
{
"prefer": "type-imports",
"fixStyle": "separate-type-imports",
"disallowTypeAnnotations": false
}
],
"react/no-unescaped-entities": "off",
"react/exhaustive-deps": "off",
"nextjs/no-html-link-for-pages": "off",
"nextjs/no-img-element": "off"
},
"ignorePatterns": [
"*.config.js",
"*.config.cjs",
"apps/*/public/*.js",
"apps/*/public/*.cjs",
"scripts/",
"lingui.config.ts",
"packages/lib/translations/**/*.js"
]
}
.prettierignore
-20
View File
@@ -1,20 +0,0 @@
node_modules
.next
public
**/**/node_modules
**/**/.next
**/**/public
packages/lib/translations/**/*.js
*.lock
*.log
*.test.ts
.gitignore
.npmignore
.prettierignore
.DS_Store
.eslintignore
# Docs MDX - Prettier strips indentation from code blocks inside components
apps/docs/content/**/*.mdx
apps/docs/src/app/og/docs/[...slug]/route.tsx
+81 -83
View File
@@ -40,104 +40,102 @@ export async function GET(_req: Request, { params }: RouteContext<'/og/docs/[...
const { logoSrc, fonts } = await loadAssets();
return new ImageResponse(
(
<div
style={{
display: 'flex',
flexDirection: 'column',
width: '100%',
height: '100%',
backgroundColor: 'white',
padding: '60px 80px',
fontFamily: 'Inter',
position: 'relative',
}}
>
{/* Green accent bar */}
<div
style={{
position: 'absolute',
top: 0,
left: 0,
right: 0,
height: '6px',
backgroundColor: '#6DC947',
}}
/>
{/* Top: Logo */}
<div
style={{
display: 'flex',
alignItems: 'center',
gap: '16px',
}}
>
{/* eslint-disable-next-line @next/next/no-img-element */}
<img src={logoSrc} alt="Documenso" height="28" />
<span
style={{
color: '#D4D4D8',
fontSize: '28px',
fontWeight: 400,
}}
>
|
</span>
<span style={{ color: '#71717A', fontSize: '20px', fontWeight: 400 }}>Docs</span>
</div>
{/* Middle: Title + description */}
<div
style={{
display: 'flex',
flexDirection: 'column',
width: '100%',
height: '100%',
backgroundColor: 'white',
padding: '60px 80px',
fontFamily: 'Inter',
position: 'relative',
flex: 1,
justifyContent: 'center',
gap: '16px',
}}
>
{/* Green accent bar */}
<div
<h1
style={{
position: 'absolute',
top: 0,
left: 0,
right: 0,
height: '6px',
backgroundColor: '#6DC947',
}}
/>
{/* Top: Logo */}
<div
style={{
display: 'flex',
alignItems: 'center',
gap: '16px',
color: '#18181B',
fontSize: page.data.title.length > 40 ? '48px' : '56px',
fontWeight: 700,
lineHeight: 1.15,
letterSpacing: '-0.025em',
margin: 0,
}}
>
{/* eslint-disable-next-line @next/next/no-img-element */}
<img src={logoSrc} alt="Documenso" height="28" />
<span
{page.data.title}
</h1>
{page.data.description && (
<p
style={{
color: '#D4D4D8',
fontSize: '28px',
color: '#71717A',
fontSize: '22px',
fontWeight: 400,
}}
>
|
</span>
<span style={{ color: '#71717A', fontSize: '20px', fontWeight: 400 }}>Docs</span>
</div>
{/* Middle: Title + description */}
<div
style={{
display: 'flex',
flexDirection: 'column',
flex: 1,
justifyContent: 'center',
gap: '16px',
}}
>
<h1
style={{
color: '#18181B',
fontSize: page.data.title.length > 40 ? '48px' : '56px',
fontWeight: 700,
lineHeight: 1.15,
letterSpacing: '-0.025em',
lineHeight: 1.4,
margin: 0,
maxWidth: '900px',
overflow: 'hidden',
textOverflow: 'ellipsis',
display: '-webkit-box',
WebkitLineClamp: 2,
WebkitBoxOrient: 'vertical',
}}
>
{page.data.title}
</h1>
{page.data.description && (
<p
style={{
color: '#71717A',
fontSize: '22px',
fontWeight: 400,
lineHeight: 1.4,
margin: 0,
maxWidth: '900px',
overflow: 'hidden',
textOverflow: 'ellipsis',
display: '-webkit-box',
WebkitLineClamp: 2,
WebkitBoxOrient: 'vertical',
}}
>
{page.data.description}
</p>
)}
</div>
{/* Bottom: URL */}
<div style={{ display: 'flex', alignItems: 'center' }}>
<span style={{ color: '#A1A1AA', fontSize: '16px', fontWeight: 400 }}>
docs.documenso.com{page.url}
</span>
</div>
{page.data.description}
</p>
)}
</div>
),
{/* Bottom: URL */}
<div style={{ display: 'flex', alignItems: 'center' }}>
<span style={{ color: '#A1A1AA', fontSize: '16px', fontWeight: 400 }}>
docs.documenso.com{page.url}
</span>
</div>
</div>,
{
width: 1200,
height: 630,
apps/openpage-api/package.json
+1 -1
View File
@@ -6,7 +6,7 @@
"dev": "next dev -p 3003",
"build": "next build",
"start": "next start -p 3003",
"lint:fix": "next lint --fix",
"lint:fix": "oxlint --type-aware --fix .",
"clean": "rimraf .next && rimraf node_modules"
},
"dependencies": {
apps/remix/app/components/dialogs/account-delete-dialog.tsx
+1 -1
View File
@@ -122,7 +122,7 @@ export const AccountDeleteDialog = ({ className }: AccountDeleteDialogProps) =>
<Label>
<Trans>
Please type{' '}
<span className="text-muted-foreground font-semibold">{user.email}</span> to
<span className="font-semibold text-muted-foreground">{user.email}</span> to
confirm.
</Trans>
</Label>
apps/remix/app/components/dialogs/assistant-confirmation-dialog.tsx
+1 -1
View File
@@ -115,7 +115,7 @@ export function AssistantConfirmationDialog({
<div className="mt-4 flex flex-col gap-4">
{!isEditingNextSigner && (
<div>
<p className="text-muted-foreground text-sm">
<p className="text-sm text-muted-foreground">
<Trans>
The next recipient to sign this document will be{' '}
<span className="font-semibold">{form.watch('name')}</span> (
apps/remix/app/components/dialogs/document-move-to-folder-dialog.tsx
+2 -2
View File
@@ -165,7 +165,7 @@ export const DocumentMoveToFolderDialog = ({
</DialogHeader>
<div className="relative">
<Search className="text-muted-foreground absolute left-2 top-3 h-4 w-4" />
<Search className="absolute left-2 top-3 h-4 w-4 text-muted-foreground" />
<Input
placeholder={_(msg`Search folders...`)}
value={searchTerm}
@@ -219,7 +219,7 @@ export const DocumentMoveToFolderDialog = ({
))}
{searchTerm && filteredFolders?.length === 0 && (
<div className="text-muted-foreground px-2 py-2 text-center text-sm">
<div className="px-2 py-2 text-center text-sm text-muted-foreground">
<Trans>No folders found</Trans>
</div>
)}
apps/remix/app/components/dialogs/document-resend-dialog.tsx
+1 -1
View File
@@ -183,7 +183,7 @@ export const DocumentResendDialog = ({ document, recipients }: DocumentResendDia
<DialogClose asChild>
<Button
type="button"
className="dark:bg-muted dark:hover:bg-muted/80 flex-1 bg-black/5 hover:bg-black/10"
className="flex-1 bg-black/5 hover:bg-black/10 dark:bg-muted dark:hover:bg-muted/80"
variant="secondary"
disabled={isSubmitting}
>
apps/remix/app/components/dialogs/envelope-download-dialog.tsx
+6 -6
View File
@@ -132,7 +132,7 @@ export const EnvelopeDownloadDialog = ({
{Array.from({ length: 1 }).map((_, index) => (
<div
key={index}
className="border-border bg-card flex items-center gap-2 rounded-lg border p-4"
className="flex items-center gap-2 rounded-lg border border-border bg-card p-4"
>
<Skeleton className="h-10 w-10 flex-shrink-0 rounded-lg" />
@@ -149,20 +149,20 @@ export const EnvelopeDownloadDialog = ({
envelopeItems.map((item) => (
<div
key={item.id}
className="border-border bg-card hover:bg-accent/50 flex items-center gap-4 rounded-lg border p-4 transition-colors"
className="flex items-center gap-4 rounded-lg border border-border bg-card p-4 transition-colors hover:bg-accent/50"
>
<div className="flex-shrink-0">
<div className="bg-primary/10 flex h-10 w-10 items-center justify-center rounded-lg">
<FileTextIcon className="text-primary h-5 w-5" />
<div className="flex h-10 w-10 items-center justify-center rounded-lg bg-primary/10">
<FileTextIcon className="h-5 w-5 text-primary" />
</div>
</div>
<div className="min-w-0 flex-1">
{/* Todo: Envelopes - Fix overflow */}
<h4 className="text-foreground truncate text-sm font-medium" title={item.title}>
<h4 className="truncate text-sm font-medium text-foreground" title={item.title}>
{item.title}
</h4>
<p className="text-muted-foreground mt-0.5 text-xs">
<p className="mt-0.5 text-xs text-muted-foreground">
<Trans>PDF Document</Trans>
</p>
</div>
apps/remix/app/components/dialogs/folder-delete-dialog.tsx
+1 -1
View File
@@ -134,7 +134,7 @@ export const FolderDeleteDialog = ({ folder, isOpen, onOpenChange }: FolderDelet
<FormLabel>
<Trans>
Confirm by typing:{' '}
<span className="font-sm text-destructive font-semibold">
<span className="font-sm font-semibold text-destructive">
{deleteMessage}
</span>
</Trans>
apps/remix/app/components/dialogs/folder-move-dialog.tsx
+1 -1
View File
@@ -129,7 +129,7 @@ export const FolderMoveDialog = ({
</DialogHeader>
<div className="relative">
<Search className="text-muted-foreground absolute left-2 top-3 h-4 w-4" />
<Search className="absolute left-2 top-3 h-4 w-4 text-muted-foreground" />
<Input
placeholder={t`Search folders...`}
value={searchTerm}
apps/remix/app/components/dialogs/organisation-create-dialog.tsx
+9 -9
View File
@@ -357,9 +357,9 @@ const BillingPlanForm = ({
<button
onClick={() => onChange('')}
className={cn(
'hover:border-primary flex cursor-pointer items-center space-x-2 rounded-md border p-4 transition-all hover:shadow-sm',
'flex cursor-pointer items-center space-x-2 rounded-md border p-4 transition-all hover:border-primary hover:shadow-sm',
{
'ring-primary/10 border-primary ring-2 ring-offset-1': '' === value,
'border-primary ring-2 ring-primary/10 ring-offset-1': '' === value,
},
)}
disabled={!canCreateFreeOrganisation}
@@ -390,9 +390,9 @@ const BillingPlanForm = ({
key={plan[billingPeriod]?.id}
onClick={() => onChange(plan[billingPeriod]?.id ?? '')}
className={cn(
'hover:border-primary flex cursor-pointer items-center space-x-2 rounded-md border p-4 transition-all hover:shadow-sm',
'flex cursor-pointer items-center space-x-2 rounded-md border p-4 transition-all hover:border-primary hover:shadow-sm',
{
'ring-primary/10 border-primary ring-2 ring-offset-1':
'border-primary ring-2 ring-primary/10 ring-offset-1':
plan[billingPeriod]?.id === value,
},
)}
@@ -403,7 +403,7 @@ const BillingPlanForm = ({
</div>
<div className="whitespace-nowrap text-right text-sm font-medium">
<p>{plan[billingPeriod]?.friendlyPrice}</p>
<span className="text-muted-foreground text-xs">
<span className="text-xs text-muted-foreground">
{billingPeriod === 'monthlyPrice' ? (
<Trans>per month</Trans>
) : (
@@ -417,13 +417,13 @@ const BillingPlanForm = ({
<Link
to="https://documen.so/enterprise-cta"
target="_blank"
className="bg-muted/30 flex items-center space-x-2 rounded-md border p-4"
className="flex items-center space-x-2 rounded-md border bg-muted/30 p-4"
>
<div className="flex-1 font-normal">
<p className="text-muted-foreground font-medium">
<p className="font-medium text-muted-foreground">
<Trans>Enterprise</Trans>
</p>
<p className="text-muted-foreground flex flex-row items-center gap-1">
<p className="flex flex-row items-center gap-1 text-muted-foreground">
<Trans>Contact sales here</Trans>
<ExternalLinkIcon className="h-4 w-4" />
</p>
@@ -434,7 +434,7 @@ const BillingPlanForm = ({
<div className="mt-6 text-center">
<Link
to="https://documenso.com/pricing"
className="text-primary hover:text-primary/80 flex items-center justify-center gap-1 text-sm hover:underline"
className="flex items-center justify-center gap-1 text-sm text-primary hover:text-primary/80 hover:underline"
target="_blank"
>
<Trans>Compare all plans and features in detail</Trans>
apps/remix/app/components/dialogs/organisation-email-create-dialog.tsx
+2 -2
View File
@@ -176,14 +176,14 @@ export const OrganisationEmailCreateDialog = ({
}}
placeholder={t`support`}
/>
<div className="bg-muted text-muted-foreground absolute bottom-0 right-0 top-0 flex items-center rounded-r-md border px-3 py-2 text-sm">
<div className="absolute bottom-0 right-0 top-0 flex items-center rounded-r-md border bg-muted px-3 py-2 text-sm text-muted-foreground">
@{emailDomain.domain}
</div>
</div>
</FormControl>
<FormMessage />
{!form.formState.errors.email && (
<span className="text-foreground/50 text-xs font-normal">
<span className="text-xs font-normal text-foreground/50">
{field.value ? (
field.value
) : (
apps/remix/app/components/dialogs/organisation-email-domain-delete-dialog.tsx
+1 -1
View File
@@ -126,7 +126,7 @@ export const OrganisationEmailDomainDeleteDialog = ({
<FormLabel>
<Trans>
Confirm by typing{' '}
<span className="font-sm text-destructive font-semibold">
<span className="font-sm font-semibold text-destructive">
{deleteMessage}
</span>
</Trans>
apps/remix/app/components/dialogs/organisation-group-create-dialog.tsx
+2 -2
View File
@@ -178,7 +178,7 @@ export const OrganisationGroupCreateDialog = ({
</FormLabel>
<FormControl>
<Select {...field} onValueChange={field.onChange}>
<SelectTrigger className="text-muted-foreground w-full">
<SelectTrigger className="w-full text-muted-foreground">
<SelectValue />
</SelectTrigger>
@@ -217,7 +217,7 @@ export const OrganisationGroupCreateDialog = ({
loading={isLoadingMembers}
selectedValues={field.value}
onChange={field.onChange}
className="bg-background w-full"
className="w-full bg-background"
emptySelectionPlaceholder={t`Select members`}
/>
</FormControl>
apps/remix/app/components/dialogs/organisation-member-invite-dialog.tsx
+4 -4
View File
@@ -329,12 +329,12 @@ export const OrganisationMemberInviteDialog = ({
onValueChange={(value) => setInvitationType(value as TabTypes)}
>
<TabsList className="w-full">
<TabsTrigger value="INDIVIDUAL" className="hover:text-foreground w-full">
<TabsTrigger value="INDIVIDUAL" className="w-full hover:text-foreground">
<MailIcon size={20} className="mr-2" />
<Trans>Invite Members</Trans>
</TabsTrigger>
<TabsTrigger value="BULK" className="hover:text-foreground w-full">
<TabsTrigger value="BULK" className="w-full hover:text-foreground">
<UsersIcon size={20} className="mr-2" /> <Trans>Bulk Import</Trans>
</TabsTrigger>
</TabsList>
@@ -382,7 +382,7 @@ export const OrganisationMemberInviteDialog = ({
)}
<FormControl>
<Select {...field} onValueChange={field.onChange}>
<SelectTrigger className="text-muted-foreground max-w-[200px]">
<SelectTrigger className="max-w-[200px] text-muted-foreground">
<SelectValue />
</SelectTrigger>
@@ -447,7 +447,7 @@ export const OrganisationMemberInviteDialog = ({
<div className="mt-4 space-y-4">
<Card gradient className="h-32">
<CardContent
className="text-muted-foreground/80 hover:text-muted-foreground/90 flex h-full cursor-pointer flex-col items-center justify-center rounded-lg p-0 transition-colors"
className="flex h-full cursor-pointer flex-col items-center justify-center rounded-lg p-0 text-muted-foreground/80 transition-colors hover:text-muted-foreground/90"
onClick={() => fileInputRef.current?.click()}
>
<Upload className="h-5 w-5" />
apps/remix/app/components/dialogs/public-profile-template-manage-dialog.tsx
+3 -3
View File
@@ -290,11 +290,11 @@ export const ManagePublicTemplateDialog = ({
key={row.id}
onClick={() => setSelectedTemplateId(row.id)}
>
<TableCell className="text-muted-foreground max-w-[30ch] text-sm">
<TableCell className="max-w-[30ch] text-sm text-muted-foreground">
{row.title}
</TableCell>
<TableCell className="text-muted-foreground text-sm">
<TableCell className="text-sm text-muted-foreground">
{i18n.date(row.createdAt)}
</TableCell>
@@ -381,7 +381,7 @@ export const ManagePublicTemplateDialog = ({
</FormControl>
{!form.formState.errors.publicDescription && (
<p className="text-muted-foreground text-sm">
<p className="text-sm text-muted-foreground">
{remaningLength >= 0 ? (
<Plural
value={remaningLength}
apps/remix/app/components/dialogs/team-email-delete-dialog.tsx
+1 -1
View File
@@ -129,7 +129,7 @@ export const TeamEmailDeleteDialog = ({ trigger, teamName, team }: TeamEmailDele
(team.teamEmail?.name || team.emailVerification?.name) ?? '',
)}
primaryText={
<span className="text-foreground/80 text-sm font-semibold">
<span className="text-sm font-semibold text-foreground/80">
{team.teamEmail?.name || team.emailVerification?.name}
</span>
}
apps/remix/app/components/dialogs/team-group-create-dialog.tsx
+1 -1
View File
@@ -198,7 +198,7 @@ export const TeamGroupCreateDialog = ({ ...props }: TeamGroupCreateDialogProps)
})),
);
}}
className="bg-background w-full"
className="w-full bg-background"
emptySelectionPlaceholder={t`Select groups`}
/>
</FormControl>
apps/remix/app/components/dialogs/template-move-to-folder-dialog.tsx
+2 -2
View File
@@ -157,7 +157,7 @@ export function TemplateMoveToFolderDialog({
</DialogHeader>
<div className="relative">
<Search className="text-muted-foreground absolute left-2 top-3 h-4 w-4" />
<Search className="absolute left-2 top-3 h-4 w-4 text-muted-foreground" />
<Input
placeholder={_(msg`Search folders...`)}
value={searchTerm}
@@ -211,7 +211,7 @@ export function TemplateMoveToFolderDialog({
))}
{searchTerm && filteredFolders?.length === 0 && (
<div className="text-muted-foreground px-2 py-2 text-center text-sm">
<div className="px-2 py-2 text-center text-sm text-muted-foreground">
<Trans>No folders found</Trans>
</div>
)}
apps/remix/app/components/dialogs/token-delete-dialog.tsx
+1 -1
View File
@@ -142,7 +142,7 @@ export default function TokenDeleteDialog({ token, onDelete, children }: TokenDe
<FormLabel>
<Trans>
Confirm by typing:{' '}
<span className="font-sm text-destructive font-semibold">
<span className="font-sm font-semibold text-destructive">
{deleteMessage}
</span>
</Trans>
apps/remix/app/components/dialogs/webhook-delete-dialog.tsx
+1 -1
View File
@@ -132,7 +132,7 @@ export const WebhookDeleteDialog = ({ webhook, children }: WebhookDeleteDialogPr
<FormLabel>
<Trans>
Confirm by typing:{' '}
<span className="font-sm text-destructive font-semibold">
<span className="font-sm font-semibold text-destructive">
{deleteMessage}
</span>
</Trans>
apps/remix/app/components/dialogs/webhook-test-dialog.tsx
+1 -1
View File
@@ -140,7 +140,7 @@ export const WebhookTestDialog = ({ webhook, children }: WebhookTestDialogProps)
<h4 className="mb-2 text-sm font-medium">
<Trans>Webhook URL</Trans>
</h4>
<p className="text-muted-foreground break-all text-sm">{webhook.webhookUrl}</p>
<p className="break-all text-sm text-muted-foreground">{webhook.webhookUrl}</p>
</div>
<DialogFooter>
apps/remix/app/components/embed/authoring/configure-document-advanced-settings.tsx
+6 -6
View File
@@ -60,11 +60,11 @@ export const ConfigureDocumentAdvancedSettings = ({
return (
<div>
<h3 className="text-foreground mb-1 text-lg font-medium">
<h3 className="mb-1 text-lg font-medium text-foreground">
<Trans>Advanced Settings</Trans>
</h3>
<p className="text-muted-foreground mb-6 text-sm">
<p className="mb-6 text-sm text-muted-foreground">
<Trans>Configure additional options and preferences</Trans>
</p>
@@ -100,7 +100,7 @@ export const ConfigureDocumentAdvancedSettings = ({
}))}
selectedValues={field.value}
onChange={field.onChange}
className="bg-background w-full"
className="w-full bg-background"
emptySelectionPlaceholder={t`Select signature types`}
/>
</FormControl>
@@ -204,7 +204,7 @@ export const ConfigureDocumentAdvancedSettings = ({
<TooltipTrigger>
<InfoIcon className="mx-2 h-4 w-4" />
</TooltipTrigger>
<TooltipContent className="text-muted-foreground max-w-xs">
<TooltipContent className="max-w-xs text-muted-foreground">
<Trans>
Add a URL to redirect the user to once the document is signed
</Trans>
@@ -279,7 +279,7 @@ export const ConfigureDocumentAdvancedSettings = ({
<FormControl>
<Input
id="subject"
className="bg-background mt-2"
className="mt-2 bg-background"
disabled={isSubmitting || !isEmailDistribution}
{...field}
/>
@@ -302,7 +302,7 @@ export const ConfigureDocumentAdvancedSettings = ({
<FormControl>
<Textarea
id="message"
className="bg-background mt-2 h-32 resize-none"
className="mt-2 h-32 resize-none bg-background"
disabled={isSubmitting || !isEmailDistribution}
{...field}
/>
apps/remix/app/components/embed/authoring/configure-document-recipients.tsx
+4 -4
View File
@@ -146,11 +146,11 @@ export const ConfigureDocumentRecipients = ({
return (
<div>
<h3 className="text-foreground mb-1 text-lg font-medium">
<h3 className="mb-1 text-lg font-medium text-foreground">
<Trans>Recipients</Trans>
</h3>
<p className="text-muted-foreground mb-6 text-sm">
<p className="mb-6 text-sm text-muted-foreground">
<Trans>Add signers and configure signing preferences</Trans>
</p>
@@ -206,7 +206,7 @@ export const ConfigureDocumentRecipients = ({
</FormLabel>
<Tooltip>
<TooltipTrigger asChild>
<span className="text-muted-foreground ml-1 cursor-help">
<span className="ml-1 cursor-help text-muted-foreground">
<HelpCircle className="h-3.5 w-3.5" />
</span>
</TooltipTrigger>
@@ -249,7 +249,7 @@ export const ConfigureDocumentRecipients = ({
{...provided.dragHandleProps}
disabled={signer.disabled}
className={cn('py-1', {
'bg-widget-foreground pointer-events-none rounded-md pt-2':
'pointer-events-none rounded-md bg-widget-foreground pt-2':
snapshot.isDragging,
})}
>
apps/remix/app/components/embed/authoring/configure-document-upload.tsx
+5 -5
View File
@@ -144,7 +144,7 @@ export const ConfigureDocumentUpload = ({ isSubmitting = false }: ConfigureDocum
<div
{...getRootProps()}
className={cn(
'border-border bg-background relative flex min-h-[160px] cursor-pointer flex-col items-center justify-center rounded-lg border border-dashed transition',
'relative flex min-h-[160px] cursor-pointer flex-col items-center justify-center rounded-lg border border-dashed border-border bg-background transition',
{
'border-primary/50 bg-primary/5': isDragActive,
'hover:bg-muted/30':
@@ -193,21 +193,21 @@ export const ConfigureDocumentUpload = ({ isSubmitting = false }: ConfigureDocum
</FormControl>
{isLoading && (
<div className="bg-background/50 absolute inset-0 flex items-center justify-center rounded-lg">
<Loader className="text-muted-foreground h-10 w-10 animate-spin" />
<div className="absolute inset-0 flex items-center justify-center rounded-lg bg-background/50">
<Loader className="h-10 w-10 animate-spin text-muted-foreground" />
</div>
)}
</div>
) : (
<div className="mt-2 rounded-lg border p-4">
<div className="flex items-center gap-x-4">
<div className="bg-primary/10 text-primary flex h-12 w-12 items-center justify-center rounded-md">
<div className="flex h-12 w-12 items-center justify-center rounded-md bg-primary/10 text-primary">
<FileText className="h-6 w-6" />
</div>
<div className="flex-1">
<div className="text-sm font-medium">{documentData.name}</div>
<div className="text-muted-foreground text-xs">
<div className="text-xs text-muted-foreground">
{formatFileSize(documentData.size)}
</div>
</div>
apps/remix/app/components/embed/authoring/configure-document-view.tsx
+2 -2
View File
@@ -88,11 +88,11 @@ export const ConfigureDocumentView = ({
return (
<div className="flex w-full flex-col space-y-8">
<div>
<h2 className="text-foreground mb-1 text-xl font-semibold">
<h2 className="mb-1 text-xl font-semibold text-foreground">
{isTemplate ? <Trans>Configure Template</Trans> : <Trans>Configure Document</Trans>}
</h2>
<p className="text-muted-foreground text-sm">
<p className="text-sm text-muted-foreground">
{isTemplate ? (
<Trans>Set up your template properties and recipient information</Trans>
) : (
apps/remix/app/components/embed/embed-client-loading.tsx
+1 -1
View File
@@ -3,7 +3,7 @@ import { Loader } from 'lucide-react';
export const EmbedClientLoading = () => {
return (
<div className="bg-background fixed left-0 top-0 z-[9999] flex h-full w-full items-center justify-center">
<div className="fixed left-0 top-0 z-[9999] flex h-full w-full items-center justify-center bg-background">
<Loader className="mr-2 h-4 w-4 animate-spin" />
<span>
apps/remix/app/components/embed/embed-document-completed.tsx
+2 -2
View File
@@ -12,7 +12,7 @@ export type EmbedDocumentCompletedPageProps = {
export const EmbedDocumentCompleted = ({ name, signature }: EmbedDocumentCompletedPageProps) => {
return (
<div className="embed--DocumentCompleted relative mx-auto flex min-h-[100dvh] max-w-screen-lg flex-col items-center justify-center p-6">
<h3 className="text-foreground text-2xl font-semibold">
<h3 className="text-2xl font-semibold text-foreground">
<Trans>Document Completed!</Trans>
</h3>
@@ -25,7 +25,7 @@ export const EmbedDocumentCompleted = ({ name, signature }: EmbedDocumentComplet
/>
</div>
<p className="text-muted-foreground mt-8 max-w-[50ch] text-center text-sm">
<p className="mt-8 max-w-[50ch] text-center text-sm text-muted-foreground">
<Trans>
The document is now completed, please follow any instructions provided within the parent
application.
apps/remix/app/components/embed/embed-document-rejected.tsx
+4 -4
View File
@@ -6,25 +6,25 @@ export const EmbedDocumentRejected = () => {
<div className="embed--DocumentRejected relative mx-auto flex min-h-[100dvh] max-w-screen-lg flex-col items-center justify-center p-6">
<div className="flex flex-col items-center">
<div className="flex items-center gap-x-4">
<XCircle className="text-destructive h-10 w-10" />
<XCircle className="h-10 w-10 text-destructive" />
<h2 className="max-w-[35ch] text-center text-2xl font-semibold leading-normal md:text-3xl lg:text-4xl">
<Trans>Document Rejected</Trans>
</h2>
</div>
<div className="text-destructive mt-4 flex items-center text-center text-sm">
<div className="mt-4 flex items-center text-center text-sm text-destructive">
<Trans>You have rejected this document</Trans>
</div>
<p className="text-muted-foreground mt-6 max-w-[60ch] text-center text-sm">
<p className="mt-6 max-w-[60ch] text-center text-sm text-muted-foreground">
<Trans>
The document owner has been notified of your decision. They may contact you with further
instructions if necessary.
</Trans>
</p>
<p className="text-muted-foreground mt-2 max-w-[60ch] text-center text-sm">
<p className="mt-2 max-w-[60ch] text-center text-sm text-muted-foreground">
<Trans>No further action is required from you at this time.</Trans>
</p>
</div>
apps/remix/app/components/embed/embed-document-waiting-for-turn.tsx
+3 -3
View File
@@ -25,19 +25,19 @@ export const EmbedDocumentWaitingForTurn = () => {
return (
<div className="embed--WaitingForTurn relative mx-auto flex min-h-[100dvh] max-w-screen-lg flex-col items-center justify-center p-6">
<h3 className="text-foreground text-center text-2xl font-bold">
<h3 className="text-center text-2xl font-bold text-foreground">
<Trans>Waiting for Your Turn</Trans>
</h3>
<div className="mt-8 max-w-[50ch] text-center">
<p className="text-muted-foreground text-sm">
<p className="text-sm text-muted-foreground">
<Trans>
It's currently not your turn to sign. Please check back soon as this document should be
available for you to sign shortly.
</Trans>
</p>
<p className="text-muted-foreground mt-4 text-sm">
<p className="mt-4 text-sm text-muted-foreground">
<Trans>Please check with the parent application for more information.</Trans>
</p>
</div>
apps/remix/app/components/embed/multisign/multi-sign-document-list.tsx
+10 -10
View File
@@ -60,27 +60,27 @@ export function MultiSignDocumentList({ envelopes, onDocumentSelect }: MultiSign
return (
<div className="mx-auto mt-16 flex w-full max-w-lg flex-col md:mt-16 md:rounded-2xl md:border md:px-8 md:py-16 md:shadow-lg">
<div className="flex items-center justify-center">
<XCircle className="text-destructive h-16 w-16 md:h-24 md:w-24" strokeWidth={1.2} />
<XCircle className="h-16 w-16 text-destructive md:h-24 md:w-24" strokeWidth={1.2} />
</div>
<h2 className="mt-12 text-xl font-bold md:text-2xl">
<Trans>It looks like we ran into an issue!</Trans>
</h2>
<p className="text-muted-foreground mt-6">
<p className="mt-6 text-muted-foreground">
<Trans>
One of the documents in the current bundle has a signing role that is not compatible
with the current signing experience.
</Trans>
</p>
<p className="text-muted-foreground mt-2">
<p className="mt-2 text-muted-foreground">
<Trans>
Assistants and Copy roles are currently not compatible with the multi-sign experience.
</Trans>
</p>
<p className="text-muted-foreground mt-2">
<p className="mt-2 text-muted-foreground">
<Trans>Please contact the site owner for further assistance.</Trans>
</p>
</div>
@@ -88,12 +88,12 @@ export function MultiSignDocumentList({ envelopes, onDocumentSelect }: MultiSign
}
return (
<div className="bg-background mx-auto w-full max-w-lg md:my-12 md:rounded-2xl md:border md:p-8 md:shadow-lg">
<h2 className="text-foreground mb-1 text-lg font-semibold">
<div className="mx-auto w-full max-w-lg bg-background md:my-12 md:rounded-2xl md:border md:p-8 md:shadow-lg">
<h2 className="mb-1 text-lg font-semibold text-foreground">
<Trans>Sign Documents</Trans>
</h2>
<p className="text-muted-foreground text-sm">
<p className="text-sm text-muted-foreground">
<Trans>
You have been requested to sign the following documents. Review each document carefully
and complete the signing process.
@@ -103,7 +103,7 @@ export function MultiSignDocumentList({ envelopes, onDocumentSelect }: MultiSign
{/* Progress Section */}
<div className="mt-6">
<div className="flex items-center justify-between text-sm">
<span className="text-muted-foreground font-medium">
<span className="font-medium text-muted-foreground">
<Trans>Progress</Trans>
</span>
<span className="text-muted-foreground">
@@ -120,9 +120,9 @@ export function MultiSignDocumentList({ envelopes, onDocumentSelect }: MultiSign
{envelopes.map((envelope) => (
<div
key={envelope.document.id}
className="border-border flex items-center gap-4 rounded-lg border px-4 py-2"
className="flex items-center gap-4 rounded-lg border border-border px-4 py-2"
>
<span className="text-foreground flex-1 truncate text-sm font-medium">
<span className="flex-1 truncate text-sm font-medium text-foreground">
{envelope.document.title}
</span>
apps/remix/app/components/forms/2fa/enable-authenticator-app-dialog.tsx
+3 -3
View File
@@ -216,18 +216,18 @@ export const EnableAuthenticatorAppDialog = ({ onSuccess }: EnableAuthenticatorA
}}
/>
<p className="text-muted-foreground text-sm">
<p className="text-sm text-muted-foreground">
<Trans>
If your authenticator app does not support QR codes, you can use the
following code instead:
</Trans>
</p>
<p className="bg-muted/60 text-muted-foreground rounded-lg p-2 text-center font-mono tracking-widest">
<p className="rounded-lg bg-muted/60 p-2 text-center font-mono tracking-widest text-muted-foreground">
{setup2FAData?.secret}
</p>
<p className="text-muted-foreground text-sm">
<p className="text-sm text-muted-foreground">
<Trans>
Once you have scanned the QR code or entered the code manually, enter the
code provided by your authenticator app below.
apps/remix/app/components/forms/2fa/recovery-code-list.tsx
+1 -1
View File
@@ -42,7 +42,7 @@ export const RecoveryCodeList = ({ recoveryCodes }: RecoveryCodeListProps) => {
{recoveryCodes.map((code) => (
<div
key={code}
className="bg-muted text-muted-foreground relative rounded-lg p-4 font-mono md:text-center"
className="relative rounded-lg bg-muted p-4 font-mono text-muted-foreground md:text-center"
>
<span>{code}</span>
apps/remix/app/components/forms/avatar-image.tsx
+1 -1
View File
@@ -168,7 +168,7 @@ export const AvatarImageForm = ({ className, team, organisation }: AvatarImageFo
{hasAvatarImage && (
<button
type="button"
className="bg-background/70 text-destructive absolute inset-0 flex cursor-pointer items-center justify-center text-xs opacity-0 transition-opacity hover:opacity-100"
className="absolute inset-0 flex cursor-pointer items-center justify-center bg-background/70 text-xs text-destructive opacity-0 transition-opacity hover:opacity-100"
disabled={form.formState.isSubmitting}
onClick={() => void onFormSubmit({ bytes: null })}
>
apps/remix/app/components/forms/branding-preferences-form.tsx
+6 -6
View File
@@ -173,7 +173,7 @@ export function BrandingPreferencesForm({
/>
<div className="relative flex w-full flex-col gap-y-4">
{!isBrandingEnabled && <div className="bg-background/60 absolute inset-0 z-[9998]" />}
{!isBrandingEnabled && <div className="absolute inset-0 z-[9998] bg-background/60" />}
<FormField
control={form.control}
@@ -185,7 +185,7 @@ export function BrandingPreferencesForm({
</FormLabel>
<div className="flex flex-col gap-4">
<div className="border-border bg-background relative h-48 w-full overflow-hidden rounded-lg border">
<div className="relative h-48 w-full overflow-hidden rounded-lg border border-border bg-background">
{previewUrl ? (
<img
src={previewUrl}
@@ -193,12 +193,12 @@ export function BrandingPreferencesForm({
className="h-full w-full object-contain p-4"
/>
) : (
<div className="bg-muted/20 dark:bg-muted text-muted-foreground relative flex h-full w-full items-center justify-center text-sm">
<div className="relative flex h-full w-full items-center justify-center bg-muted/20 text-sm text-muted-foreground dark:bg-muted">
<Trans>Please upload a logo</Trans>
{!hasLoadedPreview && (
<div className="bg-muted dark:bg-muted absolute inset-0 z-[999] flex items-center justify-center">
<Loader className="text-muted-foreground h-8 w-8 animate-spin" />
<div className="absolute inset-0 z-[999] flex items-center justify-center bg-muted dark:bg-muted">
<Loader className="h-8 w-8 animate-spin text-muted-foreground" />
</div>
)}
</div>
@@ -243,7 +243,7 @@ export function BrandingPreferencesForm({
type="button"
variant="link"
size="sm"
className="text-destructive text-xs"
className="text-xs text-destructive"
onClick={() => {
setPreviewUrl('');
onChange(null);
apps/remix/app/components/forms/editor/editor-field-checkbox-form.tsx
+4 -4
View File
@@ -184,7 +184,7 @@ export const EditorFieldCheckboxForm = ({
</FormLabel>
<FormControl>
<Select value={field.value} onValueChange={field.onChange}>
<SelectTrigger className="text-muted-foreground bg-background w-full">
<SelectTrigger className="w-full bg-background text-muted-foreground">
<SelectValue placeholder={t`Select direction`} />
</SelectTrigger>
<SelectContent position="popper">
@@ -214,7 +214,7 @@ export const EditorFieldCheckboxForm = ({
</FormLabel>
<FormControl>
<Select {...field} onValueChange={field.onChange}>
<SelectTrigger className="text-muted-foreground bg-background w-full">
<SelectTrigger className="w-full bg-background text-muted-foreground">
<SelectValue placeholder={t`Select at least`} />
</SelectTrigger>
<SelectContent position="popper">
@@ -260,7 +260,7 @@ export const EditorFieldCheckboxForm = ({
void form.trigger();
}}
>
<SelectTrigger className="text-muted-foreground bg-background mt-5 w-full">
<SelectTrigger className="mt-5 w-full bg-background text-muted-foreground">
<SelectValue placeholder={t`Pick a number`} />
</SelectTrigger>
<SelectContent position="popper">
@@ -310,7 +310,7 @@ export const EditorFieldCheckboxForm = ({
<FormItem>
<FormControl>
<Checkbox
className="data-[state=checked]:bg-primary border-foreground/30 h-5 w-5"
className="h-5 w-5 border-foreground/30 data-[state=checked]:bg-primary"
checked={field.value}
onCheckedChange={field.onChange}
/>
apps/remix/app/components/forms/editor/editor-field-dropdown-form.tsx
+1 -1
View File
@@ -176,7 +176,7 @@ export const EditorFieldDropdownForm = ({
value={field.value ?? '-1'}
onValueChange={(value) => field.onChange(value === '-1' ? undefined : value)}
>
<SelectTrigger className="text-muted-foreground bg-background w-full">
<SelectTrigger className="w-full bg-background text-muted-foreground">
<SelectValue placeholder={t`Default Value`} />
</SelectTrigger>
<SelectContent position="popper">
apps/remix/app/components/forms/editor/editor-field-generic-field-forms.tsx
+2 -2
View File
@@ -255,7 +255,7 @@ export const EditorGenericRequiredField = ({
onCheckedChange={field.onChange}
/>
<label className="text-muted-foreground ml-2 text-sm" htmlFor="field-required">
<label className="ml-2 text-sm text-muted-foreground" htmlFor="field-required">
<Trans>Required Field</Trans>
</label>
</div>
@@ -298,7 +298,7 @@ export const EditorGenericReadOnlyField = ({
onCheckedChange={field.onChange}
/>
<label className="text-muted-foreground ml-2 text-sm" htmlFor="field-read-only">
<label className="ml-2 text-sm text-muted-foreground" htmlFor="field-read-only">
<Trans>Read Only</Trans>
</label>
</div>
apps/remix/app/components/forms/editor/editor-field-number-form.tsx
+1 -1
View File
@@ -203,7 +203,7 @@ export const EditorFieldNumberForm = ({
value={field.value === null ? '-1' : field.value}
onValueChange={(value) => field.onChange(value === '-1' ? null : value)}
>
<SelectTrigger className="text-muted-foreground bg-background w-full">
<SelectTrigger className="w-full bg-background text-muted-foreground">
<SelectValue placeholder={t`Field format`} />
</SelectTrigger>
<SelectContent position="popper">
apps/remix/app/components/forms/editor/editor-field-radio-form.tsx
+2 -2
View File
@@ -140,7 +140,7 @@ export const EditorFieldRadioForm = ({
</FormLabel>
<FormControl>
<Select value={field.value} onValueChange={field.onChange}>
<SelectTrigger className="text-muted-foreground bg-background w-full">
<SelectTrigger className="w-full bg-background text-muted-foreground">
<SelectValue placeholder={t`Select direction`} />
</SelectTrigger>
<SelectContent position="popper">
@@ -187,7 +187,7 @@ export const EditorFieldRadioForm = ({
<FormItem>
<FormControl>
<Checkbox
className="data-[state=checked]:bg-primary border-foreground/30 h-5 w-5"
className="h-5 w-5 border-foreground/30 data-[state=checked]:bg-primary"
checked={field.value}
onCheckedChange={(value) => {
// Uncheck all other values.
apps/remix/app/components/forms/editor/editor-field-signature-form.tsx
+1 -1
View File
@@ -60,7 +60,7 @@ export const EditorFieldSignatureForm = ({
<fieldset className="flex flex-col gap-2">
<div>
<EditorGenericFontSizeField formControl={form.control} />
<p className="text-muted-foreground mt-0.5 text-xs">
<p className="mt-0.5 text-xs text-muted-foreground">
<Trans>The typed signature font size</Trans>
</p>
</div>
apps/remix/app/components/forms/organisation-update-form.tsx
+1 -1
View File
@@ -131,7 +131,7 @@ export const OrganisationUpdateForm = () => {
<Input className="bg-background" {...field} />
</FormControl>
{!form.formState.errors.url && (
<span className="text-foreground/50 text-xs font-normal">
<span className="text-xs font-normal text-foreground/50">
{field.value ? (
`${NEXT_PUBLIC_WEBAPP_URL()}/o/${field.value}`
) : (
apps/remix/app/components/forms/public-profile-form.tsx
+3 -3
View File
@@ -155,7 +155,7 @@ export const PublicProfileForm = ({
</FormControl>
{!isPersonalLayoutMode && (
<p className="text-muted-foreground text-xs">
<p className="text-xs text-muted-foreground">
<Trans>
You can update the profile URL by updating the team URL in the general
settings page.
@@ -165,7 +165,7 @@ export const PublicProfileForm = ({
<div className="h-8">
{!form.formState.errors.url && (
<div className="text-muted-foreground h-8 text-sm">
<div className="h-8 text-sm text-muted-foreground">
{field.value ? (
<div>
<Button
@@ -229,7 +229,7 @@ export const PublicProfileForm = ({
</FormControl>
{!form.formState.errors.profileBio && (
<p className="text-muted-foreground text-sm">
<p className="text-sm text-muted-foreground">
{remaningLength >= 0 ? (
<Plural
value={remaningLength}
apps/remix/app/components/forms/search-param-selector.tsx
+1 -1
View File
@@ -41,7 +41,7 @@ export const SearchParamSelector = ({ children, paramKey, isValueValid }: Search
return (
<Select defaultValue={value} onValueChange={onValueChange}>
<SelectTrigger className="text-muted-foreground max-w-[200px]">
<SelectTrigger className="max-w-[200px] text-muted-foreground">
<SelectValue />
</SelectTrigger>
apps/remix/app/components/forms/signup.tsx
+14 -14
View File
@@ -196,7 +196,7 @@ export const SignUpForm = ({
return (
<div className={cn('flex justify-center gap-x-12', className)}>
<div className="border-border relative hidden flex-1 overflow-hidden rounded-xl border xl:flex">
<div className="relative hidden flex-1 overflow-hidden rounded-xl border border-border xl:flex">
<div className="absolute -inset-8 -z-[2] backdrop-blur">
<img
src={communityCardsImage}
@@ -205,17 +205,17 @@ export const SignUpForm = ({
/>
</div>
<div className="bg-background/50 absolute -inset-8 -z-[1] backdrop-blur-[2px]" />
<div className="absolute -inset-8 -z-[1] bg-background/50 backdrop-blur-[2px]" />
<div className="relative flex h-full w-full flex-col items-center justify-evenly">
<div className="bg-background rounded-2xl border px-4 py-1 text-sm font-medium">
<div className="rounded-2xl border bg-background px-4 py-1 text-sm font-medium">
<Trans>User profiles are here!</Trans>
</div>
<div className="w-full max-w-md">
<UserProfileTimur
rows={2}
className="bg-background border-border rounded-2xl border shadow-md"
className="rounded-2xl border border-border bg-background shadow-md"
/>
</div>
@@ -223,13 +223,13 @@ export const SignUpForm = ({
</div>
</div>
<div className="border-border dark:bg-background relative z-10 flex min-h-[min(850px,80vh)] w-full max-w-lg flex-col rounded-xl border bg-neutral-100 p-6">
<div className="relative z-10 flex min-h-[min(850px,80vh)] w-full max-w-lg flex-col rounded-xl border border-border bg-neutral-100 p-6 dark:bg-background">
<div className="h-20">
<h1 className="text-xl font-semibold md:text-2xl">
<Trans>Create a new account</Trans>
</h1>
<p className="text-muted-foreground mt-2 text-xs md:text-sm">
<p className="mt-2 text-xs text-muted-foreground md:text-sm">
<Trans>
Create your account and start using state-of-the-art document signing. Open and
beautiful signing is within your grasp.
@@ -325,11 +325,11 @@ export const SignUpForm = ({
{hasSocialAuthEnabled && (
<>
<div className="relative flex items-center justify-center gap-x-4 py-2 text-xs uppercase">
<div className="bg-border h-px flex-1" />
<span className="text-muted-foreground bg-transparent">
<div className="h-px flex-1 bg-border" />
<span className="bg-transparent text-muted-foreground">
<Trans>Or</Trans>
</span>
<div className="bg-border h-px flex-1" />
<div className="h-px flex-1 bg-border" />
</div>
</>
)}
@@ -340,7 +340,7 @@ export const SignUpForm = ({
type="button"
size="lg"
variant={'outline'}
className="bg-background text-muted-foreground border"
className="border bg-background text-muted-foreground"
disabled={isSubmitting}
onClick={onSignUpWithGoogleClick}
>
@@ -356,7 +356,7 @@ export const SignUpForm = ({
type="button"
size="lg"
variant={'outline'}
className="bg-background text-muted-foreground border"
className="border bg-background text-muted-foreground"
disabled={isSubmitting}
onClick={onSignUpWithMicrosoftClick}
>
@@ -376,7 +376,7 @@ export const SignUpForm = ({
type="button"
size="lg"
variant={'outline'}
className="bg-background text-muted-foreground border"
className="border bg-background text-muted-foreground"
disabled={isSubmitting}
onClick={onSignUpWithOIDCClick}
>
@@ -386,7 +386,7 @@ export const SignUpForm = ({
</>
)}
<p className="text-muted-foreground mt-4 text-sm">
<p className="mt-4 text-sm text-muted-foreground">
<Trans>
Already have an account?{' '}
<Link to="/signin" className="text-documenso-700 duration-200 hover:opacity-70">
@@ -406,7 +406,7 @@ export const SignUpForm = ({
</Button>
</form>
</Form>
<p className="text-muted-foreground mt-6 text-xs">
<p className="mt-6 text-xs text-muted-foreground">
<Trans>
By proceeding, you agree to our{' '}
<Link
apps/remix/app/components/forms/team-update-form.tsx
+1 -1
View File
@@ -129,7 +129,7 @@ export const TeamUpdateForm = ({ teamId, teamName, teamUrl }: UpdateTeamDialogPr
<Input className="bg-background" {...field} />
</FormControl>
{!form.formState.errors.url && (
<span className="text-foreground/50 text-xs font-normal">
<span className="text-xs font-normal text-foreground/50">
{field.value ? (
`${NEXT_PUBLIC_WEBAPP_URL()}/t/${field.value}`
) : (
apps/remix/app/components/general/admin-monthly-active-user-charts.tsx
+1 -1
View File
@@ -44,7 +44,7 @@ export const MonthlyActiveUsersChart = ({
return (
<div className={className}>
<div className="border-border flex flex-1 flex-col justify-center rounded-2xl border p-6 pl-2">
<div className="flex flex-1 flex-col justify-center rounded-2xl border border-border p-6 pl-2">
<div className="mb-6 flex px-4">
<h3 className="text-lg font-semibold">{title}</h3>
</div>
apps/remix/app/components/general/admin-stats-signer-conversion-chart.tsx
+1 -1
View File
@@ -26,7 +26,7 @@ export const AdminStatsSignerConversionChart = ({
return (
<div className={className}>
<div className="border-border flex flex-1 flex-col justify-center rounded-2xl border p-6 pl-2">
<div className="flex flex-1 flex-col justify-center rounded-2xl border border-border p-6 pl-2">
<div className="mb-6 flex px-4">
<h3 className="text-lg font-semibold">{title}</h3>
</div>
apps/remix/app/components/general/admin-stats-users-with-documents.tsx
+1 -1
View File
@@ -60,7 +60,7 @@ export const AdminStatsUsersWithDocumentsChart = ({
return (
<div className={className}>
<div className="border-border flex flex-1 flex-col justify-center rounded-2xl border p-6 pl-2">
<div className="flex flex-1 flex-col justify-center rounded-2xl border border-border p-6 pl-2">
<div className="mb-6 flex h-12 px-4">
<h3 className="text-lg font-semibold">{title}</h3>
</div>
apps/remix/app/components/general/app-header.tsx
+6 -6
View File
@@ -52,7 +52,7 @@ export const Header = ({ className, ...props }: HeaderProps) => {
return (
<header
className={cn(
'supports-backdrop-blur:bg-background/60 bg-background/95 sticky top-0 z-[60] flex h-16 w-full items-center border-b border-b-transparent backdrop-blur duration-200',
'supports-backdrop-blur:bg-background/60 sticky top-0 z-[60] flex h-16 w-full items-center border-b border-b-transparent bg-background/95 backdrop-blur duration-200',
scrollY > 5 && 'border-b-border',
className,
)}
@@ -61,7 +61,7 @@ export const Header = ({ className, ...props }: HeaderProps) => {
<div className="mx-auto flex w-full max-w-screen-xl items-center justify-between gap-x-4 px-4 md:justify-normal md:px-8">
<Link
to={getRootHref(params)}
className="focus-visible:ring-ring ring-offset-background hidden rounded-md focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 md:inline"
className="hidden rounded-md ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 md:inline"
>
<BrandingLogo className="h-6 w-auto" />
</Link>
@@ -70,10 +70,10 @@ export const Header = ({ className, ...props }: HeaderProps) => {
<Button asChild variant="outline" className="relative hidden h-10 w-10 rounded-lg md:flex">
<Link to="/inbox" className="relative block h-10 w-10">
<InboxIcon className="text-muted-foreground hover:text-foreground h-5 w-5 flex-shrink-0 transition-colors" />
<InboxIcon className="h-5 w-5 flex-shrink-0 text-muted-foreground transition-colors hover:text-foreground" />
{unreadCountData && unreadCountData.count > 0 && (
<span className="bg-primary text-primary-foreground absolute -right-1.5 -top-1.5 flex h-5 w-5 items-center justify-center rounded-full text-[10px] font-semibold">
<span className="absolute -right-1.5 -top-1.5 flex h-5 w-5 items-center justify-center rounded-full bg-primary text-[10px] font-semibold text-primary-foreground">
{unreadCountData.count > 99 ? '99+' : unreadCountData.count}
</span>
)}
@@ -86,11 +86,11 @@ export const Header = ({ className, ...props }: HeaderProps) => {
<div className="flex flex-row items-center space-x-4 md:hidden">
<button onClick={() => setIsCommandMenuOpen(true)}>
<SearchIcon className="text-muted-foreground h-6 w-6" />
<SearchIcon className="h-6 w-6 text-muted-foreground" />
</button>
<button onClick={() => setIsHamburgerMenuOpen(true)}>
<MenuIcon className="text-muted-foreground h-6 w-6" />
<MenuIcon className="h-6 w-6 text-muted-foreground" />
</button>
<AppCommandMenu open={isCommandMenuOpen} onOpenChange={setIsCommandMenuOpen} />
apps/remix/app/components/general/app-nav-desktop.tsx
+3 -3
View File
@@ -86,7 +86,7 @@ export const AppNavDesktop = ({
key={href}
to={href}
className={cn(
'text-muted-foreground dark:text-muted-foreground/60 focus-visible:ring-ring ring-offset-background rounded-md font-medium leading-5 hover:opacity-80 focus-visible:outline-none focus-visible:ring-2',
'rounded-md font-medium leading-5 text-muted-foreground ring-offset-background hover:opacity-80 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring dark:text-muted-foreground/60',
{
'text-foreground dark:text-muted-foreground': pathname?.startsWith(href),
},
@@ -102,7 +102,7 @@ export const AppNavDesktop = ({
<Button
variant="outline"
className="text-muted-foreground flex w-full max-w-96 items-center justify-between rounded-lg"
className="flex w-full max-w-96 items-center justify-between rounded-lg text-muted-foreground"
onClick={() => setIsCommandMenuOpen(true)}
>
<div className="flex items-center">
@@ -111,7 +111,7 @@ export const AppNavDesktop = ({
</div>
<div>
<div className="text-muted-foreground bg-muted flex items-center rounded-md px-1.5 py-0.5 text-xs tracking-wider">
<div className="flex items-center rounded-md bg-muted px-1.5 py-0.5 text-xs tracking-wider text-muted-foreground">
{modifierKey}+K
</div>
</div>
apps/remix/app/components/general/app-nav-mobile.tsx
+4 -4
View File
@@ -97,13 +97,13 @@ export const AppNavMobile = ({ isMenuOpen, onMenuOpenChange }: AppNavMobileProps
{menuNavigationLinks.map(({ href, text }) => (
<Link
key={href}
className="text-foreground hover:text-foreground/80 flex items-center gap-2 text-2xl font-semibold"
className="flex items-center gap-2 text-2xl font-semibold text-foreground hover:text-foreground/80"
to={href}
onClick={() => handleMenuItemClick()}
>
{text}
{href === '/inbox' && unreadCountData && unreadCountData.count > 0 && (
<span className="bg-primary text-primary-foreground flex h-6 min-w-[1.5rem] items-center justify-center rounded-full px-1.5 text-xs font-semibold">
<span className="flex h-6 min-w-[1.5rem] items-center justify-center rounded-full bg-primary px-1.5 text-xs font-semibold text-primary-foreground">
{unreadCountData.count > 99 ? '99+' : unreadCountData.count}
</span>
)}
@@ -111,7 +111,7 @@ export const AppNavMobile = ({ isMenuOpen, onMenuOpenChange }: AppNavMobileProps
))}
<button
className="text-foreground hover:text-foreground/80 text-2xl font-semibold"
className="text-2xl font-semibold text-foreground hover:text-foreground/80"
onClick={async () => authClient.signOut()}
>
<Trans>Sign Out</Trans>
@@ -123,7 +123,7 @@ export const AppNavMobile = ({ isMenuOpen, onMenuOpenChange }: AppNavMobileProps
<ThemeSwitcher />
</div>
<p className="text-muted-foreground text-sm">
<p className="text-sm text-muted-foreground">
© {new Date().getFullYear()} Documenso, Inc.
<br />
<Trans>All rights reserved.</Trans>
apps/remix/app/components/general/direct-template/direct-template-signing-auth-page.tsx
+1 -1
View File
@@ -38,7 +38,7 @@ export const DirectTemplateAuthPageView = () => {
<Trans>Authentication required</Trans>
</h1>
<p className="text-muted-foreground mt-2 text-sm">
<p className="mt-2 text-sm text-muted-foreground">
<Trans>You need to be logged in to view this page.</Trans>
</p>
apps/remix/app/components/general/document-signing/access-auth-2fa-form.tsx
+5 -5
View File
@@ -151,7 +151,7 @@ export const AccessAuth2FAForm = ({ onSubmit, token, error }: AccessAuth2FAFormP
<h3 className="text-lg font-semibold">
<Trans>Choose verification method</Trans>
</h3>
<p className="text-muted-foreground text-sm">
<p className="text-sm text-muted-foreground">
<Trans>Please select how you'd like to receive your verification code.</Trans>
</p>
</div>
@@ -175,7 +175,7 @@ export const AccessAuth2FAForm = ({ onSubmit, token, error }: AccessAuth2FAFormP
<div className="font-medium">
<Trans>Email verification</Trans>
</div>
<div className="text-muted-foreground text-sm">
<div className="text-sm text-muted-foreground">
<Trans>We'll send a 6-digit code to your email</Trans>
</div>
</div>
@@ -194,7 +194,7 @@ export const AccessAuth2FAForm = ({ onSubmit, token, error }: AccessAuth2FAFormP
<div className="font-medium">
<Trans>Authenticator app</Trans>
</div>
<div className="text-muted-foreground text-sm">
<div className="text-sm text-muted-foreground">
<Trans>Use your authenticator app to generate a code</Trans>
</div>
</div>
@@ -216,7 +216,7 @@ export const AccessAuth2FAForm = ({ onSubmit, token, error }: AccessAuth2FAFormP
</h3>
</div>
<div className="text-muted-foreground text-sm">
<div className="text-sm text-muted-foreground">
{selectedMethod === 'email' ? (
<Trans>
We've sent a 6-digit verification code to your email. Please enter it below to
@@ -262,7 +262,7 @@ export const AccessAuth2FAForm = ({ onSubmit, token, error }: AccessAuth2FAFormP
{expiresAt && millisecondsRemaining !== null && (
<div
className={cn('text-muted-foreground mt-2 text-center text-sm', {
className={cn('mt-2 text-center text-sm text-muted-foreground', {
'text-destructive': millisecondsRemaining <= 0,
})}
>
apps/remix/app/components/general/document-signing/document-signing-attachments-popover.tsx
+4 -4
View File
@@ -47,7 +47,7 @@ export const DocumentSigningAttachmentsPopover = ({
<h4 className="font-medium">
<Trans>Attachments</Trans>
</h4>
<p className="text-muted-foreground mt-1 text-sm">
<p className="mt-1 text-sm text-muted-foreground">
<Trans>Documents and resources related to this envelope.</Trans>
</p>
</div>
@@ -60,14 +60,14 @@ export const DocumentSigningAttachmentsPopover = ({
title={attachment.data}
target="_blank"
rel="noopener noreferrer"
className="border-border hover:bg-muted/50 group flex items-center justify-between rounded-md border px-3 py-2.5 transition duration-200"
className="group flex items-center justify-between rounded-md border border-border px-3 py-2.5 transition duration-200 hover:bg-muted/50"
>
<div className="flex flex-1 items-center gap-2.5">
<div className="bg-muted rounded p-2">
<div className="rounded bg-muted p-2">
<PaperclipIcon className="h-4 w-4" />
</div>
<span className="text-muted-foreground hover:text-foreground block truncate text-sm underline">
<span className="block truncate text-sm text-muted-foreground underline hover:text-foreground">
{attachment.label}
</span>
</div>
apps/remix/app/components/general/document-signing/document-signing-auth-dialog.tsx
+2 -2
View File
@@ -123,7 +123,7 @@ export const DocumentSigningAuthDialog = ({
{/* Show chooser if no auth type is selected and there are multiple options */}
{!selectedAuthType && validAuthTypes.length > 1 && (
<div className="space-y-4">
<p className="text-muted-foreground text-sm">
<p className="text-sm text-muted-foreground">
<Trans>Choose your preferred authentication method:</Trans>
</p>
<div className="grid gap-2">
@@ -145,7 +145,7 @@ export const DocumentSigningAuthDialog = ({
.exhaustive()}
</div>
<div className="text-muted-foreground text-sm">
<div className="text-sm text-muted-foreground">
{match(authType)
.with(DocumentAuth.ACCOUNT, () => <Trans>Sign in to your account</Trans>)
.with(DocumentAuth.PASSKEY, () => (
apps/remix/app/components/general/document-signing/document-signing-auth-page.tsx
+1 -1
View File
@@ -54,7 +54,7 @@ export const DocumentSigningAuthPageView = ({
<Trans>Authentication required</Trans>
</h1>
<p className="text-muted-foreground mt-2 text-sm">
<p className="mt-2 text-sm text-muted-foreground">
{email ? (
<Trans>
You need to be logged in as <strong>{email}</strong> to view this page.
apps/remix/app/components/general/document-signing/document-signing-auth-provider.tsx
+3 -3
View File
@@ -184,9 +184,9 @@ export const DocumentSigningAuthProvider = ({
// Assume that a user must be logged in for any auth requirements.
const isAuthRedirectRequired = Boolean(
derivedRecipientActionAuth &&
derivedRecipientActionAuth.length > 0 &&
!derivedRecipientActionAuth.includes(DocumentAuth.EXPLICIT_NONE) &&
user?.email !== recipient.email,
derivedRecipientActionAuth.length > 0 &&
!derivedRecipientActionAuth.includes(DocumentAuth.EXPLICIT_NONE) &&
user?.email !== recipient.email,
);
const refetchPasskeys = async () => {
apps/remix/app/components/general/document-signing/document-signing-auto-sign.tsx
+1 -1
View File
@@ -167,7 +167,7 @@ export const DocumentSigningAutoSign = ({ recipient, fields }: DocumentSigningAu
</DialogTitle>
</DialogHeader>
<div className="text-muted-foreground max-w-[50ch]">
<div className="max-w-[50ch] text-muted-foreground">
<p>
<Trans>
When you sign a document, we can automatically fill in and sign the following fields
apps/remix/app/components/general/document-signing/document-signing-checkbox-field.tsx
+4 -4
View File
@@ -265,8 +265,8 @@ export const DocumentSigningCheckboxField = ({
type="Checkbox"
>
{isLoading && (
<div className="bg-background absolute inset-0 z-20 flex items-center justify-center rounded-md">
<Loader className="text-primary h-5 w-5 animate-spin md:h-8 md:w-8" />
<div className="absolute inset-0 z-20 flex items-center justify-center rounded-md bg-background">
<Loader className="h-5 w-5 animate-spin text-primary md:h-8 md:w-8" />
</div>
)}
@@ -300,7 +300,7 @@ export const DocumentSigningCheckboxField = ({
{!item.value.includes('empty-value-') && item.value && (
<Label
htmlFor={`checkbox-${field.id}-${item.id}`}
className="text-foreground ml-1.5 text-xs font-normal"
className="ml-1.5 text-xs font-normal text-foreground"
>
{item.value}
</Label>
@@ -334,7 +334,7 @@ export const DocumentSigningCheckboxField = ({
{!item.value.includes('empty-value-') && item.value && (
<Label
htmlFor={`checkbox-${field.id}-${item.id}`}
className="text-foreground ml-1.5 text-xs font-normal"
className="ml-1.5 text-xs font-normal text-foreground"
>
{item.value}
</Label>
apps/remix/app/components/general/document-signing/document-signing-date-field.tsx
+4 -4
View File
@@ -136,13 +136,13 @@ export const DocumentSigningDateField = ({
tooltipText={isDifferentTime ? tooltipText : undefined}
>
{isLoading && (
<div className="bg-background absolute inset-0 flex items-center justify-center rounded-md">
<Loader className="text-primary h-5 w-5 animate-spin md:h-8 md:w-8" />
<div className="absolute inset-0 flex items-center justify-center rounded-md bg-background">
<Loader className="h-5 w-5 animate-spin text-primary md:h-8 md:w-8" />
</div>
)}
{!field.inserted && (
<p className="group-hover:text-primary text-foreground group-hover:text-recipient-green text-[clamp(0.425rem,25cqw,0.825rem)] duration-200">
<p className="text-[clamp(0.425rem,25cqw,0.825rem)] text-foreground duration-200 group-hover:text-primary group-hover:text-recipient-green">
<Trans>Date</Trans>
</p>
)}
@@ -151,7 +151,7 @@ export const DocumentSigningDateField = ({
<div className="flex h-full w-full items-center">
<p
className={cn(
'text-foreground w-full whitespace-nowrap text-left text-[clamp(0.425rem,25cqw,0.825rem)] duration-200',
'w-full whitespace-nowrap text-left text-[clamp(0.425rem,25cqw,0.825rem)] text-foreground duration-200',
{
'!text-center': parsedFieldMeta?.textAlign === 'center',
'!text-right': parsedFieldMeta?.textAlign === 'right',
apps/remix/app/components/general/document-signing/document-signing-disclosure.tsx
+1 -1
View File
@@ -12,7 +12,7 @@ export const DocumentSigningDisclosure = ({
...props
}: DocumentSigningDisclosureProps) => {
return (
<p className={cn('text-muted-foreground text-xs', className)} {...props}>
<p className={cn('text-xs text-muted-foreground', className)} {...props}>
<Trans>
By proceeding with your electronic signature, you acknowledge and consent that it will be
used to sign the given document and holds the same legal validity as a handwritten
apps/remix/app/components/general/document-signing/document-signing-dropdown-field.tsx
+5 -5
View File
@@ -171,17 +171,17 @@ export const DocumentSigningDropdownField = ({
type="Dropdown"
>
{isLoading && (
<div className="bg-background absolute inset-0 flex items-center justify-center rounded-md">
<Loader className="text-primary h-5 w-5 animate-spin md:h-8 md:w-8" />
<div className="absolute inset-0 flex items-center justify-center rounded-md bg-background">
<Loader className="h-5 w-5 animate-spin text-primary md:h-8 md:w-8" />
</div>
)}
{!field.inserted && (
<p className="group-hover:text-primary text-foreground flex flex-col items-center justify-center duration-200">
<p className="flex flex-col items-center justify-center text-foreground duration-200 group-hover:text-primary">
<Select value={localChoice} onValueChange={handleSelectItem}>
<SelectTrigger
className={cn(
'text-foreground z-10 h-full w-full border-none ring-0 focus:border-none focus:ring-0',
'z-10 h-full w-full border-none text-foreground ring-0 focus:border-none focus:ring-0',
)}
>
<SelectValue
@@ -201,7 +201,7 @@ export const DocumentSigningDropdownField = ({
)}
{field.inserted && (
<p className="text-foreground text-[clamp(0.425rem,25cqw,0.825rem)] duration-200">
<p className="text-[clamp(0.425rem,25cqw,0.825rem)] text-foreground duration-200">
{field.customText}
</p>
)}
apps/remix/app/components/general/document-signing/document-signing-field-container.tsx
+2 -2
View File
@@ -180,10 +180,10 @@ export const DocumentSigningFieldContainer = ({
className={cn(
'absolute -top-16 left-0 right-0 rounded-md p-2 text-center text-xs text-gray-700',
{
'bg-foreground/5 border-border border': !field.inserted,
'border border-border bg-foreground/5': !field.inserted,
},
{
'bg-documenso-200 border-primary border': field.inserted,
'border border-primary bg-documenso-200': field.inserted,
},
)}
>
apps/remix/app/components/general/document-signing/document-signing-fields.tsx
+4 -4
View File
@@ -4,15 +4,15 @@ import { cn } from '@documenso/ui/lib/utils';
export const DocumentSigningFieldsLoader = () => {
return (
<div className="bg-background absolute inset-0 flex items-center justify-center rounded-md">
<Loader className="text-primary h-5 w-5 animate-spin md:h-8 md:w-8" />
<div className="absolute inset-0 flex items-center justify-center rounded-md bg-background">
<Loader className="h-5 w-5 animate-spin text-primary md:h-8 md:w-8" />
</div>
);
};
export const DocumentSigningFieldsUninserted = ({ children }: { children: React.ReactNode }) => {
return (
<p className="text-foreground group-hover:text-recipient-green whitespace-pre-wrap text-[clamp(0.425rem,25cqw,0.825rem)] duration-200">
<p className="whitespace-pre-wrap text-[clamp(0.425rem,25cqw,0.825rem)] text-foreground duration-200 group-hover:text-recipient-green">
{children}
</p>
);
@@ -37,7 +37,7 @@ export const DocumentSigningFieldsInserted = ({
<div className="flex h-full w-full items-center overflow-hidden">
<p
className={cn(
'text-foreground w-full whitespace-pre-wrap text-left text-[clamp(0.425rem,25cqw,0.825rem)] duration-200',
'w-full whitespace-pre-wrap text-left text-[clamp(0.425rem,25cqw,0.825rem)] text-foreground duration-200',
{
'!text-center': textAlign === 'center',
'!text-right': textAlign === 'right',
apps/remix/app/components/general/document-signing/document-signing-radio-field.tsx
+2 -2
View File
@@ -170,7 +170,7 @@ export const DocumentSigningRadioField = ({
{!item.value.includes('empty-value-') && item.value && (
<Label
htmlFor={`option-${field.id}-${item.id}`}
className="text-foreground ml-1.5 text-xs font-normal"
className="ml-1.5 text-xs font-normal text-foreground"
>
{item.value}
</Label>
@@ -194,7 +194,7 @@ export const DocumentSigningRadioField = ({
{!item.value.includes('empty-value-') && item.value && (
<Label
htmlFor={`option-${field.id}-${item.id}`}
className="text-foreground ml-1.5 text-xs font-normal"
className="ml-1.5 text-xs font-normal text-foreground"
>
{item.value}
</Label>
apps/remix/app/components/general/document-signing/document-signing-text-field.tsx
+1 -1
View File
@@ -279,7 +279,7 @@ export const DocumentSigningTextField = ({
{parsedFieldMeta?.characterLimit !== undefined &&
parsedFieldMeta?.characterLimit > 0 &&
!userInputHasErrors && (
<div className="text-muted-foreground text-sm">
<div className="text-sm text-muted-foreground">
<Plural
value={charactersRemaining}
one="1 character remaining"
apps/remix/app/components/general/document/document-attachments-popover.tsx
+3 -3
View File
@@ -143,7 +143,7 @@ export const DocumentAttachmentsPopover = ({
<h4 className="font-medium">
<Trans>Attachments</Trans>
</h4>
<p className="text-muted-foreground mt-1 text-sm">
<p className="mt-1 text-sm text-muted-foreground">
<Trans>Add links to relevant documents or resources.</Trans>
</p>
</div>
@@ -153,7 +153,7 @@ export const DocumentAttachmentsPopover = ({
{attachments?.data.map((attachment) => (
<div
key={attachment.id}
className="border-border flex items-center justify-between rounded-md border p-2"
className="flex items-center justify-between rounded-md border border-border p-2"
>
<div className="min-w-0 flex-1">
<p className="truncate text-sm font-medium">{attachment.label}</p>
@@ -161,7 +161,7 @@ export const DocumentAttachmentsPopover = ({
href={attachment.data}
target="_blank"
rel="noopener noreferrer"
className="text-muted-foreground hover:text-foreground truncate text-xs underline"
className="truncate text-xs text-muted-foreground underline hover:text-foreground"
>
{attachment.data}
</a>
apps/remix/app/components/general/document/document-page-view-dropdown.tsx
+1 -1
View File
@@ -69,7 +69,7 @@ export const DocumentPageViewDropdown = ({ envelope }: DocumentPageViewDropdownP
return (
<DropdownMenu>
<DropdownMenuTrigger>
<MoreHorizontal className="text-muted-foreground h-5 w-5" />
<MoreHorizontal className="h-5 w-5 text-muted-foreground" />
</DropdownMenuTrigger>
<DropdownMenuContent className="w-52" align="end" forceMount>
apps/remix/app/components/general/document/document-page-view-information.tsx
+1 -1
View File
@@ -50,7 +50,7 @@ export const DocumentPageViewInformation = ({
}, [isMounted, envelope, userId]);
return (
<section className="dark:bg-background text-foreground border-border bg-widget flex flex-col rounded-xl border">
<section className="flex flex-col rounded-xl border border-border bg-widget text-foreground dark:bg-background">
<h1 className="px-4 py-3 font-medium">
<Trans>Information</Trans>
</h1>
apps/remix/app/components/general/document/document-recipient-link-copy-dialog.tsx
+3 -3
View File
@@ -88,7 +88,7 @@ export const DocumentRecipientLinkCopyDialog = ({
</DialogDescription>
</DialogHeader>
<ul className="text-muted-foreground divide-y rounded-lg border">
<ul className="divide-y rounded-lg border text-muted-foreground">
{recipients.length === 0 && (
<li className="flex flex-col items-center justify-center py-6 text-sm">
<Trans>No recipients</Trans>
@@ -99,9 +99,9 @@ export const DocumentRecipientLinkCopyDialog = ({
<li key={recipient.id} className="flex items-center justify-between px-4 py-3 text-sm">
<AvatarWithText
avatarFallback={recipient.email.slice(0, 1).toUpperCase()}
primaryText={<p className="text-muted-foreground text-sm">{recipient.email}</p>}
primaryText={<p className="text-sm text-muted-foreground">{recipient.email}</p>}
secondaryText={
<p className="text-muted-foreground/70 text-xs">
<p className="text-xs text-muted-foreground/70">
{_(RECIPIENT_ROLES_DESCRIPTION[recipient.role].roleName)}
</p>
}
apps/remix/app/components/general/envelope-editor/envelope-editor-fields-drag-drop.tsx
+3 -3
View File
@@ -278,13 +278,13 @@ export const EnvelopeEditorFieldDragDrop = ({
onMouseDown={() => setSelectedField(field.type)}
data-selected={selectedField === field.type ? true : undefined}
className={cn(
'border-border group flex h-12 cursor-pointer items-center justify-center rounded-lg border px-4 transition-colors',
'group flex h-12 cursor-pointer items-center justify-center rounded-lg border border-border px-4 transition-colors',
RECIPIENT_COLOR_STYLES[selectedRecipientColor].fieldButton,
)}
>
<p
className={cn(
'text-muted-foreground font-noto group-data-[selected]:text-foreground flex items-center justify-center gap-x-1.5 text-sm font-normal',
'flex items-center justify-center gap-x-1.5 font-noto text-sm font-normal text-muted-foreground group-data-[selected]:text-foreground',
field.className,
{
'group-hover:text-recipient-green': selectedRecipientColor === 'green',
@@ -306,7 +306,7 @@ export const EnvelopeEditorFieldDragDrop = ({
{selectedField && (
<div
className={cn(
'text-muted-foreground dark:text-muted-background font-noto pointer-events-none fixed z-50 flex cursor-pointer flex-col items-center justify-center rounded-[2px] bg-white ring-2 transition duration-200 [container-type:size]',
'dark:text-muted-background pointer-events-none fixed z-50 flex cursor-pointer flex-col items-center justify-center rounded-[2px] bg-white font-noto text-muted-foreground ring-2 transition duration-200 [container-type:size]',
RECIPIENT_COLOR_STYLES[selectedRecipientColor].base,
selectedField === FieldType.SIGNATURE && 'font-signature',
{
apps/remix/app/components/general/envelope-editor/envelope-editor-title-input.tsx
+1 -1
View File
@@ -72,7 +72,7 @@ export const EnvelopeItemTitleInput = ({
disabled={disabled}
style={{ width: `${inputWidth}px` }}
className={cn(
'text-foreground hover:outline-muted-foreground focus:outline-muted-foreground rounded-sm border-0 bg-transparent p-1 text-sm font-medium outline-none hover:outline hover:outline-1 focus:outline focus:outline-1',
'rounded-sm border-0 bg-transparent p-1 text-sm font-medium text-foreground outline-none hover:outline hover:outline-1 hover:outline-muted-foreground focus:outline focus:outline-1 focus:outline-muted-foreground',
className,
{
'outline-red-500': isError,
apps/remix/app/components/general/folder/folder-card.tsx
+8 -8
View File
@@ -58,19 +58,19 @@ export const FolderCard = ({ folder, onMove, onSettings, onDelete }: FolderCardP
return (
<Link to={formatPath()} data-folder-id={folder.id} data-folder-name={folder.name}>
<Card className="hover:bg-muted/50 border-border h-full border transition-all">
<Card className="h-full border border-border transition-all hover:bg-muted/50">
<CardContent className="p-4">
<div className="flex min-w-0 items-center gap-3">
<FolderIcon className="text-documenso h-6 w-6 flex-shrink-0" />
<FolderIcon className="h-6 w-6 flex-shrink-0 text-documenso" />
<div className="flex w-full min-w-0 items-center justify-between">
<div className="min-w-0 flex-1">
<h3 className="flex min-w-0 items-center gap-2 font-medium">
<span className="truncate">{folder.name}</span>
{folder.pinned && <PinIcon className="text-documenso h-3 w-3 flex-shrink-0" />}
{folder.pinned && <PinIcon className="h-3 w-3 flex-shrink-0 text-documenso" />}
</h3>
<div className="text-muted-foreground mt-1 flex space-x-2 truncate text-xs">
<div className="mt-1 flex space-x-2 truncate text-xs text-muted-foreground">
<span>
{folder.type === FolderType.TEMPLATE ? (
<Plural
@@ -143,17 +143,17 @@ export const FolderCard = ({ folder, onMove, onSettings, onDelete }: FolderCardP
export const FolderCardEmpty = ({ type }: { type: FolderType }) => {
return (
<Card className="hover:bg-muted/50 border-border h-full border transition-all">
<Card className="h-full border border-border transition-all hover:bg-muted/50">
<CardContent className="p-4">
<div className="flex items-center gap-3">
<FolderPlusIcon className="text-muted-foreground/60 h-6 w-6" />
<FolderPlusIcon className="h-6 w-6 text-muted-foreground/60" />
<div>
<h3 className="text-muted-foreground flex items-center gap-2 font-medium">
<h3 className="flex items-center gap-2 font-medium text-muted-foreground">
<Trans>Create folder</Trans>
</h3>
<div className="text-muted-foreground/60 mt-1 flex space-x-2 truncate text-xs">
<div className="mt-1 flex space-x-2 truncate text-xs text-muted-foreground/60">
{type === FolderType.DOCUMENT ? (
<Trans>Organise your documents</Trans>
) : (
apps/remix/app/components/general/generic-error-layout.tsx
+2 -2
View File
@@ -81,11 +81,11 @@ export const GenericErrorLayout = ({
<div className="inset-0 mx-auto flex h-full flex-grow items-center justify-center px-6 py-32">
<div>
<p className="text-muted-foreground font-semibold">{_(subHeading)}</p>
<p className="font-semibold text-muted-foreground">{_(subHeading)}</p>
<h1 className="mt-3 text-2xl font-bold md:text-3xl">{_(heading)}</h1>
<p className="text-muted-foreground mt-4 text-sm">{_(message)}</p>
<p className="mt-4 text-sm text-muted-foreground">{_(message)}</p>
<div className="mt-6 flex gap-x-2.5 gap-y-4 md:items-center">
{secondaryButton ||
apps/remix/app/components/general/legacy-field-warning-popover.tsx
+1 -1
View File
@@ -83,7 +83,7 @@ export const LegacyFieldWarningPopover = ({
</Button>
}
>
<p className="text-muted-foreground text-sm">
<p className="text-sm text-muted-foreground">
{type === 'document' ? (
<Trans>
This document is using legacy field insertion, we recommend using the new field
apps/remix/app/components/general/menu-switcher.tsx
+7 -7
View File
@@ -54,7 +54,7 @@ export const MenuSwitcher = () => {
primaryText={user.name}
secondaryText={_(msg`Personal Account`)}
rightSideComponent={
<ChevronsUpDown className="text-muted-foreground ml-auto h-4 w-4" />
<ChevronsUpDown className="ml-auto h-4 w-4 text-muted-foreground" />
}
textSectionClassName="hidden lg:flex"
/>
@@ -66,7 +66,7 @@ export const MenuSwitcher = () => {
align="end"
forceMount
>
<DropdownMenuItem className="text-muted-foreground px-4 py-2" asChild>
<DropdownMenuItem className="px-4 py-2 text-muted-foreground" asChild>
<Link
to="/settings/organisations?action=add-organisation"
className="flex items-center justify-between"
@@ -78,34 +78,34 @@ export const MenuSwitcher = () => {
<DropdownMenuSeparator />
{isUserAdmin && (
<DropdownMenuItem className="text-muted-foreground px-4 py-2" asChild>
<DropdownMenuItem className="px-4 py-2 text-muted-foreground" asChild>
<Link to="/admin">
<Trans>Admin panel</Trans>
</Link>
</DropdownMenuItem>
)}
<DropdownMenuItem className="text-muted-foreground px-4 py-2" asChild>
<DropdownMenuItem className="px-4 py-2 text-muted-foreground" asChild>
<Link to="/inbox">
<Trans>Personal Inbox</Trans>
</Link>
</DropdownMenuItem>
<DropdownMenuItem className="text-muted-foreground px-4 py-2" asChild>
<DropdownMenuItem className="px-4 py-2 text-muted-foreground" asChild>
<Link to="/settings/profile">
<Trans>User settings</Trans>
</Link>
</DropdownMenuItem>
<DropdownMenuItem
className="text-muted-foreground px-4 py-2"
className="px-4 py-2 text-muted-foreground"
onClick={() => setLanguageSwitcherOpen(true)}
>
<Trans>Language</Trans>
</DropdownMenuItem>
<DropdownMenuItem
className="text-destructive/90 hover:!text-destructive px-4 py-2"
className="px-4 py-2 text-destructive/90 hover:!text-destructive"
onSelect={async () => authClient.signOut()}
>
<Trans>Sign Out</Trans>
apps/remix/app/components/general/org-menu-switcher.tsx
+18 -18
View File
@@ -130,7 +130,7 @@ export const OrgMenuSwitcher = () => {
primaryText={dropdownMenuAvatarText.primaryText}
secondaryText={dropdownMenuAvatarText.secondaryText}
rightSideComponent={
<ChevronsUpDown className="text-muted-foreground ml-auto h-4 w-4" />
<ChevronsUpDown className="ml-auto h-4 w-4 text-muted-foreground" />
}
textSectionClassName="hidden lg:flex"
/>
@@ -139,7 +139,7 @@ export const OrgMenuSwitcher = () => {
<DropdownMenuContent
className={cn(
'divide-border z-[60] ml-6 flex w-full divide-x p-0 md:ml-0 md:min-w-[40rem]',
'z-[60] ml-6 flex w-full divide-x divide-border p-0 md:ml-0 md:min-w-[40rem]',
)}
align="end"
forceMount
@@ -148,7 +148,7 @@ export const OrgMenuSwitcher = () => {
{/* Organisations column */}
<div className="flex w-full flex-col md:w-1/3">
<div className="flex h-12 items-center border-b p-2">
<h3 className="text-muted-foreground flex items-center px-2 text-sm font-medium">
<h3 className="flex items-center px-2 text-sm font-medium text-muted-foreground">
<Building2Icon className="mr-2 h-3.5 w-3.5" />
<Trans>Organisations</Trans>
</h3>
@@ -162,7 +162,7 @@ export const OrgMenuSwitcher = () => {
>
<DropdownMenuItem
className={cn(
'text-muted-foreground w-full px-4 py-2',
'w-full px-4 py-2 text-muted-foreground',
org.id === currentOrganisation?.id && !hoveredOrgId && 'bg-accent',
org.id === hoveredOrgId && 'bg-accent',
)}
@@ -186,7 +186,7 @@ export const OrgMenuSwitcher = () => {
<div className="absolute bottom-0 right-0 top-0 flex items-center justify-center">
<Link
to={`/o/${org.url}/settings`}
className="text-muted-foreground mr-2 rounded-sm border p-1 transition-opacity duration-200 group-hover:opacity-100 md:opacity-0"
className="mr-2 rounded-sm border p-1 text-muted-foreground transition-opacity duration-200 group-hover:opacity-100 md:opacity-0"
>
<Settings2Icon className="h-3.5 w-3.5" />
</Link>
@@ -207,7 +207,7 @@ export const OrgMenuSwitcher = () => {
{/* Teams column */}
<div className="hidden w-1/3 flex-col md:flex">
<div className="flex h-12 items-center border-b p-2">
<h3 className="text-muted-foreground flex items-center px-2 text-sm font-medium">
<h3 className="flex items-center px-2 text-sm font-medium text-muted-foreground">
<UsersIcon className="mr-2 h-3.5 w-3.5" />
<Trans>Teams</Trans>
</h3>
@@ -219,7 +219,7 @@ export const OrgMenuSwitcher = () => {
<div className="group relative" key={team.id}>
<DropdownMenuItem
className={cn(
'text-muted-foreground w-full px-4 py-2',
'w-full px-4 py-2 text-muted-foreground',
team.id === currentTeam?.id && 'bg-accent',
)}
asChild
@@ -239,7 +239,7 @@ export const OrgMenuSwitcher = () => {
<div className="absolute bottom-0 right-0 top-0 flex items-center justify-center">
<Link
to={`/t/${team.url}/settings`}
className="text-muted-foreground mr-2 rounded-sm border p-1 opacity-0 transition-opacity duration-200 group-hover:opacity-100"
className="mr-2 rounded-sm border p-1 text-muted-foreground opacity-0 transition-opacity duration-200 group-hover:opacity-100"
>
<Settings2Icon className="h-3.5 w-3.5" />
</Link>
@@ -248,7 +248,7 @@ export const OrgMenuSwitcher = () => {
</div>
))
) : (
<div className="text-muted-foreground my-12 flex items-center justify-center px-2 text-center text-sm">
<div className="my-12 flex items-center justify-center px-2 text-center text-sm text-muted-foreground">
<Trans>Select an organisation to view teams</Trans>
</div>
)}
@@ -268,14 +268,14 @@ export const OrgMenuSwitcher = () => {
{/* Settings column */}
<div className="hidden w-1/3 flex-col md:flex">
<div className="flex h-12 items-center border-b p-2">
<h3 className="text-muted-foreground flex items-center px-2 text-sm font-medium">
<h3 className="flex items-center px-2 text-sm font-medium text-muted-foreground">
<SettingsIcon className="mr-2 h-3.5 w-3.5" />
<Trans>Settings</Trans>
</h3>
</div>
<div className="flex-1 overflow-y-auto p-1.5">
{isUserAdmin && (
<DropdownMenuItem className="text-muted-foreground px-4 py-2" asChild>
<DropdownMenuItem className="px-4 py-2 text-muted-foreground" asChild>
<Link to="/admin">
<Trans>Admin panel</Trans>
</Link>
@@ -287,7 +287,7 @@ export const OrgMenuSwitcher = () => {
'MANAGE_ORGANISATION',
currentOrganisation.currentOrganisationRole,
) && (
<DropdownMenuItem className="text-muted-foreground px-4 py-2" asChild>
<DropdownMenuItem className="px-4 py-2 text-muted-foreground" asChild>
<Link to={`/o/${currentOrganisation.url}/settings`}>
<Trans>Organisation settings</Trans>
</Link>
@@ -295,34 +295,34 @@ export const OrgMenuSwitcher = () => {
)}
{currentTeam && canExecuteTeamAction('MANAGE_TEAM', currentTeam.currentTeamRole) && (
<DropdownMenuItem className="text-muted-foreground px-4 py-2" asChild>
<DropdownMenuItem className="px-4 py-2 text-muted-foreground" asChild>
<Link to={`/t/${currentTeam.url}/settings`}>
<Trans>Team settings</Trans>
</Link>
</DropdownMenuItem>
)}
<DropdownMenuItem className="text-muted-foreground px-4 py-2" asChild>
<DropdownMenuItem className="px-4 py-2 text-muted-foreground" asChild>
<Link to="/inbox">
<Trans>Personal Inbox</Trans>
</Link>
</DropdownMenuItem>
<DropdownMenuItem className="text-muted-foreground px-4 py-2" asChild>
<DropdownMenuItem className="px-4 py-2 text-muted-foreground" asChild>
<Link to="/settings/profile">
<Trans>Account</Trans>
</Link>
</DropdownMenuItem>
<DropdownMenuItem
className="text-muted-foreground px-4 py-2"
className="px-4 py-2 text-muted-foreground"
onClick={() => setLanguageSwitcherOpen(true)}
>
<Trans>Language</Trans>
</DropdownMenuItem>
{currentOrganisation && (
<DropdownMenuItem className="text-muted-foreground px-4 py-2" asChild>
<DropdownMenuItem className="px-4 py-2 text-muted-foreground" asChild>
<Link
to={{
pathname: `/o/${currentOrganisation.url}/support`,
@@ -335,7 +335,7 @@ export const OrgMenuSwitcher = () => {
)}
<DropdownMenuItem
className="text-muted-foreground hover:!text-muted-foreground px-4 py-2"
className="px-4 py-2 text-muted-foreground hover:!text-muted-foreground"
onSelect={async () => authClient.signOut()}
>
<Trans>Sign Out</Trans>
apps/remix/app/components/general/organisations/organisation-invitations.tsx
+1 -1
View File
@@ -90,7 +90,7 @@ export const OrganisationInvitations = ({ className }: { className?: string }) =
className="w-full max-w-none py-4"
avatarFallback={invitation.organisation.name.slice(0, 1)}
primaryText={
<span className="text-foreground/80 font-semibold">
<span className="font-semibold text-foreground/80">
{invitation.organisation.name}
</span>
}
apps/remix/app/components/general/period-selector.tsx
+1 -1
View File
@@ -47,7 +47,7 @@ export const PeriodSelector = () => {
return (
<Select defaultValue={period} onValueChange={onPeriodChange}>
<SelectTrigger className="text-muted-foreground max-w-[200px]">
<SelectTrigger className="max-w-[200px] text-muted-foreground">
<SelectValue />
</SelectTrigger>
apps/remix/app/components/general/settings-header.tsx
+1 -1
View File
@@ -23,7 +23,7 @@ export const SettingsHeader = ({
<div>
<h3 className="text-lg font-medium">{title}</h3>
<p className="text-muted-foreground text-sm md:mt-2">{subtitle}</p>
<p className="text-sm text-muted-foreground md:mt-2">{subtitle}</p>
</div>
{children}
apps/remix/app/components/general/stack-avatar.tsx
+1 -1
View File
@@ -47,7 +47,7 @@ export const StackAvatar = ({ first, zIndex, fallbackText = '', type }: StackAva
return (
<Avatar
className={` ${zIndexClass} ${firstClass} dark:border-border h-10 w-10 border-2 border-solid border-white`}
className={` ${zIndexClass} ${firstClass} h-10 w-10 border-2 border-solid border-white dark:border-border`}
>
<AvatarFallback className={classes}>{fallbackText}</AvatarFallback>
</Avatar>
apps/remix/app/components/general/teams/team-email-dropdown.tsx
+1 -1
View File
@@ -46,7 +46,7 @@ export const TeamEmailDropdown = ({ team }: TeamEmailDropdownProps) => {
return (
<DropdownMenu>
<DropdownMenuTrigger>
<MoreHorizontal className="text-muted-foreground h-5 w-5" />
<MoreHorizontal className="h-5 w-5 text-muted-foreground" />
</DropdownMenuTrigger>
<DropdownMenuContent className="w-52" align="start" forceMount>
apps/remix/app/components/general/template/template-page-view-documents-table.tsx
+2 -2
View File
@@ -133,8 +133,8 @@ export const TemplatePageViewDocumentsTable = ({
<InfoIcon className="mx-2 h-4 w-4" />
</TooltipTrigger>
<TooltipContent className="text-foreground max-w-md space-y-2 !p-0">
<ul className="text-muted-foreground space-y-0.5 divide-y [&>li]:p-4">
<TooltipContent className="max-w-md space-y-2 !p-0 text-foreground">
<ul className="space-y-0.5 divide-y text-muted-foreground [&>li]:p-4">
<li>
<h2 className="mb-2 flex flex-row items-center font-semibold">
<Trans>Template</Trans>
apps/remix/app/components/general/template/template-page-view-information.tsx
+1 -1
View File
@@ -54,7 +54,7 @@ export const TemplatePageViewInformation = ({
}, [isMounted, template, userId]);
return (
<section className="dark:bg-background text-foreground border-border bg-widget flex flex-col rounded-xl border">
<section className="flex flex-col rounded-xl border border-border bg-widget text-foreground dark:bg-background">
<h1 className="px-4 py-3 font-medium">
<Trans>Information</Trans>
</h1>
apps/remix/app/components/general/template/template-page-view-recent-activity.tsx
+15 -15
View File
@@ -33,9 +33,9 @@ export const TemplatePageViewRecentActivity = ({
};
return (
<section className="dark:bg-background border-border bg-widget flex flex-col rounded-xl border">
<section className="flex flex-col rounded-xl border border-border bg-widget dark:bg-background">
<div className="flex flex-row items-center justify-between border-b px-4 py-3">
<h1 className="text-foreground font-medium">
<h1 className="font-medium text-foreground">
<Trans>Recent documents</Trans>
</h1>
@@ -44,18 +44,18 @@ export const TemplatePageViewRecentActivity = ({
{isLoading && (
<div className="flex h-full items-center justify-center py-16">
<Loader className="text-muted-foreground h-6 w-6 animate-spin" />
<Loader className="h-6 w-6 animate-spin text-muted-foreground" />
</div>
)}
{isLoadingError && (
<div className="flex h-full flex-col items-center justify-center py-16">
<p className="text-foreground/80 text-sm">
<p className="text-sm text-foreground/80">
<Trans>Unable to load documents</Trans>
</p>
<button
onClick={async () => refetch()}
className="text-foreground/70 hover:text-muted-foreground mt-2 text-sm"
className="mt-2 text-sm text-foreground/70 hover:text-muted-foreground"
>
<Trans>Click here to retry</Trans>
</button>
@@ -68,11 +68,11 @@ export const TemplatePageViewRecentActivity = ({
{data.data.length > 0 && results.totalPages > 1 && (
<li className="relative flex gap-x-4">
<div className="absolute -bottom-6 left-0 top-0 flex w-6 justify-center">
<div className="bg-border w-px" />
<div className="w-px bg-border" />
</div>
<div className="bg-widget relative flex h-6 w-6 flex-none items-center justify-center">
<div className="bg-widget h-1.5 w-1.5 rounded-full ring-1 ring-gray-300 dark:ring-neutral-600" />
<div className="relative flex h-6 w-6 flex-none items-center justify-center bg-widget">
<div className="h-1.5 w-1.5 rounded-full bg-widget ring-1 ring-gray-300 dark:ring-neutral-600" />
</div>
<button
@@ -82,7 +82,7 @@ export const TemplatePageViewRecentActivity = ({
behavior: 'smooth',
});
}}
className="text-foreground/70 hover:text-muted-foreground flex items-center text-xs"
className="flex items-center text-xs text-foreground/70 hover:text-muted-foreground"
>
<Trans>View more</Trans>
</button>
@@ -91,7 +91,7 @@ export const TemplatePageViewRecentActivity = ({
{results.data.length === 0 && (
<div className="flex items-center justify-center py-4">
<p className="text-muted-foreground/70 text-sm">
<p className="text-sm text-muted-foreground/70">
<Trans>No recent documents</Trans>
</p>
</div>
@@ -105,16 +105,16 @@ export const TemplatePageViewRecentActivity = ({
'absolute left-0 top-0 flex w-6 justify-center',
)}
>
<div className="bg-border w-px" />
<div className="w-px bg-border" />
</div>
<div className="bg-widget text-foreground/40 relative flex h-6 w-6 flex-none items-center justify-center">
<div className="bg-widget h-1.5 w-1.5 rounded-full ring-1 ring-gray-300 dark:ring-neutral-600" />
<div className="relative flex h-6 w-6 flex-none items-center justify-center bg-widget text-foreground/40">
<div className="h-1.5 w-1.5 rounded-full bg-widget ring-1 ring-gray-300 dark:ring-neutral-600" />
</div>
<Link
to={`${documentRootPath}/${document.envelopeId}`}
className="text-muted-foreground dark:text-muted-foreground/70 flex-auto truncate py-0.5 text-xs leading-5"
className="flex-auto truncate py-0.5 text-xs leading-5 text-muted-foreground dark:text-muted-foreground/70"
>
{match(document.source)
.with(DocumentSource.DOCUMENT, DocumentSource.TEMPLATE, () => (
@@ -130,7 +130,7 @@ export const TemplatePageViewRecentActivity = ({
.exhaustive()}
</Link>
<time className="text-muted-foreground dark:text-muted-foreground/70 flex-none py-0.5 text-xs leading-5">
<time className="flex-none py-0.5 text-xs leading-5 text-muted-foreground dark:text-muted-foreground/70">
{DateTime.fromJSDate(document.createdAt).toRelative({ style: 'short' })}
</time>
</li>
apps/remix/app/components/general/template/template-page-view-recipients.tsx
+6 -6
View File
@@ -24,9 +24,9 @@ export const TemplatePageViewRecipients = ({
const { _ } = useLingui();
return (
<section className="dark:bg-background border-border bg-widget flex flex-col rounded-xl border">
<section className="flex flex-col rounded-xl border border-border bg-widget dark:bg-background">
<div className="flex flex-row items-center justify-between px-4 py-3">
<h1 className="text-foreground font-medium">
<h1 className="font-medium text-foreground">
<Trans>Recipients</Trans>
</h1>
@@ -43,7 +43,7 @@ export const TemplatePageViewRecipients = ({
</Link>
</div>
<ul className="text-muted-foreground divide-y border-t">
<ul className="divide-y border-t text-muted-foreground">
{recipients.length === 0 && (
<li className="flex flex-col items-center justify-center py-6 text-sm">
<Trans>No recipients</Trans>
@@ -60,13 +60,13 @@ export const TemplatePageViewRecipients = ({
}
primaryText={
isTemplateRecipientEmailPlaceholder(recipient.email) ? (
<p className="text-muted-foreground text-sm">{recipient.name}</p>
<p className="text-sm text-muted-foreground">{recipient.name}</p>
) : (
<p className="text-muted-foreground text-sm">{recipient.email}</p>
<p className="text-sm text-muted-foreground">{recipient.email}</p>
)
}
secondaryText={
<p className="text-muted-foreground/70 text-xs">
<p className="text-xs text-muted-foreground/70">
{_(RECIPIENT_ROLES_DESCRIPTION[recipient.role].roleName)}
</p>
}
apps/remix/app/components/general/user-profile-skeleton.tsx
+13 -13
View File
@@ -21,17 +21,17 @@ export const UserProfileSkeleton = ({ className, user, rows = 2 }: UserProfileSk
return (
<div
className={cn(
'dark:bg-background flex flex-col items-center rounded-xl bg-neutral-100 p-4',
'flex flex-col items-center rounded-xl bg-neutral-100 p-4 dark:bg-background',
className,
)}
>
<div className="border-border bg-background text-muted-foreground inline-block max-w-full truncate rounded-md border px-2.5 py-1.5 text-sm lowercase">
<div className="inline-block max-w-full truncate rounded-md border border-border bg-background px-2.5 py-1.5 text-sm lowercase text-muted-foreground">
{baseUrl.host}/u/{user.url}
</div>
<div className="mt-4">
<div className="bg-primary/10 rounded-full p-1.5">
<div className="bg-background flex h-20 w-20 items-center justify-center rounded-full border-2">
<div className="rounded-full bg-primary/10 p-1.5">
<div className="flex h-20 w-20 items-center justify-center rounded-full border-2 bg-background">
<User2 className="h-12 w-12 text-[hsl(228,10%,90%)]" />
</div>
</div>
@@ -41,16 +41,16 @@ export const UserProfileSkeleton = ({ className, user, rows = 2 }: UserProfileSk
<div className="flex items-center justify-center gap-x-2">
<h2 className="max-w-[12rem] truncate text-2xl font-semibold">{user.name}</h2>
<VerifiedIcon className="text-primary h-8 w-8" />
<VerifiedIcon className="h-8 w-8 text-primary" />
</div>
<div className="dark:bg-foreground/30 mx-auto mt-4 h-2 w-52 rounded-full bg-neutral-300" />
<div className="dark:bg-foreground/20 mx-auto mt-2 h-2 w-36 rounded-full bg-neutral-200" />
<div className="mx-auto mt-4 h-2 w-52 rounded-full bg-neutral-300 dark:bg-foreground/30" />
<div className="mx-auto mt-2 h-2 w-36 rounded-full bg-neutral-200 dark:bg-foreground/20" />
</div>
<div className="mt-8 w-full">
<div className="dark:divide-foreground/30 dark:border-foreground/30 divide-y-2 divide-neutral-200 overflow-hidden rounded-lg border-2 border-neutral-200">
<div className="text-muted-foreground dark:bg-foreground/20 bg-neutral-50 p-4 font-medium">
<div className="divide-y-2 divide-neutral-200 overflow-hidden rounded-lg border-2 border-neutral-200 dark:divide-foreground/30 dark:border-foreground/30">
<div className="bg-neutral-50 p-4 font-medium text-muted-foreground dark:bg-foreground/20">
<Trans>Documents</Trans>
</div>
@@ -59,14 +59,14 @@ export const UserProfileSkeleton = ({ className, user, rows = 2 }: UserProfileSk
.map((_, index) => (
<div
key={index}
className="bg-background flex items-center justify-between gap-x-6 p-4"
className="flex items-center justify-between gap-x-6 bg-background p-4"
>
<div className="flex items-center gap-x-2">
<File className="text-muted-foreground/80 h-8 w-8" strokeWidth={1.5} />
<File className="h-8 w-8 text-muted-foreground/80" strokeWidth={1.5} />
<div className="space-y-2">
<div className="dark:bg-foreground/30 h-1.5 w-24 rounded-full bg-neutral-300 md:w-36" />
<div className="dark:bg-foreground/20 h-1.5 w-16 rounded-full bg-neutral-200 md:w-24" />
<div className="h-1.5 w-24 rounded-full bg-neutral-300 md:w-36 dark:bg-foreground/30" />
<div className="h-1.5 w-16 rounded-full bg-neutral-200 md:w-24 dark:bg-foreground/20" />
</div>
</div>
apps/remix/app/components/general/user-profile-timur.tsx
+11 -11
View File
@@ -18,11 +18,11 @@ export const UserProfileTimur = ({ className, rows = 2 }: UserProfileTimurProps)
return (
<div
className={cn(
'dark:bg-background flex flex-col items-center rounded-xl bg-neutral-100 p-4',
'flex flex-col items-center rounded-xl bg-neutral-100 p-4 dark:bg-background',
className,
)}
>
<div className="border-border bg-background text-muted-foreground inline-block max-w-full truncate rounded-md border px-2.5 py-1.5 text-sm">
<div className="inline-block max-w-full truncate rounded-md border border-border bg-background px-2.5 py-1.5 text-sm text-muted-foreground">
{baseUrl.host}/u/timur
</div>
@@ -38,21 +38,21 @@ export const UserProfileTimur = ({ className, rows = 2 }: UserProfileTimurProps)
<div className="flex items-center justify-center gap-x-2">
<h2 className="text-2xl font-semibold">Timur Ercan</h2>
<VerifiedIcon className="text-primary h-8 w-8" />
<VerifiedIcon className="h-8 w-8 text-primary" />
</div>
<p className="text-muted-foreground mt-4 max-w-[40ch] text-center text-sm">
<p className="mt-4 max-w-[40ch] text-center text-sm text-muted-foreground">
<Trans>Hey I’m Timur</Trans>
</p>
<p className="text-muted-foreground mt-1 max-w-[40ch] text-center text-sm">
<p className="mt-1 max-w-[40ch] text-center text-sm text-muted-foreground">
<Trans>Pick any of the following agreements below and start signing to get started</Trans>
</p>
</div>
<div className="mt-8 w-full">
<div className="dark:divide-foreground/30 dark:border-foreground/30 divide-y-2 divide-neutral-200 overflow-hidden rounded-lg border-2 border-neutral-200">
<div className="text-muted-foreground dark:bg-foreground/20 bg-neutral-50 p-4 font-medium">
<div className="divide-y-2 divide-neutral-200 overflow-hidden rounded-lg border-2 border-neutral-200 dark:divide-foreground/30 dark:border-foreground/30">
<div className="bg-neutral-50 p-4 font-medium text-muted-foreground dark:bg-foreground/20">
<Trans>Documents</Trans>
</div>
@@ -61,14 +61,14 @@ export const UserProfileTimur = ({ className, rows = 2 }: UserProfileTimurProps)
.map((_, index) => (
<div
key={index}
className="bg-background flex items-center justify-between gap-x-6 p-4"
className="flex items-center justify-between gap-x-6 bg-background p-4"
>
<div className="flex items-center gap-x-2">
<File className="text-muted-foreground/80 h-8 w-8" strokeWidth={1.5} />
<File className="h-8 w-8 text-muted-foreground/80" strokeWidth={1.5} />
<div className="space-y-2">
<div className="dark:bg-foreground/30 h-1.5 w-24 rounded-full bg-neutral-300 md:w-36" />
<div className="dark:bg-foreground/20 h-1.5 w-16 rounded-full bg-neutral-200 md:w-24" />
<div className="h-1.5 w-24 rounded-full bg-neutral-300 md:w-36 dark:bg-foreground/30" />
<div className="h-1.5 w-16 rounded-full bg-neutral-200 md:w-24 dark:bg-foreground/20" />
</div>
</div>
apps/remix/app/components/general/webhook-logs-sheet.tsx
+15 -15
View File
@@ -71,14 +71,14 @@ export const WebhookLogsSheet = createCallable<WebhookLogsSheetProps, string | n
<h2 className="text-lg font-semibold">
<Trans>Webhook Details</Trans>
</h2>
<p className="text-muted-foreground font-mono text-xs">{webhookCall.id}</p>
<p className="font-mono text-xs text-muted-foreground">{webhookCall.id}</p>
</SheetTitle>
{/* Content */}
<div className="flex-1 overflow-y-auto">
<div className="mt-6">
<div className="flex items-end justify-between">
<h4 className="text-muted-foreground mb-3 text-xs font-semibold uppercase tracking-wider">
<h4 className="mb-3 text-xs font-semibold uppercase tracking-wider text-muted-foreground">
<Trans>Details</Trans>
</h4>
@@ -98,15 +98,15 @@ export const WebhookLogsSheet = createCallable<WebhookLogsSheetProps, string | n
<Trans>Resend</Trans>
</Button>
</div>
<div className="border-border overflow-hidden rounded-lg border">
<div className="overflow-hidden rounded-lg border border-border">
<table className="w-full text-left text-sm">
<tbody className="divide-border bg-muted/30 divide-y">
<tbody className="divide-y divide-border bg-muted/30">
{generalWebhookDetails.map(({ header, value }, index) => (
<tr key={index}>
<td className="text-muted-foreground border-border w-1/3 border-r px-4 py-2 font-mono text-xs">
<td className="w-1/3 border-r border-border px-4 py-2 font-mono text-xs text-muted-foreground">
{header}
</td>
<td className="text-foreground break-all px-4 py-2 font-mono text-xs">
<td className="break-all px-4 py-2 font-mono text-xs text-foreground">
{value}
</td>
</tr>
@@ -118,13 +118,13 @@ export const WebhookLogsSheet = createCallable<WebhookLogsSheetProps, string | n
{/* Payload Tabs */}
<div className="py-6">
<div className="border-border mb-4 flex items-center gap-4 border-b">
<div className="mb-4 flex items-center gap-4 border-b border-border">
<button
onClick={() => setActiveTab('request')}
className={cn(
'relative pb-2 text-sm font-medium transition-colors',
activeTab === 'request'
? 'text-foreground after:bg-primary after:absolute after:bottom-0 after:left-0 after:right-0 after:h-0.5'
? 'text-foreground after:absolute after:bottom-0 after:left-0 after:right-0 after:h-0.5 after:bg-primary'
: 'text-muted-foreground hover:text-foreground',
)}
>
@@ -136,7 +136,7 @@ export const WebhookLogsSheet = createCallable<WebhookLogsSheetProps, string | n
className={cn(
'relative pb-2 text-sm font-medium transition-colors',
activeTab === 'response'
? 'text-foreground after:bg-primary after:absolute after:bottom-0 after:left-0 after:right-0 after:h-0.5'
? 'text-foreground after:absolute after:bottom-0 after:left-0 after:right-0 after:h-0.5 after:bg-primary'
: 'text-muted-foreground hover:text-foreground',
)}
>
@@ -155,7 +155,7 @@ export const WebhookLogsSheet = createCallable<WebhookLogsSheetProps, string | n
onCopySuccess={() => toast({ title: t`Copied to clipboard` })}
/>
</div>
<pre className="bg-muted/50 border-border text-foreground overflow-x-auto rounded-lg border p-4 font-mono text-xs leading-relaxed">
<pre className="overflow-x-auto rounded-lg border border-border bg-muted/50 p-4 font-mono text-xs leading-relaxed text-foreground">
{JSON.stringify(
activeTab === 'request' ? webhookCall.requestBody : webhookCall.responseBody,
null,
@@ -166,19 +166,19 @@ export const WebhookLogsSheet = createCallable<WebhookLogsSheetProps, string | n
{activeTab === 'response' && (
<div className="mt-6">
<h4 className="text-muted-foreground mb-3 text-xs font-semibold uppercase tracking-wider">
<h4 className="mb-3 text-xs font-semibold uppercase tracking-wider text-muted-foreground">
<Trans>Response Headers</Trans>
</h4>
<div className="border-border overflow-hidden rounded-lg border">
<div className="overflow-hidden rounded-lg border border-border">
<table className="w-full text-left text-sm">
<tbody className="divide-border bg-muted/30 divide-y">
<tbody className="divide-y divide-border bg-muted/30">
{Object.entries(webhookCall.responseHeaders as Record<string, string>).map(
([key, value]) => (
<tr key={key}>
<td className="text-muted-foreground border-border w-1/3 border-r px-4 py-2 font-mono text-xs">
<td className="w-1/3 border-r border-border px-4 py-2 font-mono text-xs text-muted-foreground">
{key}
</td>
<td className="text-foreground break-all px-4 py-2 font-mono text-xs">
<td className="break-all px-4 py-2 font-mono text-xs text-foreground">
{value as string}
</td>
</tr>
apps/remix/app/components/tables/documents-table-action-dropdown.tsx
+1 -1
View File
@@ -76,7 +76,7 @@ export const DocumentsTableActionDropdown = ({
return (
<DropdownMenu>
<DropdownMenuTrigger data-testid="document-table-action-btn">
<MoreHorizontal className="text-muted-foreground h-5 w-5" />
<MoreHorizontal className="h-5 w-5 text-muted-foreground" />
</DropdownMenuTrigger>
<DropdownMenuContent className="w-52" align="start" forceMount>
apps/remix/app/components/tables/documents-table-empty-state.tsx
+1 -1
View File
@@ -38,7 +38,7 @@ export const DocumentsTableEmptyState = ({ status }: DocumentsTableEmptyStatePro
return (
<div
className="text-muted-foreground/60 flex h-60 flex-col items-center justify-center gap-y-4"
className="flex h-60 flex-col items-center justify-center gap-y-4 text-muted-foreground/60"
data-testid="empty-document-state"
>
<Icon className="h-12 w-12" strokeWidth={1.5} />
apps/remix/app/components/tables/documents-table-sender-filter.tsx
+1 -1
View File
@@ -49,7 +49,7 @@ export const DocumentsTableSenderFilter = ({ teamId }: DocumentsTableSenderFilte
return (
<MultiSelectCombobox
emptySelectionPlaceholder={
<p className="text-muted-foreground font-normal">
<p className="font-normal text-muted-foreground">
<Trans>
<span className="text-muted-foreground/70">Sender:</span> All
</Trans>
apps/remix/app/components/tables/inbox-table.tsx
+3 -3
View File
@@ -130,7 +130,7 @@ export const InboxTable = () => {
enable: isLoadingError || false,
}}
emptyState={
<div className="text-muted-foreground/60 flex h-60 flex-col items-center justify-center gap-y-4">
<div className="flex h-60 flex-col items-center justify-center gap-y-4 text-muted-foreground/60">
<p>
<Trans>Documents that require your attention will appear here</Trans>
</p>
@@ -170,8 +170,8 @@ export const InboxTable = () => {
</DataTable>
{isPending && (
<div className="bg-background/50 absolute inset-0 flex items-center justify-center">
<Loader className="text-muted-foreground h-8 w-8 animate-spin" />
<div className="absolute inset-0 flex items-center justify-center bg-background/50">
<Loader className="h-8 w-8 animate-spin text-muted-foreground" />
</div>
)}
</div>
apps/remix/app/components/tables/organisation-billing-invoices-table.tsx
+1 -1
View File
@@ -59,7 +59,7 @@ export const OrganisationBillingInvoicesTable = ({
<div className="flex max-w-xs items-center gap-2">
<File className="h-6 w-6" />
<div className="text-foreground/80 text-sm font-semibold">
<div className="text-sm font-semibold text-foreground/80">
{DateTime.fromSeconds(row.original.created).toFormat('MMMM yyyy')}
</div>
</div>
apps/remix/app/components/tables/organisation-insights-table.tsx
+4 -4
View File
@@ -276,12 +276,12 @@ const SummaryCard = ({
value: number;
subtitle?: string;
}) => (
<div className="bg-card flex items-start gap-x-2 rounded-lg border px-4 py-3">
<Icon className="text-muted-foreground h-4 w-4 items-start" />
<div className="flex items-start gap-x-2 rounded-lg border bg-card px-4 py-3">
<Icon className="h-4 w-4 items-start text-muted-foreground" />
<div className="-mt-0.5 space-y-2">
<p className="text-muted-foreground text-sm font-medium">{title}</p>
<p className="text-sm font-medium text-muted-foreground">{title}</p>
<p className="text-2xl font-bold">{value}</p>
{subtitle && <p className="text-muted-foreground text-xs">{subtitle}</p>}
{subtitle && <p className="text-xs text-muted-foreground">{subtitle}</p>}
</div>
</div>
);

Some files were not shown because too many files have changed in this diff Show More