Hi all,
Complete CSS beginner over here but I’m loving reading all the posts about how to customise your platform using CSS. I’ve rounded all the edges of our widgets which looks awesome and now I’m looking for how I can round the edges of the course icons (screenshot of what I mean attached)?! I know it’s possible but I can’t quite work out how to do it. Could someone help?
Thanks
Sarah
Best answer by StefanW
Hi everyone,
this seems to do what you’re looking for:
/* Content Cards Rounded Corners */
dcb-ui-card .ui-card-wrapper, ui-card .ui-card-wrapper {
border-radius: 10px;
}
dcb-ui-content-image.ui-content-image-size-full, ui-content-image.ui-content-image-size-full {
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
You might want to adjust the corner radius though if it’s too rounded for you.
Ahh my mistake. Screenshots attached. The course icons are the ones I want to make rounded as per the rounded widgets screenshot. Thank you so much
Hi everyone,
this seems to do what you’re looking for:
/* Content Cards Rounded Corners */
dcb-ui-card .ui-card-wrapper, ui-card .ui-card-wrapper {
border-radius: 10px;
}
dcb-ui-content-image.ui-content-image-size-full, ui-content-image.ui-content-image-size-full {
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
You might want to adjust the corner radius though if it’s too rounded for you.
Could someone help me to move the gear Icon? I am new at testing CSS and I would like to center my gear Icon as it is place very high. Do you know how to?
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.
