@salutejs/plasma-new-hope 0.194.0-canary.1568.11891833298.0 → 0.194.0-dev.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (5) hide show
  1. package/package.json +2 -2
  2. package/emotion/cjs/components/Card/Card.api.mdx +0 -184
  3. package/emotion/es/components/Card/Card.api.mdx +0 -184
  4. package/styled-components/cjs/components/Card/Card.api.mdx +0 -184
  5. package/styled-components/es/components/Card/Card.api.mdx +0 -184
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@salutejs/plasma-new-hope",
3
- "version": "0.194.0-canary.1568.11891833298.0",
3
+ "version": "0.194.0-dev.0",
4
4
  "description": "Salute Design System blueprint",
5
5
  "main": "cjs/index.js",
6
6
  "module": "es/index.js",
@@ -128,5 +128,5 @@
128
128
  "sideEffects": [
129
129
  "*.css"
130
130
  ],
131
- "gitHead": "cefe6714d8c07097e31273c50d13370ae9b222b9"
131
+ "gitHead": "c58896a004fb89f31dacd08dc2d20602e23fa6d4"
132
132
  }
package/emotion/cjs/components/Card/Card.api.mdx DELETED
@@ -1,184 +0,0 @@
1
- ---
2
- id: card
3
- title: Card
4
- ---
5
-
6
- отличия от https://plasma.sberdevices.ru/b2c/components/card/:
7
- * избавляемся от CardBody
8
- * убираем дублирование disabled
9
-
10
- примеры дизайна https://www.figma.com/design/MXl0ZkXEqEhIFDS2H6b3yk/StarDS-Cards?node-id=2-690&node-type=instance&t=TJN8Nqyiky3Dfw2T-0
11
-
12
- другие либы:
13
- https://ant.design/components/card#
14
- https://mui.com/material-ui/react-card/
15
-
16
- ```tsx live
17
- import React, { ReactNode } from "react";
18
-
19
- /**
20
- * Набор часто встречающихся скруглений.
21
- */
22
-
23
- export const radiuses = {
24
- 250: 15.625,
25
- 32: 2,
26
- 28: 1.75,
27
- 24: 1.5,
28
- 20: 1.25,
29
- 18: 1.125,
30
- 16: 1,
31
- 14: 0.875,
32
- 12: 0.75,
33
- 8: 0.5,
34
- 0: 0,
35
- };
36
-
37
- export type Roundness = keyof typeof radiuses;
38
-
39
- export interface RoundnessProps {
40
- /** Скругленность */
41
- roundness: Roundness;
42
- }
43
-
44
- interface Card {
45
- /** Компонент в фокусе */
46
- focused?: boolean;
47
- /** Увеличение по фокусу */
48
- scaleOnFocus?: boolean;
49
- /** Компонент неактивен */
50
- disabled?: boolean;
51
- /** Добавить рамку при фокусе */
52
- outlined?: boolean;
53
- /** Цвет подложки */
54
- background?: string;
55
- /** Делает карточку квадратной */
56
- square?: boolean;
57
- /** Заголовок */
58
- title?: string | ReactNode;
59
- /** Подзаголовок */
60
- subtitle?: string | ReactNode;
61
- /** Расположение заголовка и подзаголовка, пока нет в дизайне */
62
- titlePlacement?: "inner" | "outer";
63
- /** Выравнивание заголовка и подзаголовка */
64
- titleAlign?: "left" | "center";
65
- /** Подвал, или вынести в
66
- * <CardContent footer={<CardTimeline />} /> или <CardFooter><CardTimeline /></CardFooter>
67
- * */
68
- footer?: ReactNode;
69
- }
70
-
71
- const ratios = {
72
- "1 / 1": "100",
73
- "1/1": "100",
74
- "3 / 4": "133.3333",
75
- "3/4": "133.3333",
76
- "4 / 3": "75",
77
- "4/3": "75",
78
- "9 / 16": "177.7778",
79
- "9/16": "177.7778",
80
- "16 / 9": "56.25",
81
- "16/9": "56.25",
82
- "1 / 2": "200",
83
- "1/2": "200",
84
- "2 / 1": "50",
85
- "2/1": "50",
86
- };
87
-
88
- export type Ratio = keyof typeof ratios;
89
-
90
- /**
91
- * CardMedia из текущей реализации
92
- * Стоит ли заменить пропсом `cover?: ReactNode;` в Card как в Ant?
93
- * а width и height передавать в style...
94
- *
95
- * имхо, нет. у Card может быть title и subtitle под карточкой
96
- * скорее всего, на них свойство height не должно распространяться
97
- * стоит подождать финальный дизайн
98
- */
99
- interface CardMedia {
100
- base?: "img" | "div";
101
- height?: string | number;
102
- ratio?: Ratio;
103
- customRatio?: string;
104
- }
105
-
106
- interface CardContent {
107
- topLeft?: string | ReactNode;
108
- topRight?: string | ReactNode;
109
- bottomLeft?: string | ReactNode;
110
- bottomRight?: string | ReactNode;
111
- children?: ReactNode;
112
- }
113
-
114
- /** или */
115
- interface CardContent {
116
- placement?: "top-left" | "top-right" | "bottom-left" | "bottom-right";
117
- children?: ReactNode;
118
- }
119
-
120
- interface CardTimeline {
121
- /**
122
- * Описание, например время до конца фильма. Возможно,
123
- * не нужно и стоит указывать bottomRight контент
124
- */
125
- text?: string;
126
- progress?: string | number;
127
- /**
128
- * Не увеличивать высоту карточки
129
- * @default true
130
- */
131
- inline?: boolean;
132
- }
133
- ```
134
-
135
- ```tsx live
136
- <Card title="Title" subtitle="Subtitle">
137
- <CardContent placement="top-left">
138
- <SomeIcon />
139
- </CardContent>
140
- <CardContent placement="top-right">
141
- <SaveButton saved={isSaved} />
142
- </CardContent>
143
- <CardContent placement="bottom-right">18+</CardContent>
144
- </Card>;
145
-
146
- <Card title="Title" subtitle="Subtitle">
147
- <CardContent
148
- topLeft={<SomeIcon />}
149
- topRight={<SaveButton saved={isSaved} />}
150
- bottomRight="18+"
151
- />
152
- </Card>;
153
-
154
- <Card title="Title" subtitle="Subtitle">
155
- <CardMedia src={someSrc} alt="trailer" />
156
- <CardContent
157
- topLeft={<SomeIcon />}
158
- topRight={<SaveButton saved={isSaved} />}
159
- bottomRight="18+"
160
- />
161
- <CardTimeline text="еще 1ч 23мин" progress={56} />
162
- </Card>;
163
-
164
- <Card title="Title" subtitle="Subtitle">
165
- <CardContent topLeft={<SomeIcon />} topRight={<SaveButton saved={isSaved} />}>
166
- <CardMedia src={someSrc} alt="trailer" />
167
- </CardContent>
168
- <CardTimeline text="еще 1ч 23мин" progress={56} />
169
- </Card>;
170
-
171
- <Card
172
- title="Title"
173
- subtitle="Subtitle"
174
- // как в ant, но кажется, что так менее гибко
175
- cover={<CardMedia src={someSrc} alt="trailer" />}
176
- square
177
- >
178
- <CardContent
179
- topLeft={<SomeIcon />}
180
- topRight={<SaveButton saved={isSaved} />}
181
- />
182
- <CardTimeline text="еще 1ч 23мин" progress={56} />
183
- </Card>;
184
- ```
package/emotion/es/components/Card/Card.api.mdx DELETED
@@ -1,184 +0,0 @@
1
- ---
2
- id: card
3
- title: Card
4
- ---
5
-
6
- отличия от https://plasma.sberdevices.ru/b2c/components/card/:
7
- * избавляемся от CardBody
8
- * убираем дублирование disabled
9
-
10
- примеры дизайна https://www.figma.com/design/MXl0ZkXEqEhIFDS2H6b3yk/StarDS-Cards?node-id=2-690&node-type=instance&t=TJN8Nqyiky3Dfw2T-0
11
-
12
- другие либы:
13
- https://ant.design/components/card#
14
- https://mui.com/material-ui/react-card/
15
-
16
- ```tsx live
17
- import React, { ReactNode } from "react";
18
-
19
- /**
20
- * Набор часто встречающихся скруглений.
21
- */
22
-
23
- export const radiuses = {
24
- 250: 15.625,
25
- 32: 2,
26
- 28: 1.75,
27
- 24: 1.5,
28
- 20: 1.25,
29
- 18: 1.125,
30
- 16: 1,
31
- 14: 0.875,
32
- 12: 0.75,
33
- 8: 0.5,
34
- 0: 0,
35
- };
36
-
37
- export type Roundness = keyof typeof radiuses;
38
-
39
- export interface RoundnessProps {
40
- /** Скругленность */
41
- roundness: Roundness;
42
- }
43
-
44
- interface Card {
45
- /** Компонент в фокусе */
46
- focused?: boolean;
47
- /** Увеличение по фокусу */
48
- scaleOnFocus?: boolean;
49
- /** Компонент неактивен */
50
- disabled?: boolean;
51
- /** Добавить рамку при фокусе */
52
- outlined?: boolean;
53
- /** Цвет подложки */
54
- background?: string;
55
- /** Делает карточку квадратной */
56
- square?: boolean;
57
- /** Заголовок */
58
- title?: string | ReactNode;
59
- /** Подзаголовок */
60
- subtitle?: string | ReactNode;
61
- /** Расположение заголовка и подзаголовка, пока нет в дизайне */
62
- titlePlacement?: "inner" | "outer";
63
- /** Выравнивание заголовка и подзаголовка */
64
- titleAlign?: "left" | "center";
65
- /** Подвал, или вынести в
66
- * <CardContent footer={<CardTimeline />} /> или <CardFooter><CardTimeline /></CardFooter>
67
- * */
68
- footer?: ReactNode;
69
- }
70
-
71
- const ratios = {
72
- "1 / 1": "100",
73
- "1/1": "100",
74
- "3 / 4": "133.3333",
75
- "3/4": "133.3333",
76
- "4 / 3": "75",
77
- "4/3": "75",
78
- "9 / 16": "177.7778",
79
- "9/16": "177.7778",
80
- "16 / 9": "56.25",
81
- "16/9": "56.25",
82
- "1 / 2": "200",
83
- "1/2": "200",
84
- "2 / 1": "50",
85
- "2/1": "50",
86
- };
87
-
88
- export type Ratio = keyof typeof ratios;
89
-
90
- /**
91
- * CardMedia из текущей реализации
92
- * Стоит ли заменить пропсом `cover?: ReactNode;` в Card как в Ant?
93
- * а width и height передавать в style...
94
- *
95
- * имхо, нет. у Card может быть title и subtitle под карточкой
96
- * скорее всего, на них свойство height не должно распространяться
97
- * стоит подождать финальный дизайн
98
- */
99
- interface CardMedia {
100
- base?: "img" | "div";
101
- height?: string | number;
102
- ratio?: Ratio;
103
- customRatio?: string;
104
- }
105
-
106
- interface CardContent {
107
- topLeft?: string | ReactNode;
108
- topRight?: string | ReactNode;
109
- bottomLeft?: string | ReactNode;
110
- bottomRight?: string | ReactNode;
111
- children?: ReactNode;
112
- }
113
-
114
- /** или */
115
- interface CardContent {
116
- placement?: "top-left" | "top-right" | "bottom-left" | "bottom-right";
117
- children?: ReactNode;
118
- }
119
-
120
- interface CardTimeline {
121
- /**
122
- * Описание, например время до конца фильма. Возможно,
123
- * не нужно и стоит указывать bottomRight контент
124
- */
125
- text?: string;
126
- progress?: string | number;
127
- /**
128
- * Не увеличивать высоту карточки
129
- * @default true
130
- */
131
- inline?: boolean;
132
- }
133
- ```
134
-
135
- ```tsx live
136
- <Card title="Title" subtitle="Subtitle">
137
- <CardContent placement="top-left">
138
- <SomeIcon />
139
- </CardContent>
140
- <CardContent placement="top-right">
141
- <SaveButton saved={isSaved} />
142
- </CardContent>
143
- <CardContent placement="bottom-right">18+</CardContent>
144
- </Card>;
145
-
146
- <Card title="Title" subtitle="Subtitle">
147
- <CardContent
148
- topLeft={<SomeIcon />}
149
- topRight={<SaveButton saved={isSaved} />}
150
- bottomRight="18+"
151
- />
152
- </Card>;
153
-
154
- <Card title="Title" subtitle="Subtitle">
155
- <CardMedia src={someSrc} alt="trailer" />
156
- <CardContent
157
- topLeft={<SomeIcon />}
158
- topRight={<SaveButton saved={isSaved} />}
159
- bottomRight="18+"
160
- />
161
- <CardTimeline text="еще 1ч 23мин" progress={56} />
162
- </Card>;
163
-
164
- <Card title="Title" subtitle="Subtitle">
165
- <CardContent topLeft={<SomeIcon />} topRight={<SaveButton saved={isSaved} />}>
166
- <CardMedia src={someSrc} alt="trailer" />
167
- </CardContent>
168
- <CardTimeline text="еще 1ч 23мин" progress={56} />
169
- </Card>;
170
-
171
- <Card
172
- title="Title"
173
- subtitle="Subtitle"
174
- // как в ant, но кажется, что так менее гибко
175
- cover={<CardMedia src={someSrc} alt="trailer" />}
176
- square
177
- >
178
- <CardContent
179
- topLeft={<SomeIcon />}
180
- topRight={<SaveButton saved={isSaved} />}
181
- />
182
- <CardTimeline text="еще 1ч 23мин" progress={56} />
183
- </Card>;
184
- ```
package/styled-components/cjs/components/Card/Card.api.mdx DELETED
@@ -1,184 +0,0 @@
1
- ---
2
- id: card
3
- title: Card
4
- ---
5
-
6
- отличия от https://plasma.sberdevices.ru/b2c/components/card/:
7
- * избавляемся от CardBody
8
- * убираем дублирование disabled
9
-
10
- примеры дизайна https://www.figma.com/design/MXl0ZkXEqEhIFDS2H6b3yk/StarDS-Cards?node-id=2-690&node-type=instance&t=TJN8Nqyiky3Dfw2T-0
11
-
12
- другие либы:
13
- https://ant.design/components/card#
14
- https://mui.com/material-ui/react-card/
15
-
16
- ```tsx live
17
- import React, { ReactNode } from "react";
18
-
19
- /**
20
- * Набор часто встречающихся скруглений.
21
- */
22
-
23
- export const radiuses = {
24
- 250: 15.625,
25
- 32: 2,
26
- 28: 1.75,
27
- 24: 1.5,
28
- 20: 1.25,
29
- 18: 1.125,
30
- 16: 1,
31
- 14: 0.875,
32
- 12: 0.75,
33
- 8: 0.5,
34
- 0: 0,
35
- };
36
-
37
- export type Roundness = keyof typeof radiuses;
38
-
39
- export interface RoundnessProps {
40
- /** Скругленность */
41
- roundness: Roundness;
42
- }
43
-
44
- interface Card {
45
- /** Компонент в фокусе */
46
- focused?: boolean;
47
- /** Увеличение по фокусу */
48
- scaleOnFocus?: boolean;
49
- /** Компонент неактивен */
50
- disabled?: boolean;
51
- /** Добавить рамку при фокусе */
52
- outlined?: boolean;
53
- /** Цвет подложки */
54
- background?: string;
55
- /** Делает карточку квадратной */
56
- square?: boolean;
57
- /** Заголовок */
58
- title?: string | ReactNode;
59
- /** Подзаголовок */
60
- subtitle?: string | ReactNode;
61
- /** Расположение заголовка и подзаголовка, пока нет в дизайне */
62
- titlePlacement?: "inner" | "outer";
63
- /** Выравнивание заголовка и подзаголовка */
64
- titleAlign?: "left" | "center";
65
- /** Подвал, или вынести в
66
- * <CardContent footer={<CardTimeline />} /> или <CardFooter><CardTimeline /></CardFooter>
67
- * */
68
- footer?: ReactNode;
69
- }
70
-
71
- const ratios = {
72
- "1 / 1": "100",
73
- "1/1": "100",
74
- "3 / 4": "133.3333",
75
- "3/4": "133.3333",
76
- "4 / 3": "75",
77
- "4/3": "75",
78
- "9 / 16": "177.7778",
79
- "9/16": "177.7778",
80
- "16 / 9": "56.25",
81
- "16/9": "56.25",
82
- "1 / 2": "200",
83
- "1/2": "200",
84
- "2 / 1": "50",
85
- "2/1": "50",
86
- };
87
-
88
- export type Ratio = keyof typeof ratios;
89
-
90
- /**
91
- * CardMedia из текущей реализации
92
- * Стоит ли заменить пропсом `cover?: ReactNode;` в Card как в Ant?
93
- * а width и height передавать в style...
94
- *
95
- * имхо, нет. у Card может быть title и subtitle под карточкой
96
- * скорее всего, на них свойство height не должно распространяться
97
- * стоит подождать финальный дизайн
98
- */
99
- interface CardMedia {
100
- base?: "img" | "div";
101
- height?: string | number;
102
- ratio?: Ratio;
103
- customRatio?: string;
104
- }
105
-
106
- interface CardContent {
107
- topLeft?: string | ReactNode;
108
- topRight?: string | ReactNode;
109
- bottomLeft?: string | ReactNode;
110
- bottomRight?: string | ReactNode;
111
- children?: ReactNode;
112
- }
113
-
114
- /** или */
115
- interface CardContent {
116
- placement?: "top-left" | "top-right" | "bottom-left" | "bottom-right";
117
- children?: ReactNode;
118
- }
119
-
120
- interface CardTimeline {
121
- /**
122
- * Описание, например время до конца фильма. Возможно,
123
- * не нужно и стоит указывать bottomRight контент
124
- */
125
- text?: string;
126
- progress?: string | number;
127
- /**
128
- * Не увеличивать высоту карточки
129
- * @default true
130
- */
131
- inline?: boolean;
132
- }
133
- ```
134
-
135
- ```tsx live
136
- <Card title="Title" subtitle="Subtitle">
137
- <CardContent placement="top-left">
138
- <SomeIcon />
139
- </CardContent>
140
- <CardContent placement="top-right">
141
- <SaveButton saved={isSaved} />
142
- </CardContent>
143
- <CardContent placement="bottom-right">18+</CardContent>
144
- </Card>;
145
-
146
- <Card title="Title" subtitle="Subtitle">
147
- <CardContent
148
- topLeft={<SomeIcon />}
149
- topRight={<SaveButton saved={isSaved} />}
150
- bottomRight="18+"
151
- />
152
- </Card>;
153
-
154
- <Card title="Title" subtitle="Subtitle">
155
- <CardMedia src={someSrc} alt="trailer" />
156
- <CardContent
157
- topLeft={<SomeIcon />}
158
- topRight={<SaveButton saved={isSaved} />}
159
- bottomRight="18+"
160
- />
161
- <CardTimeline text="еще 1ч 23мин" progress={56} />
162
- </Card>;
163
-
164
- <Card title="Title" subtitle="Subtitle">
165
- <CardContent topLeft={<SomeIcon />} topRight={<SaveButton saved={isSaved} />}>
166
- <CardMedia src={someSrc} alt="trailer" />
167
- </CardContent>
168
- <CardTimeline text="еще 1ч 23мин" progress={56} />
169
- </Card>;
170
-
171
- <Card
172
- title="Title"
173
- subtitle="Subtitle"
174
- // как в ant, но кажется, что так менее гибко
175
- cover={<CardMedia src={someSrc} alt="trailer" />}
176
- square
177
- >
178
- <CardContent
179
- topLeft={<SomeIcon />}
180
- topRight={<SaveButton saved={isSaved} />}
181
- />
182
- <CardTimeline text="еще 1ч 23мин" progress={56} />
183
- </Card>;
184
- ```
package/styled-components/es/components/Card/Card.api.mdx DELETED
@@ -1,184 +0,0 @@
1
- ---
2
- id: card
3
- title: Card
4
- ---
5
-
6
- отличия от https://plasma.sberdevices.ru/b2c/components/card/:
7
- * избавляемся от CardBody
8
- * убираем дублирование disabled
9
-
10
- примеры дизайна https://www.figma.com/design/MXl0ZkXEqEhIFDS2H6b3yk/StarDS-Cards?node-id=2-690&node-type=instance&t=TJN8Nqyiky3Dfw2T-0
11
-
12
- другие либы:
13
- https://ant.design/components/card#
14
- https://mui.com/material-ui/react-card/
15
-
16
- ```tsx live
17
- import React, { ReactNode } from "react";
18
-
19
- /**
20
- * Набор часто встречающихся скруглений.
21
- */
22
-
23
- export const radiuses = {
24
- 250: 15.625,
25
- 32: 2,
26
- 28: 1.75,
27
- 24: 1.5,
28
- 20: 1.25,
29
- 18: 1.125,
30
- 16: 1,
31
- 14: 0.875,
32
- 12: 0.75,
33
- 8: 0.5,
34
- 0: 0,
35
- };
36
-
37
- export type Roundness = keyof typeof radiuses;
38
-
39
- export interface RoundnessProps {
40
- /** Скругленность */
41
- roundness: Roundness;
42
- }
43
-
44
- interface Card {
45
- /** Компонент в фокусе */
46
- focused?: boolean;
47
- /** Увеличение по фокусу */
48
- scaleOnFocus?: boolean;
49
- /** Компонент неактивен */
50
- disabled?: boolean;
51
- /** Добавить рамку при фокусе */
52
- outlined?: boolean;
53
- /** Цвет подложки */
54
- background?: string;
55
- /** Делает карточку квадратной */
56
- square?: boolean;
57
- /** Заголовок */
58
- title?: string | ReactNode;
59
- /** Подзаголовок */
60
- subtitle?: string | ReactNode;
61
- /** Расположение заголовка и подзаголовка, пока нет в дизайне */
62
- titlePlacement?: "inner" | "outer";
63
- /** Выравнивание заголовка и подзаголовка */
64
- titleAlign?: "left" | "center";
65
- /** Подвал, или вынести в
66
- * <CardContent footer={<CardTimeline />} /> или <CardFooter><CardTimeline /></CardFooter>
67
- * */
68
- footer?: ReactNode;
69
- }
70
-
71
- const ratios = {
72
- "1 / 1": "100",
73
- "1/1": "100",
74
- "3 / 4": "133.3333",
75
- "3/4": "133.3333",
76
- "4 / 3": "75",
77
- "4/3": "75",
78
- "9 / 16": "177.7778",
79
- "9/16": "177.7778",
80
- "16 / 9": "56.25",
81
- "16/9": "56.25",
82
- "1 / 2": "200",
83
- "1/2": "200",
84
- "2 / 1": "50",
85
- "2/1": "50",
86
- };
87
-
88
- export type Ratio = keyof typeof ratios;
89
-
90
- /**
91
- * CardMedia из текущей реализации
92
- * Стоит ли заменить пропсом `cover?: ReactNode;` в Card как в Ant?
93
- * а width и height передавать в style...
94
- *
95
- * имхо, нет. у Card может быть title и subtitle под карточкой
96
- * скорее всего, на них свойство height не должно распространяться
97
- * стоит подождать финальный дизайн
98
- */
99
- interface CardMedia {
100
- base?: "img" | "div";
101
- height?: string | number;
102
- ratio?: Ratio;
103
- customRatio?: string;
104
- }
105
-
106
- interface CardContent {
107
- topLeft?: string | ReactNode;
108
- topRight?: string | ReactNode;
109
- bottomLeft?: string | ReactNode;
110
- bottomRight?: string | ReactNode;
111
- children?: ReactNode;
112
- }
113
-
114
- /** или */
115
- interface CardContent {
116
- placement?: "top-left" | "top-right" | "bottom-left" | "bottom-right";
117
- children?: ReactNode;
118
- }
119
-
120
- interface CardTimeline {
121
- /**
122
- * Описание, например время до конца фильма. Возможно,
123
- * не нужно и стоит указывать bottomRight контент
124
- */
125
- text?: string;
126
- progress?: string | number;
127
- /**
128
- * Не увеличивать высоту карточки
129
- * @default true
130
- */
131
- inline?: boolean;
132
- }
133
- ```
134
-
135
- ```tsx live
136
- <Card title="Title" subtitle="Subtitle">
137
- <CardContent placement="top-left">
138
- <SomeIcon />
139
- </CardContent>
140
- <CardContent placement="top-right">
141
- <SaveButton saved={isSaved} />
142
- </CardContent>
143
- <CardContent placement="bottom-right">18+</CardContent>
144
- </Card>;
145
-
146
- <Card title="Title" subtitle="Subtitle">
147
- <CardContent
148
- topLeft={<SomeIcon />}
149
- topRight={<SaveButton saved={isSaved} />}
150
- bottomRight="18+"
151
- />
152
- </Card>;
153
-
154
- <Card title="Title" subtitle="Subtitle">
155
- <CardMedia src={someSrc} alt="trailer" />
156
- <CardContent
157
- topLeft={<SomeIcon />}
158
- topRight={<SaveButton saved={isSaved} />}
159
- bottomRight="18+"
160
- />
161
- <CardTimeline text="еще 1ч 23мин" progress={56} />
162
- </Card>;
163
-
164
- <Card title="Title" subtitle="Subtitle">
165
- <CardContent topLeft={<SomeIcon />} topRight={<SaveButton saved={isSaved} />}>
166
- <CardMedia src={someSrc} alt="trailer" />
167
- </CardContent>
168
- <CardTimeline text="еще 1ч 23мин" progress={56} />
169
- </Card>;
170
-
171
- <Card
172
- title="Title"
173
- subtitle="Subtitle"
174
- // как в ant, но кажется, что так менее гибко
175
- cover={<CardMedia src={someSrc} alt="trailer" />}
176
- square
177
- >
178
- <CardContent
179
- topLeft={<SomeIcon />}
180
- topRight={<SaveButton saved={isSaved} />}
181
- />
182
- <CardTimeline text="еще 1ч 23мин" progress={56} />
183
- </Card>;
184
- ```