How to customize an existing .css resource ?


I’d like to customize the CSS style for classes “.collapse .title” that is defined in the patientDashboard.css file.

How could I achieve that ?

  • Create a minimal extension of the Patient Dashboard that does nothing but to include a new .css resource file. (1) OR
  • At module activation, read and override the existing patientDashboard.css contents. (2) OR
  • Just drop a new resource file in an appropriate resource folder somewhere (?) (3)

Q: What is the way to include a .css resource into an existing page ?


See this: ?

Also, feel free to improve that one line of documentation. :slight_smile:

That is what I’ve been looking for. Thanks @darius

I’ve updated the very concise ( :slight_smile: ) documentation as you suggested. (If any English native dev would have time to quickly review it to make sure it is correctly written and there is no typos or anything)

Now, if I would like to add this resource to only the Patient Dashboard page, how could I do that ? Would option (1) work ?

1 Like

You can always prove it will work or not. :slight_smile:

Yeah, ok. I just wanted to know if that is something that could be theoretically done that way. Or just not valid at all. I don’t want a tutorial here, but more to understand the framework, how to do this and that, what are the good practices… And share the information with people on the Talk who may ask themselves the same question.

For this specific page (i.e. patientDashboard) there is an extension point patientDashboard.includeFragments which lets you include an arbitrary fragment, and this fragment could just have an includeCss line.

See controller and view of the patientDashboard page:

If you want a more general solution to this, I would happily accept a pull request that adds an optional regex property that filters which pages the GlobalResourceIncluder is actually included on.