fix: page template markup

This commit is contained in:
Norman Köhring 2024-12-15 13:47:44 +01:00
parent 9039f0e70f
commit cb31f35d06

View file

@ -1,43 +1,57 @@
{% extends "base.html" %} {% extends "base.html" %} {% block content %}
{% block content %}
<main id="member"> <main id="member">
<h1 id="title" class="p-name dated"> <h1 id="title" class="p-name dated">{{ page.title }}</h1>
{{ page.title }} <p class="big center">Proud member of the exclusive 250KB&nbsp;Club!</p>
</h1>
<p class="big center">
Proud member of the exclusive 250KB&nbsp;Club!
</p>
<p> <p>
<time class="dt-published" datetime="{{ page.date }}" pubdate="" itemprop="datePublished" content="{{ page.date }}"> <time
class="dt-published"
datetime="{{ page.date }}"
pubdate=""
itemprop="datePublished"
content="{{ page.date }}"
>
Added: {{ page.date }} Added: {{ page.date }}
</time> </time>
| |
<time class="dt-published" datetime="{{ page.date }}" pubdate="" itemprop="datePublished" content="{{ page.date }}"> <time
class="dt-published"
datetime="{{ page.date }}"
pubdate=""
itemprop="datePublished"
content="{{ page.date }}"
>
Last updated: {{ page.date }} Last updated: {{ page.date }}
</time> </time>
</p> </p>
<p class="e-content"> <p class="e-content">
<a rel="noopener nofollow" href="{{ page.extra.source }}" target="_blank">{{ page.title }}</a> <a
rel="noopener nofollow"
href="{{ page.extra.source }}"
target="_blank"
>{{ page.title }}</a
>
is a member of the exclusive 250KB Club. The page weighs is a member of the exclusive 250KB Club. The page weighs
<strong> <strong>
{% if page.extra.size == 0 %} {% if page.extra.size == 0 %} under 1kb {% else %} only {{
under 1kb page.extra.size }}kb {% endif %}
{% else %} </strong>
only {{ page.extra.size }}kb and has a content-to-bloat ratio of
{% endif %}
</strong> and has a content-to-bloat ratio of
<strong>{{ page.extra.ratio }}%</strong>. <strong>{{ page.extra.ratio }}%</strong>.
</p> </p>
<p> <p>
They are now entitled to add one of those shiny badges to your page. But don't forget, even though I tried to make them as small as possible, a badge will add some kilobytes to your page weight. The owner of this page is now entitled to add one of those shiny badges
A code snipped can be found by clicking on the respective badge. to their page. But, even though I tried to make them as small as
possible, a badge will add some kilobytes to the page weight. A code
snipped can be found by clicking on the respective badge.
</p> </p>
<p class="badges"> <p class="badges">
The badges can either be downloaded and served by yourself or linked directly from 250KB.club. The badges can either be downloaded and served as part of the website or
The latter might save a few users some bandwidth if the badge is already cached. linked directly from 250KB.club. The latter might save a few users some
On the other hand this gives the 250KB.club server a log entry for <i>every visitor of <strong>your</strong> page</i>. bandwidth if the badge is already cached. On the other hand this gives
I'm not interested in those logs but you still have to trust my word. So decide for yourself. the 250KB.club server a log entry for
<i>every visitor of <strong>your</strong> page</i>. I'm not interested
in those logs but you still have to trust my word. So decide for
yourself.
</p> </p>
<p> <p>
@ -55,10 +69,14 @@
&lt;/a&gt; &lt;/a&gt;
</code></pre> </code></pre>
</details> </details>
</p><p> </p>
<p>
<details> <details>
<summary> <summary>
<img alt="simple badge, bright" src="/simple_badge_bright.png" /> <img
alt="simple badge, bright"
src="/simple_badge_bright.png"
/>
(1.7kB) (1.7kB)
</summary> </summary>
<pre><code> <pre><code>
@ -70,7 +88,8 @@
&lt;/a&gt; &lt;/a&gt;
</code></pre> </code></pre>
</details> </details>
</p><p> </p>
<p>
<details> <details>
<summary> <summary>
<img alt="color badge, bright" src="/color_badge_bright.png" /> <img alt="color badge, bright" src="/color_badge_bright.png" />
@ -85,7 +104,8 @@
&lt;/a&gt; &lt;/a&gt;
</code></pre> </code></pre>
</details> </details>
</p><p> </p>
<p>
<details> <details>
<summary> <summary>
<img alt="color badge, dark" src="/color_badge_dark.png" /> <img alt="color badge, dark" src="/color_badge_dark.png" />