+7If you’re using the HTML training material type and really want to get rid of that instantaneous pop-over saying the activity is completed, here’s some CSS code to hide it:
/*Hide pop-over completion message for HTML content*/
div.intime-completed.ng-star-inserted > div {
display: none !important;
}
The activity will still be marked completed everywhere it needs to be. This just prevents the pop-over message from displaying.
+10HI
+7This is awesome
+10This is awesome
many thanks Adam...
+2You are the man! thank you!
+7This code does not seem to work now for either player. I’ll do some digging and see if I can find another way.
+10+2Looks like the element is part of the .zmdi class now which is shared with other attributes - like the circle buttons throughout the site. If we hide that .zmdi class, it’ll hide the images in the circle buttons
+7Just a hunch, if you need this right away it might require unsupported scripting to solve. I’m envisioning a function that watches every x milliseconds for this div to be inserted and dynamically changes it.
What I did observe was that the .intime-completed class is not in the code at all until a triggering event (choosing the html training material) causes it to be inserted. This may be the crux of the problem.
If we want a supported solution, I recommend waiting until after 9/30 and then requesting a new feature that allows this completion pop-over to be hidden by checking a checkbox in the properties.
Hi there
Give the following CSS a go. Have tested this with a Video and HTML training material in the same course but could do with further testing on this.
body:has(lrn-training-material-player-html) .ui-notification-toast-success {
display: none!important
}
+7Hi there
Give the following CSS a go. Have tested this with a Video and HTML training material in the same course but could do with further testing on this.
body:has(lrn-training-material-player-html) .ui-notification-toast-success {
display: none!important
}
Didn’t work for me, but will do more testing.
Hello all,
Please test the following CSS in your Sandbox first.
I was trying to figure out a way to remove the Completion banner all together from the HTML Page training material, with no luck. But I was able to remove everything inside if you all want to try the following CSS.
/*removes completion banner title & description*/
.dcb-ui-notification-content {
display: none !important;
}
/* removes buttons */
.dcb-ui-notification-actions {
display: none !important;
}
/*removes check mark icon*/
.dcb-ui-icon-size-xs {
display: none !important;
}
When I moved the previous post CSS the Sandbox to Production the check mark icon wasn’t hidden. I found a new CSS function to remove the check circle. Here is the updated CSS:
/*removes completion banner title & description*/
.dcb-ui-notification-content {
display: none !important;
}
/* removes buttons */
.dcb-ui-notification-actions {
display: none !important;
}
/*removes check mark icon */
dcb-ui-notification[iconsvgname="check_circle"] dcb-ui-icon {
display: none;
}
Enter your email address or username and password below to log in to Docebo Community. No account yet? Create an account
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.