{% extends 'main/base.html' %}

{% block content %}
<div class= "container white  black-text" style="opacity:.8; padding: 10px; border-radius: 5px; text-align: center; font-family: Trebuchet MS">
    <div class="row">
        <ul class="tabs" style="text-align: center; display: flex;">
            <li class="tab col s4"><a href="{% url 'main:profile' %}" style="color: black;">Profile</a></li>
            <li class="tab col s4"><a href="{% url 'main:preferences' %}" style="color: black;  background: orange;">Preferences</a></li>
            <li class="tab col s4"><a href="{% url 'main:sell' %}" style="color: black;">Become a trader</a></li>
        </ul>
    </div>      
    
    <div class="row container">
        <table>
            <tr>
                <td style="border: none;"><b>Allow Bazaar of Wonders to send you email notifications</b></td>
                {% ifequal pref.email_notif False %} 
                <td>No</td>
                {% else %}
                <td>Yes</td>
                {% endifequal %}
            </tr>
            <tr>
                <td style="border: none;"><b>Recieve email newsletter</b></td>
                {% ifequal pref.subscribe_email False %} 
                <td>No</td>
                {% else %}
                <td>Yes</td>
                {% endifequal %}
            </tr>
            <tr>
                <td style="border: none;"><b>Allow other Bazaar Traders to view your profile</b></td>
                {% ifequal pref.view_email False %} 
                <td>No</td>
                {% else %}
                <td>Yes</td>
                {% endifequal %}
            </tr>
        </table>
        <br>
        <a href="{% url 'main:editpref' %}" style="text-align: center; color: black; font-size: 18px; border: 1px solid gray; border-radius: 5px; padding: 5px; background: orange;">Edit</a>
    </div>
</div>        
{% endblock %}