@ndla/ui 10.1.1 → 11.1.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.
@@ -24,7 +24,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "d
24
24
  var BottomBorder = (0, _styledBase["default"])("div", {
25
25
  target: "e16vwpby0",
26
26
  label: "BottomBorder"
27
- })("margin-top:", _core.spacing.normal, ";border-bottom:1px solid ", _core.colors.brand.greyLight, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkZpZ3VyZU5vdGlvbi50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZStCIiwiZmlsZSI6IkZpZ3VyZU5vdGlvbi50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAyMi1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuICpcbiAqL1xuXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBjb2xvcnMsIHNwYWNpbmcgfSBmcm9tICdAbmRsYS9jb3JlJztcbmltcG9ydCB7IGdldEdyb3VwZWRDb250cmlidXRvckRlc2NyaXB0aW9uTGlzdCwgZ2V0TGljZW5zZUJ5QWJicmV2aWF0aW9uIH0gZnJvbSAnQG5kbGEvbGljZW5zZXMnO1xuaW1wb3J0IFJlYWN0LCB7IFJlYWN0Tm9kZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IHVzZVRyYW5zbGF0aW9uIH0gZnJvbSAncmVhY3QtaTE4bmV4dCc7XG5pbXBvcnQgeyBGaWd1cmUsIEZpZ3VyZUNhcHRpb24sIEZpZ3VyZUxpY2Vuc2VEaWFsb2cgfSBmcm9tICcuLi9GaWd1cmUnO1xuaW1wb3J0IHsgQ29weXJpZ2h0IH0gZnJvbSAnLi4vdHlwZXMnO1xuXG5jb25zdCBCb3R0b21Cb3JkZXIgPSBzdHlsZWQuZGl2YFxuICBtYXJnaW4tdG9wOiAke3NwYWNpbmcubm9ybWFsfTtcbiAgYm9yZGVyLWJvdHRvbTogMXB4IHNvbGlkICR7Y29sb3JzLmJyYW5kLmdyZXlMaWdodH07XG5gO1xuXG5pbnRlcmZhY2UgUHJvcHMge1xuICByZXNpemVJZnJhbWU/OiBib29sZWFuO1xuICBmaWd1cmVJZDogc3RyaW5nO1xuICBjaGlsZHJlbjogUmVhY3ROb2RlIHwgKChwYXJhbXM6IHsgdHlwZUNsYXNzOiBzdHJpbmcgfSkgPT4gUmVhY3ROb2RlKTtcbiAgaWQ6IHN0cmluZztcbiAgdGl0bGU/OiBzdHJpbmc7XG4gIGNvcHlyaWdodD86IFBhcnRpYWw8Q29weXJpZ2h0PjtcbiAgbGljZW5zZVN0cmluZzogc3RyaW5nO1xuICB0eXBlOiAndmlkZW8nIHwgJ2g1cCcgfCAnaW1hZ2UnIHwgJ2NvbmNlcHQnIHwgJ290aGVyJztcbiAgaGlkZUZpZ0NhcHRpb24/OiBib29sZWFuO1xuICBoaWRlSWNvbnNBbmRBdXRob3JzPzogYm9vbGVhbjtcbn1cblxuY29uc3QgRmlndXJlTm90aW9uID0gKHtcbiAgcmVzaXplSWZyYW1lLFxuICBmaWd1cmVJZCxcbiAgY2hpbGRyZW4sXG4gIGlkLFxuICBjb3B5cmlnaHQsXG4gIGxpY2Vuc2VTdHJpbmcsXG4gIHRpdGxlLFxuICB0eXBlLFxuICBoaWRlRmlnQ2FwdGlvbixcbiAgaGlkZUljb25zQW5kQXV0aG9ycyxcbn06IFByb3BzKSA9PiB7XG4gIGNvbnN0IHsgdCwgaTE4biB9ID0gdXNlVHJhbnNsYXRpb24oKTtcbiAgY29uc3QgbGljZW5zZSA9IGdldExpY2Vuc2VCeUFiYnJldmlhdGlvbihsaWNlbnNlU3RyaW5nLCBpMThuLmxhbmd1YWdlKTtcbiAgY29uc3QgeyBjcmVhdG9ycywgcHJvY2Vzc29ycywgcmlnaHRzaG9sZGVycyB9ID0gY29weXJpZ2h0ID8/IHt9O1xuICBjb25zdCBjb250cmlidXRvcnMgPSBnZXRHcm91cGVkQ29udHJpYnV0b3JEZXNjcmlwdGlvbkxpc3QoXG4gICAge1xuICAgICAgY3JlYXRvcnM6IGNyZWF0b3JzID8/IFtdLFxuICAgICAgcHJvY2Vzc29yczogcHJvY2Vzc29ycyA/PyBbXSxcbiAgICAgIHJpZ2h0c2hvbGRlcnM6IHJpZ2h0c2hvbGRlcnMgPz8gW10sXG4gICAgfSxcbiAgICBpMThuLmxhbmd1YWdlLFxuICApLm1hcCgoaSkgPT4gKHsgbmFtZTogaS5kZXNjcmlwdGlvbiwgdHlwZTogaS5sYWJlbCB9KSk7XG5cbiAgcmV0dXJuIChcbiAgICA8RmlndXJlIHJlc2l6ZUlmcmFtZT17cmVzaXplSWZyYW1lfSBpZD17ZmlndXJlSWR9IHR5cGU9eydmdWxsLWNvbHVtbid9PlxuICAgICAgeyh7IHR5cGVDbGFzcyB9KSA9PiAoXG4gICAgICAgIDw+XG4gICAgICAgICAge3R5cGVvZiBjaGlsZHJlbiA9PT0gJ2Z1bmN0aW9uJyA/IGNoaWxkcmVuKHsgdHlwZUNsYXNzIH0pIDogY2hpbGRyZW59XG4gICAgICAgICAge2NvcHlyaWdodD8ubGljZW5zZT8ubGljZW5zZSA/IChcbiAgICAgICAgICAgIDxGaWd1cmVDYXB0aW9uXG4gICAgICAgICAgICAgIGhpZGVGaWdjYXB0aW9uPXtoaWRlRmlnQ2FwdGlvbn1cbiAgICAgICAgICAgICAgZmlndXJlSWQ9e2ZpZ3VyZUlkfVxuICAgICAgICAgICAgICBpZD17aWR9XG4gICAgICAgICAgICAgIHJldXNlTGFiZWw9e3QoYCR7dHlwZX0ucmV1c2VgKX1cbiAgICAgICAgICAgICAgYXV0aG9ycz17Y29udHJpYnV0b3JzfVxuICAgICAgICAgICAgICBsaWNlbnNlUmlnaHRzPXtsaWNlbnNlLnJpZ2h0c31cbiAgICAgICAgICAgICAgaGlkZUljb25zQW5kQXV0aG9ycz17aGlkZUljb25zQW5kQXV0aG9yc30+XG4gICAgICAgICAgICAgIDxGaWd1cmVMaWNlbnNlRGlhbG9nXG4gICAgICAgICAgICAgICAgaWQ9e2lkfVxuICAgICAgICAgICAgICAgIGF1dGhvcnM9e2NvbnRyaWJ1dG9yc31cbiAgICAgICAgICAgICAgICBsb2NhbGU9e2kxOG4ubGFuZ3VhZ2V9XG4gICAgICAgICAgICAgICAgdGl0bGU9e3RpdGxlfVxuICAgICAgICAgICAgICAgIG9yaWdpbj17Y29weXJpZ2h0Py5vcmlnaW59XG4gICAgICAgICAgICAgICAgbGljZW5zZT17bGljZW5zZX1cbiAgICAgICAgICAgICAgICBtZXNzYWdlcz17e1xuICAgICAgICAgICAgICAgICAgY2xvc2U6IHQoJ2Nsb3NlJyksXG4gICAgICAgICAgICAgICAgICBydWxlc0ZvclVzZTogdCgnbGljZW5zZS5jb25jZXB0LnJ1bGVzJyksXG4gICAgICAgICAgICAgICAgICBzb3VyY2U6IHQoJ3NvdXJjZScpLFxuICAgICAgICAgICAgICAgICAgbGVhcm5BYm91dExpY2Vuc2VzOiB0KCdsaWNlbnNlLmxlYXJuTW9yZScpLFxuICAgICAgICAgICAgICAgICAgdGl0bGU6IHQoJ3RpdGxlJyksXG4gICAgICAgICAgICAgICAgfX0+PC9GaWd1cmVMaWNlbnNlRGlhbG9nPlxuICAgICAgICAgICAgPC9GaWd1cmVDYXB0aW9uPlxuICAgICAgICAgICkgOiAoXG4gICAgICAgICAgICA8Qm90dG9tQm9yZGVyIC8+XG4gICAgICAgICAgKX1cbiAgICAgICAgPC8+XG4gICAgICApfVxuICAgIDwvRmlndXJlPlxuICApO1xufTtcblxuZXhwb3J0IGRlZmF1bHQgRmlndXJlTm90aW9uO1xuIl19 */"));
27
+ })("margin-top:", _core.spacing.normal, ";border-bottom:1px solid ", _core.colors.brand.greyLight, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkZpZ3VyZU5vdGlvbi50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZStCIiwiZmlsZSI6IkZpZ3VyZU5vdGlvbi50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAyMi1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuICpcbiAqL1xuXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBjb2xvcnMsIHNwYWNpbmcgfSBmcm9tICdAbmRsYS9jb3JlJztcbmltcG9ydCB7IGdldEdyb3VwZWRDb250cmlidXRvckRlc2NyaXB0aW9uTGlzdCwgZ2V0TGljZW5zZUJ5QWJicmV2aWF0aW9uIH0gZnJvbSAnQG5kbGEvbGljZW5zZXMnO1xuaW1wb3J0IFJlYWN0LCB7IFJlYWN0Tm9kZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IHVzZVRyYW5zbGF0aW9uIH0gZnJvbSAncmVhY3QtaTE4bmV4dCc7XG5pbXBvcnQgeyBGaWd1cmUsIEZpZ3VyZUNhcHRpb24sIEZpZ3VyZUxpY2Vuc2VEaWFsb2csIEZpZ3VyZVR5cGUgfSBmcm9tICcuLi9GaWd1cmUnO1xuaW1wb3J0IHsgQ29weXJpZ2h0IH0gZnJvbSAnLi4vdHlwZXMnO1xuXG5jb25zdCBCb3R0b21Cb3JkZXIgPSBzdHlsZWQuZGl2YFxuICBtYXJnaW4tdG9wOiAke3NwYWNpbmcubm9ybWFsfTtcbiAgYm9yZGVyLWJvdHRvbTogMXB4IHNvbGlkICR7Y29sb3JzLmJyYW5kLmdyZXlMaWdodH07XG5gO1xuXG5pbnRlcmZhY2UgUHJvcHMge1xuICByZXNpemVJZnJhbWU/OiBib29sZWFuO1xuICBmaWd1cmVJZDogc3RyaW5nO1xuICBjaGlsZHJlbjogUmVhY3ROb2RlIHwgKChwYXJhbXM6IHsgdHlwZUNsYXNzOiBzdHJpbmcgfSkgPT4gUmVhY3ROb2RlKTtcbiAgaWQ6IHN0cmluZztcbiAgdGl0bGU/OiBzdHJpbmc7XG4gIGNvcHlyaWdodD86IFBhcnRpYWw8Q29weXJpZ2h0PjtcbiAgbGljZW5zZVN0cmluZzogc3RyaW5nO1xuICB0eXBlOiAndmlkZW8nIHwgJ2g1cCcgfCAnaW1hZ2UnIHwgJ2NvbmNlcHQnIHwgJ290aGVyJztcbiAgaGlkZUZpZ0NhcHRpb24/OiBib29sZWFuO1xuICBoaWRlSWNvbnNBbmRBdXRob3JzPzogYm9vbGVhbjtcbiAgZmlndXJlVHlwZT86IEZpZ3VyZVR5cGU7XG59XG5cbmNvbnN0IEZpZ3VyZU5vdGlvbiA9ICh7XG4gIHJlc2l6ZUlmcmFtZSxcbiAgZmlndXJlSWQsXG4gIGNoaWxkcmVuLFxuICBpZCxcbiAgY29weXJpZ2h0LFxuICBsaWNlbnNlU3RyaW5nLFxuICB0aXRsZSxcbiAgdHlwZSxcbiAgaGlkZUZpZ0NhcHRpb24sXG4gIGhpZGVJY29uc0FuZEF1dGhvcnMsXG4gIGZpZ3VyZVR5cGUsXG59OiBQcm9wcykgPT4ge1xuICBjb25zdCB7IHQsIGkxOG4gfSA9IHVzZVRyYW5zbGF0aW9uKCk7XG4gIGNvbnN0IGxpY2Vuc2UgPSBnZXRMaWNlbnNlQnlBYmJyZXZpYXRpb24obGljZW5zZVN0cmluZywgaTE4bi5sYW5ndWFnZSk7XG4gIGNvbnN0IHsgY3JlYXRvcnMsIHByb2Nlc3NvcnMsIHJpZ2h0c2hvbGRlcnMgfSA9IGNvcHlyaWdodCA/PyB7fTtcbiAgY29uc3QgY29udHJpYnV0b3JzID0gZ2V0R3JvdXBlZENvbnRyaWJ1dG9yRGVzY3JpcHRpb25MaXN0KFxuICAgIHtcbiAgICAgIGNyZWF0b3JzOiBjcmVhdG9ycyA/PyBbXSxcbiAgICAgIHByb2Nlc3NvcnM6IHByb2Nlc3NvcnMgPz8gW10sXG4gICAgICByaWdodHNob2xkZXJzOiByaWdodHNob2xkZXJzID8/IFtdLFxuICAgIH0sXG4gICAgaTE4bi5sYW5ndWFnZSxcbiAgKS5tYXAoKGkpID0+ICh7IG5hbWU6IGkuZGVzY3JpcHRpb24sIHR5cGU6IGkubGFiZWwgfSkpO1xuXG4gIHJldHVybiAoXG4gICAgPEZpZ3VyZSByZXNpemVJZnJhbWU9e3Jlc2l6ZUlmcmFtZX0gaWQ9e2ZpZ3VyZUlkfSB0eXBlPXtmaWd1cmVUeXBlIHx8ICdmdWxsLWNvbHVtbid9PlxuICAgICAgeyh7IHR5cGVDbGFzcyB9KSA9PiAoXG4gICAgICAgIDw+XG4gICAgICAgICAge3R5cGVvZiBjaGlsZHJlbiA9PT0gJ2Z1bmN0aW9uJyA/IGNoaWxkcmVuKHsgdHlwZUNsYXNzIH0pIDogY2hpbGRyZW59XG4gICAgICAgICAge2NvcHlyaWdodD8ubGljZW5zZT8ubGljZW5zZSA/IChcbiAgICAgICAgICAgIDxGaWd1cmVDYXB0aW9uXG4gICAgICAgICAgICAgIGhpZGVGaWdjYXB0aW9uPXtoaWRlRmlnQ2FwdGlvbn1cbiAgICAgICAgICAgICAgZmlndXJlSWQ9e2ZpZ3VyZUlkfVxuICAgICAgICAgICAgICBpZD17aWR9XG4gICAgICAgICAgICAgIHJldXNlTGFiZWw9e3QoYCR7dHlwZX0ucmV1c2VgKX1cbiAgICAgICAgICAgICAgYXV0aG9ycz17Y29udHJpYnV0b3JzfVxuICAgICAgICAgICAgICBsaWNlbnNlUmlnaHRzPXtsaWNlbnNlLnJpZ2h0c31cbiAgICAgICAgICAgICAgaGlkZUljb25zQW5kQXV0aG9ycz17aGlkZUljb25zQW5kQXV0aG9yc30+XG4gICAgICAgICAgICAgIDxGaWd1cmVMaWNlbnNlRGlhbG9nXG4gICAgICAgICAgICAgICAgaWQ9e2lkfVxuICAgICAgICAgICAgICAgIGF1dGhvcnM9e2NvbnRyaWJ1dG9yc31cbiAgICAgICAgICAgICAgICBsb2NhbGU9e2kxOG4ubGFuZ3VhZ2V9XG4gICAgICAgICAgICAgICAgdGl0bGU9e3RpdGxlfVxuICAgICAgICAgICAgICAgIG9yaWdpbj17Y29weXJpZ2h0Py5vcmlnaW59XG4gICAgICAgICAgICAgICAgbGljZW5zZT17bGljZW5zZX1cbiAgICAgICAgICAgICAgICBtZXNzYWdlcz17e1xuICAgICAgICAgICAgICAgICAgY2xvc2U6IHQoJ2Nsb3NlJyksXG4gICAgICAgICAgICAgICAgICBydWxlc0ZvclVzZTogdCgnbGljZW5zZS5jb25jZXB0LnJ1bGVzJyksXG4gICAgICAgICAgICAgICAgICBzb3VyY2U6IHQoJ3NvdXJjZScpLFxuICAgICAgICAgICAgICAgICAgbGVhcm5BYm91dExpY2Vuc2VzOiB0KCdsaWNlbnNlLmxlYXJuTW9yZScpLFxuICAgICAgICAgICAgICAgICAgdGl0bGU6IHQoJ3RpdGxlJyksXG4gICAgICAgICAgICAgICAgfX0+PC9GaWd1cmVMaWNlbnNlRGlhbG9nPlxuICAgICAgICAgICAgPC9GaWd1cmVDYXB0aW9uPlxuICAgICAgICAgICkgOiAoXG4gICAgICAgICAgICA8Qm90dG9tQm9yZGVyIC8+XG4gICAgICAgICAgKX1cbiAgICAgICAgPC8+XG4gICAgICApfVxuICAgIDwvRmlndXJlPlxuICApO1xufTtcblxuZXhwb3J0IGRlZmF1bHQgRmlndXJlTm90aW9uO1xuIl19 */"));
28
28
 
29
29
  var FigureNotion = function FigureNotion(_ref) {
30
30
  var resizeIframe = _ref.resizeIframe,
@@ -36,7 +36,8 @@ var FigureNotion = function FigureNotion(_ref) {
36
36
  title = _ref.title,
37
37
  type = _ref.type,
38
38
  hideFigCaption = _ref.hideFigCaption,
39
- hideIconsAndAuthors = _ref.hideIconsAndAuthors;
39
+ hideIconsAndAuthors = _ref.hideIconsAndAuthors,
40
+ figureType = _ref.figureType;
40
41
 
41
42
  var _useTranslation = (0, _reactI18next.useTranslation)(),
42
43
  t = _useTranslation.t,
@@ -62,7 +63,7 @@ var FigureNotion = function FigureNotion(_ref) {
62
63
  return (0, _core2.jsx)(_Figure.Figure, {
63
64
  resizeIframe: resizeIframe,
64
65
  id: figureId,
65
- type: 'full-column'
66
+ type: figureType || 'full-column'
66
67
  }, function (_ref3) {
67
68
  var _copyright$license;
68
69
 
@@ -32,13 +32,13 @@ var StyledImageWrapper = (0, _styledBase["default"])("div", {
32
32
  label: "StyledImageWrapper"
33
33
  })("overflow:hidden;width:260px;padding-top:", _core.spacing.small, ";", _core.mq.range({
34
34
  until: _core.breakpoints.tabletWide
35
- }), "{margin:0 auto;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIk5vdGlvbkltYWdlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFjcUMiLCJmaWxlIjoiTm90aW9uSW1hZ2UudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIDIwMjItcHJlc2VudCwgTkRMQS5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBHUEx2MyBsaWNlbnNlIGZvdW5kIGluIHRoZVxuICogTElDRU5TRSBmaWxlIGluIHRoZSByb290IGRpcmVjdG9yeSBvZiB0aGlzIHNvdXJjZSB0cmVlLiAqXG4gKi9cblxuaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IGFuaW1hdGlvbnMsIGJyZWFrcG9pbnRzLCBtcSwgc3BhY2luZyB9IGZyb20gJ0BuZGxhL2NvcmUnO1xuaW1wb3J0IHsgdXNlVHJhbnNsYXRpb24gfSBmcm9tICdyZWFjdC1pMThuZXh0JztcbmltcG9ydCBJbWFnZSBmcm9tICcuLi9JbWFnZSc7XG5pbXBvcnQgeyBGaWd1cmUsIEZpZ3VyZU9wZW5EaWFsb2dCdXR0b24gfSBmcm9tICcuLi9GaWd1cmUnO1xuXG5jb25zdCBTdHlsZWRJbWFnZVdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuICBvdmVyZmxvdzogaGlkZGVuO1xuICB3aWR0aDogMjYwcHg7XG4gIHBhZGRpbmctdG9wOiAke3NwYWNpbmcuc21hbGx9O1xuICAke21xLnJhbmdlKHsgdW50aWw6IGJyZWFrcG9pbnRzLnRhYmxldFdpZGUgfSl9IHtcbiAgICBtYXJnaW46IDAgYXV0bztcbiAgfVxuYDtcblxuY29uc3QgU3R5bGVkSW1hZ2UgPSBzdHlsZWQoSW1hZ2UpYFxuICBvYmplY3QtZml0OiBjb3ZlcjtcbiAgbWF4LWhlaWdodDogMTYycHg7XG4gIHRyYW5zaXRpb246IHRyYW5zZm9ybSAke2FuaW1hdGlvbnMuZHVyYXRpb25zLmZhc3R9O1xuICAmOmhvdmVyIHtcbiAgICB0cmFuc2Zvcm06IHNjYWxlKDEuMSk7XG4gICAgb3BhY2l0eTogMS4xO1xuICAgIHRyYW5zaXRpb24tZHVyYXRpb246IDAuNXM7XG4gIH1cbiAgJHttcS5yYW5nZSh7IHVudGlsOiBicmVha3BvaW50cy50YWJsZXRXaWRlIH0pfSB7XG4gICAgbWluLXdpZHRoOiAyNjBweDtcbiAgfVxuYDtcblxuaW50ZXJmYWNlIFByb3BzIHtcbiAgdHlwZTogJ2ltYWdlJyB8ICd2aWRlbycgfCAnaDVwJyB8ICdpZnJhbWUnIHwgJ2V4dGVybmFsJyB8IHVuZGVmaW5lZDtcbiAgaWQ6IHN0cmluZztcbiAgc3JjOiBzdHJpbmc7XG4gIGFsdDogc3RyaW5nO1xufVxuZXhwb3J0IGNvbnN0IE5vdGlvbkltYWdlID0gKHsgaWQsIHNyYywgYWx0LCB0eXBlIH06IFByb3BzKSA9PiB7XG4gIGNvbnN0IHsgdCB9ID0gdXNlVHJhbnNsYXRpb24oKTtcblxuICBjb25zdCBpbWFnZUZpZ3VyZUlkID0gYGltYWdlLWZpZ3VyZS0ke2lkfWA7XG5cbiAgcmV0dXJuIChcbiAgICA8RmlndXJlIHJlc2l6ZUlmcmFtZSBpZD17aW1hZ2VGaWd1cmVJZH0gdHlwZT17J2Z1bGwtY29sdW1uJ30+XG4gICAgICA8U3R5bGVkSW1hZ2VXcmFwcGVyPlxuICAgICAgICA8U3R5bGVkSW1hZ2VcbiAgICAgICAgICBhbHQ9e2FsdH1cbiAgICAgICAgICBzcmM9e3NyY31cbiAgICAgICAgICBleHBhbmRCdXR0b249e1xuICAgICAgICAgICAgPEZpZ3VyZU9wZW5EaWFsb2dCdXR0b25cbiAgICAgICAgICAgICAgdHlwZT17dHlwZX1cbiAgICAgICAgICAgICAgbWVzc2FnZXM9e3tcbiAgICAgICAgICAgICAgICB6b29tSW1hZ2VCdXR0b25MYWJlbDogdCgnbGljZW5zZS5pbWFnZXMuaXRlbUltYWdlLnpvb21JbWFnZUJ1dHRvbkxhYmVsJyksXG4gICAgICAgICAgICAgICAgem9vbU91dEltYWdlQnV0dG9uTGFiZWw6IHQoJ2xpY2Vuc2UuaW1hZ2UuaXRlbUltYWdlLnpvb21PdXRJbWFnZUJ1dHRvbkxhYmVsJyksXG4gICAgICAgICAgICAgIH19XG4gICAgICAgICAgICAvPlxuICAgICAgICAgIH1cbiAgICAgICAgLz5cbiAgICAgIDwvU3R5bGVkSW1hZ2VXcmFwcGVyPlxuICAgIDwvRmlndXJlPlxuICApO1xufTtcbiJdfQ== */"));
35
+ }), "{margin:0 auto;}&:hover{img{transform:scale(1.1);opacity:1.1;transition-duration:0.5s;}}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIk5vdGlvbkltYWdlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFjcUMiLCJmaWxlIjoiTm90aW9uSW1hZ2UudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIDIwMjItcHJlc2VudCwgTkRMQS5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBHUEx2MyBsaWNlbnNlIGZvdW5kIGluIHRoZVxuICogTElDRU5TRSBmaWxlIGluIHRoZSByb290IGRpcmVjdG9yeSBvZiB0aGlzIHNvdXJjZSB0cmVlLiAqXG4gKi9cblxuaW1wb3J0IFJlYWN0IGZyb20gJ3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IGFuaW1hdGlvbnMsIGJyZWFrcG9pbnRzLCBtcSwgc3BhY2luZyB9IGZyb20gJ0BuZGxhL2NvcmUnO1xuaW1wb3J0IHsgdXNlVHJhbnNsYXRpb24gfSBmcm9tICdyZWFjdC1pMThuZXh0JztcbmltcG9ydCBJbWFnZSBmcm9tICcuLi9JbWFnZSc7XG5pbXBvcnQgeyBGaWd1cmUsIEZpZ3VyZU9wZW5EaWFsb2dCdXR0b24gfSBmcm9tICcuLi9GaWd1cmUnO1xuXG5jb25zdCBTdHlsZWRJbWFnZVdyYXBwZXIgPSBzdHlsZWQuZGl2YFxuICBvdmVyZmxvdzogaGlkZGVuO1xuICB3aWR0aDogMjYwcHg7XG4gIHBhZGRpbmctdG9wOiAke3NwYWNpbmcuc21hbGx9O1xuICAke21xLnJhbmdlKHsgdW50aWw6IGJyZWFrcG9pbnRzLnRhYmxldFdpZGUgfSl9IHtcbiAgICBtYXJnaW46IDAgYXV0bztcbiAgfVxuICAmOmhvdmVyIHtcbiAgICBpbWcge1xuICAgICAgdHJhbnNmb3JtOiBzY2FsZSgxLjEpO1xuICAgICAgb3BhY2l0eTogMS4xO1xuICAgICAgdHJhbnNpdGlvbi1kdXJhdGlvbjogMC41cztcbiAgICB9XG4gIH1cbmA7XG5cbmNvbnN0IFN0eWxlZEltYWdlID0gc3R5bGVkKEltYWdlKWBcbiAgb2JqZWN0LWZpdDogY292ZXI7XG4gIG1heC1oZWlnaHQ6IDE2MnB4O1xuICB0cmFuc2l0aW9uOiB0cmFuc2Zvcm0gJHthbmltYXRpb25zLmR1cmF0aW9ucy5mYXN0fTtcbiAgJHttcS5yYW5nZSh7IHVudGlsOiBicmVha3BvaW50cy50YWJsZXRXaWRlIH0pfSB7XG4gICAgbWluLXdpZHRoOiAyNjBweDtcbiAgfVxuYDtcblxuaW50ZXJmYWNlIFByb3BzIHtcbiAgdHlwZTogJ2ltYWdlJyB8ICd2aWRlbycgfCAnaDVwJyB8ICdpZnJhbWUnIHwgJ2V4dGVybmFsJyB8IHVuZGVmaW5lZDtcbiAgaWQ6IHN0cmluZztcbiAgc3JjOiBzdHJpbmc7XG4gIGFsdDogc3RyaW5nO1xufVxuZXhwb3J0IGNvbnN0IE5vdGlvbkltYWdlID0gKHsgaWQsIHNyYywgYWx0LCB0eXBlIH06IFByb3BzKSA9PiB7XG4gIGNvbnN0IHsgdCB9ID0gdXNlVHJhbnNsYXRpb24oKTtcblxuICBjb25zdCBpbWFnZUZpZ3VyZUlkID0gYGltYWdlLWZpZ3VyZS0ke2lkfWA7XG5cbiAgcmV0dXJuIChcbiAgICA8RmlndXJlIHJlc2l6ZUlmcmFtZSBpZD17aW1hZ2VGaWd1cmVJZH0gdHlwZT17J2Z1bGwtY29sdW1uJ30+XG4gICAgICA8U3R5bGVkSW1hZ2VXcmFwcGVyPlxuICAgICAgICA8U3R5bGVkSW1hZ2VcbiAgICAgICAgICBhbHQ9e2FsdH1cbiAgICAgICAgICBzcmM9e3NyY31cbiAgICAgICAgICBleHBhbmRCdXR0b249e1xuICAgICAgICAgICAgPEZpZ3VyZU9wZW5EaWFsb2dCdXR0b25cbiAgICAgICAgICAgICAgdHlwZT17dHlwZX1cbiAgICAgICAgICAgICAgbWVzc2FnZXM9e3tcbiAgICAgICAgICAgICAgICB6b29tSW1hZ2VCdXR0b25MYWJlbDogdCgnbGljZW5zZS5pbWFnZXMuaXRlbUltYWdlLnpvb21JbWFnZUJ1dHRvbkxhYmVsJyksXG4gICAgICAgICAgICAgICAgem9vbU91dEltYWdlQnV0dG9uTGFiZWw6IHQoJ2xpY2Vuc2UuaW1hZ2UuaXRlbUltYWdlLnpvb21PdXRJbWFnZUJ1dHRvbkxhYmVsJyksXG4gICAgICAgICAgICAgIH19XG4gICAgICAgICAgICAvPlxuICAgICAgICAgIH1cbiAgICAgICAgLz5cbiAgICAgIDwvU3R5bGVkSW1hZ2VXcmFwcGVyPlxuICAgIDwvRmlndXJlPlxuICApO1xufTtcbiJdfQ== */"));
36
36
  var StyledImage = ( /*#__PURE__*/0, _styledBase["default"])(_Image["default"], {
37
37
  target: "e1beccco1",
38
38
  label: "StyledImage"
39
- })("object-fit:cover;max-height:162px;transition:transform ", _core.animations.durations.fast, ";&:hover{transform:scale(1.1);opacity:1.1;transition-duration:0.5s;}", _core.mq.range({
39
+ })("object-fit:cover;max-height:162px;transition:transform ", _core.animations.durations.fast, ";", _core.mq.range({
40
40
  until: _core.breakpoints.tabletWide
41
- }), "{min-width:260px;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIk5vdGlvbkltYWdlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF1QmlDIiwiZmlsZSI6Ik5vdGlvbkltYWdlLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQ29weXJpZ2h0IChjKSAyMDIyLXByZXNlbnQsIE5ETEEuXG4gKlxuICogVGhpcyBzb3VyY2UgY29kZSBpcyBsaWNlbnNlZCB1bmRlciB0aGUgR1BMdjMgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS4gKlxuICovXG5cbmltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBhbmltYXRpb25zLCBicmVha3BvaW50cywgbXEsIHNwYWNpbmcgfSBmcm9tICdAbmRsYS9jb3JlJztcbmltcG9ydCB7IHVzZVRyYW5zbGF0aW9uIH0gZnJvbSAncmVhY3QtaTE4bmV4dCc7XG5pbXBvcnQgSW1hZ2UgZnJvbSAnLi4vSW1hZ2UnO1xuaW1wb3J0IHsgRmlndXJlLCBGaWd1cmVPcGVuRGlhbG9nQnV0dG9uIH0gZnJvbSAnLi4vRmlndXJlJztcblxuY29uc3QgU3R5bGVkSW1hZ2VXcmFwcGVyID0gc3R5bGVkLmRpdmBcbiAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgd2lkdGg6IDI2MHB4O1xuICBwYWRkaW5nLXRvcDogJHtzcGFjaW5nLnNtYWxsfTtcbiAgJHttcS5yYW5nZSh7IHVudGlsOiBicmVha3BvaW50cy50YWJsZXRXaWRlIH0pfSB7XG4gICAgbWFyZ2luOiAwIGF1dG87XG4gIH1cbmA7XG5cbmNvbnN0IFN0eWxlZEltYWdlID0gc3R5bGVkKEltYWdlKWBcbiAgb2JqZWN0LWZpdDogY292ZXI7XG4gIG1heC1oZWlnaHQ6IDE2MnB4O1xuICB0cmFuc2l0aW9uOiB0cmFuc2Zvcm0gJHthbmltYXRpb25zLmR1cmF0aW9ucy5mYXN0fTtcbiAgJjpob3ZlciB7XG4gICAgdHJhbnNmb3JtOiBzY2FsZSgxLjEpO1xuICAgIG9wYWNpdHk6IDEuMTtcbiAgICB0cmFuc2l0aW9uLWR1cmF0aW9uOiAwLjVzO1xuICB9XG4gICR7bXEucmFuZ2UoeyB1bnRpbDogYnJlYWtwb2ludHMudGFibGV0V2lkZSB9KX0ge1xuICAgIG1pbi13aWR0aDogMjYwcHg7XG4gIH1cbmA7XG5cbmludGVyZmFjZSBQcm9wcyB7XG4gIHR5cGU6ICdpbWFnZScgfCAndmlkZW8nIHwgJ2g1cCcgfCAnaWZyYW1lJyB8ICdleHRlcm5hbCcgfCB1bmRlZmluZWQ7XG4gIGlkOiBzdHJpbmc7XG4gIHNyYzogc3RyaW5nO1xuICBhbHQ6IHN0cmluZztcbn1cbmV4cG9ydCBjb25zdCBOb3Rpb25JbWFnZSA9ICh7IGlkLCBzcmMsIGFsdCwgdHlwZSB9OiBQcm9wcykgPT4ge1xuICBjb25zdCB7IHQgfSA9IHVzZVRyYW5zbGF0aW9uKCk7XG5cbiAgY29uc3QgaW1hZ2VGaWd1cmVJZCA9IGBpbWFnZS1maWd1cmUtJHtpZH1gO1xuXG4gIHJldHVybiAoXG4gICAgPEZpZ3VyZSByZXNpemVJZnJhbWUgaWQ9e2ltYWdlRmlndXJlSWR9IHR5cGU9eydmdWxsLWNvbHVtbid9PlxuICAgICAgPFN0eWxlZEltYWdlV3JhcHBlcj5cbiAgICAgICAgPFN0eWxlZEltYWdlXG4gICAgICAgICAgYWx0PXthbHR9XG4gICAgICAgICAgc3JjPXtzcmN9XG4gICAgICAgICAgZXhwYW5kQnV0dG9uPXtcbiAgICAgICAgICAgIDxGaWd1cmVPcGVuRGlhbG9nQnV0dG9uXG4gICAgICAgICAgICAgIHR5cGU9e3R5cGV9XG4gICAgICAgICAgICAgIG1lc3NhZ2VzPXt7XG4gICAgICAgICAgICAgICAgem9vbUltYWdlQnV0dG9uTGFiZWw6IHQoJ2xpY2Vuc2UuaW1hZ2VzLml0ZW1JbWFnZS56b29tSW1hZ2VCdXR0b25MYWJlbCcpLFxuICAgICAgICAgICAgICAgIHpvb21PdXRJbWFnZUJ1dHRvbkxhYmVsOiB0KCdsaWNlbnNlLmltYWdlLml0ZW1JbWFnZS56b29tT3V0SW1hZ2VCdXR0b25MYWJlbCcpLFxuICAgICAgICAgICAgICB9fVxuICAgICAgICAgICAgLz5cbiAgICAgICAgICB9XG4gICAgICAgIC8+XG4gICAgICA8L1N0eWxlZEltYWdlV3JhcHBlcj5cbiAgICA8L0ZpZ3VyZT5cbiAgKTtcbn07XG4iXX0= */"));
41
+ }), "{min-width:260px;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIk5vdGlvbkltYWdlLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE4QmlDIiwiZmlsZSI6Ik5vdGlvbkltYWdlLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQ29weXJpZ2h0IChjKSAyMDIyLXByZXNlbnQsIE5ETEEuXG4gKlxuICogVGhpcyBzb3VyY2UgY29kZSBpcyBsaWNlbnNlZCB1bmRlciB0aGUgR1BMdjMgbGljZW5zZSBmb3VuZCBpbiB0aGVcbiAqIExJQ0VOU0UgZmlsZSBpbiB0aGUgcm9vdCBkaXJlY3Rvcnkgb2YgdGhpcyBzb3VyY2UgdHJlZS4gKlxuICovXG5cbmltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBhbmltYXRpb25zLCBicmVha3BvaW50cywgbXEsIHNwYWNpbmcgfSBmcm9tICdAbmRsYS9jb3JlJztcbmltcG9ydCB7IHVzZVRyYW5zbGF0aW9uIH0gZnJvbSAncmVhY3QtaTE4bmV4dCc7XG5pbXBvcnQgSW1hZ2UgZnJvbSAnLi4vSW1hZ2UnO1xuaW1wb3J0IHsgRmlndXJlLCBGaWd1cmVPcGVuRGlhbG9nQnV0dG9uIH0gZnJvbSAnLi4vRmlndXJlJztcblxuY29uc3QgU3R5bGVkSW1hZ2VXcmFwcGVyID0gc3R5bGVkLmRpdmBcbiAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgd2lkdGg6IDI2MHB4O1xuICBwYWRkaW5nLXRvcDogJHtzcGFjaW5nLnNtYWxsfTtcbiAgJHttcS5yYW5nZSh7IHVudGlsOiBicmVha3BvaW50cy50YWJsZXRXaWRlIH0pfSB7XG4gICAgbWFyZ2luOiAwIGF1dG87XG4gIH1cbiAgJjpob3ZlciB7XG4gICAgaW1nIHtcbiAgICAgIHRyYW5zZm9ybTogc2NhbGUoMS4xKTtcbiAgICAgIG9wYWNpdHk6IDEuMTtcbiAgICAgIHRyYW5zaXRpb24tZHVyYXRpb246IDAuNXM7XG4gICAgfVxuICB9XG5gO1xuXG5jb25zdCBTdHlsZWRJbWFnZSA9IHN0eWxlZChJbWFnZSlgXG4gIG9iamVjdC1maXQ6IGNvdmVyO1xuICBtYXgtaGVpZ2h0OiAxNjJweDtcbiAgdHJhbnNpdGlvbjogdHJhbnNmb3JtICR7YW5pbWF0aW9ucy5kdXJhdGlvbnMuZmFzdH07XG4gICR7bXEucmFuZ2UoeyB1bnRpbDogYnJlYWtwb2ludHMudGFibGV0V2lkZSB9KX0ge1xuICAgIG1pbi13aWR0aDogMjYwcHg7XG4gIH1cbmA7XG5cbmludGVyZmFjZSBQcm9wcyB7XG4gIHR5cGU6ICdpbWFnZScgfCAndmlkZW8nIHwgJ2g1cCcgfCAnaWZyYW1lJyB8ICdleHRlcm5hbCcgfCB1bmRlZmluZWQ7XG4gIGlkOiBzdHJpbmc7XG4gIHNyYzogc3RyaW5nO1xuICBhbHQ6IHN0cmluZztcbn1cbmV4cG9ydCBjb25zdCBOb3Rpb25JbWFnZSA9ICh7IGlkLCBzcmMsIGFsdCwgdHlwZSB9OiBQcm9wcykgPT4ge1xuICBjb25zdCB7IHQgfSA9IHVzZVRyYW5zbGF0aW9uKCk7XG5cbiAgY29uc3QgaW1hZ2VGaWd1cmVJZCA9IGBpbWFnZS1maWd1cmUtJHtpZH1gO1xuXG4gIHJldHVybiAoXG4gICAgPEZpZ3VyZSByZXNpemVJZnJhbWUgaWQ9e2ltYWdlRmlndXJlSWR9IHR5cGU9eydmdWxsLWNvbHVtbid9PlxuICAgICAgPFN0eWxlZEltYWdlV3JhcHBlcj5cbiAgICAgICAgPFN0eWxlZEltYWdlXG4gICAgICAgICAgYWx0PXthbHR9XG4gICAgICAgICAgc3JjPXtzcmN9XG4gICAgICAgICAgZXhwYW5kQnV0dG9uPXtcbiAgICAgICAgICAgIDxGaWd1cmVPcGVuRGlhbG9nQnV0dG9uXG4gICAgICAgICAgICAgIHR5cGU9e3R5cGV9XG4gICAgICAgICAgICAgIG1lc3NhZ2VzPXt7XG4gICAgICAgICAgICAgICAgem9vbUltYWdlQnV0dG9uTGFiZWw6IHQoJ2xpY2Vuc2UuaW1hZ2VzLml0ZW1JbWFnZS56b29tSW1hZ2VCdXR0b25MYWJlbCcpLFxuICAgICAgICAgICAgICAgIHpvb21PdXRJbWFnZUJ1dHRvbkxhYmVsOiB0KCdsaWNlbnNlLmltYWdlLml0ZW1JbWFnZS56b29tT3V0SW1hZ2VCdXR0b25MYWJlbCcpLFxuICAgICAgICAgICAgICB9fVxuICAgICAgICAgICAgLz5cbiAgICAgICAgICB9XG4gICAgICAgIC8+XG4gICAgICA8L1N0eWxlZEltYWdlV3JhcHBlcj5cbiAgICA8L0ZpZ3VyZT5cbiAgKTtcbn07XG4iXX0= */"));
42
42
 
43
43
  var NotionImage = function NotionImage(_ref) {
44
44
  var id = _ref.id,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ndla/ui",
3
- "version": "10.1.1",
3
+ "version": "11.1.0",
4
4
  "description": "UI component library for NDLA.",
5
5
  "license": "GPL-3.0",
6
6
  "main": "lib/index.js",
@@ -38,7 +38,7 @@
38
38
  "@ndla/icons": "^1.7.0",
39
39
  "@ndla/licenses": "^4.1.0",
40
40
  "@ndla/modal": "^1.2.6",
41
- "@ndla/notion": "^3.1.0",
41
+ "@ndla/notion": "^3.1.1",
42
42
  "@ndla/safelink": "^1.1.7",
43
43
  "@ndla/switch": "^0.1.5",
44
44
  "@ndla/tabs": "^1.1.5",
@@ -81,5 +81,5 @@
81
81
  "publishConfig": {
82
82
  "access": "public"
83
83
  },
84
- "gitHead": "6c43d6775f6e357cc738d2fac813e6841fe84f10"
84
+ "gitHead": "62b9f1deac1941e5a58497d5c0946278464bc48f"
85
85
  }
@@ -24,7 +24,8 @@ type CursorWrapperProps = {
24
24
  hide: boolean;
25
25
  };
26
26
  const CursorWrapper = styled.div<CursorWrapperProps>`
27
- @import url('https://fonts.googleapis.com/css2?family=Shadows+Into+Light+Two&display=swap');
27
+ font-family: 'Shadows Into Light Two';
28
+ font-display: swap;
28
29
  width: 120px;
29
30
  font-family: 'Shadows Into Light Two', cursive;
30
31
  margin-top: 40px;
@@ -68,7 +68,8 @@ const HighlightWrapper = styled.div`
68
68
  `;
69
69
 
70
70
  const HighlightText = styled.span`
71
- @import url('https://fonts.googleapis.com/css2?family=Shadows+Into+Light+Two&display=swap');
71
+ font-family: 'Shadows Into Light Two';
72
+ font-display: swap;
72
73
  display: inline-block;
73
74
  color: ${colors.text.light};
74
75
  transform: rotate(14deg);
@@ -10,7 +10,8 @@ type CursorStyleProps = {
10
10
  };
11
11
 
12
12
  const Wrapper = styled.div<CursorStyleProps>`
13
- @import url('https://fonts.googleapis.com/css2?family=Shadows+Into+Light+Two&display=swap');
13
+ font-family: 'Shadows Into Light Two';
14
+ font-display: swap;
14
15
  position: absolute;
15
16
  top: -5px;
16
17
  max-width: 155px;
@@ -19,11 +19,10 @@ interface Props {
19
19
  };
20
20
  }
21
21
 
22
- export function FigureOpenDialogButton({ messages, type }: Props) {
22
+ export const FigureOpenDialogButton = ({ messages, type }: Props) => {
23
23
  return (
24
- <button
24
+ <div
25
25
  className="c-figure__fullscreen-btn"
26
- type="button"
27
26
  data-aria={messages.zoomImageButtonLabel}
28
27
  data-ariaexpanded={messages.zoomOutImageButtonLabel}
29
28
  aria-label={messages.zoomImageButtonLabel}>
@@ -32,6 +31,6 @@ export function FigureOpenDialogButton({ messages, type }: Props) {
32
31
  {type === 'iframe' && <CursorClick style={{ width: '24px', height: '24px' }} />}
33
32
  {type === 'external' && <CursorClick style={{ width: '24px', height: '24px' }} />}
34
33
  {type === 'video' && <Play style={{ width: '24px', height: '24px' }} />}
35
- </button>
34
+ </div>
36
35
  );
37
- }
36
+ };
@@ -36,7 +36,8 @@ const CursorPlaceholder = styled.div`
36
36
  `;
37
37
 
38
38
  const CursorWrapper = styled.div`
39
- @import url('https://fonts.googleapis.com/css2?family=Shadows+Into+Light+Two&display=swap');
39
+ font-family: 'Shadows Into Light Two';
40
+ font-display: swap;
40
41
  position: absolute;
41
42
  top: -55px;
42
43
  left: 38px;
@@ -18,6 +18,7 @@ import { NotionImage } from './NotionImage';
18
18
  import NotionVisualElement, { NotionVisualElementType } from './NotionVisualElement';
19
19
  import FigureNotion from './FigureNotion';
20
20
  import { Copyright } from '../types';
21
+ import { FigureType } from '../Figure';
21
22
 
22
23
  const ImageWrapper = styled.div`
23
24
  float: right;
@@ -47,9 +48,10 @@ interface Props {
47
48
  concept: ConceptNotionType;
48
49
  disableScripts?: boolean;
49
50
  hideIconsAndAuthors?: boolean;
51
+ figureType?: FigureType;
50
52
  }
51
53
 
52
- const ConceptNotion = ({ concept, disableScripts, type, hideIconsAndAuthors }: Props) => {
54
+ const ConceptNotion = ({ concept, disableScripts, type, hideIconsAndAuthors, figureType }: Props) => {
53
55
  const notionId = `notion-${concept.id}`;
54
56
  const figureId = `notion-figure-${concept.id}`;
55
57
  const visualElementId = `visual-element-${concept.id}`;
@@ -69,7 +71,8 @@ const ConceptNotion = ({ concept, disableScripts, type, hideIconsAndAuthors }: P
69
71
  copyright={concept.copyright}
70
72
  licenseString={concept.copyright?.license?.license ?? ''}
71
73
  type="concept"
72
- hideIconsAndAuthors={hideIconsAndAuthors}>
74
+ hideIconsAndAuthors={hideIconsAndAuthors}
75
+ figureType={figureType}>
73
76
  <UINotion
74
77
  id={notionId}
75
78
  title={concept.title}
@@ -10,7 +10,7 @@ import { colors, spacing } from '@ndla/core';
10
10
  import { getGroupedContributorDescriptionList, getLicenseByAbbreviation } from '@ndla/licenses';
11
11
  import React, { ReactNode } from 'react';
12
12
  import { useTranslation } from 'react-i18next';
13
- import { Figure, FigureCaption, FigureLicenseDialog } from '../Figure';
13
+ import { Figure, FigureCaption, FigureLicenseDialog, FigureType } from '../Figure';
14
14
  import { Copyright } from '../types';
15
15
 
16
16
  const BottomBorder = styled.div`
@@ -29,6 +29,7 @@ interface Props {
29
29
  type: 'video' | 'h5p' | 'image' | 'concept' | 'other';
30
30
  hideFigCaption?: boolean;
31
31
  hideIconsAndAuthors?: boolean;
32
+ figureType?: FigureType;
32
33
  }
33
34
 
34
35
  const FigureNotion = ({
@@ -42,6 +43,7 @@ const FigureNotion = ({
42
43
  type,
43
44
  hideFigCaption,
44
45
  hideIconsAndAuthors,
46
+ figureType,
45
47
  }: Props) => {
46
48
  const { t, i18n } = useTranslation();
47
49
  const license = getLicenseByAbbreviation(licenseString, i18n.language);
@@ -56,7 +58,7 @@ const FigureNotion = ({
56
58
  ).map((i) => ({ name: i.description, type: i.label }));
57
59
 
58
60
  return (
59
- <Figure resizeIframe={resizeIframe} id={figureId} type={'full-column'}>
61
+ <Figure resizeIframe={resizeIframe} id={figureId} type={figureType || 'full-column'}>
60
62
  {({ typeClass }) => (
61
63
  <>
62
64
  {typeof children === 'function' ? children({ typeClass }) : children}
@@ -19,17 +19,19 @@ const StyledImageWrapper = styled.div`
19
19
  ${mq.range({ until: breakpoints.tabletWide })} {
20
20
  margin: 0 auto;
21
21
  }
22
+ &:hover {
23
+ img {
24
+ transform: scale(1.1);
25
+ opacity: 1.1;
26
+ transition-duration: 0.5s;
27
+ }
28
+ }
22
29
  `;
23
30
 
24
31
  const StyledImage = styled(Image)`
25
32
  object-fit: cover;
26
33
  max-height: 162px;
27
34
  transition: transform ${animations.durations.fast};
28
- &:hover {
29
- transform: scale(1.1);
30
- opacity: 1.1;
31
- transition-duration: 0.5s;
32
- }
33
35
  ${mq.range({ until: breakpoints.tabletWide })} {
34
36
  min-width: 260px;
35
37
  }