<div class="container isdi-page">
    <br/>
    <h2>Information about "{{ app.title | safe }}"</h2>
    <div class="container form-group">
        <div class="table-wrap">
        <table class="table table-bordered">
            <tbody>
                <!-- <i class="material-icons">info</i> -->
		<tr><td>AppId</td><td><code>{{ app.appId }}</code></td></tr>
		{% if app.developer %}
		<tr><td>Developer</td> <td><i>{{ app.developer }}</i> </td></tr>
		{% endif %}
		{% if app.website %}
		<tr><td>Website</td> <td>{{ app.website }} </td></tr>
		{% endif %}
                {% for k, v in info.items() %}
		<tr><td>{{ k }}</td> <td>{{ v }} </td></tr>
                {% endfor %}
            </tbody>
        </table>
        </div>
	    <div class="text-sm-left">
		<h4> The app used {{ app.permissions| length }} app permissions recently:</h4>
		<br>
	    </div>
        <ul class="list-group">
            {% for perm in app.permissions %}
            <li class="code">{{ perm | capitalize | replace('_', ' ') }}</li>
            {% endfor %}
        </ul>
	<!-- label class="btn btn-danger">
	     <button type="button" class="btn btn-danger"
	     onclick="delete_app('{{ app.appId }}', this)" disabled>Delete</button>
	     </label -->
    </div>

    <div class="jumbotron" style="padding: 1em">
        <h3>{% if device=="android" %} Google Play Store {% endif %} {% if device=="ios" %} Apple App Store {% endif %} Description of the app</h3>
        <span style="margin-bottom: 2em; display:block"><mark><b>{{ app.summary|safe }}</b></mark></span>
        {{ app.descriptionHTML|safe }}
    </div>
    
    {% if device=="android" %} 
    <div class="jumbotron" style="padding: 1em">
        <h3>Recently used permissions</h3>
        <p>(Here, <code>mode=allow</code> only means the permission is requested, not necessarily granted.)</p>
        {{ app.non_hf_permissions_html | safe }}
    </div>
    {% endif %}


</div>
