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
                        <code>{{ i }}</code> 
        
            37
                    {% endfor %} 
        
            38
                </pre> 
        
            39
            {% elif mode == "image" %} 
        
            40
                <img src="{{ file }}"> 
        
            41
            {% elif mode == "audio" %} 
        
            42
                <audio controls src="{{ file }}" style="width: 100%;"> 
        
            43
                    {% trans %}Your browser does not support HTML5 multimedia.{% endtrans %} 
        
            44
                    <a href="{{ file }}">{% trans %}Download file{% endtrans %}</a> 
        
            45
                </audio> 
        
            46
            {% elif mode == "video" %} 
        
            47
                <video controls src="{{ file }}" style="width: 100%;"> 
        
            48
                    {% trans %}Your browser does not support HTML5 multimedia.{% endtrans %} 
        
            49
                    <a href="{{ file }}">{% trans %}Download file{% endtrans %}</a> 
        
            50
                </video> 
        
            51
            {% endif %}