style: soften draft welcome title
Makes the welcome prompt lighter Keeps the project name visually emphasized
This commit is contained in:
@@ -337,6 +337,20 @@ const getProjectDisplayLabel = (project: { label?: string; path: string }): stri
|
|||||||
return label || formatDirectoryName(project.path);
|
return label || formatDirectoryName(project.path);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const renderDraftTitle = (title: string, projectLabel: string | null): React.ReactNode => {
|
||||||
|
if (!projectLabel) return title;
|
||||||
|
const projectIndex = title.indexOf(projectLabel);
|
||||||
|
if (projectIndex === -1) return title;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
{title.slice(0, projectIndex)}
|
||||||
|
<span className="font-medium">{projectLabel}</span>
|
||||||
|
{title.slice(projectIndex + projectLabel.length)}
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
type ChatContainerProps = {
|
type ChatContainerProps = {
|
||||||
autoOpenDraft?: boolean;
|
autoOpenDraft?: boolean;
|
||||||
readOnly?: boolean;
|
readOnly?: boolean;
|
||||||
@@ -794,10 +808,13 @@ export const ChatContainer: React.FC<ChatContainerProps> = ({ autoOpenDraft = tr
|
|||||||
<div className="relative flex h-full flex-col bg-background transform-gpu">
|
<div className="relative flex h-full flex-col bg-background transform-gpu">
|
||||||
{useCompactDraftLayout && !isDesktopExpandedInput ? (
|
{useCompactDraftLayout && !isDesktopExpandedInput ? (
|
||||||
<div className="flex min-h-0 flex-1 items-center justify-center px-6 text-center">
|
<div className="flex min-h-0 flex-1 items-center justify-center px-6 text-center">
|
||||||
<h1 className="text-balance text-3xl font-medium tracking-tight text-foreground">
|
<h1 className="text-balance text-3xl font-normal tracking-tight text-foreground">
|
||||||
{draftProjectLabel
|
{renderDraftTitle(
|
||||||
? t('chat.emptyState.draftTitleWithProject', { project: draftProjectLabel })
|
draftProjectLabel
|
||||||
: t('chat.emptyState.draftTitle')}
|
? t('chat.emptyState.draftTitleWithProject', { project: draftProjectLabel })
|
||||||
|
: t('chat.emptyState.draftTitle'),
|
||||||
|
draftProjectLabel,
|
||||||
|
)}
|
||||||
</h1>
|
</h1>
|
||||||
</div>
|
</div>
|
||||||
) : null}
|
) : null}
|
||||||
|
|||||||
@@ -318,6 +318,20 @@ const getProjectDisplayLabel = (project: { label?: string; path: string }): stri
|
|||||||
return formatDirectoryName(project.path);
|
return formatDirectoryName(project.path);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const renderDraftTitle = (title: string, projectLabel: string | null): React.ReactNode => {
|
||||||
|
if (!projectLabel) return title;
|
||||||
|
const projectIndex = title.indexOf(projectLabel);
|
||||||
|
if (projectIndex === -1) return title;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
{title.slice(0, projectIndex)}
|
||||||
|
<span className="font-medium">{projectLabel}</span>
|
||||||
|
{title.slice(projectIndex + projectLabel.length)}
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
const getProjectIconColor = (projectColor?: string | null): string | undefined => {
|
const getProjectIconColor = (projectColor?: string | null): string | undefined => {
|
||||||
if (!projectColor) {
|
if (!projectColor) {
|
||||||
return undefined;
|
return undefined;
|
||||||
@@ -3789,10 +3803,13 @@ const ChatInputComponent: React.FC<ChatInputProps> = ({ onOpenSettings, scrollTo
|
|||||||
>
|
>
|
||||||
{newSessionDraftOpen && !isDesktopExpanded && !isMobile && !isVSCode && !isMiniChatSurface ? (
|
{newSessionDraftOpen && !isDesktopExpanded && !isMobile && !isVSCode && !isMiniChatSurface ? (
|
||||||
<div className="chat-input-column mb-7 text-center">
|
<div className="chat-input-column mb-7 text-center">
|
||||||
<h1 className="text-balance text-2xl font-medium tracking-tight text-foreground md:text-3xl">
|
<h1 className="text-balance text-2xl font-normal tracking-tight text-foreground md:text-3xl">
|
||||||
{draftProjectLabel
|
{renderDraftTitle(
|
||||||
? t('chat.emptyState.draftTitleWithProject', { project: draftProjectLabel })
|
draftProjectLabel
|
||||||
: t('chat.emptyState.draftTitle')}
|
? t('chat.emptyState.draftTitleWithProject', { project: draftProjectLabel })
|
||||||
|
: t('chat.emptyState.draftTitle'),
|
||||||
|
draftProjectLabel,
|
||||||
|
)}
|
||||||
</h1>
|
</h1>
|
||||||
</div>
|
</div>
|
||||||
) : null}
|
) : null}
|
||||||
|
|||||||
Reference in New Issue
Block a user