[Feature] Replace the dynamic styling in listing.js with class-based CSS approach

[Murdock9803]

Problem

In the _assets/js/listing.js file, to make the resources visible, the use of dynamic styling has been done.

Description

Instead of creating a new style element for the displaying of resource cards, It will be better to use a css property of display: none via a class based approach. we can create a new utility class for the task.
The link to listing.js file: https://github.com/creativecommons/cc-resource-archive/blob/main/docs/_assets/js/listing.js

Implementation

• I would be interested in implementing this feature.

[poojatalele]

I would like to work on this issue, kindly assign.

[poojatalele]

@Murdock9803 Kindly review my pr and let me know if any other changes are required!!