{% extends "base.html" %}
{% block content %}

<div data-role="page" data-theme="b" id="wikipedia-languages">
    <div data-role="header">
        <a href="/iiab/" data-icon="home" data-iconpos="notext" data-direction="reverse">{% trans %}Home{% endtrans %}</a>
        <h1>{% trans %}Wikipedia{% endtrans %}</h1>
    </div>
    <div data-role="content">
        <ul data-role="listview" data-divider-theme="b" data-inset="true">
            {% for language in languages %}
            <li data-role="list-divider" data-theme="c">
                {{ language['languageEnglish'] }}
            </li>
            {% for book in language['books'] %}
            <li data-theme="c">
	    <a href="{{ url_for('zim_views.iframe_main_page_view', humanReadableId=book['humanReadableId']) }}" data-transition="slide" data-ajax="false">
                <h3>{{ book['title'] }}</h3>
                {% if book.has_key('description') %}
                <p style="white-space: normal;" class="float-left">{{ book['description'] }}</p>
                {% endif %}
                <p class="float-right">{{ book['articleCount'] }} {% trans %}Articles{% endtrans %}</p>
            </a>
            </li>
            {% endfor %}
            {% endfor %}
        </ul>
    </div>
</div>

{% endblock %}
