HTML document, ASCII text
1
<x-hbox style="align-items: center;">
2
<h1 style="display: flex; align-items: center; text-overflow: ellipsis; overflow: hidden;" title="{{ basename }}"><iconify-icon icon="{{ icon }}"></iconify-icon> {{ basename }}</h1>
3
<div class="flexible-space"></div>
4
<x-buttonbox>
5
<a href="{{ file }}" class="button">{% trans %}View raw{% endtrans %}</a>
6
<a href="{{ file }}" download class="button">{% trans %}Download{% endtrans %}</a>
7
</x-buttonbox>
8
</x-hbox>
9
{{ mimetype }} • {{ size[0] }} {{ size[1] }}
10
<br>
11
{{ detailedtype }}
12
{% if (mode == "text" and extension == ".md") or mimetype == "text/markdown" %}
14
<x-notebook>
15
<label><input type="radio" name="tabs-example" checked>{% trans %}Rendered{% endtrans %}</label>
16
<x-tab>
17
<x-frame style="padding-top: 1em;">
18
<article>
19
{{ contents | markdown }}
20
</article>
21
</x-frame>
22
</x-tab>
23
<label><input type="radio" name="tabs-example">{% trans %}Raw{% endtrans %}</label>
24
<x-tab>
25
<pre class="code-view" style="--line-chars: {{ contents | split('\n') | length | string | length }}">
26
{% for i in contents | split("\n") %}
27
<div class="line-number">{{ loop.index0 + 1 }}</div>
28
<x-codeline>{{ i }}</x-codeline>
29
{% endfor %}
30
</pre>
31
</x-tab>
32
</x-notebook>
33
{% elif mode == "text" %}
34
<pre class="code-view" style="--line-chars: {{ contents | split('\n') | length | string | length }}">
35
{% for i in contents | split("\n") %}
36
<div class="line-number">{{ loop.index0 + 1 }}</div>
37
<x-codeline>{{ i }}</x-codeline>
38
{% endfor %}
39
</pre>
40
{% elif mode == "image" %}
41
<img src="{{ file }}">
42
{% elif mode == "audio" %}
43
<audio controls src="{{ file }}" style="width: 100%;">
44
{% trans %}Your browser does not support HTML5 multimedia.{% endtrans %}
45
<a href="{{ file }}">{% trans %}Download file{% endtrans %}</a>
46
</audio>
47
{% elif mode == "video" %}
48
<video controls src="{{ file }}" style="width: 100%;">
49
{% trans %}Your browser does not support HTML5 multimedia.{% endtrans %}
50
<a href="{{ file }}">{% trans %}Download file{% endtrans %}</a>
51
</video>
52
{% endif %}