{% extends "contacts/base.html" %}
{% load contact_tags %}
{% load base_filters %}
{% load i18n %}

{% block title %}{{ block.super }}{{ contact }}{% endblock %}

{% block extra_head %}
{{ block.super }}
<link rel="stylesheet" href="{{ STATIC_URL }}css/contacts.css">
{% endblock %}

{% block body %}

<div class="t">

    {% contact_nav request.user contact %}

    <div class="contact-wrap">

        <div class="options">
            <div class="quick-options">
               {% contact_options request.user contact %}
            </div>
        </div>


        <h2>{% blocktrans %}{{ contact }}'s Contact Form Submission{% endblocktrans %}</h2>

		<div class="row phone-row">
			<div class="label">{% trans "Phone" %}</div>
			<div class="value">{{ contact.phones.all.0.number|phonenumber }} &nbsp;</div>
			<div style="clear:both;"></div>
		</div>

		<div class="row email-row">
			<div class="label">{% trans "Email" %}</div>
			<div class="value">
				{{ contact.emails.all.0.email|obfuscate_email }}
			</div>
			<div style="clear:both;"></div>
		</div>
		<div style="clear:both;"></div>

		<div class="row url-row">
			<div class="label">{% trans "Website" %}</div>
			<div class="value">
				<a href="{{ contact.urls.all.0.url }}">{{ contact.urls.all.0.url }}</a> &nbsp;
			</div>
			<div style="clear:both;"></div>
		</div>

		<div class="row address-row">
			<div class="label">{% trans "Address" %}</div>
			<div class="value">
				<div class="address">{{ contact.addresses.all.0.address }} &nbsp;</div>
				<div class="city-state-zip"> 
					{{ contact.addresses.all.0.city_state|join:", " }}
					{{ contact.addresses.all.0.zipcode }}
					<div>{{ contact.addresses.all.0.country }}</div>
				</div>
				
			</div>
			<div style="clear:both;"></div>
		</div>

        <div class="the-message">
        	<div class="label">{% trans "Message" %}</div>
        	<div class="submitted-dt">
        		{% blocktrans with contact.create_dt|date:"long" as create_date %}Submitted {{ create_date }}{% endblocktrans %}
        	</div>
        	<div class="content">
        		{{ contact.message|linebreaks }}
        	</div>
        </div>

    </div>

</div>
{% endblock %}
