natty
/
calckey
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

chore: format

This commit is contained in:
freeplay 2023-07-13 19:30:22 -04:00
parent 55d150f9b1
commit 33931fd896
2 changed files with 9 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
packages/client/src/components/MkUserInfo.vue
View File

@ -19,7 +19,7 @@
/></MkA> /></MkA>
<p class="username"><MkAcct :user="user" /></p> <p class="username"><MkAcct :user="user" /></p>
</h3> </h3>
<div <div
class="description" class="description"
:class="{ collapsed: isLong && collapsed, truncate: !detailed }" :class="{ collapsed: isLong && collapsed, truncate: !detailed }"
> >
@ -35,16 +35,9 @@
i18n.ts.noAccountDescription i18n.ts.noAccountDescription
}}</span> }}</span>
</div> </div>
<XShowMoreButton <XShowMoreButton v-if="isLong" v-model="collapsed"></XShowMoreButton>
v-if="isLong"
v-model="collapsed"
></XShowMoreButton>
<div v-if="user.fields.length > 0 && detailed" class="fields"> <div v-if="user.fields.length > 0 && detailed" class="fields">
<dl <dl v-for="(field, i) in user.fields" :key="i" class="field">
v-for="(field, i) in user.fields"
:key="i"
class="field"
>
<dt class="name"> <dt class="name">
<Mfm <Mfm
:text="field.name" :text="field.name"
@ -101,10 +94,8 @@ const props = defineProps<{
let isLong = $ref( let isLong = $ref(
props.detailed && props.detailed &&
( (props.user.description.split("\n").length > 9 ||
props.user.description.split("\n").length > 9 || props.user.description.length > 400),
props.user.description.length > 400
)
); );
let collapsed = $ref(isLong); let collapsed = $ref(isLong);
</script> </script>
@ -148,7 +139,6 @@ let collapsed = $ref(isLong);
} }
} }
.title { .title {
position: relative; position: relative;
display: block; display: block;
@ -159,7 +149,7 @@ let collapsed = $ref(isLong);
background: var(--panel); background: var(--panel);
line-height: 1; line-height: 1;
z-index: 4; z-index: 4;
.avatar { .avatar {
display: block; display: block;
position: absolute; position: absolute;
@ -210,12 +200,10 @@ let collapsed = $ref(isLong);
position: relative; position: relative;
max-height: calc(9em + 50px); max-height: calc(9em + 50px);
mask: linear-gradient(black calc(100% - 64px), transparent); mask: linear-gradient(black calc(100% - 64px), transparent);
-webkit-mask: linear-gradient( -webkit-mask: linear-gradient(black calc(100% - 64px), transparent);
black calc(100% - 64px),
transparent
);
} }
&.collapsed, &.truncate { &.collapsed,
&.truncate {
:deep(br) { :deep(br) {
display: none; // collapse white spaces display: none; // collapse white spaces
} }

1
packages/client/src/components/MkUserPreview.vue
View File

@ -93,6 +93,5 @@ onMounted(() => {
width: 300px; width: 300px;
overflow: hidden; overflow: hidden;
transform-origin: center top; transform-origin: center top;
} }
</style> </style>