outman/dify
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: update bill page background image

Browse Source
This commit is contained in:
NFish 2025-01-23 11:06:01 +08:00
parent 3fcf7e88b0
commit 10991cbc03
4 changed files with 2155 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2146
web/app/components/base/grid-mask/Grid.svg Normal file
View File

File diff suppressed because it is too large Load Diff
Side by Side

After

Width:  |  Height:  |  Size: 189 KiB

8
web/app/components/base/grid-mask/index.tsx
View File

@ -1,4 +1,5 @@
import type { FC } from 'react'
import Style from './style.module.css'
import classNames from '@/utils/classnames'
type GridMaskProps = {
@ -15,12 +16,7 @@ const GridMask: FC<GridMaskProps> = ({
}) => {
return (
<div className={classNames('relative bg-saas-background', wrapperClassName)}>
<div className={classNames('absolute inset-0 w-full h-full z-0', canvasClassName)}
style={{
background: `
repeating-linear-gradient(0deg, transparent, transparent 23px, var(--color-divider-subtle) 24px,transparent 24px, transparent 47px, var(--color-divider-subtle) 48px),
repeating-linear-gradient(90deg, transparent, transparent 23px, var(--color-divider-subtle) 24px,transparent 24px,transparent 47px, var(--color-divider-subtle) 48px)`,
}} />
<div className={classNames('absolute inset-0 w-full h-full z-0', canvasClassName, Style.gridBg)} />
<div className={classNames('absolute w-full h-full z-[1] bg-grid-mask-background rounded-lg', gradientClassName)} />
<div className='relative z-[2]'>{children}</div>
</div>

5
web/app/components/base/grid-mask/style.module.css Normal file
View File

@ -0,0 +1,5 @@
.gridBg{
background-image: url(./Grid.svg);
background-repeat: repeat;
background-position: 0 0;
}

4
web/app/components/billing/pricing/index.tsx
View File

@ -40,12 +40,12 @@ const Pricing: FC<Props> = ({
>
<div className='w-full h-full relative overflow-auto rounded-2xl border border-effects-highlight bg-saas-background'>
<div
className='absolute top-3 right-3 flex items-center justify-center w-9 h-9 bg-components-button-tertiary-bg hover:bg-components-button-tertiary-bg-hover rounded-[10px] cursor-pointer z-[1001]'
className='fixed top-7 right-7 flex items-center justify-center w-9 h-9 bg-components-button-tertiary-bg hover:bg-components-button-tertiary-bg-hover rounded-[10px] cursor-pointer z-[1001]'
onClick={onCancel}
>
<RiCloseLine className='size-5 text-components-button-tertiary-text' />
</div>
<GridMask wrapperClassName='w-full h-full' canvasClassName='h-full'>
<GridMask wrapperClassName='w-full min-h-full' canvasClassName='min-h-full'>
<div className='pt-12 px-8 pb-7 flex flex-col items-center'>
<div className='mb-2 title-5xl-bold text-text-primary'>
{t('billing.plansCommon.title')}