cancel
Showing results for 
Search instead for 
Did you mean: 
Highlighted
Community Member

Javascript/CSS to target the background of the Course badge?

Hi-

I'd like to add a background-image to the course badge in the dashboard. Does anyone know how I might do that? Would it be a javascript/css combo? I tried finding just the css target but could only get: div.ic-DashboardCard_header_hero   but this did not seem to work.

Thank you!

Matt

Tags (2)
0 Kudos
1 Reply
Community Member

Update: Way better answer.

This is now a feature in the beta instance of Canvas (and should be live soon). Here are the notes: https://community.canvaslms.com/docs/DOC-8024#jive_content_id_Course_Settings 

---Original Post-----

Matt,

You can change the course card background to an image with the css attribute content. Here is an example:

#DashboardCard_Container > div > div:nth-child(3) > div.ic-DashboardCard__header > div.ic-DashboardCard__header_hero {

     content:url('path/to/image');

}

If you want to apply a different image to each course, you will need to use javascript to apply the content style with the appropriate url.

Hope this helps,

Alex