{% extends 'base.html' %}
{% block content %}
<main class="single-col">
<h1>Account Settings</h1>
<table>
    <tbody>
        <tr>
            <th scope="row">Username</th>
            <td colspan="2">{{object.user.username}}<td>
        </tr>
        <tr>
            <th scope="row">Email</th>
            <td colspan="2">{{object.user.email}}<td>
            <td class="text-right"><a href="/settings/change-email/"class="btn">Change</a></td>
        </tr>
        <tr>
            <th scope="row">Fullname</th>
            <td colspan="2">{{object.user.first_name}} {{object.user.last_name}}<td>
            <td class="text-right"><a href="/settings/change-profile/#display_name"class="btn">Change</a></td>
        </tr>
        <tr>
            <th scope="row">Plan</th>
            <td colspan="2">{{object.plan}}<td>
            <td class="text-right"><a href="/settings/change-plan/" class="btn">Change</a></td>
        </tr>
        <tr>
            <th scope="row">Credit Card</th>
            <td colspan="2">{{object.credit_card}}<td>
            <td class="text-right"><a href="/settings/change-profile/" class="btn">Change</a></td>
        </tr>
        <tr>
            <th scope="row">Bio</th>
            <td colspan="2">{{object.bio}}<td>
            <td class="text-right"><a href="/settings/change-profile/" class="btn">Change</a></td>
        </tr>
        <tr>
            <th scope="row">Photo</th>
            <td colspan="2">{{object.photo}}<td>
            <td class="text-right"><a href="/settings/change-profile/" class="btn">Change</a></td>
        </tr>
    </tbody>
</table>
</main>
{% endblock %}