zio/elk
2
0
Fork 0
Code Releases 2 Packages 1 Activity

fix: style overflow due to user content (#355)

Browse source
This commit is contained in:
Ayaka Rizumu 2022-12-07 00:37:58 +08:00 • committed by GitHub
parent 3b6b83ae7a
commit 7a07d21b76
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
16 changed files with 50 additions and 26 deletions
Download patch file Download diff file Expand all files Collapse all files

4
components/account/AccountHeader.vue
View file

@ -101,14 +101,14 @@ watchEffect(() => {
</button>
<div flex flex-col>
<ContentRich
font-bold text-2xl ws-nowrap
font-bold sm:text-2xl text-xl
:content="getDisplayName(account, { rich: true })"
:emojis="account.emojis"
/>
<AccountHandle :account="account" />
</div>
</div>
<div absolute top="1/2" right-0 translate-y="-1/2" flex gap-2 items-center>
<div absolute top-18 right-0 flex gap-2 items-center>
<AccountMoreButton :account="account" :command="command" />
<AccountFollowButton :account="account" :command="command" />
<!-- <button flex gap-1 items-center w-full rounded op75 hover="op100 text-purple" group>

6
components/account/AccountInfo.vue
View file

@ -20,7 +20,11 @@ defineOptions({
<AccountAvatar :account="account" w-12 h-12 />
</AccountHoverWrapper>
<div flex="~ col" shrink overflow-hidden>
<ContentRich font-bold :content="getDisplayName(account, { rich: true })" :emojis="account.emojis" overflow-hidden truncate text-ellipsis />
<ContentRich
font-bold line-clamp-1 ws-pre-wrap break-all
:content="getDisplayName(account, { rich: true })"
:emojis="account.emojis"
/>
<AccountHandle :account="account" text-sm text-secondary-light />
</div>
</component>

6
components/account/AccountInlineInfo.vue
View file

@ -16,7 +16,11 @@ const { link = true, avatar = true } = defineProps<{
min-w-0 flex gap-1 items-center
>
<AccountAvatar v-if="avatar" :account="account" w-5 h-5 />
<ContentRich ws-nowrap :content="getDisplayName(account, { rich: true })" :emojis="account.emojis" />
<ContentRich
line-clamp-1 ws-pre-wrap break-all
:content="getDisplayName(account, { rich: true })"
:emojis="account.emojis"
/>
</NuxtLink>
</AccountHoverWrapper>
</template>