feat(cxl-ui): cxl-course-card update styles when on large devices

https://cxlworld.slack.com/archives/C01HNLQNVA9/p1715760558848559
conversionxl · May 29, 2024 · c2cdf33 · c2cdf33
1 parent 9d44ec9
commit c2cdf33
Showing 1 changed file with 5 additions and 2 deletions.
diff --git a/packages/cxl-ui/scss/cxl-course-card.scss b/packages/cxl-ui/scss/cxl-course-card.scss
@@ -2,6 +2,7 @@
 /* stylelint-disable declaration-no-important  */
 
 @use "~@conversionxl/cxl-ui/scss/mixins";
+@use "~@conversionxl/cxl-lumo-styles/scss/mq";
 @use "~@conversionxl/cxl-lumo-styles/scss/typography";
 
 :host {
@@ -134,8 +135,10 @@ footer {
 
 :host([theme~="course"]) {
   .name {
-    font-size: var(--lumo-font-size-m);
-    -webkit-line-clamp: unset;
+    @media #{mq.$medium} {
+      -webkit-line-clamp: 3;
+      font-size: var(--lumo-font-size-m);
+    }
   }
 }