Skip to main content

I am wondering if it is possible in the catalog page to have it open with the course description fully expanded as opposed to having to press the “Show More” Button?

Right now it only shows like one or two sentences and is not a great visual for learners who are looking to purchase. see below gif for reference.

 

 

Hi there,

I am facing the same issue. Do we have any solution for this issue?


We are wondering the same.


I’m not a professional web developer, so I’m not entirely sure what’s going on here, but I would love to know why Docebo took the approach of defining max-height inline here:

<div class="ui-paragraph-content dcb-ui-paragraph-content-max-height dcb-ui-paragraph-content-fade" style="max-height: 140px;-webkit-line-clamp: 4;" dcb-ui-keyboard-focusable-visible="false">
...
</div>

If I disable that inline style attribute with the browser dev tools, I can provide a more reasonable max height using CSS:

.ui-paragraph-content.dcb-ui-paragraph-content-max-height.dcb-ui-paragraph-content-fade {
max-height: 400px;
}

But that’s the thing, I can’t disable the inline style attribute for anyone else. And if I try to trump it using e.g. !important, the browser freaks out, it can’t decide whether the max-height should be 140px or 400px, and so it just goes back and forth between them countless times per second...


Hi there,

The following CSS should aid here.

/* Show More in Course Description Course */

lrn-widget-content-description .ui-paragraph-content {
max-height: unset!important;
}

 


Outstanding, thank you @DPatel!


Thank you @DPatel!!


Very helpful and will make the courses now far easier at a glance to read about, and will reduce people enrolling and reading later. Thanks.


Reply