filesafe/views/album.njk
Bobby Wibowo d5bb5a5bac
Updates
* Better thumbnails view in album page (it's now using the same styling as the one in dashboard, minus the on-hover effects and uploader/album names).

* Fixed unenclosed p tag in thumbs view at dashboard.js. It did not cause any issue because it's optional to enclose it, but oh well.
2018-04-27 01:33:11 +07:00

63 lines
2.1 KiB
Plaintext

{% extends "_layout.njk" %}
{% block stylesheets %}
<!-- Stylesheets -->
<link rel="stylesheet" type="text/css" href="../libs/bulma/bulma.min.css?v={{ globals.v1 }}">
<link rel="stylesheet" type="text/css" href="../css/style.css?v={{ globals.v1 }}">
<link rel="stylesheet" type="text/css" href="../css/album.css?v={{ globals.v1 }}">
<style>
html {
background-color: #232629;
}
.section {
background: none;
}
</style>
{% endblock %}
{% block opengraph %}
<!-- Open Graph tags -->
<meta property="og:type" content="website" />
<meta property="og:title" content="{{ title }} &#8211; {{ count }} files" />
<meta property="og:url" content="{{ url }}" />
<meta property="og:description" content="A pomf-like file uploading service that doesn't suck." />
<meta property="og:image" content="{{ thumb }}" />
<meta property="og:locale" content="en_US" />
<!-- Twitter Card tags -->
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="{{ title }} &#8211; {{ count }} files">
<meta name="twitter:description" content="A pomf-like file uploading service that doesn't suck.">
<meta name="twitter:image" content="{{ thumb }}">
{% endblock %}
{% block content %}
{{ super() }}
<section class="section">
<div class="container">
<h1 id="title" class="title">
{{ title }}
</h1>
<h1 id="count" class="subtitle">
{{ count }} files
</h1>
{% if enableDownload %}
<a class="button is-primary is-outlined" title="Download album" href="../api/album/zip/{{ identifier }}">Download Album</a>
{% endif %}
<hr>
<div id="table" class="columns is-multiline is-mobile is-centered has-text-centered">
{% for file in files %}
<div class="image-container column is-narrow">
<a class="image" href="{{ file.file }}" target="_blank" rel="noopener">{{ file.thumb | safe }}</a>
<div class="details">
<p><span class="name" title="{{ file.file }}">{{ file.name }}</span></p>
<p>{{ file.size }}</p>
</div>
</div>
{% endfor %}
</div>
</div>
</section>
{% endblock %}