t/tetratto
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(ui): random text overflow spots

Browse source
This commit is contained in:
trisua 2025-04-03 17:42:03 -04:00
parent 2102a8ea14
commit 573b10f5e1
6 changed files with 31 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

13
crates/app/src/public/css/style.css
View file

@ -149,6 +149,19 @@ article {
}
/* typo */
.name {
max-width: 200px;
overflow: hidden;
overflow-wrap: break-word;
text-overflow: ellipsis;
}
@media screen and (min-width: 901px) {
.name.shorter {
max-width: 180px;
}
}
ul,
ol {
margin-left: 1rem;

4
crates/app/src/public/html/communities/base.html
View file

@ -16,7 +16,7 @@
community=community, size="72px") }}
<div class="flex flex-col">
<div class="flex gap-2 items-center">
<h3 id="title" class="title">
<h3 id="title" class="title name shorter">
<!-- prettier-ignore -->
{% if community.context.display_name %}
{{ community.context.display_name }}
@ -36,7 +36,7 @@
{{ icon "ellipsis" }}
</button>
<div class="inner left">
<div class="inner">
<button
class="red"
onclick="trigger('me::report', ['{{ community.id }}', 'community'])"

10
crates/app/src/public/html/communities/settings.html
View file

@ -438,6 +438,16 @@
null,
{
role: (new_role) => {
const [matching, _] =
all_matching_permissions(new_role);
document.getElementById(
"permissions",
).innerHTML = get_permissions_html(
rebuild_role(matching),
"permissions",
);
return update_user_role(
e.target.uid.value,
new_role,

6
crates/app/src/public/html/components.html
View file

@ -57,7 +57,7 @@ community %}
{{ components::community_avatar(id=community.id, community=community,
size="48px") }}
<div class="flex flex-col">
<h3>{{ community.context.display_name }}</h3>
<h3 class="name">{{ community.context.display_name }}</h3>
<span class="fade"><b>{{ community.member_count }}</b> members</span>
</div>
</a>
@ -132,7 +132,9 @@ show_community %}
<div class="flex flex-col w-full gap-1">
<div class="flex flex-wrap gap-2 items-center">
{{ components::full_username(user=owner) }}
<span class="name"
>{{ components::full_username(user=owner) }}</span
>
<span class="fade date">{{ post.created }}</span>

2
crates/app/src/public/html/profile/base.html
View file

@ -18,7 +18,7 @@
<div class="flex flex-col">
<!-- prettier-ignore -->
<h3 id="username" class="username flex items-center gap-2">
{{ components::username(user=profile) }}
<span class="name shorter">{{ components::username(user=profile) }}</span>
{% if profile.is_verified %}
<span title="Verified" style="color: var(--color-primary);" class="flex items-center">

2
crates/app/src/public/js/atto.js
View file

@ -262,7 +262,7 @@ media_theme_pref();
const height = parent_height;
const y = box.y + scroll;
if (y > height - scroll - 300) {
if (y > height - scroll - 375) {
dropdown.classList.add("top");
} else {
dropdown.classList.remove("top");