Austin/dify
1
0
Fork 0
mirror of https://github.com/langgenius/dify.git synced 2024-11-16 19:59:50 +08:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

chore: transform field type css to tailwind and multi theme

Browse Source
This commit is contained in:
Joel 2024-09-09 15:15:08 +08:00
parent 6c9c3faf78
commit c159b7a781
2 changed files with 4 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
web/app/components/app/configuration/config-var/select-type-item/index.tsx
View File

@ -2,7 +2,6 @@
import type { FC } from 'react'
import React from 'react'
import { useTranslation } from 'react-i18next'
import s from './style.module.css'
import cn from '@/utils/classnames'
import type { InputVarType } from '@/app/components/workflow/types'
import InputVarTypeIcon from '@/app/components/workflow/nodes/_base/components/input-var-type-icon'
@ -27,13 +26,15 @@ const SelectTypeItem: FC<ISelectTypeItemProps> = ({
return (
<div
className={cn('space-y-1', selected && s.selected, s.item)}
className={cn(
'flex flex-col justify-center items-center h-[58px] rounded-lg border border-components-option-card-option-border bg-components-option-card-option-bg space-y-1',
selected ? 'border-[1.5px] border-components-option-card-option-selected-border bg-components-option-card-option-selected-bg shadow-xs system-xs-medium' : ' hover:border-components-option-card-option-border-hover hover:bg-components-option-card-option-bg-hover hover:shadow-xs cursor-pointer system-xs-regular')}
onClick={onClick}
>
<div className='shrink-0'>
<InputVarTypeIcon type={type} className='w-5 h-5' />
</div>
<span className={cn(s.text)}>{typeName}</span>
<span>{typeName}</span>
</div>
)
}

40
web/app/components/app/configuration/config-var/select-type-item/style.module.css
View File

@ -1,40 +0,0 @@
.item {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
height: 58px;
/* width: 98px; */
border-radius: 8px;
border: 1px solid #EAECF0;
box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
background-color: #fff;
cursor: pointer;
}
.item:not(.selected):hover {
border-color: #B2CCFF;
background-color: #F5F8FF;
box-shadow: 0px 4px 8px -2px rgba(16, 24, 40, 0.1), 0px 2px 4px -2px rgba(16, 24, 40, 0.06);
}
.item.selected {
color: #155EEF;
border-color: #528BFF;
background-color: #F5F8FF;
box-shadow: 0px 1px 3px rgba(16, 24, 40, 0.1), 0px 1px 2px rgba(16, 24, 40, 0.06);
}
.text {
font-size: 13px;
color: #667085;
font-weight: 500;
}
.item.selected .text {
color: #155EEF;
}
.item:not(.selected):hover {
color: #344054;
}