mirror of
https://codeberg.org/rimu/pyfedi
synced 2025-01-23 19:36:56 -08:00
wcag tweaks
This commit is contained in:
parent
e193a47b55
commit
35be628966
4 changed files with 63 additions and 16 deletions
|
@ -571,6 +571,17 @@ fieldset legend {
|
|||
float: right;
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
position: relative;
|
||||
}
|
||||
.post_list .post_teaser .thumbnail .fe {
|
||||
display: block;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
background-color: rgba(255, 255, 255, 0.7);
|
||||
padding-bottom: 1px;
|
||||
padding-left: 1px;
|
||||
border-radius: 2px;
|
||||
top: 0;
|
||||
}
|
||||
.post_list .post_teaser .thumbnail img {
|
||||
height: 60px;
|
||||
|
@ -585,6 +596,13 @@ fieldset legend {
|
|||
width: 133px;
|
||||
}
|
||||
}
|
||||
.post_list .post_teaser .thumbnail.lbw .fe {
|
||||
background: none;
|
||||
}
|
||||
.post_list .post_teaser .thumbnail.lbw .fe::before {
|
||||
font-size: 28px;
|
||||
padding-right: 7px;
|
||||
}
|
||||
.post_list .post_teaser.blocked {
|
||||
opacity: 0.2;
|
||||
font-size: 80%;
|
||||
|
|
|
@ -189,6 +189,18 @@ nav, etc which are used site-wide */
|
|||
float: right;
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
position: relative;
|
||||
|
||||
.fe {
|
||||
display: block;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
background-color: rgba(256,256,256, 0.7);
|
||||
padding-bottom: 1px;
|
||||
padding-left: 1px;
|
||||
border-radius: 2px;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
img {
|
||||
height: 60px;
|
||||
|
@ -202,6 +214,16 @@ nav, etc which are used site-wide */
|
|||
|
||||
}
|
||||
}
|
||||
|
||||
&.lbw {
|
||||
.fe {
|
||||
background: none;
|
||||
}
|
||||
.fe::before {
|
||||
font-size: 28px;
|
||||
padding-right: 7px;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.blocked {
|
||||
opacity: 0.2;
|
||||
|
|
|
@ -182,8 +182,8 @@
|
|||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
<li class="nav-item" aria-label="{{ _('Light mode') }}"><a class="nav-link" id="light_mode" href="#" tabindex=""><span class="fe fe-sun" title="{{ _('Light mode') }}"></span></a></li>
|
||||
<li class="nav-item" aria-label="{{ _('Dark mode') }}"><a class="nav-link" id="dark_mode" href="#" tabindex=""><span class="fe fe-moon" title="{{ _('Dark mode') }}"></span></a></li>
|
||||
<li class="nav-item" aria-label="{{ _('Light mode') }}"><a class="nav-link" id="light_mode" href="#" tabindex="" title="{{ _('Light mode') }}"><span class="fe fe-sun"></span></a></li>
|
||||
<li class="nav-item" aria-label="{{ _('Dark mode') }}"><a class="nav-link" id="dark_mode" href="#" tabindex="" title="{{ _('Dark mode') }}"><span class="fe fe-moon"></span></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -12,19 +12,29 @@
|
|||
<div class="voting_buttons">
|
||||
{% include "post/_post_voting_buttons.html" %}
|
||||
</div>
|
||||
{% if post.image_id and not low_bandwidth %}
|
||||
<div class="thumbnail">
|
||||
{% if post.type == POST_TYPE_LINK %}
|
||||
<a href="{{ post.url }}" rel="nofollow ugc" target="_blank" aria-label="{{ _('Read article') }}"><img src="{{ post.image.thumbnail_url() }}"
|
||||
alt="{{ post.image.alt_text if post.image.alt_text else '' }}" height="50" loading="lazy" /></a>
|
||||
{% elif post.type == POST_TYPE_IMAGE %}
|
||||
{% if post.image_id %}
|
||||
<a href="{{ post.image.view_url() }}" rel="nofollow ugc" aria-label="{{ _('View image') }}" target="_blank"><img src="{{ post.image.thumbnail_url() }}"
|
||||
alt="{{ post.image.alt_text if post.image.alt_text else '' }}" height="50" loading="lazy" /></a>
|
||||
{% if post.image_id %}
|
||||
<div class="thumbnail{{ ' lbw' if low_bandwidth }}">
|
||||
{% if low_bandwidth %}
|
||||
{% if post.type == POST_TYPE_LINK %}
|
||||
<a href="{{ post.url }}" rel="nofollow ugc" target="_blank" aria-label="{{ _('Read article') }}"><span class="fe fe-external"></span></a>
|
||||
{% elif post.type == POST_TYPE_IMAGE %}
|
||||
<a href="{{ post.image.view_url() }}" rel="nofollow ugc" aria-label="{{ _('View image') }}" target="_blank"><span class="fe fe-magnify"></span></a>
|
||||
{% else %}
|
||||
<a href="{{ url_for('activitypub.post_ap', post_id=post.id) }}" aria-label="{{ _('Read post') }}"><span class="fe fe-reply"></span></a>
|
||||
{% endif %}
|
||||
{% else %}
|
||||
<a href="{{ url_for('activitypub.post_ap', post_id=post.id) }}" aria-label="{{ _('Read post') }}"><img src="{{ post.image.thumbnail_url() }}"
|
||||
alt="{{ post.image.alt_text if post.image.alt_text else '' }}" height="50" loading="lazy" /></a>
|
||||
{% if post.type == POST_TYPE_LINK %}
|
||||
<a href="{{ post.url }}" rel="nofollow ugc" target="_blank" aria-label="{{ _('Read article') }}"><span class="fe fe-external"></span><img src="{{ post.image.thumbnail_url() }}"
|
||||
alt="{{ post.image.alt_text if post.image.alt_text else '' }}" loading="lazy" /></a>
|
||||
{% elif post.type == POST_TYPE_IMAGE %}
|
||||
{% if post.image_id %}
|
||||
<a href="{{ post.image.view_url() }}" rel="nofollow ugc" aria-label="{{ _('View image') }}" target="_blank"><span class="fe fe-magnify"></span><img src="{{ post.image.thumbnail_url() }}"
|
||||
alt="{{ post.image.alt_text if post.image.alt_text else '' }}" loading="lazy" /></a>
|
||||
{% endif %}
|
||||
{% else %}
|
||||
<a href="{{ url_for('activitypub.post_ap', post_id=post.id) }}" aria-label="{{ _('Read post') }}"><span class="fe fe-reply"></span><img src="{{ post.image.thumbnail_url() }}"
|
||||
alt="{{ post.image.alt_text if post.image.alt_text else '' }}" loading="lazy" /></a>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
@ -34,9 +44,6 @@
|
|||
{% if post.url and 'youtube.com' in post.url %}
|
||||
<span class="fe fe-video"></span>
|
||||
{% endif %}
|
||||
<a href="{{ post.url }}" rel="nofollow ugc" target="_blank" class="post_link" aria-label="{{ _('Read article') }}">
|
||||
<img src="/static/images/external_link_black.svg" class="external_link_icon" alt="External link" />
|
||||
</a>
|
||||
<span class="domain_link">(<a href="/d/{{ post.domain_id }}" aria-label="{{ _('All posts about this domain') }}">{{ post.domain.name }}</a>)</span>
|
||||
{% endif %}
|
||||
{% if post.reports and current_user.is_authenticated and post.community.is_moderator(current_user) %}
|
||||
|
|
Loading…
Reference in a new issue