mirror of
https://github.com/infiniflow/ragflow.git
synced 2025-12-23 23:16:58 +08:00
### What problem does this PR solve? Feat: Replace color variables according to design draft #3221 ### Type of change - [x] New Feature (non-breaking change which adds functionality)
This commit is contained in:
@ -40,7 +40,7 @@ export function BulkOperateBar({
|
||||
{list.map((x) => (
|
||||
<li
|
||||
key={x.id}
|
||||
className={cn({ ['text-text-delete-red']: isDeleteItem(x.id) })}
|
||||
className={cn({ ['text-state-error']: isDeleteItem(x.id) })}
|
||||
>
|
||||
<ConfirmDeleteDialog
|
||||
hidden={!isDeleteItem(x.id)}
|
||||
|
||||
@ -52,7 +52,7 @@ export function ConfirmDeleteDialog({
|
||||
{t('common.cancel')}
|
||||
</AlertDialogCancel>
|
||||
<AlertDialogAction
|
||||
className="bg-text-delete-red text-text-title"
|
||||
className="bg-state-error text-text-primary"
|
||||
onClick={onOk}
|
||||
>
|
||||
{t('common.ok')}
|
||||
|
||||
@ -95,7 +95,7 @@ function CheckboxFormMultiple({
|
||||
name={x.field}
|
||||
render={({ field }) => {
|
||||
return (
|
||||
<div className="flex items-center justify-between text-text-title text-xs">
|
||||
<div className="flex items-center justify-between text-text-primary text-xs">
|
||||
<FormItem
|
||||
key={item.id}
|
||||
className="flex flex-row space-x-3 space-y-0 items-center "
|
||||
|
||||
@ -27,7 +27,7 @@ export const FilterButton = React.forwardRef<
|
||||
<Button variant="secondary" {...props} ref={ref}>
|
||||
<span
|
||||
className={cn({
|
||||
'text-text-title': count > 0,
|
||||
'text-text-primary': count > 0,
|
||||
'text-text-sub-title-invert': count === 0,
|
||||
})}
|
||||
>
|
||||
|
||||
@ -25,7 +25,7 @@ export function InnerUploadedMessageFiles({ files = [] }: IProps) {
|
||||
)}
|
||||
<div className="text-xs max-w-20">
|
||||
<div className="truncate">{file.name}</div>
|
||||
<p className="text-text-sub-title pt-1">{formatBytes(file.size)}</p>
|
||||
<p className="text-text-secondary pt-1">{formatBytes(file.size)}</p>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
|
||||
@ -142,7 +142,7 @@ export function PromptEditor({
|
||||
}
|
||||
placeholder={
|
||||
<div
|
||||
className="absolute top-10 left-2 text-text-sub-title"
|
||||
className="absolute top-10 left-2 text-text-secondary"
|
||||
data-xxx
|
||||
>
|
||||
{placeholder || t('common.pleaseInput')}
|
||||
|
||||
@ -34,7 +34,7 @@ const BreadcrumbItem = React.forwardRef<
|
||||
<li
|
||||
ref={ref}
|
||||
className={cn(
|
||||
'inline-flex items-center gap-1.5 text-text-sub-title',
|
||||
'inline-flex items-center gap-1.5 text-text-secondary',
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
|
||||
@ -29,11 +29,11 @@ const DualRangeSlider = React.forwardRef<
|
||||
{...props}
|
||||
>
|
||||
<SliderPrimitive.Track className="relative h-2 w-full grow overflow-hidden rounded-full bg-secondary">
|
||||
<SliderPrimitive.Range className="absolute h-full bg-background-checked" />
|
||||
<SliderPrimitive.Range className="absolute h-full bg-accent-primary" />
|
||||
</SliderPrimitive.Track>
|
||||
{initialValue.map((value, index) => (
|
||||
<React.Fragment key={index}>
|
||||
<SliderPrimitive.Thumb className="relative block h-4 w-4 rounded-full border-2 border-background-checked bg-white ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 cursor-pointer">
|
||||
<SliderPrimitive.Thumb className="relative block h-4 w-4 rounded-full border-2 border-accent-primary bg-white ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 cursor-pointer">
|
||||
{label && (
|
||||
<span
|
||||
className={cn(
|
||||
|
||||
@ -150,7 +150,7 @@ export function RAGFlowPagination({
|
||||
<PaginationItem
|
||||
key={page}
|
||||
className={cn({
|
||||
['bg-background-header-bar rounded-md text-text-title']:
|
||||
['bg-bg-card rounded-md text-text-primary']:
|
||||
currentPage === page,
|
||||
})}
|
||||
>
|
||||
@ -174,7 +174,7 @@ export function RAGFlowPagination({
|
||||
options={sizeChangerOptions}
|
||||
value={currentPageSize}
|
||||
onChange={handlePageSizeChange}
|
||||
triggerClassName="bg-background-header-bar"
|
||||
triggerClassName="bg-bg-card"
|
||||
></RAGFlowSelect>
|
||||
)}
|
||||
</section>
|
||||
|
||||
@ -43,7 +43,7 @@ export function Segmented({
|
||||
return (
|
||||
<div
|
||||
className={cn(
|
||||
'flex items-center rounded-3xl p-1 gap-2 bg-background-header-bar px-5 py-2.5',
|
||||
'flex items-center rounded-3xl p-1 gap-2 bg-bg-card px-5 py-2.5',
|
||||
className,
|
||||
)}
|
||||
>
|
||||
@ -55,10 +55,10 @@ export function Segmented({
|
||||
<div
|
||||
key={actualValue}
|
||||
className={cn(
|
||||
'inline-flex items-center px-6 py-2 text-base font-normal rounded-3xl cursor-pointer text-text-badge',
|
||||
'inline-flex items-center px-6 py-2 text-base font-normal rounded-3xl cursor-pointer',
|
||||
{
|
||||
'bg-text-title': selectedValue === actualValue,
|
||||
'text-text-title-invert': selectedValue === actualValue,
|
||||
'bg-text-primary': selectedValue === actualValue,
|
||||
'text-bg-base': selectedValue === actualValue,
|
||||
},
|
||||
)}
|
||||
onClick={() => handleOnChange(actualValue)}
|
||||
|
||||
@ -316,6 +316,7 @@ const SidebarRail = React.forwardRef<
|
||||
'[[data-side=right][data-collapsible=offcanvas]_&]:-left-2',
|
||||
className,
|
||||
)}
|
||||
type="button"
|
||||
{...props}
|
||||
/>
|
||||
);
|
||||
|
||||
@ -11,7 +11,7 @@ const Switch = React.forwardRef<
|
||||
>(({ className, ...props }, ref) => (
|
||||
<SwitchPrimitives.Root
|
||||
className={cn(
|
||||
'peer inline-flex h-3.5 w-6 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-background-checked data-[state=unchecked]:bg-text-sub-title',
|
||||
'peer inline-flex h-3.5 w-6 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-accent-primary data-[state=unchecked]:bg-text-sub-title',
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
|
||||
@ -82,7 +82,7 @@ const TableHead = React.forwardRef<
|
||||
<th
|
||||
ref={ref}
|
||||
className={cn(
|
||||
'h-12 px-4 text-left align-middle font-normal text-text-sub-title [&:has([role=checkbox])]:pr-0',
|
||||
'h-12 px-4 text-left align-middle font-normal text-text-secondary [&:has([role=checkbox])]:pr-0',
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
@ -97,7 +97,7 @@ const TableCell = React.forwardRef<
|
||||
<td
|
||||
ref={ref}
|
||||
className={cn(
|
||||
'p-4 align-middle [&:has([role=checkbox])]:pr-0 text-text-title font-normal',
|
||||
'p-4 align-middle [&:has([role=checkbox])]:pr-0 text-text-primary font-normal',
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
|
||||
@ -29,7 +29,7 @@ const TabsTrigger = React.forwardRef<
|
||||
<TabsPrimitive.Trigger
|
||||
ref={ref}
|
||||
className={cn(
|
||||
'inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-text-title-invert data-[state=active]:text-text-title data-[state=active]:shadow-sm',
|
||||
'inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-text-title-invert data-[state=active]:text-text-primary data-[state=active]:shadow-sm',
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
|
||||
Reference in New Issue
Block a user