@ndla/ui 56.0.13-alpha.0 → 56.0.15-alpha.0

package/dist/panda.buildinfo.json

@@ -3,6 +3,7 @@
   "styles": {
     "atomic": [
       "paddingInline]___[value:8%",
+      "width]___[value:100%",
       "paddingBlockStart]___[value:xsmall",
       "paddingBlockStart]___[value:medium]___[cond:tablet",
       "paddingBlockStart]___[value:xxlarge]___[cond:desktop",
@@ -14,7 +15,6 @@
       "flexDirection]___[value:column",
       "color]___[value:text.default",
       "alignItems]___[value:center",
-      "width]___[value:100%",
       "overflowWrap]___[value:break-word",
       "position]___[value:relative",
       "transform]___[value:scaleY(100) translateY(0.075em)]___[cond:& mjx-stretchy-v > mjx-ext > mjx-c",
@@ -433,7 +433,12 @@
       "padding]___[value:xsmall]___[cond:tabletDown",
       "aspectRatio]___[value:1/1",
       "width]___[value:100%]___[cond:tabletDown",
-      "borderRadius]___[value:0]___[cond:tabletDown"
+      "borderRadius]___[value:0]___[cond:tabletDown",
+      "overflow]___[value:hidden]___[cond:& span",
+      "textOverflow]___[value:ellipsis]___[cond:& span",
+      "maxHeight]___[value:inherit",
+      "overflow]___[value:auto",
+      "gap]___[value:10px"
     ],
     "recipes": {}
   }

package/dist/styles.css

@@ -89,6 +89,10 @@
     padding-inline: 8%;
 }
 
+  .w_100\% {
+    width: 100%;
+}
+
   .pbs_xsmall {
     padding-block-start: var(--spacing-xsmall);
 }
@@ -109,10 +113,6 @@
     color: var(--colors-text-default);
 }
 
-  .w_100\% {
-    width: 100%;
-}
-
   .ov-wrap_break-word {
     overflow-wrap: break-word;
 }
@@ -611,6 +611,18 @@
     aspect-ratio: 1/1;
 }
 
+  .max-h_inherit {
+    max-height: inherit;
+}
+
+  .ov_auto {
+    overflow: auto;
+}
+
+  .gap_10px {
+    gap: 10px;
+}
+
   .flex-d_column {
     flex-direction: column;
 }
@@ -1171,6 +1183,14 @@
     text-decoration: underline;
 }
 
+  .\[\&_span\]\:ov_hidden span {
+    overflow: hidden;
+}
+
+  .\[\&_span\]\:tov_ellipsis span {
+    text-overflow: ellipsis;
+}
+
   .after\:content_0::after {
     content: 0;
 }

package/es/Article/Article.js

@@ -36,7 +36,10 @@ const paddingBlockStart = {
   }
 };
 export const ArticlePadding = styled(ark.div, {
-  base: articlePadding,
+  base: {
+    ...articlePadding,
+    width: "100%"
+  },
   variants: {
     padStart: {
       true: paddingBlockStart

package/es/ContentTypeBadge/ContentTypeBadge.js

@@ -14,6 +14,8 @@ import { MenuSearchLine, LearningPath, SharedResource, TasksAndActivities } from
 import { ChatLine, FileListLine, LinkMedium, ImageLine, MovieLine } from "@ndla/icons/editor";
 import { styled } from "@ndla/styled-system/jsx";
 import * as contentTypes from "../model/ContentType";
+
+// TODO: Remove this component
 import { jsx as _jsx } from "react/jsx-runtime";
 const StyledContentTypeBadge = styled("div", {
   base: {