mirror of
https://github.com/langgenius/dify.git
synced 2026-05-27 12:26:15 +08:00
fix marketplace hero shake
This commit is contained in:
@ -97,5 +97,11 @@ describe('Description', () => {
|
||||
|
||||
expect(container.querySelector('.custom-hero-class')).toBeInTheDocument()
|
||||
})
|
||||
|
||||
it('should keep the hero bottom padding fixed during collapse animation', () => {
|
||||
const { container } = render(<Description />)
|
||||
|
||||
expect(container.firstElementChild).toHaveStyle({ paddingBottom: '24px' })
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
@ -22,7 +22,6 @@ const MAX_SCROLL = 120 // pixels to fully collapse
|
||||
const EXPANDED_PADDING_TOP = 32 // pt-8
|
||||
const COLLAPSED_PADDING_TOP = 12 // pt-3
|
||||
const EXPANDED_PADDING_BOTTOM = 24 // pb-6
|
||||
const COLLAPSED_PADDING_BOTTOM = 12 // pb-3
|
||||
|
||||
export const Description = ({
|
||||
className,
|
||||
@ -112,7 +111,6 @@ export const Description = ({
|
||||
const tabsMarginTop = useTransform(smoothProgress, [0, 1], [48, marketplaceNav ? 16 : 0])
|
||||
const titleMarginTop = useTransform(smoothProgress, [0, 1], [marketplaceNav ? 80 : 0, 0])
|
||||
const paddingTop = useTransform(smoothProgress, [0, 1], [marketplaceNav ? COLLAPSED_PADDING_TOP : EXPANDED_PADDING_TOP, COLLAPSED_PADDING_TOP])
|
||||
const paddingBottom = useTransform(smoothProgress, [0, 1], [EXPANDED_PADDING_BOTTOM, COLLAPSED_PADDING_BOTTOM])
|
||||
|
||||
useEffect(() => {
|
||||
const container = document.getElementById(scrollContainerId)
|
||||
@ -172,7 +170,7 @@ export const Description = ({
|
||||
)}
|
||||
style={{
|
||||
paddingTop,
|
||||
paddingBottom,
|
||||
paddingBottom: EXPANDED_PADDING_BOTTOM,
|
||||
}}
|
||||
>
|
||||
{/* Blue base background */}
|
||||
|
||||
Reference in New Issue
Block a user