Skip to content
This repository has been archived by the owner on Mar 15, 2018. It is now read-only.

Commit

Permalink
Bug 625921, initial details page styles
Browse files Browse the repository at this point in the history
  • Loading branch information
@potch
potch committed Jan 28, 2011
1 parent bc0c67d commit adf020d
Show file tree
Hide file tree
Showing 2 changed files with 114 additions and 89 deletions.
182 changes: 93 additions & 89 deletions apps/addons/templates/addons/mobile/details.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,100 +3,104 @@
{% block title %}{{ page_title(addon.name) }}{% endblock %}

{% block page %}
<div class="listview">
<div class="item">
<img class="icon" width="32" height="32" src="{{ addon.icon_url }}">
<h3>{{ addon.name }}</h3>
{# TODO: make this a secret link #}
<h4 class="author">{{ _('by') }} {{ users_list(addon.listed_authors) }}</h4>
{# TODO: button #}
{# TODO: privacy policy (in button.html right now) #}
<section id="content">
<div class="listview">
<div class="item">
<img class="icon" width="32" height="32" src="{{ addon.icon_url }}">
<h3>{{ addon.name }}</h3>
{# TODO: make this a secret link #}
<h4 class="author">{{ _('by') }} {{ users_list(addon.listed_authors) }}</h4>
{# TODO: button #}
{# TODO: privacy policy (in button.html right now) #}
</div>
</div>
</div>

<span class="desc">{{ addon.summary }}</span>
<blockquote>{{ addon.description }}</blockquote>
<span class="desc">{{ addon.summary }}</span>
<blockquote>{{ addon.description }}</blockquote>

{% set previews = addon.previews.all() %}
{% if previews %}
<ul id="screenshots">
{% for preview in previews %}
{# TODO: lazy-load all, or at least the third and up #}
<li>
<a href="{{ preview.image_url }}" title="{{ preview.caption }}">
<img src="{{ preview.thumbnail_url }}"></a>
</li>
{% endfor %}
</ul>
{% endif %}
<a class="listview" href="{{ url('reviews.list', addon.slug) }}">
<div class="icon">
{{ addon.average_rating|stars }}
</div>
{% trans num=addon.total_reviews, cnt=addon.total_reviews|numberfmt %}
See All Reviews
{% pluralize %}
See All {{ cnt }} Reviews
{% endtrans %}
</a>

<a class="listview" href="{{ url('reviews.list', addon.slug) }}">
{{ addon.average_rating|stars }}
{% trans num=addon.total_reviews, cnt=addon.total_reviews|numberfmt %}
See All Reviews
{% pluralize %}
See All {{ cnt }} Reviews
{% endtrans %}
</a>
</div>

<table>
<tr>
<th>{{ _('Updated') }}</th>
<td>
<time datetime="{{ addon.last_updated|isotime }}">{{
addon.last_updated|datetime }}</time>
</td>
</tr>
{% if addon.homepage %}
<tr>
<th>{{ _('Website') }}</th>
<td>
<strong><a href="{{ addon.homepage|external_url }}">{{
addon.homepage }}</a></strong>
</td>
</tr>
{% endif %}
{% if addon.compatible_apps[APP] %}
<tr>
<th>{{ _('Works with') }}</th>
<td>{{ addon.compatible_apps[APP] }}</td>
</tr>
{% set previews = addon.previews.all() %}
{% if previews %}
<ul id="screenshots" class="carousel">
{% for preview in previews %}
{# TODO: lazy-load all, or at least the third and up #}
<li>
<a href="{{ preview.image_url }}" title="{{ preview.caption }}">
<img src="{{ preview.thumbnail_url }}"></a>
</li>
{% endfor %}
</ul>
{% endif %}
<tr>
<th>{{ _('Downloads', 'list_sortby_downloads') }}</th>
<td>{{ addon.total_downloads|numberfmt }}</td>
</tr>
<tr>
<th>{{ _('Version') }}</th>
<td>
<ul>
{% set version = addon.current_version %}
<li>
<a href="{{ url('addons.versions', addon.slug, version.id) }}">
{# L10n: {0} is a version number. #}
{{ _('{0} (Release Notes)')|f(version.version) }}</a>
</li>
<li>
<a href="{{ url('addons.versions', addon.slug) }}">
{{ _('View All Versions') }}</a>
</li>
{% if addon.current_beta_version %}
<li><a href="#">{{ _('View Beta Version') }}</a></li>
{% endif %}
</ul>
</td>
</tr>
</table>

{% if addon.support_url %}
<a class="listview" href="{{ addon.support_url|external_url }}">
{{ _('Visit the Support Site') }}</a>
{% endif %}
{% if addon.supuport_email %}
{# TODO: make this a listview, get the emaillink js #}
{{ emaillink(addon.support_email.localized_string,
_('Ask the Author a Question')) }}
{% endif %}
<details>
<table>
<tr>
<th>{{ _('Updated') }}</th>
<td>
<time datetime="{{ addon.last_updated|isotime }}">{{
addon.last_updated|datetime }}</time>
</td>
</tr>
{% if addon.homepage %}
<tr>
<th>{{ _('Website') }}</th>
<td>
<strong><a href="{{ addon.homepage|external_url }}">{{
addon.homepage }}</a></strong>
</td>
</tr>
{% endif %}
{% if addon.compatible_apps[APP] %}
<tr>
<th>{{ _('Works with') }}</th>
<td>{{ addon.compatible_apps[APP] }}</td>
</tr>
{% endif %}
<tr>
<th>{{ _('Downloads', 'list_sortby_downloads') }}</th>
<td>{{ addon.total_downloads|numberfmt }}</td>
</tr>
<tr>
<th>{{ _('Version') }}</th>
<td>
<ul class="versions">
{% set version = addon.current_version %}
<li>
<a href="{{ url('addons.versions', addon.slug, version.id) }}">
{# L10n: {0} is a version number. #}
{{ _('{0} (Release Notes)')|f(version.version) }}</a>
</li>
<li>
<a href="{{ url('addons.versions', addon.slug) }}">
{{ _('View All Versions') }}</a>
</li>
{% if addon.current_beta_version %}
<li><a href="#">{{ _('View Beta Version') }}</a></li>
{% endif %}
</ul>
</td>
</tr>
</table>
</details>

{% if addon.support_url %}
<a class="listview" href="{{ addon.support_url|external_url }}">
{{ _('Visit the Support Site') }}</a>
{% endif %}
{% if addon.supuport_email %}
{# TODO: make this a listview, get the emaillink js #}
{{ emaillink(addon.support_email.localized_string,
_('Ask the Author a Question')) }}
{% endif %}
</section>
{% endblock %}
21 changes: 21 additions & 0 deletions media/css/zamboni/mobile.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -404,6 +404,14 @@ a.listview:before {
padding: 11px 8px 6px 11px;
}

/************************************/
/* DETAILS PAGE */
/************************************/

td .versions li {
margin-bottom: 8px;
}

/************************************/
/* REVIEWS */
/************************************/
Expand Down Expand Up @@ -433,6 +441,19 @@ a.listview:before {
background-position: -65px 50%;
}

/************************************/
/* CAROUSEL */
/************************************/

.carousel {
height: 100px;
overflow: hidden;
}

.carousel li {
display: inline-block;
}

/************************************/
/* FOOTER */
/************************************/
Expand Down

0 comments on commit adf020d

Please sign in to comment.