@cloud-ru/uikit-product-site-section 0.26.0 → 0.27.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (24) hide show
  1. package/CHANGELOG.md +11 -0
  2. package/README.md +31 -22
  3. package/dist/cjs/components/SectionContent/styles.module.css +2 -0
  4. package/dist/cjs/components/SectionContentTabs/styles.module.css +3 -1
  5. package/dist/cjs/components/SectionMedia/styles.module.css +2 -0
  6. package/dist/cjs/components/SectionPersonalManager/styles.module.css +1 -0
  7. package/dist/cjs/components/SectionPromoList/styles.module.css +5 -0
  8. package/dist/cjs/helperComponents/CardLeading/styles.module.css +1 -0
  9. package/dist/cjs/helperComponents/Expert/styles.module.css +1 -0
  10. package/dist/esm/components/SectionContent/styles.module.css +2 -0
  11. package/dist/esm/components/SectionContentTabs/styles.module.css +3 -1
  12. package/dist/esm/components/SectionMedia/styles.module.css +2 -0
  13. package/dist/esm/components/SectionPersonalManager/styles.module.css +1 -0
  14. package/dist/esm/components/SectionPromoList/styles.module.css +5 -0
  15. package/dist/esm/helperComponents/CardLeading/styles.module.css +1 -0
  16. package/dist/esm/helperComponents/Expert/styles.module.css +1 -0
  17. package/package.json +4 -4
  18. package/src/components/SectionContent/styles.module.scss +3 -1
  19. package/src/components/SectionContentTabs/styles.module.scss +3 -1
  20. package/src/components/SectionMedia/styles.module.scss +2 -0
  21. package/src/components/SectionPersonalManager/styles.module.scss +2 -1
  22. package/src/components/SectionPromoList/styles.module.scss +7 -1
  23. package/src/helperComponents/CardLeading/styles.module.scss +1 -0
  24. package/src/helperComponents/Expert/styles.module.scss +1 -0
package/CHANGELOG.md CHANGED
@@ -3,6 +3,17 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ # 0.27.0 (2025-12-24)
7
+
8
+
9
+ ### Features
10
+
11
+ * **SITE-10441:** add border radius & fix padding bottom ([786639b](https://gitverse.ru/cloud-ru-tech/uikit-product/commits/786639b497ad7de71551f6dbbaab1b5b81facb85))
12
+
13
+
14
+
15
+
16
+
6
17
  # 0.26.0 (2025-12-18)
7
18
 
8
19
 
package/README.md CHANGED
@@ -46,7 +46,7 @@
46
46
  | content* | `ContentBasicTab[] \| CardBasicArray \| ContentInfoTab[] \| CardInfoArray \| ContentNumericTab[] \| CardNumericArray \| ContentProductTab[] \| CardProductArray` | - | |
47
47
  | type* | "basic" \| "info" \| "numeric" \| "product" | - | |
48
48
  | layoutType* | enum LayoutType: `"mobile"`, `"tablet"`, `"desktop"`, `"desktopSmall"` | - | |
49
- | columnsConfig* | `GridProps` | - | Конфигурация настройки колонок для разных layoutType |
49
+ | columnsConfig* | `ColumnsConfig` | - | Конфигурация настройки колонок для разных layoutType |
50
50
  | id | `string` | - | id секции |
51
51
  | title | `string` | - | Название секции |
52
52
  | subtitle | `string` | - | Название подзаголовка секции |
@@ -78,8 +78,8 @@
78
78
  ### Props
79
79
  | name | type | default value | description |
80
80
  |------|------|---------------|-------------|
81
- | items* | `BlogCarouselItem[]` | - | Массив айтемов |
82
81
  | layoutType* | enum LayoutType: `"mobile"`, `"tablet"`, `"desktop"`, `"desktopSmall"` | - | |
82
+ | items* | `BlogCarouselItem[]` | - | Массив айтемов |
83
83
  | title | `string` | - | Название секции |
84
84
  | subtitle | `string` | - | Подзаголовок секции |
85
85
  | description | `string` | - | Описание секции |
@@ -88,8 +88,8 @@
88
88
  | subtitleTag | enum SectionTag: `"h2"`, `"h3"`, `"h4"` | - | Тег подзаголовка |
89
89
  | titleAlign | "left" \| "center" | - | Выравнивание текста |
90
90
  | id | `string` | - | id секции |
91
- | backgroundColor | enum SectionColor: `"neutral-background1-level"`, `"neutral-background"` | - | Цвет фона |
92
91
  | className | `string` | - | CSS - класснейм |
92
+ | backgroundColor | enum SectionColor: `"neutral-background1-level"`, `"neutral-background"` | - | Цвет фона |
93
93
  | moreButton | `{ label?: string; href?: string; onClick: MouseEventHandler<HTMLElement>; 'data-test-id'?: string; }` | - | Кнопка внизу секции |
94
94
  | autoSwipe | `number` | 9 | Автоматическое переключение слайдов в секундах |
95
95
  | infiniteScroll | `boolean` | false | Цикличная прокрутка |
@@ -97,8 +97,8 @@
97
97
  ### Props
98
98
  | name | type | default value | description |
99
99
  |------|------|---------------|-------------|
100
- | items* | `CaseItem[]` | - | Массив айтемов |
101
100
  | layoutType* | enum LayoutType: `"mobile"`, `"tablet"`, `"desktop"`, `"desktopSmall"` | - | |
101
+ | items* | `CaseItem[]` | - | Массив айтемов |
102
102
  | title | `string` | - | Название секции |
103
103
  | subtitle | `string` | - | Подзаголовок секции |
104
104
  | titleSectionSize | enum Size: `"s"`, `"m"`, `"l"` | - | Размер шрифтов заголовка и подзаголовка |
@@ -106,8 +106,8 @@
106
106
  | subtitleTag | enum SectionTag: `"h2"`, `"h3"`, `"h4"` | - | Тег подзаголовка |
107
107
  | titleAlign | "left" \| "center" | - | Выравнивание текста |
108
108
  | id | `string` | - | id секции |
109
- | backgroundColor | enum SectionColor: `"neutral-background1-level"`, `"neutral-background"` | - | Цвет фона |
110
109
  | className | `string` | - | CSS - класснейм |
110
+ | backgroundColor | enum SectionColor: `"neutral-background1-level"`, `"neutral-background"` | - | Цвет фона |
111
111
  | moreButton | `{ label?: string; href?: string; onClick: MouseEventHandler<HTMLElement>; 'data-test-id'?: string; }` | - | Кнопка внизу секции |
112
112
  | autoSwipe | `number` | 9 | Автоматическое переключение слайдов в секундах |
113
113
  | infiniteScroll | `boolean` | false | Цикличная прокрутка |
@@ -128,8 +128,8 @@
128
128
  ### Props
129
129
  | name | type | default value | description |
130
130
  |------|------|---------------|-------------|
131
- | items* | `CardClientProps[]` | - | Массив айтемов |
132
131
  | layoutType* | enum LayoutType: `"mobile"`, `"tablet"`, `"desktop"`, `"desktopSmall"` | - | |
132
+ | items* | `CardClientProps[]` | - | Массив айтемов |
133
133
  | title | `string` | - | Название секции |
134
134
  | subtitle | `string` | - | Подзаголовок секции |
135
135
  | titleSectionSize | enum Size: `"s"`, `"m"`, `"l"` | - | Размер шрифтов заголовка и подзаголовка |
@@ -137,8 +137,8 @@
137
137
  | subtitleTag | enum SectionTag: `"h2"`, `"h3"`, `"h4"` | - | Тег подзаголовка |
138
138
  | titleAlign | "left" \| "center" | - | Выравнивание текста |
139
139
  | id | `string` | - | id секции |
140
- | backgroundColor | enum SectionColor: `"neutral-background1-level"`, `"neutral-background"` | - | Цвет фона |
141
140
  | className | `string` | - | CSS - класснейм |
141
+ | backgroundColor | enum SectionColor: `"neutral-background1-level"`, `"neutral-background"` | - | Цвет фона |
142
142
  | moreButton | `{ label?: string; href?: string; onClick: MouseEventHandler<HTMLElement>; 'data-test-id'?: string; }` | - | Кнопка внизу секции |
143
143
  | autoSwipe | `number` | 9 | Автоматическое переключение слайдов в секундах |
144
144
  | infiniteScroll | `boolean` | false | Цикличная прокрутка |
@@ -154,9 +154,9 @@
154
154
  | button | `Omit<ButtonFilledProps, "size" \| "fullWidth">` | - | Кнопка действия |
155
155
  | backgroundColor | enum SectionColor: `"neutral-background1-level"`, `"neutral-background"` | neutral-background1-level | Цвет фона |
156
156
  | contentPosition | "left" \| "right" | left | Местоположение контента в секции |
157
- | video | `any` | - | |
158
- | onPlay | `any` | - | |
159
- | onError | `any` | - | |
157
+ | video | `ReactNode \| VideoPlayerProps` | - | |
158
+ | onPlay | `() => void` | - | |
159
+ | onError | `ReactEventHandler<HTMLVideoElement>` | - | |
160
160
  | image | `{ src: string; alt?: string; }` | - | Ссылка на изображение |
161
161
  | titleTag | enum SectionTag: `"h2"`, `"h3"`, `"h4"` | - | Тег заголовка |
162
162
  ## SectionContentList
@@ -171,9 +171,9 @@
171
171
  | items | `Item[]` | - | Список элементов |
172
172
  | backgroundColor | enum SectionColor: `"neutral-background1-level"`, `"neutral-background"` | - | Цвет фона |
173
173
  | contentPosition | "left" \| "right" | left | Местоположение контента в секции |
174
- | video | `any` | - | |
175
- | onPlay | `any` | - | |
176
- | onError | `any` | - | |
174
+ | video | `ReactNode \| VideoPlayerProps` | - | |
175
+ | onPlay | `() => void` | - | |
176
+ | onError | `ReactEventHandler<HTMLVideoElement>` | - | |
177
177
  | image | `{ src: string; alt?: string; }` | - | Ссылка на изображение |
178
178
  | titleTag | enum SectionTag: `"h2"`, `"h3"`, `"h4"` | - | Тег заголовка |
179
179
  ## SectionContentTabs
@@ -194,8 +194,8 @@
194
194
  ### Props
195
195
  | name | type | default value | description |
196
196
  |------|------|---------------|-------------|
197
- | items* | `ExpertDetails[]` | - | Массив айтемов |
198
197
  | layoutType* | enum LayoutType: `"mobile"`, `"tablet"`, `"desktop"`, `"desktopSmall"` | - | |
198
+ | items* | `ExpertDetails[]` | - | Массив айтемов |
199
199
  | title | `string` | - | Название секции |
200
200
  | subtitle | `string` | - | Подзаголовок секции |
201
201
  | titleSectionSize | enum Size: `"s"`, `"m"`, `"l"` | - | Размер шрифтов заголовка и подзаголовка |
@@ -203,8 +203,8 @@
203
203
  | subtitleTag | enum SectionTag: `"h2"`, `"h3"`, `"h4"` | - | Тег подзаголовка |
204
204
  | titleAlign | "left" \| "center" | - | Выравнивание текста |
205
205
  | id | `string` | - | id секции |
206
- | backgroundColor | enum SectionColor: `"neutral-background1-level"`, `"neutral-background"` | - | Цвет фона |
207
206
  | className | `string` | - | CSS - класснейм |
207
+ | backgroundColor | enum SectionColor: `"neutral-background1-level"`, `"neutral-background"` | - | Цвет фона |
208
208
  | moreButton | `{ label?: string; href?: string; onClick: MouseEventHandler<HTMLElement>; 'data-test-id'?: string; }` | - | Кнопка внизу секции |
209
209
  | autoSwipe | `number` | 9 | Автоматическое переключение слайдов в секундах |
210
210
  | infiniteScroll | `boolean` | false | Цикличная прокрутка |
@@ -227,8 +227,8 @@
227
227
  ### Props
228
228
  | name | type | default value | description |
229
229
  |------|------|---------------|-------------|
230
- | items* | `CardMarketplaceProps[]` | - | Массив айтемов |
231
230
  | layoutType* | enum LayoutType: `"mobile"`, `"tablet"`, `"desktop"`, `"desktopSmall"` | - | |
231
+ | items* | `CardMarketplaceProps[]` | - | Массив айтемов |
232
232
  | title | `string` | - | Название секции |
233
233
  | subtitle | `string` | - | Подзаголовок секции |
234
234
  | description | `string` | - | Описание секции |
@@ -237,8 +237,8 @@
237
237
  | subtitleTag | enum SectionTag: `"h2"`, `"h3"`, `"h4"` | - | Тег подзаголовка |
238
238
  | titleAlign | "left" \| "center" | - | Выравнивание текста |
239
239
  | id | `string` | - | id секции |
240
- | backgroundColor | enum SectionColor: `"neutral-background1-level"`, `"neutral-background"` | - | Цвет фона |
241
240
  | className | `string` | - | CSS - класснейм |
241
+ | backgroundColor | enum SectionColor: `"neutral-background1-level"`, `"neutral-background"` | - | Цвет фона |
242
242
  | moreButton | `{ label?: string; href?: string; onClick: MouseEventHandler<HTMLElement>; 'data-test-id'?: string; }` | - | Кнопка внизу секции |
243
243
  | autoSwipe | `number` | 9 | Автоматическое переключение слайдов в секундах |
244
244
  | infiniteScroll | `boolean` | false | Цикличная прокрутка |
@@ -252,9 +252,9 @@
252
252
  | titleTag | enum SectionTag: `"h2"`, `"h3"`, `"h4"` | - | Тег заголовка |
253
253
  | id | `string` | - | id секции |
254
254
  | backgroundColor | enum SectionColor: `"neutral-background1-level"`, `"neutral-background"` | - | Цвет фона |
255
- | video | `any` | - | |
256
- | onPlay | `any` | - | |
257
- | onError | `any` | - | |
255
+ | video | `ReactNode \| VideoPlayerProps` | - | |
256
+ | onPlay | `() => void` | - | |
257
+ | onError | `ReactEventHandler<HTMLVideoElement>` | - | |
258
258
  | image | `{ src: string; alt?: string; }` | - | Ссылка на изображение |
259
259
  ## SectionPersonalManager
260
260
  ### Props
@@ -294,11 +294,20 @@
294
294
  | id | `string` | - | id секции |
295
295
  | className | `string` | - | CSS-класс |
296
296
  | backgroundColor | enum SectionColor: `"neutral-background1-level"`, `"neutral-background"` | - | Цвет фона |
297
- | gap | `GridProps` | s | Размер отступов сетки |
297
+ | gap | "s" \| "m" \| "l" \| "xs" | s | Размер отступов сетки |
298
298
  ## SectionTable
299
299
  ### Props
300
300
  | name | type | default value | description |
301
301
  |------|------|---------------|-------------|
302
+ | layoutType* | enum LayoutType: `"mobile"`, `"tablet"`, `"desktop"`, `"desktopSmall"` | - | |
303
+ | rows* | `Cell[][]` | - | |
304
+ | id | `string` | - | id секции |
305
+ | className | `string` | - | CSS-класс |
306
+ | title | `string` | - | Заголовок |
307
+ | subtitle | `string` | - | Подзаголовок |
308
+ | description | `string` | - | Описание |
309
+ | backgroundColor | enum SectionColor: `"neutral-background1-level"`, `"neutral-background"` | - | Фон подложки |
310
+ | withHeader | `boolean` | - | |
302
311
  ## SectionCarousel
303
312
  ### Props
304
313
  | name | type | default value | description |
@@ -309,7 +318,7 @@
309
318
  | layoutType* | enum LayoutType: `"mobile"`, `"tablet"`, `"desktop"`, `"desktopSmall"` | - | |
310
319
  | title | `string` | - | Название секции |
311
320
  | subtitle | `string` | - | Подзаголовок секции |
312
- | titleLink | `PickLinkProps<(<T extends ElementType = "a">({ text, className, textMode, size, purpose, appearance, insideText, truncateVariant, as, ...rest }: LinkProps<T>) => Element), "onClick" \| "href" \| "target" \| "appearance" \| "textMode">` | - | Ссылка в названии |
321
+ | titleLink | `PickLinkProps<(<T extends ElementType = "a">({ text, className, textMode, size, purpose, appearance, insideText, truncateVariant, as, ...rest }: LinkProps<T>) => Element), "onClick" \| "appearance" \| "href" \| "target" \| "textMode">` | - | Ссылка в названии |
313
322
  | description | `string` | - | Описание секции |
314
323
  | titleSectionSize | enum Size: `"s"`, `"m"`, `"l"` | - | Размер шрифтов заголовка и подзаголовка |
315
324
  | titleTag | enum SectionTag: `"h2"`, `"h3"`, `"h4"` | - | Тег заголовка |
@@ -40,6 +40,8 @@
40
40
 
41
41
  .mediaWrapper{
42
42
  flex-grow:1;
43
+ border-radius:4px;
44
+ overflow:hidden;
43
45
  }
44
46
  [data-layout-type=tablet] .mediaWrapper{
45
47
  width:100%;
@@ -54,8 +54,10 @@
54
54
  width:100%;
55
55
  height:100%;
56
56
  display:flex;
57
- padding-bottom:56.5%;
57
+ padding-bottom:56.25%;
58
58
  border:0;
59
+ border-radius:4px;
60
+ overflow:hidden;
59
61
  }
60
62
 
61
63
  .image{
@@ -1,5 +1,7 @@
1
1
  .content{
2
2
  display:flex;
3
+ border-radius:4px;
4
+ overflow:hidden;
3
5
  }
4
6
 
5
7
  .image{
@@ -22,6 +22,7 @@
22
22
  box-sizing:border-box;
23
23
  background-color:var(--sys-neutral-background, #eeeff3);
24
24
  padding:var(--dimension-4m, 32px);
25
+ border-radius:4px;
25
26
  }
26
27
  .card[data-layout-type=tablet], .card[data-layout-type=mobile]{
27
28
  padding:var(--dimension-3m, 24px);
@@ -40,4 +40,9 @@
40
40
 
41
41
  .rightSectionText[data-layout-type=mobile]{
42
42
  padding:32px 32px 0;
43
+ }
44
+
45
+ .left,
46
+ .right{
47
+ border-radius:4px;
43
48
  }
@@ -1,5 +1,6 @@
1
1
  .cardLeading{
2
2
  overflow:hidden;
3
+ border-radius:4px;
3
4
  }
4
5
 
5
6
  .wrapper{
@@ -3,6 +3,7 @@
3
3
  flex-direction:column;
4
4
  gap:var(--dimension-1m, 8px);
5
5
  overflow:hidden;
6
+ border-radius:4px;
6
7
  }
7
8
 
8
9
  .imageWrapper{
@@ -40,6 +40,8 @@
40
40
 
41
41
  .mediaWrapper{
42
42
  flex-grow:1;
43
+ border-radius:4px;
44
+ overflow:hidden;
43
45
  }
44
46
  [data-layout-type=tablet] .mediaWrapper{
45
47
  width:100%;
@@ -54,8 +54,10 @@
54
54
  width:100%;
55
55
  height:100%;
56
56
  display:flex;
57
- padding-bottom:56.5%;
57
+ padding-bottom:56.25%;
58
58
  border:0;
59
+ border-radius:4px;
60
+ overflow:hidden;
59
61
  }
60
62
 
61
63
  .image{
@@ -1,5 +1,7 @@
1
1
  .content{
2
2
  display:flex;
3
+ border-radius:4px;
4
+ overflow:hidden;
3
5
  }
4
6
 
5
7
  .image{
@@ -22,6 +22,7 @@
22
22
  box-sizing:border-box;
23
23
  background-color:var(--sys-neutral-background, #eeeff3);
24
24
  padding:var(--dimension-4m, 32px);
25
+ border-radius:4px;
25
26
  }
26
27
  .card[data-layout-type=tablet], .card[data-layout-type=mobile]{
27
28
  padding:var(--dimension-3m, 24px);
@@ -40,4 +40,9 @@
40
40
 
41
41
  .rightSectionText[data-layout-type=mobile]{
42
42
  padding:32px 32px 0;
43
+ }
44
+
45
+ .left,
46
+ .right{
47
+ border-radius:4px;
43
48
  }
@@ -1,5 +1,6 @@
1
1
  .cardLeading{
2
2
  overflow:hidden;
3
+ border-radius:4px;
3
4
  }
4
5
 
5
6
  .wrapper{
@@ -3,6 +3,7 @@
3
3
  flex-direction:column;
4
4
  gap:var(--dimension-1m, 8px);
5
5
  overflow:hidden;
6
+ border-radius:4px;
6
7
  }
7
8
 
8
9
  .imageWrapper{
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@cloud-ru/uikit-product-site-section",
3
3
  "title": "Site Section",
4
- "version": "0.26.0",
4
+ "version": "0.27.0",
5
5
  "sideEffects": [
6
6
  "*.css",
7
7
  "*.woff",
@@ -38,11 +38,11 @@
38
38
  "dependencies": {
39
39
  "@cloud-ru/uikit-product-icons": "16.1.1",
40
40
  "@cloud-ru/uikit-product-mobile-fields": "0.12.3",
41
- "@cloud-ru/uikit-product-site-cards": "0.12.1",
41
+ "@cloud-ru/uikit-product-site-cards": "0.13.0",
42
42
  "@cloud-ru/uikit-product-site-case-card": "0.5.1",
43
43
  "@cloud-ru/uikit-product-site-grid": "0.1.10",
44
44
  "@cloud-ru/uikit-product-site-layout": "0.5.2",
45
- "@cloud-ru/uikit-product-site-media": "0.2.1",
45
+ "@cloud-ru/uikit-product-site-media": "0.3.0",
46
46
  "@cloud-ru/uikit-product-site-rich-text": "0.2.17",
47
47
  "@cloud-ru/uikit-product-site-table": "0.2.18",
48
48
  "@cloud-ru/uikit-product-utils": "8.1.0",
@@ -67,5 +67,5 @@
67
67
  "@cloud-ru/uikit-product-locale": "*",
68
68
  "@snack-uikit/figma-tokens": "*"
69
69
  },
70
- "gitHead": "340f8e4151c606c0bd1d8b3053a2bda085b2861b"
70
+ "gitHead": "5f09d9ce6c82845090013f9b4f00f46cb160e59c"
71
71
  }
@@ -51,6 +51,8 @@
51
51
 
52
52
  .mediaWrapper {
53
53
  flex-grow: 1;
54
+ border-radius: 4px;
55
+ overflow: hidden;
54
56
 
55
57
  [data-layout-type='tablet'] & {
56
58
  width: 100%;
@@ -67,4 +69,4 @@
67
69
  height: 100%;
68
70
  object-fit: contain;
69
71
  object-position: top left;
70
- }
72
+ }
@@ -64,8 +64,10 @@ $tabs-width: 280px;
64
64
  width: 100%;
65
65
  height: 100%;
66
66
  display: flex;
67
- padding-bottom: 56.5%;
67
+ padding-bottom: 56.25%;
68
68
  border: 0;
69
+ border-radius: 4px;
70
+ overflow: hidden;
69
71
  }
70
72
 
71
73
  .image {
@@ -1,5 +1,7 @@
1
1
  .content {
2
2
  display: flex;
3
+ border-radius: 4px;
4
+ overflow: hidden;
3
5
  }
4
6
 
5
7
  .image {
@@ -28,6 +28,7 @@
28
28
  background-color: var.$sys-neutral-background;
29
29
 
30
30
  padding: var.$dimension-4m;
31
+ border-radius: 4px;
31
32
 
32
33
  &[data-layout-type='tablet'],
33
34
  &[data-layout-type='mobile'] {
@@ -100,7 +101,7 @@
100
101
  gap: var.$dimension-4m;
101
102
 
102
103
  &[data-layout-type='tablet'],
103
- &[data-layout-type='mobile']{
104
+ &[data-layout-type='mobile'] {
104
105
  flex-direction: column;
105
106
  gap: var.$dimension-2m;
106
107
  }
@@ -30,7 +30,8 @@
30
30
  background-image: var(--image);
31
31
  background-repeat: no-repeat;
32
32
  background-size: var(--image-size);
33
- background-position: calc(100% + var(--image-size) - var(--image-visible-size)) calc(100% + var(--image-size) - var(--image-visible-size));
33
+ background-position: calc(100% + var(--image-size) - var(--image-visible-size))
34
+ calc(100% + var(--image-size) - var(--image-visible-size));
34
35
 
35
36
  &[data-layout-type='tablet'] {
36
37
  --image-visible-size: 300px;
@@ -50,3 +51,8 @@
50
51
  padding: 32px 32px 0;
51
52
  }
52
53
  }
54
+
55
+ .left,
56
+ .right {
57
+ border-radius: 4px;
58
+ }
@@ -2,6 +2,7 @@
2
2
 
3
3
  .cardLeading {
4
4
  overflow: hidden;
5
+ border-radius: 4px;
5
6
  }
6
7
 
7
8
  .wrapper {
@@ -5,6 +5,7 @@
5
5
  flex-direction: column;
6
6
  gap: var.$dimension-1m;
7
7
  overflow: hidden;
8
+ border-radius: 4px;
8
9
  }
9
10
 
10
11
  .imageWrapper {