This repository was archived by the owner on Apr 11, 2025. It is now read-only.
File tree Expand file tree Collapse file tree 3 files changed +20
-15
lines changed Expand file tree Collapse file tree 3 files changed +20
-15
lines changed Original file line number Diff line number Diff line change 24
24
},
25
25
"dependencies" : {
26
26
"@ant-design/icons" : " ^4.6.2" ,
27
- "@bedrock-layout/columns" : " ^2.1.11" ,
28
- "@bedrock-layout/inline" : " ^2.0.15" ,
29
- "@bedrock-layout/masonry-grid" : " ^2.0.14" ,
30
- "antd" : " ^4.14.0" ,
27
+ "antd" : " ^4.18.5" ,
31
28
"copy-to-clipboard" : " ^3.3.1" ,
29
+ "classnames" : " ^2.3.1" ,
32
30
"js-yaml" : " ^4.1.0" ,
33
- "use-merge-value" : " ^1.0.2" ,
34
- "styled-components" : " ^5.3.0"
31
+ "use-merge-value" : " ^1.0.2"
35
32
}
36
33
}
Original file line number Diff line number Diff line change 1
1
import type { FC } from 'react' ;
2
2
import React from 'react' ;
3
- import { Columns } from '@bedrock-layout/columns' ;
3
+ import cls from 'classnames' ;
4
+
4
5
import Header from './Header' ;
5
6
6
7
import type { AssetGalleryProps } from '../types' ;
@@ -36,18 +37,21 @@ const Layout: FC<LayoutProps> = ({
36
37
onLayoutChange = { onLayoutChange }
37
38
showSlider = { showSlider }
38
39
/>
39
- { layout === 'grid' ? (
40
- < Columns gutter = { '' } columns = { columns } >
41
- { children }
42
- </ Columns >
43
- ) : (
40
+ {
44
41
< div
45
- className = { 'avx-asset-gallery-container avx-asset-gallery-masonry' }
46
- style = { { columnCount : columns } }
42
+ className = { cls (
43
+ 'avx-asset-gallery-container' ,
44
+ `avx-asset-gallery-${ layout } ` ,
45
+ ) }
46
+ style = { {
47
+ columnCount : layout === 'masonry' ? columns : undefined ,
48
+ gridTemplateColumns :
49
+ layout === 'grid' ? `repeat(${ columns } , 1fr)` : undefined ,
50
+ } }
47
51
>
48
52
{ children }
49
53
</ div >
50
- ) }
54
+ }
51
55
</ div >
52
56
) ;
53
57
} ;
Original file line number Diff line number Diff line change 1
1
.avx-asset-gallery {
2
+ &-grid {
3
+ display : grid ;
4
+ grid-template-columns : repeat (3 , 1fr );
5
+ }
2
6
&-masonry {
3
7
column-count : 4 ;
4
8
column-gap : 0 ;
You can’t perform that action at this time.
0 commit comments