Real basic but here’s something: 

 

.ui-card-status-details {
  color:white !important;
  background-color: blue !important;
  border-radius: 5px;
  border-style:solid !important;
  border-color: black !important;
  text-align: center;

}

​@pmo thank you for this…

on the same note...do you have CSS to hide the “mark as Outdated” button and “Share” button on the new player?

Good afternoon! I’d suggest hiding the Share button with the Admin > Advanced Settings > Social & Rating > Social Sharing option described on the KB here. Is there some part of that functionality we’d like to keep activated but just hide the button itself globally with CSS? I can see it if one wanted to keep it activated globally, but hide it on certain EE domains with custom CSS.

In that case, we could attempt the below, which worked on my test platform and was generated with AI:

#doc-layout-page-content > lrn-course-player > div.lrn-course-player-play-area > dcb-course-player > dcb-course-header > div > div.dcb-course-header-actions buttondiconsvgname="share"] {
  display: none;
}

As with all CSS, and especially that generated by AI, we should be all kinds of careful to verify that it’s just hiding the element in question. Docebo also doesn’t guarantee the backwards compatibility of CSS, so implementing periodic checks is highly recommended. I’d also like to set the expectation that Docebo Support isn’t able to support custom CSS and this is a one-time favour because of the impact you have for our Community :)

Regarding hiding specifically the “Mark as Outdated” option, we would use the below code with the same disclaimers as above:

.dcb-course-header-mark-as-outdated {
  display: none;
}

Open to thoughts on this approach, and again, please, please, please, always test CSS. It has a habit of hiding more than you want to when using display: none;

That said, I did take a fairly deep look and the classes in question appear to be specific enough to not cause other elements to be hidden.

Hi ​@andrew.charles thank you for the code...I will try it.

FYI, the “share” link is the result of enabling the Enrolment Link and not social sharing; the social sharing was never enabled in our LMS. Since there is no option to remove that from the admin side, CSS is the only way we can hide it from users.

Ah we may be referring to different behaviour with the same Share link. I’ll include a screenshot of the Share button below that appears in the New Course Player when activating the feature I described above:
 

That course has the below Enrollment Link settings:
 

Actually pretty interesting behaviour here. Keeping in mind I’m testing this on a pre-release platform, but the behaviour is thus:​​​​​​

• Social sharing is deactivated in Advanced Settings
• Enrollment link is deactivated as above
• No CSS is applied to feature

In the above scenario, the Sharing button doesn’t show. If we activate either enrollment link or Social Sharing, it appears. So, we’re both right? :)

Edit: I would also add that you’re entirely correct. If the Enrollment Link is activated, there is no way other than CSS to hide the Share button. Good findings and CSS would be the play here.

Thanks ​@andrew.charles LOL, indeed, we are both correct...

Just curious… Did the code work when you implemented it? I tried it in our sandbox as is and then modified it a bit but I am not seeing the modification in the courses.

​@emily.mccarthy not yet...will let you know here once I try it. The new course player has its own set of challenges with these user options being a moving target based on the course settings...not an easy one fix.

​@lrnlab thanks for the collaboration! I am going to continue to fiddle, but I figured I would ask just incase. I’ll be sure to share if I find the golden code as well.

Hello Emily, it definitely did! The above code hides the below buttons on my test platform.
 

If it isn’t working on yours, please open a Support ticket linking this post so that we can take a closer look at your specific platform. It’s also somewhat likely that the above code won’t work until this goes live on December 4th for Production platforms. In which case, the above code should work on your sandbox if you have one.