Project: Conditional style for html table

Question

I have a table in html which gets the data from a SQL query in PY. One of the columns in my SQL table is type (tp). I want the html table to show one color for each row of the same type and another for opposite. It´s a financial diary so when you input expenses SQL save that info. I want the table to show the history and expenses rows in red and incomes rows in green. Here it´s my PY and HTML code. Please help I´m lost

@app.route("/history")
@login_required
def history():
    """Show history of inputs"""

    inputs = db.execute("""
                SELECT amount, category, tp, transacted
                FROM inputs
                WHERE user_id = :user_id
                ORDER BY transacted ASC
                """, user_id=session["user_id"])

    return render_template("history.html", inputs=inputs)

{% extends "layout.html" %}

{% block title %}
    History
{% endblock %}

{% block main %}
    <table class="table table-striped">
        <thead>
            <tr>
                <th>Type</th>
                <th>Amount</th>
                <th>Category</th>
                <th>Transacted</th>
            </tr>
        </thead>
        <tbody>
            {% for input in inputs %}
            <tr>
                <td>{{input["tp"]}}</td>
                <td>{{input["amount"]}}</td>
                <td>{{input["category"]}}</td>
                <td>{{input["transacted"]}}</td>
            </tr>
            {% endfor %}
         </tbody>
    </table>
{% endblock %}

Answer 1

For this you will have to do two things. For things that will be common for each row (color), use background-color of the style attribute of the tag. For different type colors, use an if tag like this:

            {% for input in inputs %}
            <tr>
                {% if input["tp"] == x %}
                    <td style="background-color:red">{{input["tp"]}}</td>
                {% else %}
                    <td style="background-color:green">{{input["tp"]}}</td>
                {% endif %}
                <td>{{input["amount"]}}</td>
                <td>{{input["category"]}}</td>
                <td>{{input["transacted"]}}</td>
            </tr>
            {% endfor %}

Don't mind the colors in my example.

Hope this helps you. If it does then please check the tickmark.