jandres/dify
1
0
Fork 0
mirror of https://github.com/langgenius/dify.git synced 2026-01-06 06:26:00 +00:00
Code Issues Actions 8 Packages Projects Releases Wiki Activity

refactor(header, option-card): improve layout and responsiveness by adjusting flex properties and adding title attributes

Browse Source
This commit is contained in:
twwu
2025-08-22 16:49:28 +08:00
parent 5824a2d71c
commit 570b644a7e
2 changed files with 8 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
web/app/components/datasets/documents/create-from-pipeline/data-source-options/option-card.tsx
View File

@@ -22,17 +22,20 @@ const OptionCard = ({
return (
<div
className={cn(
'flex items-center gap-2 rounded-xl border border-components-option-card-option-border bg-components-option-card-option-bg p-3 shadow-shadow-shadow-3',
'flex cursor-pointer items-center gap-2 rounded-xl border border-components-option-card-option-border bg-components-option-card-option-bg p-3 shadow-shadow-shadow-3',
selected
? 'border-components-option-card-option-selected-border bg-components-option-card-option-selected-bg shadow-xs ring-[0.5px] ring-inset ring-components-option-card-option-selected-border'
: 'hover:bg-components-option-card-bg-hover hover:border-components-option-card-option-border-hover hover:shadow-xs',
)}
onClick={onClick}
>
<div className='flex size-8 items-center justify-center rounded-lg border-[0.5px] border-components-panel-border bg-background-default-dodge p-1.5'>
<div className='flex size-8 shrink-0 items-center justify-center rounded-lg border-[0.5px] border-components-panel-border bg-background-default-dodge p-1.5'>
<DatasourceIcon iconUrl={iconUrl} />
</div>
<div className={cn('system-sm-medium text-text-secondary', selected && 'text-primary')}>
<div
className={cn('system-sm-medium line-clamp-2 grow text-text-secondary', selected && 'text-primary')}
title={label}
>
{label}
</div>
</div>

4
web/app/components/datasets/documents/create-from-pipeline/data-source/base/header.tsx
View File

@@ -22,8 +22,8 @@ const Header = ({
const { t } = useTranslation()
return (
<div className='flex items-center gap-x-2'>
<div className='flex grow items-center gap-x-1 overflow-hidden'>
<div className='flex items-center justify-between gap-x-2'>
<div className='flex items-center gap-x-1 overflow-hidden'>
<CredentialSelector
{...rest}
/>