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,52 +1,66 @@
{% 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>
<p class="big center"> <time
Proud member of the exclusive 250KB&nbsp;Club! class="dt-published"
</p> datetime="{{ page.date }}"
<p> pubdate=""
<time class="dt-published" datetime="{{ page.date }}" pubdate="" itemprop="datePublished" content="{{ page.date }}"> itemprop="datePublished"
Added: {{ page.date }} content="{{ page.date }}"
</time> >
| Added: {{ page.date }}
<time class="dt-published" datetime="{{ page.date }}" pubdate="" itemprop="datePublished" content="{{ page.date }}"> </time>
Last updated: {{ page.date }} |
</time> <time
</p> class="dt-published"
<p class="e-content"> datetime="{{ page.date }}"
<a rel="noopener nofollow" href="{{ page.extra.source }}" target="_blank">{{ page.title }}</a> pubdate=""
is a member of the exclusive 250KB Club. The page weighs itemprop="datePublished"
<strong> content="{{ page.date }}"
{% if page.extra.size == 0 %} >
under 1kb Last updated: {{ page.date }}
{% else %} </time>
only {{ page.extra.size }}kb </p>
{% endif %} <p class="e-content">
</strong> and has a content-to-bloat ratio of <a
<strong>{{ page.extra.ratio }}%</strong>. rel="noopener nofollow"
</p> href="{{ page.extra.source }}"
<p> target="_blank"
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. >{{ page.title }}</a
A code snipped can be found by clicking on the respective badge. >
</p> is a member of the exclusive 250KB Club. The page weighs
<p class="badges"> <strong>
The badges can either be downloaded and served by yourself or linked directly from 250KB.club. {% if page.extra.size == 0 %} under 1kb {% else %} only {{
The latter might save a few users some bandwidth if the badge is already cached. page.extra.size }}kb {% endif %}
On the other hand this gives the 250KB.club server a log entry for <i>every visitor of <strong>your</strong> page</i>. </strong>
I'm not interested in those logs but you still have to trust my word. So decide for yourself. and has a content-to-bloat ratio of
</p> <strong>{{ page.extra.ratio }}%</strong>.
</p>
<p>
The owner of this page is now entitled to add one of those shiny badges
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 class="badges">
The badges can either be downloaded and served as part of the website or
linked directly from 250KB.club. The latter might save a few users some
bandwidth if the badge is already cached. On the other hand this gives
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>
<details> <details>
<summary> <summary>
<img alt="simple badge, dark" src="/simple_badge_dark.png" /> <img alt="simple badge, dark" src="/simple_badge_dark.png" />
(1.4kB) (1.4kB)
</summary> </summary>
<pre><code> <pre><code>
&lt;a title="250KB Club page" href="https://250kb.club/{{ page.slug }}"&gt; &lt;a title="250KB Club page" href="https://250kb.club/{{ page.slug }}"&gt;
&lt;img &lt;img
alt="badge: proud member of the 250KB Club" alt="badge: proud member of the 250KB Club"
@ -54,14 +68,18 @@
/&gt; /&gt;
&lt;/a&gt; &lt;/a&gt;
</code></pre> </code></pre>
</details> </details>
</p><p> </p>
<details> <p>
<summary> <details>
<img alt="simple badge, bright" src="/simple_badge_bright.png" /> <summary>
(1.7kB) <img
</summary> alt="simple badge, bright"
<pre><code> src="/simple_badge_bright.png"
/>
(1.7kB)
</summary>
<pre><code>
&lt;a title="250KB Club page" href="https://250kb.club/{{ page.slug }}"&gt; &lt;a title="250KB Club page" href="https://250kb.club/{{ page.slug }}"&gt;
&lt;img &lt;img
alt="badge: proud member of the 250KB Club" alt="badge: proud member of the 250KB Club"
@ -69,14 +87,15 @@
/&gt; /&gt;
&lt;/a&gt; &lt;/a&gt;
</code></pre> </code></pre>
</details> </details>
</p><p> </p>
<details> <p>
<summary> <details>
<img alt="color badge, bright" src="/color_badge_bright.png" /> <summary>
(4.0kB) <img alt="color badge, bright" src="/color_badge_bright.png" />
</summary> (4.0kB)
<pre><code> </summary>
<pre><code>
&lt;a title="250KB Club page" href="https://250kb.club/{{ page.slug }}"&gt; &lt;a title="250KB Club page" href="https://250kb.club/{{ page.slug }}"&gt;
&lt;img &lt;img
alt="badge: proud member of the 250KB Club" alt="badge: proud member of the 250KB Club"
@ -84,14 +103,15 @@
/&gt; /&gt;
&lt;/a&gt; &lt;/a&gt;
</code></pre> </code></pre>
</details> </details>
</p><p> </p>
<details> <p>
<summary> <details>
<img alt="color badge, dark" src="/color_badge_dark.png" /> <summary>
(5.7kB) <img alt="color badge, dark" src="/color_badge_dark.png" />
</summary> (5.7kB)
<pre><code> </summary>
<pre><code>
&lt;a title="250KB Club page" href="https://250kb.club/{{ page.slug }}"&gt; &lt;a title="250KB Club page" href="https://250kb.club/{{ page.slug }}"&gt;
&lt;img &lt;img
alt="badge: proud member of the 250KB Club" alt="badge: proud member of the 250KB Club"
@ -99,9 +119,9 @@
/&gt; /&gt;
&lt;/a&gt; &lt;/a&gt;
</code></pre> </code></pre>
</details> </details>
</p> </p>
<p><a href="/">back</a></p> <p><a href="/">back</a></p>
</main> </main>
{% endblock content %} {% endblock content %}