@gravity-ui/page-constructor 1.1.0 → 1.2.0-alpha.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 +7 -0
  2. package/build/cjs/blocks/Info/Info.css +18 -54
  3. package/build/cjs/blocks/Info/Info.js +20 -12
  4. package/build/cjs/blocks/Info/schema.d.ts +130 -0
  5. package/build/cjs/blocks/Info/schema.js +8 -1
  6. package/build/cjs/containers/PageConstructor/PageConstructor.css +17 -5
  7. package/build/cjs/models/constructor-items/blocks.d.ts +8 -2
  8. package/build/cjs/sub-blocks/Content/Content.css +11 -9
  9. package/build/cjs/sub-blocks/Content/Content.js +6 -2
  10. package/build/cjs/text-transform/blocks.js +12 -0
  11. package/build/esm/blocks/Info/Info.css +18 -54
  12. package/build/esm/blocks/Info/Info.js +20 -12
  13. package/build/esm/blocks/Info/schema.d.ts +130 -0
  14. package/build/esm/blocks/Info/schema.js +7 -1
  15. package/build/esm/containers/PageConstructor/PageConstructor.css +17 -5
  16. package/build/esm/models/constructor-items/blocks.d.ts +8 -2
  17. package/build/esm/sub-blocks/Content/Content.css +11 -9
  18. package/build/esm/sub-blocks/Content/Content.js +6 -2
  19. package/build/esm/text-transform/blocks.js +12 -0
  20. package/package.json +4 -1
  21. package/server/models/constructor-items/blocks.d.ts +8 -2
  22. package/server/text-transform/blocks.js +12 -0
  23. package/styles/styles.css +17 -5
  24. package/styles/yfm.scss +18 -5
package/CHANGELOG.md CHANGED
@@ -1,5 +1,12 @@
1
1
  # Changelog
2
2
 
3
+ ## [1.2.0](https://github.com/gravity-ui/page-constructor/compare/v1.1.0...v1.2.0) (2022-10-11)
4
+
5
+
6
+ ### Features
7
+
8
+ * add Content to Info block ([0017341](https://github.com/gravity-ui/page-constructor/commit/00173411209bca6a61f1d64d8329ead4328152f5))
9
+
3
10
  ## [1.1.0](https://github.com/gravity-ui/page-constructor/compare/v1.0.5...v1.1.0) (2022-10-10)
4
11
 
5
12
 
package/build/cjs/blocks/Info/Info.css CHANGED
@@ -1,68 +1,32 @@
1
- .pc-info-block__content-title, .pc-info-block__sections-title {
2
- margin: 0;
3
- }
4
-
5
1
  /* use this for style redefinitions to awoid problems with
6
2
  unpredictable css rules order in build */
7
- .pc-info-block_theme_dark {
8
- color: var(--yc-color-text-light-primary);
9
- }
10
- .pc-info-block_theme_dark h1,
11
- .pc-info-block_theme_dark h2,
12
- .pc-info-block_theme_dark h3,
13
- .pc-info-block_theme_dark h4,
14
- .pc-info-block_theme_dark h5,
15
- .pc-info-block_theme_dark h6,
16
- .pc-info-block_theme_dark .yfm {
17
- color: var(--yc-color-text-light-primary);
18
- }
19
- .pc-info-block__content-title, .pc-info-block__sections-title {
20
- font-size: var(--yc-text-display-2-font-size);
21
- line-height: var(--yc-text-display-2-line-height);
22
- color: var(--pc-text-header-color);
23
- font-weight: var(--yc-text-accent-font-weight);
24
- }
25
- @media (max-width: 576px) {
26
- .pc-info-block__content-title, .pc-info-block__sections-title {
27
- font-size: var(--yc-text-display-1-font-size);
28
- line-height: var(--yc-text-display-1-line-height);
29
- }
30
- }
31
- .pc-info-block__content {
3
+ .pc-info-block__container {
32
4
  background-color: var(--yc-color-base-special);
33
- padding: 96px 64px 128px;
5
+ padding: 96px 64px;
34
6
  border-radius: var(--pc-border-radius);
35
7
  }
36
- .pc-info-block__buttons {
37
- margin-top: 16px;
38
- }
39
- .pc-info-block__button {
40
- margin-top: 16px;
41
- }
42
- .pc-info-block__button:not(:last-child) {
43
- margin-right: 16px;
44
- }
45
- .pc-info-block__links {
46
- font-size: var(--yc-text-body-2-font-size);
47
- line-height: var(--yc-text-body-2-line-height);
48
- margin-top: 20px;
49
- }
50
- .pc-info-block__link {
51
- margin-top: 0;
52
- }
53
- .pc-info-block__link + .pc-info-block__link {
54
- margin-top: 12px;
8
+ .pc-info-block__left, .pc-info-block__right {
9
+ padding-right: 96px;
10
+ padding-bottom: 16px;
55
11
  }
56
12
  @media (max-width: 1081px) {
57
- .pc-info-block__content {
13
+ .pc-info-block__left, .pc-info-block__right {
14
+ padding-bottom: 0;
15
+ }
16
+ .pc-info-block__container {
58
17
  padding: 96px 64px;
59
18
  }
60
19
  }
20
+ @media (max-width: 769px) {
21
+ .pc-info-block__left {
22
+ margin-bottom: 48px;
23
+ }
24
+ .pc-info-block__left, .pc-info-block__right {
25
+ padding-right: 0;
26
+ }
27
+ }
61
28
  @media (max-width: 577px) {
62
- .pc-info-block__content {
29
+ .pc-info-block__container {
63
30
  padding: 64px 32px;
64
31
  }
65
- .pc-info-block__buttons {
66
- margin-bottom: 64px;
67
- }
68
32
  }
package/build/cjs/blocks/Info/Info.js CHANGED
@@ -5,24 +5,32 @@ const tslib_1 = require("tslib");
5
5
  const react_1 = (0, tslib_1.__importStar)(require("react"));
6
6
  const utils_1 = require("../../utils");
7
7
  const grid_1 = require("../../grid");
8
- const Button_1 = (0, tslib_1.__importDefault)(require("../../components/Button/Button"));
9
- const Link_1 = (0, tslib_1.__importDefault)(require("../../components/Link/Link"));
10
8
  const ThemeValueContext_1 = require("../../context/theme/ThemeValueContext");
9
+ const Content_1 = (0, tslib_1.__importDefault)(require("../../sub-blocks/Content/Content"));
11
10
  const b = (0, utils_1.block)('info-block');
11
+ const sizes = { md: 6, all: 12 };
12
12
  const InfoBlock = (props) => {
13
- const { backgroundColor, theme: textTheme = 'dark', buttons, title, sectionsTitle, links, } = props;
13
+ const { backgroundColor, theme: blockTheme = 'dark', buttons = [], title, sectionsTitle, links = [], rightContent = {}, leftContent = {}, } = props;
14
14
  const { themeValue: theme } = (0, react_1.useContext)(ThemeValueContext_1.ThemeValueContext);
15
- return (react_1.default.createElement("div", { className: b({ theme: textTheme }) },
16
- react_1.default.createElement("div", { className: b('content'), style: { backgroundColor: (0, utils_1.getThemedValue)(backgroundColor, theme) } },
15
+ const contentTheme = blockTheme === 'dark' ? 'dark' : 'default';
16
+ const rightLinks = [
17
+ ...((rightContent === null || rightContent === void 0 ? void 0 : rightContent.links) || []),
18
+ ...links.map((link) => (Object.assign(Object.assign({}, link), { arrow: true, theme: 'normal' }))),
19
+ ];
20
+ const leftButtons = [...buttons, ...((leftContent === null || leftContent === void 0 ? void 0 : leftContent.buttons) || [])];
21
+ const commonProps = {
22
+ colSizes: { all: 12, md: 12 },
23
+ className: b('content'),
24
+ theme: contentTheme,
25
+ };
26
+ return (react_1.default.createElement("div", { className: b() },
27
+ react_1.default.createElement("div", { className: b('container'), style: { backgroundColor: (0, utils_1.getThemedValue)(backgroundColor, theme) } },
17
28
  react_1.default.createElement(grid_1.Grid, null,
18
29
  react_1.default.createElement(grid_1.Row, null,
19
- react_1.default.createElement(grid_1.Col, { sizes: { lg: 4, sm: 6, all: 12 } },
20
- react_1.default.createElement("h2", { className: b('content-title') }, title),
21
- buttons && (react_1.default.createElement("div", { className: b('buttons') }, buttons.map((button, index) => (react_1.default.createElement(Button_1.default, Object.assign({ key: index, className: b('button'), size: "xl" }, button))))))),
22
- react_1.default.createElement(grid_1.Col, { sizes: { lg: 4, sm: 6, all: 12 }, offsets: { lg: 2, md: 0 } },
23
- react_1.default.createElement("h2", { className: b('sections-title') }, sectionsTitle),
24
- react_1.default.createElement("div", { className: b('links') }, links &&
25
- links.map((link, index) => (react_1.default.createElement(Link_1.default, Object.assign({}, link, { key: index, className: b('link'), colorTheme: textTheme, theme: 'normal', arrow: true })))))))))));
30
+ react_1.default.createElement(grid_1.Col, { sizes: sizes, className: b('left') },
31
+ react_1.default.createElement(Content_1.default, Object.assign({ title: title || (leftContent === null || leftContent === void 0 ? void 0 : leftContent.title), text: leftContent === null || leftContent === void 0 ? void 0 : leftContent.text, links: leftContent === null || leftContent === void 0 ? void 0 : leftContent.links, buttons: leftButtons, additionalInfo: leftContent === null || leftContent === void 0 ? void 0 : leftContent.additionalInfo }, commonProps))),
32
+ react_1.default.createElement(grid_1.Col, { sizes: sizes, className: b('right') },
33
+ react_1.default.createElement(Content_1.default, Object.assign({ title: sectionsTitle || (rightContent === null || rightContent === void 0 ? void 0 : rightContent.title), text: rightContent === null || rightContent === void 0 ? void 0 : rightContent.text, links: rightLinks, buttons: rightContent === null || rightContent === void 0 ? void 0 : rightContent.buttons, additionalInfo: rightContent === null || rightContent === void 0 ? void 0 : rightContent.additionalInfo }, commonProps))))))));
26
34
  };
27
35
  exports.InfoBlock = InfoBlock;
28
36
  exports.default = exports.InfoBlock;
package/build/cjs/blocks/Info/schema.d.ts CHANGED
@@ -45,6 +45,136 @@ export declare const InfoBlock: {
45
45
  };
46
46
  };
47
47
  };
48
+ leftContent: {
49
+ additionalProperties: boolean;
50
+ properties: Partial<{
51
+ title: {
52
+ oneOf: ({
53
+ type: string;
54
+ additionalProperties: boolean;
55
+ required: string[];
56
+ properties: {
57
+ text: {
58
+ type: string;
59
+ };
60
+ textSize: {
61
+ type: string;
62
+ enum: string[];
63
+ };
64
+ url: {
65
+ type: string;
66
+ };
67
+ resetMargin: {
68
+ type: string;
69
+ };
70
+ };
71
+ } | {
72
+ type: string;
73
+ })[];
74
+ };
75
+ text: {
76
+ type: string;
77
+ };
78
+ additionalInfo: {
79
+ type: string;
80
+ };
81
+ size: {
82
+ type: string;
83
+ enum: string[];
84
+ };
85
+ links: {
86
+ type: string;
87
+ items: {
88
+ type: string;
89
+ properties: {
90
+ when: {
91
+ type: string;
92
+ };
93
+ };
94
+ };
95
+ };
96
+ buttons: {
97
+ type: string;
98
+ items: {
99
+ type: string;
100
+ properties: {
101
+ when: {
102
+ type: string;
103
+ };
104
+ };
105
+ };
106
+ };
107
+ theme: {
108
+ type: string;
109
+ enum: string[];
110
+ };
111
+ }>;
112
+ };
113
+ rightContent: {
114
+ additionalProperties: boolean;
115
+ properties: Partial<{
116
+ title: {
117
+ oneOf: ({
118
+ type: string;
119
+ additionalProperties: boolean;
120
+ required: string[];
121
+ properties: {
122
+ text: {
123
+ type: string;
124
+ };
125
+ textSize: {
126
+ type: string;
127
+ enum: string[];
128
+ };
129
+ url: {
130
+ type: string;
131
+ };
132
+ resetMargin: {
133
+ type: string;
134
+ };
135
+ };
136
+ } | {
137
+ type: string;
138
+ })[];
139
+ };
140
+ text: {
141
+ type: string;
142
+ };
143
+ additionalInfo: {
144
+ type: string;
145
+ };
146
+ size: {
147
+ type: string;
148
+ enum: string[];
149
+ };
150
+ links: {
151
+ type: string;
152
+ items: {
153
+ type: string;
154
+ properties: {
155
+ when: {
156
+ type: string;
157
+ };
158
+ };
159
+ };
160
+ };
161
+ buttons: {
162
+ type: string;
163
+ items: {
164
+ type: string;
165
+ properties: {
166
+ when: {
167
+ type: string;
168
+ };
169
+ };
170
+ };
171
+ };
172
+ theme: {
173
+ type: string;
174
+ enum: string[];
175
+ };
176
+ }>;
177
+ };
48
178
  type: {};
49
179
  when: {};
50
180
  };
package/build/cjs/blocks/Info/schema.js CHANGED
@@ -1,8 +1,15 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.InfoBlock = void 0;
4
+ const tslib_1 = require("tslib");
5
+ const lodash_1 = (0, tslib_1.__importDefault)(require("lodash"));
4
6
  const utils_1 = require("../../schema/validators/utils");
5
7
  const common_1 = require("../../schema/validators/common");
8
+ const schema_1 = require("../../sub-blocks/Content/schema");
9
+ const ContentProps = {
10
+ additionalProperties: false,
11
+ properties: lodash_1.default.omit(schema_1.ContentBase, ['size', 'colSizes', 'theme']),
12
+ };
6
13
  exports.InfoBlock = {
7
14
  'info-block': {
8
15
  additionalProperties: false,
@@ -13,6 +20,6 @@ exports.InfoBlock = {
13
20
  type: 'string',
14
21
  }), sectionsTitle: {
15
22
  type: 'string',
16
- }, buttons: (0, utils_1.filteredArray)(common_1.ButtonBlock), theme: common_1.ThemeProps, links: (0, utils_1.filteredArray)(common_1.LinkProps) }),
23
+ }, buttons: (0, utils_1.filteredArray)(common_1.ButtonBlock), theme: common_1.ThemeProps, links: (0, utils_1.filteredArray)(common_1.LinkProps), leftContent: ContentProps, rightContent: ContentProps }),
17
24
  },
18
25
  };
package/build/cjs/containers/PageConstructor/PageConstructor.css CHANGED
@@ -51,13 +51,21 @@ unpredictable css rules order in build */
51
51
  .yfm_constructor.yfm_constructor_notice p {
52
52
  color: var(--yc-color-text-secondary);
53
53
  }
54
- .yfm_constructor.yfm_constructor p,
55
- .yfm_constructor.yfm_constructor li {
54
+ .yfm_constructor.yfm_constructor ul,
55
+ .yfm_constructor.yfm_constructor ol,
56
+ .yfm_constructor.yfm_constructor li,
57
+ .yfm_constructor.yfm_constructor p {
56
58
  margin: 0 0 12px;
57
59
  }
58
60
  .yfm_constructor.yfm_constructor p strong {
59
61
  font-weight: 500;
60
62
  }
63
+ .yfm_constructor.yfm_constructor_size_s ul,
64
+ .yfm_constructor.yfm_constructor_size_s ol,
65
+ .yfm_constructor.yfm_constructor_size_s li,
66
+ .yfm_constructor.yfm_constructor_size_s p {
67
+ margin-bottom: 8px;
68
+ }
61
69
 
62
70
  .yfm_constructor_theme_dark p {
63
71
  color: var(--yc-color-text-light-primary);
@@ -109,13 +117,17 @@ unpredictable css rules order in build */
109
117
  background-color: var(--yc-color-base-generic);
110
118
  }
111
119
 
120
+ .yfm_constructor_table {
121
+ /* stylelint-enable declaration-no-important */
122
+ }
112
123
  .yfm_constructor_table table {
113
124
  border: 0;
114
125
  table-layout: fixed;
115
126
  }
116
127
  .yfm_constructor_table thead,
117
128
  .yfm_constructor_table tr {
118
- background-color: transparent !important; /* stylelint-disable-line declaration-no-important */
129
+ /* stylelint-disable declaration-no-important */
130
+ background-color: transparent !important;
119
131
  }
120
132
  .yfm_constructor_table tbody tr {
121
133
  border-top: 1px solid var(--yc-color-line-generic);
@@ -125,7 +137,7 @@ unpredictable css rules order in build */
125
137
  min-width: 120px;
126
138
  width: 120px;
127
139
  box-sizing: content-box;
128
- white-space: inherit !important; /* stylelint-disable-line declaration-no-important */
140
+ white-space: inherit !important;
129
141
  }
130
142
  .yfm_constructor_table td:first-child,
131
143
  .yfm_constructor_table th:first-child {
@@ -133,7 +145,7 @@ unpredictable css rules order in build */
133
145
  width: 172px;
134
146
  }
135
147
  .yfm_constructor_table th {
136
- text-align: left !important; /* stylelint-disable-line declaration-no-important */
148
+ text-align: left !important;
137
149
  }
138
150
 
139
151
  .pc-page-constructor {
package/build/cjs/models/constructor-items/blocks.d.ts CHANGED
@@ -187,10 +187,16 @@ export interface PreviewBlockProps extends Animatable {
187
187
  export interface InfoBlockProps {
188
188
  theme?: TextTheme;
189
189
  backgroundColor?: ThemeSupporting<string>;
190
- title: string;
190
+ /** @deprecated **/
191
+ title?: string;
192
+ /** @deprecated **/
191
193
  buttons?: Pick<ButtonProps, 'url' | 'text' | 'theme'>[];
192
- sectionsTitle: string;
194
+ /** @deprecated **/
195
+ sectionsTitle?: string;
196
+ /** @deprecated **/
193
197
  links?: Pick<LinkProps, 'text' | 'url'>[];
198
+ leftContent?: Omit<ContentBlockProps, 'colSizes' | 'theme' | 'size'>;
199
+ rightContent?: Omit<ContentBlockProps, 'colSizes' | 'theme' | 'size'>;
194
200
  }
195
201
  export interface SecurityBlockPoint {
196
202
  img: string;
package/build/cjs/sub-blocks/Content/Content.css CHANGED
@@ -1,6 +1,5 @@
1
1
  .pc-content_size_l .pc-content__text .yfm,
2
- .pc-content_size_l .pc-content__notice .yfm,
3
- .pc-content_size_l .pc-content__notice .yfm > * {
2
+ .pc-content_size_l .pc-content__notice .yfm {
4
3
  margin: 0;
5
4
  }
6
5
 
@@ -22,17 +21,13 @@ unpredictable css rules order in build */
22
21
  .pc-content__notice.pc-content__notice .yfm a:hover {
23
22
  color: var(--yc-color-text-primary);
24
23
  }
25
- .pc-content__notice.pc-content__notice ol,
26
- .pc-content__notice.pc-content__notice ul {
27
- padding-left: 25px;
28
- }
29
24
 
30
25
  .pc-content__button {
31
26
  margin-top: 0;
32
27
  margin-right: 12px;
33
28
  }
34
29
  .pc-content__link {
35
- display: inline-block;
30
+ display: block;
36
31
  margin-right: 32px;
37
32
  }
38
33
  .pc-content_centered.pc-content_centered {
@@ -43,6 +38,12 @@ unpredictable css rules order in build */
43
38
  .pc-content_centered .pc-content__link a {
44
39
  justify-content: center;
45
40
  }
41
+ .pc-content_centered .pc-content__notice .yfm ul,
42
+ .pc-content_centered .pc-content__notice .yfm ol,
43
+ .pc-content_centered .pc-content__text .yfm ul,
44
+ .pc-content_centered .pc-content__text .yfm ol {
45
+ text-align: left;
46
+ }
46
47
  .pc-content_size_s .pc-content__text,
47
48
  .pc-content_size_s .pc-content__notice {
48
49
  margin-top: 8px;
@@ -64,8 +65,7 @@ unpredictable css rules order in build */
64
65
  margin-top: 0;
65
66
  }
66
67
  .pc-content_size_l .pc-content__text .yfm,
67
- .pc-content_size_l .pc-content__notice .yfm,
68
- .pc-content_size_l .pc-content__notice .yfm > * {
68
+ .pc-content_size_l .pc-content__notice .yfm {
69
69
  font-size: var(--yc-text-body-3-font-size);
70
70
  line-height: var(--yc-text-body-3-line-height);
71
71
  }
@@ -102,6 +102,7 @@ unpredictable css rules order in build */
102
102
  .pc-content_theme_dark .pc-content__title a {
103
103
  color: var(--yc-color-text-light-primary);
104
104
  text-decoration: underline;
105
+ text-decoration: none;
105
106
  }
106
107
  .pc-content_theme_dark .pc-content__title a:hover {
107
108
  color: var(--yc-color-text-light-secondary);
@@ -133,6 +134,7 @@ unpredictable css rules order in build */
133
134
  .pc-content_theme_light .pc-content__title a {
134
135
  color: var(--yc-color-text-dark-primary);
135
136
  text-decoration: underline;
137
+ text-decoration: none;
136
138
  }
137
139
  .pc-content_theme_light .pc-content__title a:hover {
138
140
  color: var(--yc-color-text-dark-secondary);
package/build/cjs/sub-blocks/Content/Content.js CHANGED
@@ -43,9 +43,13 @@ const Content = (props) => {
43
43
  return (react_1.default.createElement(grid_1.Col, { className: b({ size, centered, theme }, className), reset: true, sizes: colSizes },
44
44
  title && react_1.default.createElement(components_1.Title, Object.assign({ className: b('title') }, titleProps, { resetMargin: true })),
45
45
  text && (react_1.default.createElement("div", { className: b('text', { ['without-title']: !hasTitle }) },
46
- react_1.default.createElement(components_1.YFMWrapper, { content: text, modifiers: { constructor: true } }))),
46
+ react_1.default.createElement(components_1.YFMWrapper, { content: text, modifiers: { constructor: true, [`constructor-size-${size}`]: true } }))),
47
47
  additionalInfo && (react_1.default.createElement("div", { className: b('notice') },
48
- react_1.default.createElement(components_1.YFMWrapper, { content: additionalInfo, modifiers: { constructor: true, 'constructor-notice': true } }))),
48
+ react_1.default.createElement(components_1.YFMWrapper, { content: additionalInfo, modifiers: {
49
+ constructor: true,
50
+ 'constructor-notice': true,
51
+ [`constructor-size-${size}`]: true,
52
+ } }))),
49
53
  links && (react_1.default.createElement("div", { className: b('links') }, links.map((link) => (react_1.default.createElement(Link_1.default, Object.assign({ className: b('link') }, link, { textSize: getLinkSize(size), key: link.url })))))),
50
54
  buttons && (react_1.default.createElement("div", { className: b('buttons') }, buttons.map((item) => (react_1.default.createElement(components_1.Button, Object.assign({ className: b('button') }, item, { key: item.url, size: getButtonSize(size) }))))))));
51
55
  };
package/build/cjs/text-transform/blocks.js CHANGED
@@ -302,6 +302,18 @@ const config = {
302
302
  transformer: yfmTransformer,
303
303
  },
304
304
  ],
305
+ [models_1.BlockType.InfoBlock]: [
306
+ {
307
+ fields: ['rightContent', 'leftContent'],
308
+ transformer: yfmTransformer,
309
+ parser: parseContentLayout,
310
+ },
311
+ {
312
+ fields: ['rightContent', 'leftContent'],
313
+ transformer: typografTransformer,
314
+ parser: parseContentLayoutTitle,
315
+ },
316
+ ],
305
317
  };
306
318
  function addRandomOrder(block) {
307
319
  if (block) {
package/build/esm/blocks/Info/Info.css CHANGED
@@ -1,68 +1,32 @@
1
- .pc-info-block__content-title, .pc-info-block__sections-title {
2
- margin: 0;
3
- }
4
-
5
1
  /* use this for style redefinitions to awoid problems with
6
2
  unpredictable css rules order in build */
7
- .pc-info-block_theme_dark {
8
- color: var(--yc-color-text-light-primary);
9
- }
10
- .pc-info-block_theme_dark h1,
11
- .pc-info-block_theme_dark h2,
12
- .pc-info-block_theme_dark h3,
13
- .pc-info-block_theme_dark h4,
14
- .pc-info-block_theme_dark h5,
15
- .pc-info-block_theme_dark h6,
16
- .pc-info-block_theme_dark .yfm {
17
- color: var(--yc-color-text-light-primary);
18
- }
19
- .pc-info-block__content-title, .pc-info-block__sections-title {
20
- font-size: var(--yc-text-display-2-font-size);
21
- line-height: var(--yc-text-display-2-line-height);
22
- color: var(--pc-text-header-color);
23
- font-weight: var(--yc-text-accent-font-weight);
24
- }
25
- @media (max-width: 576px) {
26
- .pc-info-block__content-title, .pc-info-block__sections-title {
27
- font-size: var(--yc-text-display-1-font-size);
28
- line-height: var(--yc-text-display-1-line-height);
29
- }
30
- }
31
- .pc-info-block__content {
3
+ .pc-info-block__container {
32
4
  background-color: var(--yc-color-base-special);
33
- padding: 96px 64px 128px;
5
+ padding: 96px 64px;
34
6
  border-radius: var(--pc-border-radius);
35
7
  }
36
- .pc-info-block__buttons {
37
- margin-top: 16px;
38
- }
39
- .pc-info-block__button {
40
- margin-top: 16px;
41
- }
42
- .pc-info-block__button:not(:last-child) {
43
- margin-right: 16px;
44
- }
45
- .pc-info-block__links {
46
- font-size: var(--yc-text-body-2-font-size);
47
- line-height: var(--yc-text-body-2-line-height);
48
- margin-top: 20px;
49
- }
50
- .pc-info-block__link {
51
- margin-top: 0;
52
- }
53
- .pc-info-block__link + .pc-info-block__link {
54
- margin-top: 12px;
8
+ .pc-info-block__left, .pc-info-block__right {
9
+ padding-right: 96px;
10
+ padding-bottom: 16px;
55
11
  }
56
12
  @media (max-width: 1081px) {
57
- .pc-info-block__content {
13
+ .pc-info-block__left, .pc-info-block__right {
14
+ padding-bottom: 0;
15
+ }
16
+ .pc-info-block__container {
58
17
  padding: 96px 64px;
59
18
  }
60
19
  }
20
+ @media (max-width: 769px) {
21
+ .pc-info-block__left {
22
+ margin-bottom: 48px;
23
+ }
24
+ .pc-info-block__left, .pc-info-block__right {
25
+ padding-right: 0;
26
+ }
27
+ }
61
28
  @media (max-width: 577px) {
62
- .pc-info-block__content {
29
+ .pc-info-block__container {
63
30
  padding: 64px 32px;
64
31
  }
65
- .pc-info-block__buttons {
66
- margin-bottom: 64px;
67
- }
68
32
  }
package/build/esm/blocks/Info/Info.js CHANGED
@@ -1,24 +1,32 @@
1
1
  import React, { useContext } from 'react';
2
2
  import { block, getThemedValue } from '../../utils';
3
3
  import { Grid, Row, Col } from '../../grid';
4
- import Button from '../../components/Button/Button';
5
- import Link from '../../components/Link/Link';
6
4
  import { ThemeValueContext } from '../../context/theme/ThemeValueContext';
5
+ import Content from '../../sub-blocks/Content/Content';
7
6
  import './Info.css';
8
7
  const b = block('info-block');
8
+ const sizes = { md: 6, all: 12 };
9
9
  export const InfoBlock = (props) => {
10
- const { backgroundColor, theme: textTheme = 'dark', buttons, title, sectionsTitle, links, } = props;
10
+ const { backgroundColor, theme: blockTheme = 'dark', buttons = [], title, sectionsTitle, links = [], rightContent = {}, leftContent = {}, } = props;
11
11
  const { themeValue: theme } = useContext(ThemeValueContext);
12
- return (React.createElement("div", { className: b({ theme: textTheme }) },
13
- React.createElement("div", { className: b('content'), style: { backgroundColor: getThemedValue(backgroundColor, theme) } },
12
+ const contentTheme = blockTheme === 'dark' ? 'dark' : 'default';
13
+ const rightLinks = [
14
+ ...((rightContent === null || rightContent === void 0 ? void 0 : rightContent.links) || []),
15
+ ...links.map((link) => (Object.assign(Object.assign({}, link), { arrow: true, theme: 'normal' }))),
16
+ ];
17
+ const leftButtons = [...buttons, ...((leftContent === null || leftContent === void 0 ? void 0 : leftContent.buttons) || [])];
18
+ const commonProps = {
19
+ colSizes: { all: 12, md: 12 },
20
+ className: b('content'),
21
+ theme: contentTheme,
22
+ };
23
+ return (React.createElement("div", { className: b() },
24
+ React.createElement("div", { className: b('container'), style: { backgroundColor: getThemedValue(backgroundColor, theme) } },
14
25
  React.createElement(Grid, null,
15
26
  React.createElement(Row, null,
16
- React.createElement(Col, { sizes: { lg: 4, sm: 6, all: 12 } },
17
- React.createElement("h2", { className: b('content-title') }, title),
18
- buttons && (React.createElement("div", { className: b('buttons') }, buttons.map((button, index) => (React.createElement(Button, Object.assign({ key: index, className: b('button'), size: "xl" }, button))))))),
19
- React.createElement(Col, { sizes: { lg: 4, sm: 6, all: 12 }, offsets: { lg: 2, md: 0 } },
20
- React.createElement("h2", { className: b('sections-title') }, sectionsTitle),
21
- React.createElement("div", { className: b('links') }, links &&
22
- links.map((link, index) => (React.createElement(Link, Object.assign({}, link, { key: index, className: b('link'), colorTheme: textTheme, theme: 'normal', arrow: true })))))))))));
27
+ React.createElement(Col, { sizes: sizes, className: b('left') },
28
+ React.createElement(Content, Object.assign({ title: title || (leftContent === null || leftContent === void 0 ? void 0 : leftContent.title), text: leftContent === null || leftContent === void 0 ? void 0 : leftContent.text, links: leftContent === null || leftContent === void 0 ? void 0 : leftContent.links, buttons: leftButtons, additionalInfo: leftContent === null || leftContent === void 0 ? void 0 : leftContent.additionalInfo }, commonProps))),
29
+ React.createElement(Col, { sizes: sizes, className: b('right') },
30
+ React.createElement(Content, Object.assign({ title: sectionsTitle || (rightContent === null || rightContent === void 0 ? void 0 : rightContent.title), text: rightContent === null || rightContent === void 0 ? void 0 : rightContent.text, links: rightLinks, buttons: rightContent === null || rightContent === void 0 ? void 0 : rightContent.buttons, additionalInfo: rightContent === null || rightContent === void 0 ? void 0 : rightContent.additionalInfo }, commonProps))))))));
23
31
  };
24
32
  export default InfoBlock;
package/build/esm/blocks/Info/schema.d.ts CHANGED
@@ -45,6 +45,136 @@ export declare const InfoBlock: {
45
45
  };
46
46
  };
47
47
  };
48
+ leftContent: {
49
+ additionalProperties: boolean;
50
+ properties: Partial<{
51
+ title: {
52
+ oneOf: ({
53
+ type: string;
54
+ additionalProperties: boolean;
55
+ required: string[];
56
+ properties: {
57
+ text: {
58
+ type: string;
59
+ };
60
+ textSize: {
61
+ type: string;
62
+ enum: string[];
63
+ };
64
+ url: {
65
+ type: string;
66
+ };
67
+ resetMargin: {
68
+ type: string;
69
+ };
70
+ };
71
+ } | {
72
+ type: string;
73
+ })[];
74
+ };
75
+ text: {
76
+ type: string;
77
+ };
78
+ additionalInfo: {
79
+ type: string;
80
+ };
81
+ size: {
82
+ type: string;
83
+ enum: string[];
84
+ };
85
+ links: {
86
+ type: string;
87
+ items: {
88
+ type: string;
89
+ properties: {
90
+ when: {
91
+ type: string;
92
+ };
93
+ };
94
+ };
95
+ };
96
+ buttons: {
97
+ type: string;
98
+ items: {
99
+ type: string;
100
+ properties: {
101
+ when: {
102
+ type: string;
103
+ };
104
+ };
105
+ };
106
+ };
107
+ theme: {
108
+ type: string;
109
+ enum: string[];
110
+ };
111
+ }>;
112
+ };
113
+ rightContent: {
114
+ additionalProperties: boolean;
115
+ properties: Partial<{
116
+ title: {
117
+ oneOf: ({
118
+ type: string;
119
+ additionalProperties: boolean;
120
+ required: string[];
121
+ properties: {
122
+ text: {
123
+ type: string;
124
+ };
125
+ textSize: {
126
+ type: string;
127
+ enum: string[];
128
+ };
129
+ url: {
130
+ type: string;
131
+ };
132
+ resetMargin: {
133
+ type: string;
134
+ };
135
+ };
136
+ } | {
137
+ type: string;
138
+ })[];
139
+ };
140
+ text: {
141
+ type: string;
142
+ };
143
+ additionalInfo: {
144
+ type: string;
145
+ };
146
+ size: {
147
+ type: string;
148
+ enum: string[];
149
+ };
150
+ links: {
151
+ type: string;
152
+ items: {
153
+ type: string;
154
+ properties: {
155
+ when: {
156
+ type: string;
157
+ };
158
+ };
159
+ };
160
+ };
161
+ buttons: {
162
+ type: string;
163
+ items: {
164
+ type: string;
165
+ properties: {
166
+ when: {
167
+ type: string;
168
+ };
169
+ };
170
+ };
171
+ };
172
+ theme: {
173
+ type: string;
174
+ enum: string[];
175
+ };
176
+ }>;
177
+ };
48
178
  type: {};
49
179
  when: {};
50
180
  };
package/build/esm/blocks/Info/schema.js CHANGED
@@ -1,5 +1,11 @@
1
+ import _ from 'lodash';
1
2
  import { filteredArray } from '../../schema/validators/utils';
2
3
  import { BaseProps, LinkProps, ThemeProps, withTheme, ButtonBlock, } from '../../schema/validators/common';
4
+ import { ContentBase } from '../../sub-blocks/Content/schema';
5
+ const ContentProps = {
6
+ additionalProperties: false,
7
+ properties: _.omit(ContentBase, ['size', 'colSizes', 'theme']),
8
+ };
3
9
  export const InfoBlock = {
4
10
  'info-block': {
5
11
  additionalProperties: false,
@@ -10,6 +16,6 @@ export const InfoBlock = {
10
16
  type: 'string',
11
17
  }), sectionsTitle: {
12
18
  type: 'string',
13
- }, buttons: filteredArray(ButtonBlock), theme: ThemeProps, links: filteredArray(LinkProps) }),
19
+ }, buttons: filteredArray(ButtonBlock), theme: ThemeProps, links: filteredArray(LinkProps), leftContent: ContentProps, rightContent: ContentProps }),
14
20
  },
15
21
  };
package/build/esm/containers/PageConstructor/PageConstructor.css CHANGED
@@ -51,13 +51,21 @@ unpredictable css rules order in build */
51
51
  .yfm_constructor.yfm_constructor_notice p {
52
52
  color: var(--yc-color-text-secondary);
53
53
  }
54
- .yfm_constructor.yfm_constructor p,
55
- .yfm_constructor.yfm_constructor li {
54
+ .yfm_constructor.yfm_constructor ul,
55
+ .yfm_constructor.yfm_constructor ol,
56
+ .yfm_constructor.yfm_constructor li,
57
+ .yfm_constructor.yfm_constructor p {
56
58
  margin: 0 0 12px;
57
59
  }
58
60
  .yfm_constructor.yfm_constructor p strong {
59
61
  font-weight: 500;
60
62
  }
63
+ .yfm_constructor.yfm_constructor_size_s ul,
64
+ .yfm_constructor.yfm_constructor_size_s ol,
65
+ .yfm_constructor.yfm_constructor_size_s li,
66
+ .yfm_constructor.yfm_constructor_size_s p {
67
+ margin-bottom: 8px;
68
+ }
61
69
 
62
70
  .yfm_constructor_theme_dark p {
63
71
  color: var(--yc-color-text-light-primary);
@@ -109,13 +117,17 @@ unpredictable css rules order in build */
109
117
  background-color: var(--yc-color-base-generic);
110
118
  }
111
119
 
120
+ .yfm_constructor_table {
121
+ /* stylelint-enable declaration-no-important */
122
+ }
112
123
  .yfm_constructor_table table {
113
124
  border: 0;
114
125
  table-layout: fixed;
115
126
  }
116
127
  .yfm_constructor_table thead,
117
128
  .yfm_constructor_table tr {
118
- background-color: transparent !important; /* stylelint-disable-line declaration-no-important */
129
+ /* stylelint-disable declaration-no-important */
130
+ background-color: transparent !important;
119
131
  }
120
132
  .yfm_constructor_table tbody tr {
121
133
  border-top: 1px solid var(--yc-color-line-generic);
@@ -125,7 +137,7 @@ unpredictable css rules order in build */
125
137
  min-width: 120px;
126
138
  width: 120px;
127
139
  box-sizing: content-box;
128
- white-space: inherit !important; /* stylelint-disable-line declaration-no-important */
140
+ white-space: inherit !important;
129
141
  }
130
142
  .yfm_constructor_table td:first-child,
131
143
  .yfm_constructor_table th:first-child {
@@ -133,7 +145,7 @@ unpredictable css rules order in build */
133
145
  width: 172px;
134
146
  }
135
147
  .yfm_constructor_table th {
136
- text-align: left !important; /* stylelint-disable-line declaration-no-important */
148
+ text-align: left !important;
137
149
  }
138
150
 
139
151
  .pc-page-constructor {
package/build/esm/models/constructor-items/blocks.d.ts CHANGED
@@ -187,10 +187,16 @@ export interface PreviewBlockProps extends Animatable {
187
187
  export interface InfoBlockProps {
188
188
  theme?: TextTheme;
189
189
  backgroundColor?: ThemeSupporting<string>;
190
- title: string;
190
+ /** @deprecated **/
191
+ title?: string;
192
+ /** @deprecated **/
191
193
  buttons?: Pick<ButtonProps, 'url' | 'text' | 'theme'>[];
192
- sectionsTitle: string;
194
+ /** @deprecated **/
195
+ sectionsTitle?: string;
196
+ /** @deprecated **/
193
197
  links?: Pick<LinkProps, 'text' | 'url'>[];
198
+ leftContent?: Omit<ContentBlockProps, 'colSizes' | 'theme' | 'size'>;
199
+ rightContent?: Omit<ContentBlockProps, 'colSizes' | 'theme' | 'size'>;
194
200
  }
195
201
  export interface SecurityBlockPoint {
196
202
  img: string;
package/build/esm/sub-blocks/Content/Content.css CHANGED
@@ -1,6 +1,5 @@
1
1
  .pc-content_size_l .pc-content__text .yfm,
2
- .pc-content_size_l .pc-content__notice .yfm,
3
- .pc-content_size_l .pc-content__notice .yfm > * {
2
+ .pc-content_size_l .pc-content__notice .yfm {
4
3
  margin: 0;
5
4
  }
6
5
 
@@ -22,17 +21,13 @@ unpredictable css rules order in build */
22
21
  .pc-content__notice.pc-content__notice .yfm a:hover {
23
22
  color: var(--yc-color-text-primary);
24
23
  }
25
- .pc-content__notice.pc-content__notice ol,
26
- .pc-content__notice.pc-content__notice ul {
27
- padding-left: 25px;
28
- }
29
24
 
30
25
  .pc-content__button {
31
26
  margin-top: 0;
32
27
  margin-right: 12px;
33
28
  }
34
29
  .pc-content__link {
35
- display: inline-block;
30
+ display: block;
36
31
  margin-right: 32px;
37
32
  }
38
33
  .pc-content_centered.pc-content_centered {
@@ -43,6 +38,12 @@ unpredictable css rules order in build */
43
38
  .pc-content_centered .pc-content__link a {
44
39
  justify-content: center;
45
40
  }
41
+ .pc-content_centered .pc-content__notice .yfm ul,
42
+ .pc-content_centered .pc-content__notice .yfm ol,
43
+ .pc-content_centered .pc-content__text .yfm ul,
44
+ .pc-content_centered .pc-content__text .yfm ol {
45
+ text-align: left;
46
+ }
46
47
  .pc-content_size_s .pc-content__text,
47
48
  .pc-content_size_s .pc-content__notice {
48
49
  margin-top: 8px;
@@ -64,8 +65,7 @@ unpredictable css rules order in build */
64
65
  margin-top: 0;
65
66
  }
66
67
  .pc-content_size_l .pc-content__text .yfm,
67
- .pc-content_size_l .pc-content__notice .yfm,
68
- .pc-content_size_l .pc-content__notice .yfm > * {
68
+ .pc-content_size_l .pc-content__notice .yfm {
69
69
  font-size: var(--yc-text-body-3-font-size);
70
70
  line-height: var(--yc-text-body-3-line-height);
71
71
  }
@@ -102,6 +102,7 @@ unpredictable css rules order in build */
102
102
  .pc-content_theme_dark .pc-content__title a {
103
103
  color: var(--yc-color-text-light-primary);
104
104
  text-decoration: underline;
105
+ text-decoration: none;
105
106
  }
106
107
  .pc-content_theme_dark .pc-content__title a:hover {
107
108
  color: var(--yc-color-text-light-secondary);
@@ -133,6 +134,7 @@ unpredictable css rules order in build */
133
134
  .pc-content_theme_light .pc-content__title a {
134
135
  color: var(--yc-color-text-dark-primary);
135
136
  text-decoration: underline;
137
+ text-decoration: none;
136
138
  }
137
139
  .pc-content_theme_light .pc-content__title a:hover {
138
140
  color: var(--yc-color-text-dark-secondary);
package/build/esm/sub-blocks/Content/Content.js CHANGED
@@ -42,9 +42,13 @@ const Content = (props) => {
42
42
  return (React.createElement(Col, { className: b({ size, centered, theme }, className), reset: true, sizes: colSizes },
43
43
  title && React.createElement(Title, Object.assign({ className: b('title') }, titleProps, { resetMargin: true })),
44
44
  text && (React.createElement("div", { className: b('text', { ['without-title']: !hasTitle }) },
45
- React.createElement(YFMWrapper, { content: text, modifiers: { constructor: true } }))),
45
+ React.createElement(YFMWrapper, { content: text, modifiers: { constructor: true, [`constructor-size-${size}`]: true } }))),
46
46
  additionalInfo && (React.createElement("div", { className: b('notice') },
47
- React.createElement(YFMWrapper, { content: additionalInfo, modifiers: { constructor: true, 'constructor-notice': true } }))),
47
+ React.createElement(YFMWrapper, { content: additionalInfo, modifiers: {
48
+ constructor: true,
49
+ 'constructor-notice': true,
50
+ [`constructor-size-${size}`]: true,
51
+ } }))),
48
52
  links && (React.createElement("div", { className: b('links') }, links.map((link) => (React.createElement(LinkBlock, Object.assign({ className: b('link') }, link, { textSize: getLinkSize(size), key: link.url })))))),
49
53
  buttons && (React.createElement("div", { className: b('buttons') }, buttons.map((item) => (React.createElement(Button, Object.assign({ className: b('button') }, item, { key: item.url, size: getButtonSize(size) }))))))));
50
54
  };
package/build/esm/text-transform/blocks.js CHANGED
@@ -296,6 +296,18 @@ const config = {
296
296
  transformer: yfmTransformer,
297
297
  },
298
298
  ],
299
+ [BlockType.InfoBlock]: [
300
+ {
301
+ fields: ['rightContent', 'leftContent'],
302
+ transformer: yfmTransformer,
303
+ parser: parseContentLayout,
304
+ },
305
+ {
306
+ fields: ['rightContent', 'leftContent'],
307
+ transformer: typografTransformer,
308
+ parser: parseContentLayoutTitle,
309
+ },
310
+ ],
299
311
  };
300
312
  function addRandomOrder(block) {
301
313
  if (block) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gravity-ui/page-constructor",
3
- "version": "1.1.0",
3
+ "version": "1.2.0-alpha.0",
4
4
  "description": "Gravity UI Page Constructor",
5
5
  "license": "MIT",
6
6
  "repository": {
@@ -121,5 +121,8 @@
121
121
  "*.{json,yaml,yml,md}": [
122
122
  "prettier --write"
123
123
  ]
124
+ },
125
+ "publishConfig": {
126
+ "tag": "alpha"
124
127
  }
125
128
  }
package/server/models/constructor-items/blocks.d.ts CHANGED
@@ -187,10 +187,16 @@ export interface PreviewBlockProps extends Animatable {
187
187
  export interface InfoBlockProps {
188
188
  theme?: TextTheme;
189
189
  backgroundColor?: ThemeSupporting<string>;
190
- title: string;
190
+ /** @deprecated **/
191
+ title?: string;
192
+ /** @deprecated **/
191
193
  buttons?: Pick<ButtonProps, 'url' | 'text' | 'theme'>[];
192
- sectionsTitle: string;
194
+ /** @deprecated **/
195
+ sectionsTitle?: string;
196
+ /** @deprecated **/
193
197
  links?: Pick<LinkProps, 'text' | 'url'>[];
198
+ leftContent?: Omit<ContentBlockProps, 'colSizes' | 'theme' | 'size'>;
199
+ rightContent?: Omit<ContentBlockProps, 'colSizes' | 'theme' | 'size'>;
194
200
  }
195
201
  export interface SecurityBlockPoint {
196
202
  img: string;
package/server/text-transform/blocks.js CHANGED
@@ -315,6 +315,18 @@ const config = {
315
315
  transformer: yfmTransformer,
316
316
  },
317
317
  ],
318
+ [models_1.BlockType.InfoBlock]: [
319
+ {
320
+ fields: ['rightContent', 'leftContent'],
321
+ transformer: yfmTransformer,
322
+ parser: parseContentLayout,
323
+ },
324
+ {
325
+ fields: ['rightContent', 'leftContent'],
326
+ transformer: typografTransformer,
327
+ parser: parseContentLayoutTitle,
328
+ },
329
+ ],
318
330
  };
319
331
  function addRandomOrder(block) {
320
332
  if (block) {
package/styles/styles.css CHANGED
@@ -226,13 +226,21 @@ unpredictable css rules order in build */
226
226
  .yfm_constructor.yfm_constructor_notice p {
227
227
  color: var(--yc-color-text-secondary);
228
228
  }
229
- .yfm_constructor.yfm_constructor p,
230
- .yfm_constructor.yfm_constructor li {
229
+ .yfm_constructor.yfm_constructor ul,
230
+ .yfm_constructor.yfm_constructor ol,
231
+ .yfm_constructor.yfm_constructor li,
232
+ .yfm_constructor.yfm_constructor p {
231
233
  margin: 0 0 12px;
232
234
  }
233
235
  .yfm_constructor.yfm_constructor p strong {
234
236
  font-weight: 500;
235
237
  }
238
+ .yfm_constructor.yfm_constructor_size_s ul,
239
+ .yfm_constructor.yfm_constructor_size_s ol,
240
+ .yfm_constructor.yfm_constructor_size_s li,
241
+ .yfm_constructor.yfm_constructor_size_s p {
242
+ margin-bottom: 8px;
243
+ }
236
244
 
237
245
  .yfm_constructor_theme_dark p {
238
246
  color: var(--yc-color-text-light-primary);
@@ -284,13 +292,17 @@ unpredictable css rules order in build */
284
292
  background-color: var(--yc-color-base-generic);
285
293
  }
286
294
 
295
+ .yfm_constructor_table {
296
+ /* stylelint-enable declaration-no-important */
297
+ }
287
298
  .yfm_constructor_table table {
288
299
  border: 0;
289
300
  table-layout: fixed;
290
301
  }
291
302
  .yfm_constructor_table thead,
292
303
  .yfm_constructor_table tr {
293
- background-color: transparent !important; /* stylelint-disable-line declaration-no-important */
304
+ /* stylelint-disable declaration-no-important */
305
+ background-color: transparent !important;
294
306
  }
295
307
  .yfm_constructor_table tbody tr {
296
308
  border-top: 1px solid var(--yc-color-line-generic);
@@ -300,7 +312,7 @@ unpredictable css rules order in build */
300
312
  min-width: 120px;
301
313
  width: 120px;
302
314
  box-sizing: content-box;
303
- white-space: inherit !important; /* stylelint-disable-line declaration-no-important */
315
+ white-space: inherit !important;
304
316
  }
305
317
  .yfm_constructor_table td:first-child,
306
318
  .yfm_constructor_table th:first-child {
@@ -308,5 +320,5 @@ unpredictable css rules order in build */
308
320
  width: 172px;
309
321
  }
310
322
  .yfm_constructor_table th {
311
- text-align: left !important; /* stylelint-disable-line declaration-no-important */
323
+ text-align: left !important;
312
324
  }
package/styles/yfm.scss CHANGED
@@ -34,14 +34,25 @@
34
34
  }
35
35
  }
36
36
 
37
- p,
38
- li {
37
+ ul,
38
+ ol,
39
+ li,
40
+ p {
39
41
  margin: 0 0 $indentXXS;
40
42
  }
41
43
 
42
44
  p strong {
43
45
  font-weight: 500;
44
46
  }
47
+
48
+ &_size_s {
49
+ ul,
50
+ ol,
51
+ li,
52
+ p {
53
+ margin-bottom: $indentXXXS;
54
+ }
55
+ }
45
56
  }
46
57
 
47
58
  &_theme_dark {
@@ -106,7 +117,8 @@
106
117
 
107
118
  thead,
108
119
  tr {
109
- background-color: transparent !important; /* stylelint-disable-line declaration-no-important */
120
+ /* stylelint-disable declaration-no-important */
121
+ background-color: transparent !important;
110
122
  }
111
123
 
112
124
  tbody tr {
@@ -118,7 +130,7 @@
118
130
  min-width: $columnWidth;
119
131
  width: $columnWidth;
120
132
  box-sizing: content-box;
121
- white-space: inherit !important; /* stylelint-disable-line declaration-no-important */
133
+ white-space: inherit !important;
122
134
 
123
135
  &:first-child {
124
136
  min-width: $firstColumnWidth;
@@ -127,6 +139,7 @@
127
139
  }
128
140
 
129
141
  th {
130
- text-align: left !important; /* stylelint-disable-line declaration-no-important */
142
+ text-align: left !important;
131
143
  }
144
+ /* stylelint-enable declaration-no-important */
132
145
  }