We recently implemented the sync process for adding CRI Projects to our database. It'd be nice to distinguish the cards to present those resources.
The simplest method (which I am going to use) is to add data-type attributes to the <ResourceCard/> component based on the resource.url property. This will let us target some domains, such as projects.cri-paris.org, youtube.com, *.wikipedia.org etc with additional styling on them.
[x] Update ResourceCard for data-type attributes based on url prop.
[x] Update stylesheet for those classes. Using selector [data-type="..."] will work fine.
We recently implemented the sync process for adding CRI Projects to our database. It'd be nice to distinguish the cards to present those resources.
The simplest method (which I am going to use) is to add
data-typeattributes to the<ResourceCard/>component based on theresource.urlproperty. This will let us target some domains, such asprojects.cri-paris.org,youtube.com,*.wikipedia.orgetc with additional styling on them.ResourceCardfordata-typeattributes based onurlprop.[data-type="..."]will work fine.This is what we'll be updating: