Question

I am trying to create a voting system similar to that of stackoverflow, but I can’t figure out how to call on the css instead of the images.

I have the following code:

 <input type="image" id="uparrow{{ vote.id }}" src="{{ MEDIA_URL }}static/img/aup{% if vote and vote.is_upvote %}mod{% else %}grey{% endif %}.PNG">

How can I change the code so it calls a css class instead of an img src?

Answer 1

You are looking for something like:

<input type="image" id="uparrow{{ vote.id }}" 
       src="{{ MEDIA_URL }}static/img/vote.png"
       class="otherclass {% if vote and vote.is_upvote %}upvote{% else %}novote{% endif %}" />

The image would have classes “otherclass” and “upvote” in one case, “otherclass” and “novote” in the other.