AI/dify
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/langgenius/dify.git synced 2025-08-16 08:45:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

chore: from marketplace tilte ui

Browse Source
This commit is contained in:
Joel 2024-10-21 15:07:10 +08:00
parent 5aa7696cc3
commit 8f49572f85
2 changed files with 11 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/app/components/workflow/block-selector/market-place-plugin/item.tsx
View File

@ -26,7 +26,7 @@ const Item: FC<Props> = ({
const { locale } = useContext(I18n) const { locale } = useContext(I18n)
return ( return (
<div className='group/plugin flex rounded-lg py-2 pr-1 pl-3 hover:bg-state-base-hover'> <div className='group/plugin flex rounded-lg py-1 pr-1 pl-3 hover:bg-state-base-hover'>
<div <div
className='shrink-0 relative w-6 h-6 border-[0.5px] border-components-panel-border-subtle rounded-md bg-center bg-no-repeat bg-contain' className='shrink-0 relative w-6 h-6 border-[0.5px] border-components-panel-border-subtle rounded-md bg-center bg-no-repeat bg-contain'
style={{ backgroundImage: `url(${payload.icon})` }} style={{ backgroundImage: `url(${payload.icon})` }}

15
web/app/components/workflow/block-selector/market-place-plugin/list.tsx
View File

@ -5,6 +5,7 @@ import useStickyScroll, { ScrollPosition } from '../use-sticky-scroll'
import Item from './item' import Item from './item'
import type { Plugin } from '@/app/components/plugins/types.ts' import type { Plugin } from '@/app/components/plugins/types.ts'
import cn from '@/utils/classnames' import cn from '@/utils/classnames'
// import { RiArrowRightUpLine } from '@remixicon/react'
type Props = { type Props = {
wrapElemRef: React.RefObject<HTMLElement> wrapElemRef: React.RefObject<HTMLElement>
@ -26,11 +27,11 @@ const List = ({
const stickyClassName = useMemo(() => { const stickyClassName = useMemo(() => {
switch (scrollPosition) { switch (scrollPosition) {
case ScrollPosition.aboveTheWrap: case ScrollPosition.aboveTheWrap:
return 'top-0 shadow-md bg-white' return 'top-0 h-9 pt-3 pb-2 shadow-xs bg-components-panel-bg-blur'
case ScrollPosition.showing: case ScrollPosition.showing:
return 'bottom-0' return 'bottom-0 pt-3 pb-1'
case ScrollPosition.belowTheWrap: case ScrollPosition.belowTheWrap:
return 'bottom-0 border-t border-gray-500 bg-white text-blue-500' return 'bottom-0 items-center rounded-b-xl border-t border-[0.5px] border-components-panel-border bg-components-panel-bg-blur text-blue-500 shadow-lg text-text-accent-light-mode-only cursor-pointer'
} }
}, [scrollPosition]) }, [scrollPosition])
@ -41,8 +42,12 @@ const List = ({
return ( return (
<> <>
<div <div
className={cn('sticky z-10 pt-3 px-4 py-1 text-text-primary system-sm-medium', stickyClassName)}> className={cn('sticky z-10 flex h-8 px-4 py-1 text-text-primary system-sm-medium', stickyClassName)}
{t('plugin.fromMarketplace')} >
<span>{t('plugin.fromMarketplace')}</span>
{/* {scrollPosition === ScrollPosition.belowTheWrap && (
<RiArrowRightUpLine className='ml-0.5 w-3 h-3' />
)} */}
</div> </div>
<div className='p-1 pb-[500px]' ref={nextToStickyELemRef}> <div className='p-1 pb-[500px]' ref={nextToStickyELemRef}>
{list.map((item, index) => ( {list.map((item, index) => (