CERBERUS/LibreChat
1
0
Fork 0
mirror of https://github.com/danny-avila/LibreChat.git synced 2026-07-01 20:01:35 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 7

refactor: add semantic link color token and migrate hyperlinks to it

Browse source
This commit is contained in:
Marco Beretta 2026-06-20 16:35:29 +02:00
parent ce66d7e91f
commit b2cbe3939e
No known key found for this signature in database
GPG key ID: D918033D8E74CC11
13 changed files with 24 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

2
client/src/components/Auth/LoginForm.tsx
View file

@ -80,7 +80,7 @@ const LoginForm: React.FC<TLoginFormProps> = ({ onSubmit, startupConfig, error,
{localize('com_auth_email_verification_resend_prompt')}
<button
type="button"
className="ml-2 text-blue-600 hover:underline"
className="ml-2 text-link hover:underline"
onClick={handleResendEmail}
disabled={resendLinkMutation.isLoading}
>

2
client/src/components/Auth/VerifyEmail.tsx
View file

@ -90,7 +90,7 @@ function RequestPasswordReset() {
<p className="text-center text-lg text-gray-600 dark:text-gray-400">
{localize('com_auth_email_verification_resend_prompt')}
<button
className="ml-2 text-blue-600 hover:underline"
className="ml-2 text-link hover:underline"
onClick={handleResendEmail}
disabled={resendEmailMutation.isLoading}
>

2
client/src/components/Banners/Banner.tsx
View file

@ -62,7 +62,7 @@ export const Banner = ({ onHeightChange }: { onHeightChange?: (height: number) =
>
<div
className={cn(
'text-md w-full truncate text-center [&_a]:text-blue-700 [&_a]:underline dark:[&_a]:text-blue-400',
'text-md w-full truncate text-center [&_a]:text-link [&_a]:underline',
!banner.persistable && 'px-4',
)}
dangerouslySetInnerHTML={{ __html: sanitizedMessage }}

2
client/src/components/Chat/Input/MCPConfigDialog.tsx
View file

@ -115,7 +115,7 @@ export default function MCPConfigDialog({
/>
{details.description && (
<p
className="text-xs text-text-secondary [&_a]:text-blue-500 [&_a]:hover:text-blue-600 dark:[&_a]:text-blue-400 dark:[&_a]:hover:text-blue-300"
className="text-xs text-text-secondary [&_a]:text-link [&_a]:hover:text-link-hover"
dangerouslySetInnerHTML={{ __html: sanitize(details.description) }}
/>
)}

2
client/src/components/Chat/Messages/Content/Parts/LogLink.tsx
View file

@ -97,7 +97,7 @@ const LogLink: React.FC<LogLinkProps> = ({ href, filename, file_id, user, source
onClick={handleDownload}
target="_blank"
rel="noopener noreferrer"
className="!text-blue-400 visited:!text-purple-400 hover:underline"
className="!text-link visited:!text-link-visited hover:underline"
>
{children}
</a>

6
client/src/components/Input/SetKeyDialog/HelpText.tsx
View file

@ -15,7 +15,7 @@ function HelpText({ endpoint }: { endpoint: string }) {
target="_blank"
href="https://console.cloud.google.com/vertex-ai"
rel="noreferrer"
className="text-blue-700 underline dark:text-blue-400"
className="text-link underline"
>
{localize('com_endpoint_config_key_google_vertex_ai')}
</a>{' '}
@ -24,7 +24,7 @@ function HelpText({ endpoint }: { endpoint: string }) {
target="_blank"
href="https://console.cloud.google.com/projectselector/iam-admin/serviceaccounts/create?walkthrough_id=iam--create-service-account#step_index=1"
rel="noreferrer"
className="text-blue-700 underline dark:text-blue-400"
className="text-link underline"
>
{localize('com_endpoint_config_key_google_service_account')}
</a>
@ -39,7 +39,7 @@ function HelpText({ endpoint }: { endpoint: string }) {
target="_blank"
href="https://makersuite.google.com/app/apikey"
rel="noreferrer"
className="text-blue-700 underline dark:text-blue-400"
className="text-link underline"
>
{localize('com_endpoint_config_click_here')}
</a>{' '}

2
client/src/components/MCP/CustomUserVarsSection.tsx
View file

@ -100,7 +100,7 @@ function AuthField({ name, config, hasValue, control, errors, autoFocus }: AuthF
/>
{sanitizedDescription && (
<p
className="text-xs text-text-secondary [&_a]:text-blue-500 [&_a]:hover:underline"
className="text-xs text-text-secondary [&_a]:text-link [&_a]:hover:underline"
dangerouslySetInnerHTML={{ __html: sanitizedDescription }}
/>
)}

2
client/src/components/Nav/SettingsTabs/Data/SharedLinks.tsx
View file

@ -199,7 +199,7 @@ export default function SharedLinks() {
to={`/share/${shareId}`}
target="_blank"
rel="noopener noreferrer"
className="group flex items-center gap-1 truncate rounded-sm text-blue-600 underline decoration-1 underline-offset-2 hover:decoration-2 focus:outline-none focus:ring-2 focus:ring-ring"
className="group flex items-center gap-1 truncate rounded-sm text-link underline decoration-1 underline-offset-2 hover:decoration-2 focus:outline-none focus:ring-2 focus:ring-ring"
title={title}
>
<span className="truncate">{title}</span>

2
client/src/components/Nav/SettingsTabs/General/ArchivedChatsTable.tsx
View file

@ -178,7 +178,7 @@ export default function ArchivedChatsTable({
to={`/c/${conversationId}`}
target="_blank"
rel="noopener noreferrer"
className="group flex items-center gap-1 truncate rounded-sm text-blue-600 underline decoration-1 underline-offset-2 hover:decoration-2 focus:outline-none focus:ring-2 focus:ring-ring"
className="group flex items-center gap-1 truncate rounded-sm text-link underline decoration-1 underline-offset-2 hover:decoration-2 focus:outline-none focus:ring-2 focus:ring-ring"
title={title}
aria-label={localize('com_ui_open_archived_chat_new_tab_title', { title })}
>

4
client/src/components/Plugins/Store/PluginPagination.tsx
View file

@ -64,8 +64,8 @@ const PluginPagination: React.FC<TPluginPaginationProps> = ({
tabIndex={0}
className={`flex h-5 w-5 items-center justify-center text-sm ${
currentPage === page
? 'text-blue-600 hover:text-blue-600 dark:text-blue-600 dark:hover:text-blue-600'
: 'text-black/70 hover:text-black/50 dark:text-white/70 dark:hover:text-white/50'
? 'text-link hover:text-link'
: 'text-text-secondary hover:text-text-primary'
}`}
style={{ userSelect: 'none' }}
onClick={() => onChangePage(page)}

2
client/src/components/ui/AdminSettingsDialog.tsx
View file

@ -228,7 +228,7 @@ const AdminSettingsDialog: React.FC<AdminSettingsDialogProps> = ({
href="https://www.librechat.ai/docs/configuration/librechat_yaml/object_structure/interface"
target="_blank"
rel="noreferrer"
className="text-blue-500 underline"
className="text-link underline"
>
{localize('com_ui_more_info')}
</a>

6
client/src/style.css
View file

@ -86,6 +86,9 @@ html {
--text-tertiary: var(--gray-500);
--text-warning: var(--amber-500);
--text-destructive: var(--red-600);
--link: var(--blue-600);
--link-hover: var(--blue-700);
--link-visited: #9333ea;
--ring-primary: var(--gray-500);
--header-primary: var(--white);
--header-hover: var(--gray-50);
@ -164,6 +167,9 @@ html {
--text-tertiary: var(--gray-500);
--text-warning: var(--amber-500);
--text-destructive: var(--red-600);
--link: var(--blue-400);
--link-hover: var(--blue-300);
--link-visited: #c084fc;
--header-primary: var(--gray-700);
--header-hover: var(--gray-600);
--header-button-hover: var(--gray-700);

4
packages/client/src/theme/utils/createTailwindColors.js
View file

@ -69,6 +69,10 @@ function createTailwindColors() {
'text-warning': cssVar('--text-warning'),
'text-destructive': cssVar('--text-destructive'),
link: cssVar('--link'),
'link-hover': cssVar('--link-hover'),
'link-visited': cssVar('--link-visited'),
'ring-primary': cssVar('--ring-primary'),
'header-primary': cssVar('--header-primary'),