tuankhoa1996
tuankhoa1996

Reputation: 131

One class with different CSS values in Flask/Jinja2 using jQuery

I want to set multiple css value for one class. Is that possible?

My template looks like this:

{% block right %}
    {% for announce in announce_list %}
        <div class="announce">
            <div class="announce-info">
                <span class="announce-title">
                    {{announce.name}}
                </span> <br/>
                <span class="announce-date">
                    {{announce.date}}
                </span>
            </div>
            <div class="announce-author">
                <div class="author-avatar">
                    <img src="{{url_for('static', filename='avatars/' + announce.author.avatar)}}">
                </div>
                <div class="author-info">
                    <span class="author-name">
                        {{announce.author.name}}
                    </span> <br/>
                    <span class="author-level">             
                        {{announce.author.level.level_name}}
                    </span>
                </div>
            </div>
        </div>
    {% endfor %}
{% endblock %}

Each announce in for loop contains a Author object with a variable color (example: #B22222). I want to style the border color of each .announce-author block with the color of the Author object. Please help!

Sorry about my english!

Upvotes: 0

Views: 2417

Answers (1)

mobiusklein
mobiusklein

Reputation: 1423

Variable styles cannot be represented by CSS classes. In this case, you should use inline style attributes on each div using Jinja2's template syntax:

<div class="announce-author" style="border-color: {{announce.author.color}};">
    ....
</div>

Upvotes: 2

Related Questions