feat: add meta info per page

This commit is contained in:
Ayo Ayco 2024-04-26 21:35:57 +02:00
parent 27308dde8f
commit 28d7747d41
3 changed files with 45 additions and 25 deletions

View file

@ -1,6 +1,8 @@
# Threads # Threads
Show off your favorite public threads! Show off your favorite public threads and offer hand-picked, fine-grained, topical subscriptions!
See it [in action](https://ayco.io/threads).
## Project setup ## Project setup

View file

@ -4,6 +4,18 @@
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>{{ app.title }}</title> <title>{{ app.title }}</title>
<meta name="theme-color" content="#3054bf">
{% if threads|length == 1 %}
<meta name="description" content="{{ threads[0].content }}" />
{% else %}
<meta name="description" content="{{ app.description }}" />
{% endif %}
<meta name="author" content="{{ attribution.owner }}" />
<meta property="og:site_name" content="{{ app.title }}" />
<meta property="og:type" content="website" />
<meta property="og:title" content="{{ app.title }}" />
<meta property="og:description" content="{{ app.description }}" />
<link rel="stylesheet" href="https://webcomponent.io/reset.css" /> <link rel="stylesheet" href="https://webcomponent.io/reset.css" />
<style> <style>
body { body {
@ -13,9 +25,12 @@
color: #232323; color: #232323;
padding: 5px; padding: 5px;
} }
header, footer, main { header, footer {
padding: 1em; padding: 1em;
} }
main {
padding: 1em 0;
}
header, footer { header, footer {
background: linear-gradient(45deg, #3054bf, #416fff); background: linear-gradient(45deg, #3054bf, #416fff);
color: white; color: white;
@ -151,7 +166,7 @@
</head> </head>
<body> <body>
<header> <header>
<nav><a href="/">go home</a></nav> <nav><a href="/">Go home</a></nav>
<h1>{{ app.title }}</h1> <h1>{{ app.title }}</h1>
<p>{{ app.description }}</p> <p>{{ app.description }}</p>
</header> </header>
@ -237,30 +252,33 @@
> >
</h3> </h3>
<div class="body"> <div class="body">
{{ descendant.content | safe }} {% for media in {{ descendant.content | safe }}
descendant.media_attachments%} {% if media.type == 'image'%} {% for media in descendant.media_attachments%}
<a href="{{ media.url }}"> {% if media.type == 'image'%}
<img <a href="{{ media.url }}">
<img
class="media"
src="{{media.preview_url}}"
alt="{{ media.description or 'media attachment' }}"
title="{{ media.description or 'media attachment' }}"
/>
</a>
{% elif media.type == 'gifv' %}
<video
class="media" class="media"
src="{{media.preview_url}}" controls
autoplay="autoplay"
muted
loop
alt="{{ media.description or 'media attachment' }}" alt="{{ media.description or 'media attachment' }}"
title="{{ media.description or 'media attachment' }}" title="{{ media.description or 'media attachment' }}"
/> >
</a> <source src="{{media.url}}" type="video/mp4" />
{% elif media.type == 'gifv' %} Your browser does not support the video tag.
<video </video>
class="media" {% endif %}
controls {% endfor %}
autoplay="autoplay" {% if descendant.card %}
muted
loop
alt="{{ media.description or 'media attachment' }}"
title="{{ media.description or 'media attachment' }}"
>
<source src="{{media.url}}" type="video/mp4" />
Your browser does not support the video tag.
</video>
{% endif %} {% endfor %} {% if descendant.card %}
<a href="{{ descendant.card.url }}"> <a href="{{ descendant.card.url }}">
<div class="link_card"> <div class="link_card">
<small> <small>

View file

@ -86,7 +86,7 @@ def clean_author(account):
def clean_status(status): def clean_status(status):
clean = clean_dict(status, ['id', 'content', 'created_at', 'url', 'media_attachments', 'card']) clean = clean_dict(status, ['id', 'content', 'created_at', 'url', 'media_attachments', 'card'])
clean['account'] = clean_author(status['account']) clean['account'] = clean_author(status['account'])
clean['content'] = markdown.markdown("<section markdown='block'>"+ clean['content'] +"<section>", extensions=['md_in_html']) clean['content'] = markdown.markdown("<section markdown='block'>"+ clean['content'] +"</section>", extensions=['md_in_html'])
for emoji in status['emojis']: for emoji in status['emojis']:
clean['content'] = clean['content'].replace(":" + emoji['shortcode'] + ":", '<img alt="' + emoji['shortcode'] + ' emoji" class="emoji" src="'+emoji['url']+'" />') clean['content'] = clean['content'].replace(":" + emoji['shortcode'] + ":", '<img alt="' + emoji['shortcode'] + ' emoji" class="emoji" src="'+emoji['url']+'" />')
return clean return clean