@atlaskit/smart-card 21.1.0 → 21.1.1

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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # @atlaskit/smart-card
2
2
 
3
+ ## 21.1.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [`e6a3654a137`](https://bitbucket.org/atlassian/atlassian-frontend/commits/e6a3654a137) - Fix bug where smart cards used `elevation.surface` instead of `elevation.surface.raised` design tokens for card backgrounds.
8
+
3
9
  ## 21.1.0
4
10
 
5
11
  ### Minor Changes
@@ -9,7 +9,7 @@ var _tokens = require("@atlaskit/tokens");
9
9
 
10
10
  var tokens = {
11
11
  actionIcon: (0, _tokens.token)('color.icon', '#44546F'),
12
- background: (0, _tokens.token)('elevation.surface', '#FFFFFF'),
12
+ background: (0, _tokens.token)('elevation.surface.raised', '#FFFFFF'),
13
13
  badgeIcon: (0, _tokens.token)('color.icon.subtle', '#626F86'),
14
14
  badgeText: (0, _tokens.token)('color.text.subtlest', '#626F86'),
15
15
  blackLink: (0, _tokens.token)('color.text.subtle', '#44546F'),
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/smart-card",
3
- "version": "21.1.0",
3
+ "version": "21.1.1",
4
4
  "sideEffects": false
5
5
  }
@@ -37,7 +37,7 @@ var sharedFrameStyles = {
37
37
  maxWidth: (0, _utils.gs)(95),
38
38
  width: '100%',
39
39
  display: 'flex',
40
- backgroundColor: (0, _tokens.token)('elevation.surface', 'white')
40
+ backgroundColor: (0, _tokens.token)('elevation.surface.raised', 'white')
41
41
  };
42
42
 
43
43
  var ExpandedFrame = function ExpandedFrame(_ref) {
@@ -144,7 +144,7 @@ exports.TextWrapper = TextWrapper;
144
144
  // NB: `overflow` is kept as `hidden` since
145
145
  // the internal contents of the `iframe` should
146
146
  // manage scrolling behaviour.
147
- var Content = _styled.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n ", "\n ", "\n background-color: ", ";\n position: absolute;\n z-index: 1;\n width: 100%;\n top: ", ";\n overflow: hidden;\n height: calc(100% - ", ");\n transition: box-shadow 0.3s;\n\n > .calc-height > div > div {\n left: unset !important;\n width: unset !important;\n height: unset !important;\n position: initial !important;\n padding-bottom: unset !important;\n }\n > .embed-preview > div {\n margin: 0 auto;\n }\n\n ", ";\n"])), borderRadius, cardShadow, (0, _tokens.token)('elevation.surface', 'white'), (0, _utils.gs)(4), (0, _utils.gs)(4), function (_ref9) {
147
+ var Content = _styled.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n ", "\n ", "\n background-color: ", ";\n position: absolute;\n z-index: 1;\n width: 100%;\n top: ", ";\n overflow: hidden;\n height: calc(100% - ", ");\n transition: box-shadow 0.3s;\n\n > .calc-height > div > div {\n left: unset !important;\n width: unset !important;\n height: unset !important;\n position: initial !important;\n padding-bottom: unset !important;\n }\n > .embed-preview > div {\n margin: 0 auto;\n }\n\n ", ";\n"])), borderRadius, cardShadow, (0, _tokens.token)('elevation.surface.raised', 'white'), (0, _utils.gs)(4), (0, _utils.gs)(4), function (_ref9) {
148
148
  var isInteractive = _ref9.isInteractive;
149
149
 
150
150
  if (isInteractive) {
@@ -1,7 +1,7 @@
1
1
  import { token } from '@atlaskit/tokens';
2
2
  export const tokens = {
3
3
  actionIcon: token('color.icon', '#44546F'),
4
- background: token('elevation.surface', '#FFFFFF'),
4
+ background: token('elevation.surface.raised', '#FFFFFF'),
5
5
  badgeIcon: token('color.icon.subtle', '#626F86'),
6
6
  badgeText: token('color.text.subtlest', '#626F86'),
7
7
  blackLink: token('color.text.subtle', '#44546F'),
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/smart-card",
3
- "version": "21.1.0",
3
+ "version": "21.1.1",
4
4
  "sideEffects": false
5
5
  }
@@ -13,7 +13,7 @@ const sharedFrameStyles = {
13
13
  maxWidth: gs(95),
14
14
  width: '100%',
15
15
  display: 'flex',
16
- backgroundColor: token('elevation.surface', 'white')
16
+ backgroundColor: token('elevation.surface.raised', 'white')
17
17
  };
18
18
  export const ExpandedFrame = ({
19
19
  children,
@@ -191,7 +191,7 @@ export const TextWrapper = styled.div`
191
191
  export const Content = styled.div`
192
192
  ${borderRadius}
193
193
  ${cardShadow}
194
- background-color: ${token('elevation.surface', 'white')};
194
+ background-color: ${token('elevation.surface.raised', 'white')};
195
195
  position: absolute;
196
196
  z-index: 1;
197
197
  width: 100%;
@@ -1,7 +1,7 @@
1
1
  import { token } from '@atlaskit/tokens';
2
2
  export var tokens = {
3
3
  actionIcon: token('color.icon', '#44546F'),
4
- background: token('elevation.surface', '#FFFFFF'),
4
+ background: token('elevation.surface.raised', '#FFFFFF'),
5
5
  badgeIcon: token('color.icon.subtle', '#626F86'),
6
6
  badgeText: token('color.text.subtlest', '#626F86'),
7
7
  blackLink: token('color.text.subtle', '#44546F'),
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/smart-card",
3
- "version": "21.1.0",
3
+ "version": "21.1.1",
4
4
  "sideEffects": false
5
5
  }
@@ -22,7 +22,7 @@ var sharedFrameStyles = {
22
22
  maxWidth: gs(95),
23
23
  width: '100%',
24
24
  display: 'flex',
25
- backgroundColor: token('elevation.surface', 'white')
25
+ backgroundColor: token('elevation.surface.raised', 'white')
26
26
  };
27
27
  export var ExpandedFrame = function ExpandedFrame(_ref) {
28
28
  var children = _ref.children,
@@ -99,7 +99,7 @@ export var TextWrapper = styled.div(_templateObject5 || (_templateObject5 = _tag
99
99
  // NB: `overflow` is kept as `hidden` since
100
100
  // the internal contents of the `iframe` should
101
101
  // manage scrolling behaviour.
102
- export var Content = styled.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n ", "\n ", "\n background-color: ", ";\n position: absolute;\n z-index: 1;\n width: 100%;\n top: ", ";\n overflow: hidden;\n height: calc(100% - ", ");\n transition: box-shadow 0.3s;\n\n > .calc-height > div > div {\n left: unset !important;\n width: unset !important;\n height: unset !important;\n position: initial !important;\n padding-bottom: unset !important;\n }\n > .embed-preview > div {\n margin: 0 auto;\n }\n\n ", ";\n"])), borderRadius, cardShadow, token('elevation.surface', 'white'), gridSize(4), gridSize(4), function (_ref9) {
102
+ export var Content = styled.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n ", "\n ", "\n background-color: ", ";\n position: absolute;\n z-index: 1;\n width: 100%;\n top: ", ";\n overflow: hidden;\n height: calc(100% - ", ");\n transition: box-shadow 0.3s;\n\n > .calc-height > div > div {\n left: unset !important;\n width: unset !important;\n height: unset !important;\n position: initial !important;\n padding-bottom: unset !important;\n }\n > .embed-preview > div {\n margin: 0 auto;\n }\n\n ", ";\n"])), borderRadius, cardShadow, token('elevation.surface.raised', 'white'), gridSize(4), gridSize(4), function (_ref9) {
103
103
  var isInteractive = _ref9.isInteractive;
104
104
 
105
105
  if (isInteractive) {
@@ -1,6 +1,6 @@
1
1
  export declare const tokens: {
2
2
  actionIcon: "var(--ds-icon)";
3
- background: "var(--ds-surface)";
3
+ background: "var(--ds-surface-raised)";
4
4
  badgeIcon: "var(--ds-icon-subtle)";
5
5
  badgeText: "var(--ds-text-subtlest)";
6
6
  blackLink: "var(--ds-text-subtle)";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/smart-card",
3
- "version": "21.1.0",
3
+ "version": "21.1.1",
4
4
  "description": "Smart card component",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"