mirror of
https://gitlab.com/brutaldon/brutaldon.git
synced 2024-11-02 16:37:19 -04:00
Fix a bunch of mobile formatting issues
This commit is contained in:
parent
9e1a82655e
commit
69a678a5ce
@ -20,3 +20,15 @@ div.card-header-title, div.card-header-icon {
|
|||||||
-moz-text-stroke: 2px white;
|
-moz-text-stroke: 2px white;
|
||||||
text-stroke: 2px white;
|
text-stroke: 2px white;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.media {
|
||||||
|
background-color: white;
|
||||||
|
border-radius: 5px;
|
||||||
|
-webkit-box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
|
||||||
|
box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1), 0 0 0 1px rgba(10, 10, 10, 0.1);
|
||||||
|
color: #4a4a4a;
|
||||||
|
display: block;
|
||||||
|
padding: 1.25rem;
|
||||||
|
margin-bottom: 0.75rem;
|
||||||
|
margin-top: 0.75rem;
|
||||||
|
}
|
||||||
|
@ -1,93 +1,79 @@
|
|||||||
{% extends "base.html" %}
|
{% extends "base.html" %}
|
||||||
{% load humanize %}
|
{% load humanize %}
|
||||||
|
{% load taglinks %}
|
||||||
|
|
||||||
{% block title %}
|
{% block title %}
|
||||||
Brutaldon - {{ timeline }} timelime
|
Brutaldon - {{ timeline }} timelime
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% comment %}
|
{% comment %}
|
||||||
mastodon.notifications()[0]
|
mastodon.notifications()[0]
|
||||||
# Returns the following dictionary:
|
# Returns the following dictionary:
|
||||||
{
|
{
|
||||||
'id': # id of the notification
|
'id': # id of the notification
|
||||||
'type': # "mention", "reblog", "favourite" or "follow"
|
'type': # "mention", "reblog", "favourite" or "follow"
|
||||||
'created_at': # The time the notification was created
|
'created_at': # The time the notification was created
|
||||||
'account': # User dict of the user from whom the notification originates
|
'account': # User dict of the user from whom the notification originates
|
||||||
'status': # In case of "mention", the mentioning status
|
'status': # In case of "mention", the mentioning status
|
||||||
# In case of reblog / favourite, the reblogged / favourited status
|
# In case of reblog / favourite, the reblogged / favourited status
|
||||||
}
|
}
|
||||||
{% endcomment %}
|
{% endcomment %}
|
||||||
|
|
||||||
|
|
||||||
{% block content %}
|
{% block content %}
|
||||||
<h1 class="title">Your {{ timeline }} timeline</h1>
|
<h1 class="title">Your {{ timeline }} timeline</h1>
|
||||||
{% for note in notes %}
|
{% for note in notes %}
|
||||||
{% if note.type == 'mention' %}
|
{% if note.type == 'mention' %}
|
||||||
<div class="box" >
|
<p>
|
||||||
<p>
|
<strong>{{ note.account.display_name }}</strong>
|
||||||
<strong>{{ note.account.display_name }}</strong>
|
(<a href="{{ note.account.url | localuser }}">{{ note.account.acct }}</a>)
|
||||||
(<a href="{{ note.account.url }}">{{ note.account.acct }}</a>)
|
mentioned you.
|
||||||
mentioned you.
|
</p>
|
||||||
</p>
|
<br>
|
||||||
<br>
|
{% include "main/toot_partial.html" with toot=note.status reblog=False %}
|
||||||
{% include "main/toot_partial.html" with toot=note.status reblog=False %}
|
<hr class="is-hidden">
|
||||||
</div>
|
{% elif note.type == 'reblog' %}
|
||||||
<hr class="is-hidden">
|
<p>
|
||||||
{% elif note.type == 'reblog' %}
|
{{ note.account.display_name }}
|
||||||
<div class="box">
|
(<a href="{{ note.account.url | localuser }}">{{ note.account.acct }}</a>)
|
||||||
<p>
|
boosted your toot.
|
||||||
{{ note.account.display_name }}
|
(<span>
|
||||||
(<a href="{{ note.account.url }}">{{ note.account.acct }}</a>)
|
<small>{{ note.created_at |naturaltime }}</small>
|
||||||
boosted your toot.
|
</span>)
|
||||||
(<a href="{{ note.url }}">
|
</p>
|
||||||
<small>{{ note.created_at |naturaltime }}</small>
|
{% include "main/toot_partial.html" with toot=note.status reblog=True reblog_by=note.account.acct reblog_icon=note.account.avatar %}
|
||||||
</a>)
|
<hr class="is-hidden">
|
||||||
</p>
|
{% elif note.type == 'favourite' %}
|
||||||
{% include "main/toot_partial.html" with toot=note.status reblog=True reblog_by=note.account.acct reblog_icon=note.account.avatar %}
|
<p>
|
||||||
</div>
|
{{ note.account.display_name }}
|
||||||
<hr class="is-hidden">
|
(<a href="{{ note.account.url | localuser}}">{{ note.account.acct }}</a>)
|
||||||
{% elif note.type == 'favourite' %}
|
favorited your toot.
|
||||||
<div class="box" >
|
(<span>
|
||||||
<div class="level">
|
<small>{{ note.created_at |naturaltime }}</small>
|
||||||
<div class="level-left">
|
</span>)
|
||||||
<div class="level-item" >
|
</p>
|
||||||
<img class="image is-32x32 fav-avatar" src="{{ note.account.avatar }}">
|
{% include "main/toot_partial.html" with toot=note.status reblog=True reblog_by=note.account.acct reblog_icon=note.account.avatar %}
|
||||||
</div>
|
<hr class="is_hidden">
|
||||||
<div class="level-item" >
|
{% elif note.type == 'follow' %}
|
||||||
{{ note.account.display_name }}
|
<article class="media">
|
||||||
(<a href="{{ note.account.url }}">{{ note.account.acct }}</a>)
|
<figure class="media-left">
|
||||||
favorited your toot.
|
<p class="image is-64x64">
|
||||||
(<a href="{{ note.url }}">
|
<img src="{{ note.account.avatar }}" alt="">
|
||||||
<small>{{ note.created_at |naturaltime }}</small>
|
</p>
|
||||||
</a>)
|
</figure>
|
||||||
</div>
|
<div class="media-content" >
|
||||||
</div>
|
<div class="content">
|
||||||
</div>
|
<strong>{{ note.account.display_name }}</strong>
|
||||||
{% include "main/toot_partial.html" with toot=note.status reblog=False %}
|
(<a href="{{ note.account.url |localuser }}">{{ note.account.acct }}</a>)
|
||||||
</div>
|
followed you.
|
||||||
<hr class="is-hidden">
|
(<a href="{{ note.url }}">
|
||||||
{% elif note.type == 'follow' %}
|
<small>{{ note.created_at |naturaltime }}</small>
|
||||||
<div class="box" >
|
</a>)
|
||||||
<article class="media">
|
</div>
|
||||||
<figure class="media-left">
|
</div>
|
||||||
<p class="image is-64x64">
|
</article>
|
||||||
<img src="{{ note.account.avatar }}" alt="">
|
<hr class="is-hidden">
|
||||||
</p>
|
{% endif %}
|
||||||
</figure>
|
{% endfor %}
|
||||||
<div class="media-content" >
|
|
||||||
<div class="content">
|
|
||||||
<strong>{{ note.account.display_name }}</strong>
|
|
||||||
(<a href="{{ note.account.url }}">{{ note.account.acct }}</a>)
|
|
||||||
followed you.
|
|
||||||
(<a href="{{ note.url }}">
|
|
||||||
<small>{{ note.created_at |naturaltime }}</small>
|
|
||||||
</a>)
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</article>
|
|
||||||
</div>
|
|
||||||
<hr class="is-hidden">
|
|
||||||
{% endif %}
|
|
||||||
{% endfor %}
|
|
||||||
|
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
@ -2,37 +2,35 @@
|
|||||||
{% load humanize %}
|
{% load humanize %}
|
||||||
|
|
||||||
{% block title %}
|
{% block title %}
|
||||||
Brutaldon - {{ timeline_name }} timelime
|
Brutaldon - {{ timeline_name }} timelime
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block content %}
|
{% block content %}
|
||||||
{% if form %}
|
{% if form %}
|
||||||
<h1 class="title">Post</h1>
|
<h1 class="title">Post</h1>
|
||||||
<div class="box">
|
<div class="box">
|
||||||
{% include "main/post_minimal_partial.html" %}
|
{% include "main/post_minimal_partial.html" %}
|
||||||
</div>
|
</div>
|
||||||
<hr class="is-hidden">
|
<hr class="is-hidden">
|
||||||
{% endif %}
|
{% endif %}
|
||||||
<h1 class="title">Your {{ timeline_name }} timeline</h1>
|
<h1 class="title">Your {{ timeline_name }} timeline</h1>
|
||||||
{% for toot in toots %}
|
{% for toot in toots %}
|
||||||
<div class="box">
|
{% if toot.reblog %}
|
||||||
{% if toot.reblog %}
|
{% include "main/toot_partial.html" with toot=toot.reblog reblog=True reblog_by=toot.account.acct reblog_icon=toot.account.avatar %}
|
||||||
{% include "main/toot_partial.html" with toot=toot.reblog reblog=True reblog_by=toot.account.acct reblog_icon=toot.account.avatar %}
|
{% else %}
|
||||||
{% else %}
|
{% include "main/toot_partial.html" with toot=toot reblog=False %}
|
||||||
{% include "main/toot_partial.html" with toot=toot reblog=False %}
|
{% endif %}
|
||||||
{% endif %}
|
<hr class="is-hidden">
|
||||||
</div>
|
{% endfor %}
|
||||||
<hr class="is-hidden">
|
|
||||||
{% endfor %}
|
|
||||||
|
|
||||||
{% block pagination %}
|
{% block pagination %}
|
||||||
<nav class="pagination is-centered" role="navigation" aria-label="pagination">
|
<nav class="pagination is-centered" role="navigation" aria-label="pagination">
|
||||||
{% if prev %}
|
{% if prev %}
|
||||||
<a class="pagination-next" href="{% url 'home_prev' prev.since_id %}">Newer</a>
|
<a class="pagination-next" href="{% url 'home_prev' prev.since_id %}">Newer</a>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% if next %}
|
{% if next %}
|
||||||
<a class="pagination-previous" href="{% url 'home_next' next.max_id %}">Older</a>
|
<a class="pagination-previous" href="{% url 'home_next' next.max_id %}">Older</a>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</nav>
|
</nav>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
@ -20,42 +20,41 @@
|
|||||||
{% endif %}
|
{% endif %}
|
||||||
</figure>
|
</figure>
|
||||||
<div class="media-content">
|
<div class="media-content">
|
||||||
<div class="content">
|
<p>
|
||||||
<p>
|
<strong>{{ toot.account.display_name }}</strong>
|
||||||
<strong>{{ toot.account.display_name }}</strong>
|
<small><a href="{% url "user" toot.account.acct %}">@{{ toot.account.acct }}</a></small>
|
||||||
<small><a href="{% url "user" toot.account.acct %}">@{{ toot.account.acct }}</a></small>
|
<a href="{{ toot.url }}">
|
||||||
<a href="{{ toot.url }}">
|
<small>{{ toot.created_at |naturaltime }}</small>
|
||||||
<small>{{ toot.created_at |naturaltime }}</small>
|
</a>
|
||||||
</a>
|
{% if reblog %}
|
||||||
{% if reblog %}
|
<br>
|
||||||
<br>
|
Boosted by @{{ reblog_by }}
|
||||||
Boosted by @{{ reblog_by }}
|
{% endif %}
|
||||||
{% endif %}
|
</p>
|
||||||
</p>
|
{% if toot.spoiler_text %}
|
||||||
{% if toot.spoiler_text %}
|
<details class="toot">
|
||||||
<details>
|
<summary><strong>{{ toot.spoiler_text }} </strong></summary>
|
||||||
<summary><strong>{{ toot.spoiler_text }} </strong></summary>
|
<div class="toot">
|
||||||
<div class="toot">
|
{{ toot.content | relink_toot | strip_html | safe }}
|
||||||
{{ toot.content | relink_toot | strip_html | safe }}
|
</div>
|
||||||
</div>
|
</details>
|
||||||
</details>
|
{% else %}
|
||||||
{% else %}
|
|
||||||
<div class="toot">
|
<div class="toot">
|
||||||
{{ toot.content | relink_toot | strip_html | safe }}
|
{{ toot.content | relink_toot | strip_html | safe }}
|
||||||
</div>
|
</div>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
{% if toot.media_attachments %}
|
{% if toot.media_attachments %}
|
||||||
<br>
|
<br>
|
||||||
<div class="level">
|
<div class="level">
|
||||||
<div class="level-left">
|
<div class="level-left">
|
||||||
{% for media in toot.media_attachments %}
|
{% for media in toot.media_attachments %}
|
||||||
<a class="level-item" href="{{ media.url }}">
|
<a class="level-item" href="{{ media.url }}">
|
||||||
{% if toot.sensitive %}
|
{% if toot.sensitive %}
|
||||||
<img src="{% static "images/sensitive.png" %}"
|
<img src="{% static "images/sensitive.png" %}"
|
||||||
{% else %}
|
{% else %}
|
||||||
<img src="{{ media.preview_url }}"
|
<img src="{{ media.preview_url }}"
|
||||||
{% endif %}
|
{% endif %}
|
||||||
alt="{% if media.description %}
|
alt="{% if media.description %}
|
||||||
{{ media.description }}
|
{{ media.description }}
|
||||||
{% elif media.text_url %}
|
{% elif media.text_url %}
|
||||||
@ -67,42 +66,36 @@
|
|||||||
title="{{ media.description }}"
|
title="{{ media.description }}"
|
||||||
{% endif %}
|
{% endif %}
|
||||||
class="image is-128x128">
|
class="image is-128x128">
|
||||||
</a>
|
</a>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
{% endif %}
|
</div>
|
||||||
<br>
|
{% endif %}
|
||||||
</div>
|
<br>
|
||||||
<p class="is-hidden"></p>
|
<p class="is-hidden"></p>
|
||||||
|
|
||||||
{% if not confirm_page %}
|
{% if not confirm_page %}
|
||||||
<nav class="level is-mobile">
|
<nav class="level is-mobile">
|
||||||
<div class="level-left">
|
<div class="level-left">
|
||||||
<div class="level-item">
|
<a href="{% url "reply" toot.id %}" class="level-item">
|
||||||
<a href="{% url "reply" toot.id %}">
|
|
||||||
<span class="icon is-small"><i class="fa fa-reply">
|
<span class="icon is-small"><i class="fa fa-reply">
|
||||||
<span class="is-invisible">Reply</span>
|
<span class="is-invisible">Reply</span>
|
||||||
</i></span>
|
</i></span>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
{% if toot.visibility != 'private' and toot.visibility != 'direct' %}
|
||||||
{% if toot.visibility != 'private' and toot.visibility != 'direct' %}
|
<a href="{% url "boost" toot.id %}" class="level-item">
|
||||||
<div class="level-item">
|
<span class="icon is-small">
|
||||||
<a href="{% url "boost" toot.id %}">
|
{% if toot.reblogged %}
|
||||||
<span class="icon is-small">
|
<i class="fa fa-retweet has-text-warning">
|
||||||
{% if toot.reblogged %}
|
{% else %}
|
||||||
<i class="fa fa-retweet has-text-warning">
|
<i class="fa fa-retweet" >
|
||||||
{% else %}
|
{% endif %}
|
||||||
<i class="fa fa-retweet" >
|
<span class="is-invisible" >Boost</span>
|
||||||
{% endif %}
|
</i>
|
||||||
<span class="is-invisible" >Boost</span>
|
</span>
|
||||||
</i>
|
</a>
|
||||||
</span>
|
{% endif %}
|
||||||
</a>
|
<a href="{% url "fav" toot.id %}" class="level-item">
|
||||||
</div>
|
|
||||||
{% endif %}
|
|
||||||
<div class="level-item">
|
|
||||||
<a href="{% url "fav" toot.id %}">
|
|
||||||
<span class="icon is-small">
|
<span class="icon is-small">
|
||||||
{% if toot.favourited %}
|
{% if toot.favourited %}
|
||||||
<i class="fa fa-heart has-text-warning">
|
<i class="fa fa-heart has-text-warning">
|
||||||
@ -114,23 +107,20 @@
|
|||||||
</span>
|
</span>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="level-right">
|
||||||
<div class="level-right">
|
{% if toot.account.acct == own_username %}
|
||||||
{% if toot.account.acct == own_username %}
|
<a class="level-item" href="{% url "delete" toot.id %}">
|
||||||
<a class="level-item" href="{% url "delete" toot.id %}">
|
delete
|
||||||
delete
|
</a>
|
||||||
|
{% endif %}
|
||||||
|
<span class="level-item">
|
||||||
|
{{ toot.visibility }}
|
||||||
|
</span>
|
||||||
|
<a class="level-item" href="{% url "thread" toot.id %}">
|
||||||
|
thread
|
||||||
</a>
|
</a>
|
||||||
{% endif %}
|
</div>
|
||||||
<span class="level-item">
|
</nav>
|
||||||
{{ toot.visibility }}
|
|
||||||
</span>
|
|
||||||
<a class="level-item" href="{% url "thread" toot.id %}">
|
|
||||||
thread
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</nav>
|
|
||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
<div class="media-right">
|
|
||||||
</div>
|
|
||||||
</article>
|
</article>
|
||||||
|
@ -16,10 +16,8 @@
|
|||||||
<div class="card-header">
|
<div class="card-header">
|
||||||
{% endif %}
|
{% endif %}
|
||||||
<div class="card-header-title title">
|
<div class="card-header-title title">
|
||||||
{{ user.display_name }}
|
|
||||||
|
|
||||||
<a href="{{ user.url }}">
|
<a href="{{ user.url }}">
|
||||||
(@{{ user.acct }})
|
{{ user.display_name }}
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<figure class="image is-96x96 card-header-icon">
|
<figure class="image is-96x96 card-header-icon">
|
||||||
|
@ -44,3 +44,15 @@ def relink_mentions(value):
|
|||||||
@register.filter
|
@register.filter
|
||||||
def relink_toot(value):
|
def relink_toot(value):
|
||||||
return relink_tags(relink_mentions(value))
|
return relink_tags(relink_mentions(value))
|
||||||
|
|
||||||
|
@register.filter
|
||||||
|
def localuser(value):
|
||||||
|
'''Convert a remote user link to local'''
|
||||||
|
try:
|
||||||
|
parsed = parse.urlparse(value)
|
||||||
|
instance = parsed[1]
|
||||||
|
user = parsed[2][2:]
|
||||||
|
local = reverse('user', args=[user+'@'+instance])
|
||||||
|
except:
|
||||||
|
local = value
|
||||||
|
return local
|
||||||
|
Loading…
Reference in New Issue
Block a user