@redocly/theme 0.28.1 → 0.28.2

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 (21) hide show
  1. package/lib/components/CodeBlock/CodeBlockControlButton.js +6 -3
  2. package/lib/components/Feedback/Comment.js +8 -8
  3. package/lib/components/Feedback/Mood.js +4 -4
  4. package/lib/components/Feedback/Rating.js +4 -4
  5. package/lib/components/Feedback/Reasons.js +7 -6
  6. package/lib/components/Feedback/Scale.js +3 -4
  7. package/lib/components/Feedback/Sentiment.js +4 -4
  8. package/lib/components/Tooltip/Tooltip.js +1 -1
  9. package/lib/icons/CopyIcon/CopyIcon.js +3 -3
  10. package/lib/icons/ReportIcon/ReportIcon.js +5 -5
  11. package/package.json +1 -1
  12. package/src/components/CodeBlock/CodeBlockControlButton.tsx +6 -3
  13. package/src/components/Feedback/Comment.tsx +9 -9
  14. package/src/components/Feedback/Mood.tsx +4 -4
  15. package/src/components/Feedback/Rating.tsx +4 -4
  16. package/src/components/Feedback/Reasons.tsx +7 -6
  17. package/src/components/Feedback/Scale.tsx +3 -4
  18. package/src/components/Feedback/Sentiment.tsx +4 -4
  19. package/src/components/Tooltip/Tooltip.tsx +1 -1
  20. package/src/icons/CopyIcon/CopyIcon.tsx +4 -3
  21. package/src/icons/ReportIcon/ReportIcon.tsx +8 -7
package/lib/components/CodeBlock/CodeBlockControlButton.js CHANGED
@@ -28,6 +28,7 @@ const styled_components_1 = __importStar(require("styled-components"));
28
28
  const Button_1 = require("../../components/Button");
29
29
  exports.CodeBlockControlButton = (0, styled_components_1.default)(Button_1.Button) `
30
30
  color: var(--code-block-controls-text-color);
31
+ border: none;
31
32
 
32
33
  ${({ asIcon }) => asIcon
33
34
  ? (0, styled_components_1.css) `
@@ -38,12 +39,14 @@ exports.CodeBlockControlButton = (0, styled_components_1.default)(Button_1.Butto
38
39
  background-color: var(--code-block-text-controls-background-color);
39
40
  `}
40
41
 
41
- ${({ theme }) => { var _a; return (_a = theme.mediaQueries) === null || _a === void 0 ? void 0 : _a.small; }} {
42
- padding: ${({ asIcon }) => (asIcon ? '2px 10px' : '2px 20px')};
43
- }
42
+ padding: 0;
44
43
 
45
44
  :not(:first-child) {
46
45
  margin-left: 5px;
47
46
  }
47
+
48
+ &:hover {
49
+ border: none;
50
+ }
48
51
  `;
49
52
  //# sourceMappingURL=CodeBlockControlButton.js.map
package/lib/components/Feedback/Comment.js CHANGED
@@ -62,8 +62,8 @@ const Comment = ({ settings, onSubmit, onCancel, className, standAlone = true, }
62
62
  translate('theme.feedback.settings.comment.label', 'Please share your feedback with us.')),
63
63
  React.createElement(TextArea, { rows: 3, onChange: handleTextAreaChange }),
64
64
  standAlone && (React.createElement(ButtonsContainer, null,
65
- React.createElement(SendButton, { "data-translation-key": "theme.feedback.settings.comment.send", onClick: send }, translate('theme.feedback.settings.comment.send', 'Send')),
66
- onCancel && (React.createElement(CancelButton, { "data-translation-key": "theme.feedback.settings.comment.cancel", onClick: onCancel }, translate('theme.feedback.settings.comment.cancel', 'Cancel')))))));
65
+ onCancel && (React.createElement(CancelButton, { "data-translation-key": "theme.feedback.settings.comment.cancel", onClick: onCancel }, translate('theme.feedback.settings.comment.cancel', 'Cancel'))),
66
+ React.createElement(SendButton, { "data-translation-key": "theme.feedback.settings.comment.send", onClick: send }, translate('theme.feedback.settings.comment.send', 'Send'))))));
67
67
  };
68
68
  exports.Comment = Comment;
69
69
  const Wrapper = styled_components_1.default.div `
@@ -84,12 +84,12 @@ const StateWrapper = (0, styled_components_1.default)(Wrapper) `
84
84
  width: 100%;
85
85
  }
86
86
  `;
87
- const Label = styled_components_1.default.h3 `
88
- font-family: var(--h3-font-family);
89
- font-weight: var(--h3-font-weight);
90
- font-size: var(--h3-font-size);
91
- line-height: var(--h3-line-height);
92
- color: var(--h3-text-color);
87
+ const Label = styled_components_1.default.h4 `
88
+ font-family: var(--h4-font-family);
89
+ font-weight: var(--font-weight-regular);
90
+ font-size: var(--h4-font-size);
91
+ line-height: var(--h4-line-height);
92
+ color: var(--h4-text-color);
93
93
  margin-right: 15px;
94
94
  `;
95
95
  const TextArea = styled_components_1.default.textarea `
package/lib/components/Feedback/Mood.js CHANGED
@@ -145,13 +145,13 @@ const Wrapper = styled_components_1.default.div `
145
145
  width: 100%;
146
146
  }
147
147
  `;
148
- const Label = styled_components_1.default.h3 `
149
- margin-right: 15px;
148
+ const Label = styled_components_1.default.h4 `
150
149
  font-family: var(--h4-font-family);
151
- font-weight: var(--h4-font-weight);
150
+ font-weight: var(--font-weight-regular);
152
151
  font-size: var(--h4-font-size);
153
152
  line-height: var(--h4-line-height);
154
- color: var(--h3-text-color);
153
+ color: var(--h4-text-color);
154
+ margin-right: 15px;
155
155
  `;
156
156
  const Vote = styled_components_1.default.div `
157
157
  cursor: pointer;
package/lib/components/Feedback/Rating.js CHANGED
@@ -113,13 +113,13 @@ const Wrapper = styled_components_1.default.div `
113
113
  width: 100%;
114
114
  }
115
115
  `;
116
- const Label = styled_components_1.default.h3 `
117
- margin-right: 15px;
116
+ const Label = styled_components_1.default.h4 `
118
117
  font-family: var(--h4-font-family);
119
- font-weight: var(--h4-font-weight);
118
+ font-weight: var(--font-weight-regular);
120
119
  font-size: var(--h4-font-size);
121
120
  line-height: var(--h4-line-height);
122
- color: var(--h3-text-color);
121
+ color: var(--h4-text-color);
122
+ margin-right: 15px;
123
123
  `;
124
124
  const SubmitButton = (0, styled_components_1.default)(components_1.Button).attrs(() => ({
125
125
  color: 'primary',
package/lib/components/Feedback/Reasons.js CHANGED
@@ -58,12 +58,12 @@ const Wrapper = styled_components_1.default.div `
58
58
  display: flex;
59
59
  flex-direction: column;
60
60
  `;
61
- const Label = styled_components_1.default.h3 `
62
- font-family: var(--h3-font-family);
63
- font-weight: var(--h3-font-weight);
64
- font-size: var(--h3-font-size);
65
- line-height: var(--h3-line-height);
66
- color: var(--h3-text-color);
61
+ const Label = styled_components_1.default.h4 `
62
+ font-family: var(--h4-font-family);
63
+ font-weight: var(--font-weight-regular);
64
+ font-size: var(--h4-font-size);
65
+ line-height: var(--h4-line-height);
66
+ color: var(--h4-text-color);
67
67
  margin-right: 15px;
68
68
  `;
69
69
  const OptionWrapper = styled_components_1.default.div `
@@ -76,6 +76,7 @@ const OptionWrapper = styled_components_1.default.div `
76
76
  label {
77
77
  font-size: var(--font-size-base);
78
78
  cursor: pointer;
79
+ color: var(--text-secondary);
79
80
  }
80
81
  `;
81
82
  //# sourceMappingURL=Reasons.js.map
package/lib/components/Feedback/Scale.js CHANGED
@@ -107,13 +107,12 @@ const Wrapper = styled_components_1.default.div `
107
107
  width: 100%;
108
108
  }
109
109
  `;
110
- const Label = styled_components_1.default.h3 `
111
- margin-right: 15px;
110
+ const Label = styled_components_1.default.h4 `
112
111
  font-family: var(--h4-font-family);
113
- font-weight: var(--h4-font-weight);
112
+ font-weight: var(--font-weight-regular);
114
113
  font-size: var(--h4-font-size);
115
114
  line-height: var(--h4-line-height);
116
- color: var(--h3-text-color);
115
+ color: var(--h4-text-color);
117
116
  `;
118
117
  const SubLabelContainer = styled_components_1.default.div `
119
118
  display: flex;
package/lib/components/Feedback/Sentiment.js CHANGED
@@ -111,13 +111,13 @@ const Wrapper = styled_components_1.default.div `
111
111
  width: 100%;
112
112
  }
113
113
  `;
114
- const Label = styled_components_1.default.h3 `
115
- margin-right: 15px;
114
+ const Label = styled_components_1.default.h4 `
116
115
  font-family: var(--h4-font-family);
117
- font-weight: var(--h4-font-weight);
116
+ font-weight: var(--font-weight-regular);
118
117
  font-size: var(--h4-font-size);
119
118
  line-height: var(--h4-line-height);
120
- color: var(--h3-text-color);
119
+ color: var(--h4-text-color);
120
+ margin-right: 15px;
121
121
  `;
122
122
  const Vote = styled_components_1.default.div `
123
123
  height: 32px;
package/lib/components/Tooltip/Tooltip.js CHANGED
@@ -133,7 +133,7 @@ const PLACEMENTS = {
133
133
  };
134
134
  const TooltipWrapper = styled_components_1.default.div `
135
135
  position: relative;
136
- display: inline-block;
136
+ display: flex;
137
137
  `;
138
138
  const TooltipBody = styled_components_1.default.span `
139
139
  display: inline-block;
package/lib/icons/CopyIcon/CopyIcon.js CHANGED
@@ -6,9 +6,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
6
6
  exports.CopyIcon = void 0;
7
7
  const react_1 = __importDefault(require("react"));
8
8
  const styled_components_1 = __importDefault(require("styled-components"));
9
- const Icon = ({ className }) => (react_1.default.createElement("span", { "data-component-name": "icons/CopyIcon" },
10
- react_1.default.createElement("svg", { viewBox: "0 0 11 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className },
11
- react_1.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M3.52083 1.33333C3.52083 1.25279 3.58613 1.1875 3.66667 1.1875H9.5C9.58054 1.1875 9.64583 1.25279 9.64583 1.33333V8.33333C9.64583 8.41387 9.58054 8.47917 9.5 8.47917H7.75H3.66667C3.58613 8.47917 3.52083 8.41387 3.52083 8.33333V3.08333V1.33333ZM2.64583 2.64583V1.33333C2.64583 0.769543 3.10288 0.3125 3.66667 0.3125H9.5C10.0638 0.3125 10.5208 0.769543 10.5208 1.33333V8.33333C10.5208 8.89712 10.0638 9.35417 9.5 9.35417H8.1875V10.6667C8.1875 10.9374 8.07995 11.1971 7.8885 11.3885C7.69706 11.5799 7.43741 11.6875 7.16667 11.6875H1.33333C1.06259 11.6875 0.802939 11.5799 0.611495 11.3885C0.420051 11.1971 0.3125 10.9374 0.3125 10.6667V3.66667C0.3125 3.39592 0.420052 3.13627 0.611495 2.94483C0.802938 2.75339 1.06259 2.64583 1.33333 2.64583H2.64583ZM7.3125 9.35417V10.6667C7.3125 10.7053 7.29713 10.7424 7.26979 10.7698C7.24244 10.7971 7.20534 10.8125 7.16667 10.8125H1.33333C1.29466 10.8125 1.25756 10.7971 1.23021 10.7698C1.20286 10.7424 1.1875 10.7053 1.1875 10.6667V3.66667C1.1875 3.62799 1.20286 3.5909 1.23021 3.56355C1.25756 3.5362 1.29466 3.52083 1.33333 3.52083H2.64583V8.33333C2.64583 8.89712 3.10288 9.35417 3.66667 9.35417H7.3125Z", fill: "currentColor" }))));
9
+ const Icon = ({ className }) => (react_1.default.createElement("span", { "data-component-name": "icons/CopyIcon", className: className },
10
+ react_1.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none" },
11
+ react_1.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M5.16667 2.66667C5.16667 2.57462 5.24129 2.5 5.33333 2.5H12C12.092 2.5 12.1667 2.57462 12.1667 2.66667V10.6667C12.1667 10.7587 12.092 10.8333 12 10.8333H10H5.33333C5.24129 10.8333 5.16667 10.7587 5.16667 10.6667V4.66667V2.66667ZM4.16667 4.16667V2.66667C4.16667 2.02233 4.689 1.5 5.33333 1.5H12C12.6443 1.5 13.1667 2.02233 13.1667 2.66667V10.6667C13.1667 11.311 12.6443 11.8333 12 11.8333H10.5V13.3333C10.5 13.6428 10.3771 13.9395 10.1583 14.1583C9.9395 14.3771 9.64275 14.5 9.33333 14.5H2.66667C2.35725 14.5 2.0605 14.3771 1.84171 14.1583C1.62292 13.9395 1.5 13.6428 1.5 13.3333V5.33333C1.5 5.02391 1.62292 4.72717 1.84171 4.50838C2.0605 4.28958 2.35725 4.16667 2.66667 4.16667H4.16667ZM9.5 11.8333V13.3333C9.5 13.3775 9.48244 13.4199 9.45118 13.4512C9.41993 13.4824 9.37754 13.5 9.33333 13.5H2.66667C2.62246 13.5 2.58007 13.4824 2.54882 13.4512C2.51756 13.4199 2.5 13.3775 2.5 13.3333V5.33333C2.5 5.28913 2.51756 5.24674 2.54882 5.21548C2.58007 5.18423 2.62246 5.16667 2.66667 5.16667H4.16667V10.6667C4.16667 11.311 4.689 11.8333 5.33333 11.8333H9.5Z", fill: "currentColor", fillOpacity: "1" }))));
12
12
  exports.CopyIcon = (0, styled_components_1.default)(Icon) `
13
13
  width: 1em;
14
14
  height: 1em;
package/lib/icons/ReportIcon/ReportIcon.js CHANGED
@@ -6,11 +6,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
6
6
  exports.ReportIcon = void 0;
7
7
  const react_1 = __importDefault(require("react"));
8
8
  const styled_components_1 = __importDefault(require("styled-components"));
9
- const Icon = ({ className }) => (react_1.default.createElement("svg", { "data-component-name": "icons/ReportIcon", viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className },
10
- react_1.default.createElement("rect", { width: "14", height: "14", fill: "none" }),
11
- react_1.default.createElement("path", { d: "M7 8.75C6.87021 8.75 6.74333 8.78849 6.63541 8.8606C6.52749 8.93271 6.44337 9.0352 6.3937 9.15511C6.34403 9.27503 6.33104 9.40698 6.35636 9.53428C6.38168 9.66158 6.44418 9.77851 6.53596 9.87029C6.62774 9.96207 6.74467 10.0246 6.87197 10.0499C6.99927 10.0752 7.13122 10.0622 7.25114 10.0125C7.37105 9.96288 7.47354 9.87876 7.54565 9.77084C7.61776 9.66292 7.65625 9.53604 7.65625 9.40625C7.65625 9.2322 7.58711 9.06528 7.46404 8.94221C7.34097 8.81914 7.17405 8.75 7 8.75Z", fill: "currentColor", fillOpacity: "1" }),
12
- react_1.default.createElement("path", { d: "M7.4375 3.9375H6.5625V7.875H7.4375V3.9375Z", fill: "currentColor", fillOpacity: "1" }),
13
- react_1.default.createElement("path", { d: "M11.375 12.25H2.625C2.39302 12.2497 2.17061 12.1575 2.00658 11.9934C1.84254 11.8294 1.75027 11.607 1.75 11.375V2.625C1.75027 2.39302 1.84254 2.17061 2.00658 2.00658C2.17061 1.84254 2.39302 1.75027 2.625 1.75H11.375C11.607 1.75027 11.8294 1.84254 11.9934 2.00658C12.1575 2.17061 12.2497 2.39302 12.25 2.625V11.375C12.2497 11.607 12.1575 11.8294 11.9934 11.9934C11.8294 12.1575 11.607 12.2497 11.375 12.25ZM2.625 2.625V11.375H11.3755L11.375 2.625H2.625Z", fill: "currentColor", fillOpacity: "1" })));
9
+ const Icon = ({ className }) => (react_1.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", className: className },
10
+ react_1.default.createElement("rect", { width: "16", height: "16", fill: "none" }),
11
+ react_1.default.createElement("path", { d: "M8 10C7.85166 10 7.70666 10.044 7.58332 10.1264C7.45999 10.2088 7.36386 10.3259 7.30709 10.463C7.25032 10.6 7.23547 10.7508 7.26441 10.8963C7.29335 11.0418 7.36478 11.1754 7.46967 11.2803C7.57456 11.3852 7.7082 11.4566 7.85368 11.4856C7.99917 11.5145 8.14997 11.4997 8.28701 11.4429C8.42406 11.3861 8.54119 11.29 8.6236 11.1667C8.70601 11.0433 8.75 10.8983 8.75 10.75C8.75 10.5511 8.67098 10.3603 8.53033 10.2197C8.38968 10.079 8.19891 10 8 10Z", fill: "currentColor", fillOpacity: "1" }),
12
+ react_1.default.createElement("path", { d: "M8.5 4.5H7.5V9H8.5V4.5Z", fill: "currentColor", fillOpacity: "1" }),
13
+ react_1.default.createElement("path", { d: "M13 14H3C2.73488 13.9997 2.4807 13.8942 2.29323 13.7068C2.10576 13.5193 2.0003 13.2651 2 13V3C2.0003 2.73488 2.10576 2.4807 2.29323 2.29323C2.4807 2.10576 2.73488 2.0003 3 2H13C13.2651 2.0003 13.5193 2.10576 13.7068 2.29323C13.8942 2.4807 13.9997 2.73488 14 3V13C13.9997 13.2651 13.8942 13.5193 13.7068 13.7068C13.5193 13.8942 13.2651 13.9997 13 14ZM3 3V13H13.0006L13 3H3Z", fill: "currentColor", fillOpacity: "1" })));
14
14
  exports.ReportIcon = (0, styled_components_1.default)(Icon) `
15
15
  width: 1.3em;
16
16
  height: 1.3em;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@redocly/theme",
3
- "version": "0.28.1",
3
+ "version": "0.28.2",
4
4
  "description": "Shared UI components lib",
5
5
  "keywords": [
6
6
  "theme",
package/src/components/CodeBlock/CodeBlockControlButton.tsx CHANGED
@@ -4,6 +4,7 @@ import { Button } from '@theme/components/Button';
4
4
 
5
5
  export const CodeBlockControlButton = styled(Button)<{ asIcon?: boolean }>`
6
6
  color: var(--code-block-controls-text-color);
7
+ border: none;
7
8
 
8
9
  ${({ asIcon }) =>
9
10
  asIcon
@@ -15,11 +16,13 @@ export const CodeBlockControlButton = styled(Button)<{ asIcon?: boolean }>`
15
16
  background-color: var(--code-block-text-controls-background-color);
16
17
  `}
17
18
 
18
- ${({ theme }) => theme.mediaQueries?.small} {
19
- padding: ${({ asIcon }) => (asIcon ? '2px 10px' : '2px 20px')};
20
- }
19
+ padding: 0;
21
20
 
22
21
  :not(:first-child) {
23
22
  margin-left: 5px;
24
23
  }
24
+
25
+ &:hover {
26
+ border: none;
27
+ }
25
28
  `;
package/src/components/Feedback/Comment.tsx CHANGED
@@ -61,9 +61,6 @@ export const Comment = ({
61
61
  <TextArea rows={3} onChange={handleTextAreaChange} />
62
62
  {standAlone && (
63
63
  <ButtonsContainer>
64
- <SendButton data-translation-key="theme.feedback.settings.comment.send" onClick={send}>
65
- {translate('theme.feedback.settings.comment.send', 'Send')}
66
- </SendButton>
67
64
  {onCancel && (
68
65
  <CancelButton
69
66
  data-translation-key="theme.feedback.settings.comment.cancel"
@@ -72,6 +69,9 @@ export const Comment = ({
72
69
  {translate('theme.feedback.settings.comment.cancel', 'Cancel')}
73
70
  </CancelButton>
74
71
  )}
72
+ <SendButton data-translation-key="theme.feedback.settings.comment.send" onClick={send}>
73
+ {translate('theme.feedback.settings.comment.send', 'Send')}
74
+ </SendButton>
75
75
  </ButtonsContainer>
76
76
  )}
77
77
  </Wrapper>
@@ -98,12 +98,12 @@ const StateWrapper = styled(Wrapper)`
98
98
  }
99
99
  `;
100
100
 
101
- const Label = styled.h3`
102
- font-family: var(--h3-font-family);
103
- font-weight: var(--h3-font-weight);
104
- font-size: var(--h3-font-size);
105
- line-height: var(--h3-line-height);
106
- color: var(--h3-text-color);
101
+ const Label = styled.h4`
102
+ font-family: var(--h4-font-family);
103
+ font-weight: var(--font-weight-regular);
104
+ font-size: var(--h4-font-size);
105
+ line-height: var(--h4-line-height);
106
+ color: var(--h4-text-color);
107
107
  margin-right: 15px;
108
108
  `;
109
109
 
package/src/components/Feedback/Mood.tsx CHANGED
@@ -178,13 +178,13 @@ const Wrapper = styled.div`
178
178
  }
179
179
  `;
180
180
 
181
- const Label = styled.h3`
182
- margin-right: 15px;
181
+ const Label = styled.h4`
183
182
  font-family: var(--h4-font-family);
184
- font-weight: var(--h4-font-weight);
183
+ font-weight: var(--font-weight-regular);
185
184
  font-size: var(--h4-font-size);
186
185
  line-height: var(--h4-line-height);
187
- color: var(--h3-text-color);
186
+ color: var(--h4-text-color);
187
+ margin-right: 15px;
188
188
  `;
189
189
 
190
190
  const Vote = styled.div`
package/src/components/Feedback/Rating.tsx CHANGED
@@ -133,13 +133,13 @@ const Wrapper = styled.div`
133
133
  }
134
134
  `;
135
135
 
136
- const Label = styled.h3`
137
- margin-right: 15px;
136
+ const Label = styled.h4`
138
137
  font-family: var(--h4-font-family);
139
- font-weight: var(--h4-font-weight);
138
+ font-weight: var(--font-weight-regular);
140
139
  font-size: var(--h4-font-size);
141
140
  line-height: var(--h4-line-height);
142
- color: var(--h3-text-color);
141
+ color: var(--h4-text-color);
142
+ margin-right: 15px;
143
143
  `;
144
144
 
145
145
  const SubmitButton = styled(Button).attrs(() => ({
package/src/components/Feedback/Reasons.tsx CHANGED
@@ -66,12 +66,12 @@ const Wrapper = styled.div`
66
66
  flex-direction: column;
67
67
  `;
68
68
 
69
- const Label = styled.h3`
70
- font-family: var(--h3-font-family);
71
- font-weight: var(--h3-font-weight);
72
- font-size: var(--h3-font-size);
73
- line-height: var(--h3-line-height);
74
- color: var(--h3-text-color);
69
+ const Label = styled.h4`
70
+ font-family: var(--h4-font-family);
71
+ font-weight: var(--font-weight-regular);
72
+ font-size: var(--h4-font-size);
73
+ line-height: var(--h4-line-height);
74
+ color: var(--h4-text-color);
75
75
  margin-right: 15px;
76
76
  `;
77
77
 
@@ -85,5 +85,6 @@ const OptionWrapper = styled.div`
85
85
  label {
86
86
  font-size: var(--font-size-base);
87
87
  cursor: pointer;
88
+ color: var(--text-secondary);
88
89
  }
89
90
  `;
package/src/components/Feedback/Scale.tsx CHANGED
@@ -144,13 +144,12 @@ const Wrapper = styled.div`
144
144
  }
145
145
  `;
146
146
 
147
- const Label = styled.h3`
148
- margin-right: 15px;
147
+ const Label = styled.h4`
149
148
  font-family: var(--h4-font-family);
150
- font-weight: var(--h4-font-weight);
149
+ font-weight: var(--font-weight-regular);
151
150
  font-size: var(--h4-font-size);
152
151
  line-height: var(--h4-line-height);
153
- color: var(--h3-text-color);
152
+ color: var(--h4-text-color);
154
153
  `;
155
154
 
156
155
  const SubLabelContainer = styled.div`
package/src/components/Feedback/Sentiment.tsx CHANGED
@@ -135,13 +135,13 @@ const Wrapper = styled.div`
135
135
  }
136
136
  `;
137
137
 
138
- const Label = styled.h3`
139
- margin-right: 15px;
138
+ const Label = styled.h4`
140
139
  font-family: var(--h4-font-family);
141
- font-weight: var(--h4-font-weight);
140
+ font-weight: var(--font-weight-regular);
142
141
  font-size: var(--h4-font-size);
143
142
  line-height: var(--h4-line-height);
144
- color: var(--h3-text-color);
143
+ color: var(--h4-text-color);
144
+ margin-right: 15px;
145
145
  `;
146
146
 
147
147
  const Vote = styled.div`
package/src/components/Tooltip/Tooltip.tsx CHANGED
@@ -157,7 +157,7 @@ const PLACEMENTS = {
157
157
 
158
158
  const TooltipWrapper = styled.div`
159
159
  position: relative;
160
- display: inline-block;
160
+ display: flex;
161
161
  `;
162
162
 
163
163
  const TooltipBody = styled.span<
package/src/icons/CopyIcon/CopyIcon.tsx CHANGED
@@ -6,13 +6,14 @@ interface IconProps {
6
6
  }
7
7
 
8
8
  const Icon = ({ className }: IconProps) => (
9
- <span data-component-name="icons/CopyIcon">
10
- <svg viewBox="0 0 11 12" fill="none" xmlns="http://www.w3.org/2000/svg" className={className}>
9
+ <span data-component-name="icons/CopyIcon" className={className}>
10
+ <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
11
11
  <path
12
12
  fillRule="evenodd"
13
13
  clipRule="evenodd"
14
- d="M3.52083 1.33333C3.52083 1.25279 3.58613 1.1875 3.66667 1.1875H9.5C9.58054 1.1875 9.64583 1.25279 9.64583 1.33333V8.33333C9.64583 8.41387 9.58054 8.47917 9.5 8.47917H7.75H3.66667C3.58613 8.47917 3.52083 8.41387 3.52083 8.33333V3.08333V1.33333ZM2.64583 2.64583V1.33333C2.64583 0.769543 3.10288 0.3125 3.66667 0.3125H9.5C10.0638 0.3125 10.5208 0.769543 10.5208 1.33333V8.33333C10.5208 8.89712 10.0638 9.35417 9.5 9.35417H8.1875V10.6667C8.1875 10.9374 8.07995 11.1971 7.8885 11.3885C7.69706 11.5799 7.43741 11.6875 7.16667 11.6875H1.33333C1.06259 11.6875 0.802939 11.5799 0.611495 11.3885C0.420051 11.1971 0.3125 10.9374 0.3125 10.6667V3.66667C0.3125 3.39592 0.420052 3.13627 0.611495 2.94483C0.802938 2.75339 1.06259 2.64583 1.33333 2.64583H2.64583ZM7.3125 9.35417V10.6667C7.3125 10.7053 7.29713 10.7424 7.26979 10.7698C7.24244 10.7971 7.20534 10.8125 7.16667 10.8125H1.33333C1.29466 10.8125 1.25756 10.7971 1.23021 10.7698C1.20286 10.7424 1.1875 10.7053 1.1875 10.6667V3.66667C1.1875 3.62799 1.20286 3.5909 1.23021 3.56355C1.25756 3.5362 1.29466 3.52083 1.33333 3.52083H2.64583V8.33333C2.64583 8.89712 3.10288 9.35417 3.66667 9.35417H7.3125Z"
14
+ d="M5.16667 2.66667C5.16667 2.57462 5.24129 2.5 5.33333 2.5H12C12.092 2.5 12.1667 2.57462 12.1667 2.66667V10.6667C12.1667 10.7587 12.092 10.8333 12 10.8333H10H5.33333C5.24129 10.8333 5.16667 10.7587 5.16667 10.6667V4.66667V2.66667ZM4.16667 4.16667V2.66667C4.16667 2.02233 4.689 1.5 5.33333 1.5H12C12.6443 1.5 13.1667 2.02233 13.1667 2.66667V10.6667C13.1667 11.311 12.6443 11.8333 12 11.8333H10.5V13.3333C10.5 13.6428 10.3771 13.9395 10.1583 14.1583C9.9395 14.3771 9.64275 14.5 9.33333 14.5H2.66667C2.35725 14.5 2.0605 14.3771 1.84171 14.1583C1.62292 13.9395 1.5 13.6428 1.5 13.3333V5.33333C1.5 5.02391 1.62292 4.72717 1.84171 4.50838C2.0605 4.28958 2.35725 4.16667 2.66667 4.16667H4.16667ZM9.5 11.8333V13.3333C9.5 13.3775 9.48244 13.4199 9.45118 13.4512C9.41993 13.4824 9.37754 13.5 9.33333 13.5H2.66667C2.62246 13.5 2.58007 13.4824 2.54882 13.4512C2.51756 13.4199 2.5 13.3775 2.5 13.3333V5.33333C2.5 5.28913 2.51756 5.24674 2.54882 5.21548C2.58007 5.18423 2.62246 5.16667 2.66667 5.16667H4.16667V10.6667C4.16667 11.311 4.689 11.8333 5.33333 11.8333H9.5Z"
15
15
  fill="currentColor"
16
+ fillOpacity="1"
16
17
  />
17
18
  </svg>
18
19
  </span>
package/src/icons/ReportIcon/ReportIcon.tsx CHANGED
@@ -7,21 +7,22 @@ interface IconProps {
7
7
 
8
8
  const Icon = ({ className }: IconProps) => (
9
9
  <svg
10
- data-component-name="icons/ReportIcon"
11
- viewBox="0 0 14 14"
12
- fill="none"
13
10
  xmlns="http://www.w3.org/2000/svg"
11
+ width="16"
12
+ height="16"
13
+ viewBox="0 0 16 16"
14
+ fill="none"
14
15
  className={className}
15
16
  >
16
- <rect width="14" height="14" fill="none" />
17
+ <rect width="16" height="16" fill="none" />
17
18
  <path
18
- d="M7 8.75C6.87021 8.75 6.74333 8.78849 6.63541 8.8606C6.52749 8.93271 6.44337 9.0352 6.3937 9.15511C6.34403 9.27503 6.33104 9.40698 6.35636 9.53428C6.38168 9.66158 6.44418 9.77851 6.53596 9.87029C6.62774 9.96207 6.74467 10.0246 6.87197 10.0499C6.99927 10.0752 7.13122 10.0622 7.25114 10.0125C7.37105 9.96288 7.47354 9.87876 7.54565 9.77084C7.61776 9.66292 7.65625 9.53604 7.65625 9.40625C7.65625 9.2322 7.58711 9.06528 7.46404 8.94221C7.34097 8.81914 7.17405 8.75 7 8.75Z"
19
+ d="M8 10C7.85166 10 7.70666 10.044 7.58332 10.1264C7.45999 10.2088 7.36386 10.3259 7.30709 10.463C7.25032 10.6 7.23547 10.7508 7.26441 10.8963C7.29335 11.0418 7.36478 11.1754 7.46967 11.2803C7.57456 11.3852 7.7082 11.4566 7.85368 11.4856C7.99917 11.5145 8.14997 11.4997 8.28701 11.4429C8.42406 11.3861 8.54119 11.29 8.6236 11.1667C8.70601 11.0433 8.75 10.8983 8.75 10.75C8.75 10.5511 8.67098 10.3603 8.53033 10.2197C8.38968 10.079 8.19891 10 8 10Z"
19
20
  fill="currentColor"
20
21
  fillOpacity="1"
21
22
  />
22
- <path d="M7.4375 3.9375H6.5625V7.875H7.4375V3.9375Z" fill="currentColor" fillOpacity="1" />
23
+ <path d="M8.5 4.5H7.5V9H8.5V4.5Z" fill="currentColor" fillOpacity="1" />
23
24
  <path
24
- d="M11.375 12.25H2.625C2.39302 12.2497 2.17061 12.1575 2.00658 11.9934C1.84254 11.8294 1.75027 11.607 1.75 11.375V2.625C1.75027 2.39302 1.84254 2.17061 2.00658 2.00658C2.17061 1.84254 2.39302 1.75027 2.625 1.75H11.375C11.607 1.75027 11.8294 1.84254 11.9934 2.00658C12.1575 2.17061 12.2497 2.39302 12.25 2.625V11.375C12.2497 11.607 12.1575 11.8294 11.9934 11.9934C11.8294 12.1575 11.607 12.2497 11.375 12.25ZM2.625 2.625V11.375H11.3755L11.375 2.625H2.625Z"
25
+ d="M13 14H3C2.73488 13.9997 2.4807 13.8942 2.29323 13.7068C2.10576 13.5193 2.0003 13.2651 2 13V3C2.0003 2.73488 2.10576 2.4807 2.29323 2.29323C2.4807 2.10576 2.73488 2.0003 3 2H13C13.2651 2.0003 13.5193 2.10576 13.7068 2.29323C13.8942 2.4807 13.9997 2.73488 14 3V13C13.9997 13.2651 13.8942 13.5193 13.7068 13.7068C13.5193 13.8942 13.2651 13.9997 13 14ZM3 3V13H13.0006L13 3H3Z"
25
26
  fill="currentColor"
26
27
  fillOpacity="1"
27
28
  />