fix(webapp): user teaser (#9283)

This commit is contained in:
Ulf Gebhardt 2026-02-21 09:52:23 +01:00 committed by GitHub
parent 9548ad6e31
commit 64594a3235
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 71 additions and 15 deletions

View File

@ -84,6 +84,8 @@ export default {
}
.info {
flex: 1;
min-width: 0;
padding-left: 10px;
overflow: hidden;
text-overflow: ellipsis;
@ -109,6 +111,12 @@ export default {
flex-direction: column;
justify-content: center;
align-items: flex-start;
> a,
> button,
> span:not(.group-info) {
display: contents;
}
}
.flex-direction-row {
@ -127,5 +135,26 @@ export default {
display: inline;
}
}
.group-info {
display: flex;
align-self: stretch;
align-items: baseline;
gap: 4px;
min-width: 0;
overflow: hidden;
> .text {
flex-shrink: 0;
}
}
.group-link {
color: $color-primary;
font-size: $font-size-base;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
}
</style>

View File

@ -27,15 +27,10 @@
<span class="name">{{ userName }}</span>
</user-teaser-helper>
<span v-if="wide">&nbsp;</span>
<span v-if="group">
<span class="text">
{{ $t('group.in') }}
</span>
<nuxt-link :to="groupLink">
<span class="text">
<span class="slug">{{ groupSlug }}</span>
<span v-if="!userOnly" class="name">{{ groupName }}</span>
</span>
<span v-if="group" class="group-info">
<span class="text">{{ $t('group.in') }}</span>
<nuxt-link :to="groupLink" class="group-link" :title="groupName">
{{ groupName }}
</nuxt-link>
</span>
<!-- eslint-disable-next-line prettier/prettier -->

View File

@ -225,6 +225,7 @@ exports[`GroupProfileSlug given a puplic group "yoga-practice" given a close
>
<h3
class="ds-heading ds-heading-h3 ds-heading-align-center ds-heading-no-margin"
style="word-break: break-all;"
>
School For Citizens
@ -233,6 +234,7 @@ exports[`GroupProfileSlug given a puplic group "yoga-practice" given a close
<p
class="ds-text ds-text-center ds-text-soft"
style="word-break: break-all;"
>
&school-for-citizens
@ -535,6 +537,7 @@ exports[`GroupProfileSlug given a puplic group "yoga-practice" given a close
>
<span
class="os-badge inline-flex w-fit items-center gap-[0.25em] font-semibold text-[var(--color-default-contrast)] bg-[var(--color-default)] text-[0.75rem] py-[0.2em] px-[0.8em] rounded-[2em]"
style="word-break: break-all;"
>
Our children shall receive education for life.
</span>
@ -1146,6 +1149,7 @@ exports[`GroupProfileSlug given a puplic group "yoga-practice" given a close
>
<h3
class="ds-heading ds-heading-h3 ds-heading-align-center ds-heading-no-margin"
style="word-break: break-all;"
>
School For Citizens
@ -1154,6 +1158,7 @@ exports[`GroupProfileSlug given a puplic group "yoga-practice" given a close
<p
class="ds-text ds-text-center ds-text-soft"
style="word-break: break-all;"
>
&school-for-citizens
@ -1409,6 +1414,7 @@ exports[`GroupProfileSlug given a puplic group "yoga-practice" given a close
>
<span
class="os-badge inline-flex w-fit items-center gap-[0.25em] font-semibold text-[var(--color-default-contrast)] bg-[var(--color-default)] text-[0.75rem] py-[0.2em] px-[0.8em] rounded-[2em]"
style="word-break: break-all;"
>
Our children shall receive education for life.
</span>
@ -1651,6 +1657,7 @@ exports[`GroupProfileSlug given a puplic group "yoga-practice" given a close
>
<h3
class="ds-heading ds-heading-h3 ds-heading-align-center ds-heading-no-margin"
style="word-break: break-all;"
>
School For Citizens
@ -1659,6 +1666,7 @@ exports[`GroupProfileSlug given a puplic group "yoga-practice" given a close
<p
class="ds-text ds-text-center ds-text-soft"
style="word-break: break-all;"
>
&school-for-citizens
@ -1933,6 +1941,7 @@ exports[`GroupProfileSlug given a puplic group "yoga-practice" given a close
>
<span
class="os-badge inline-flex w-fit items-center gap-[0.25em] font-semibold text-[var(--color-default-contrast)] bg-[var(--color-default)] text-[0.75rem] py-[0.2em] px-[0.8em] rounded-[2em]"
style="word-break: break-all;"
>
Our children shall receive education for life.
</span>
@ -2270,6 +2279,7 @@ exports[`GroupProfileSlug given a puplic group "yoga-practice" given a close
>
<h3
class="ds-heading ds-heading-h3 ds-heading-align-center ds-heading-no-margin"
style="word-break: break-all;"
>
School For Citizens
@ -2278,6 +2288,7 @@ exports[`GroupProfileSlug given a puplic group "yoga-practice" given a close
<p
class="ds-text ds-text-center ds-text-soft"
style="word-break: break-all;"
>
&school-for-citizens
@ -2579,6 +2590,7 @@ exports[`GroupProfileSlug given a puplic group "yoga-practice" given a close
>
<span
class="os-badge inline-flex w-fit items-center gap-[0.25em] font-semibold text-[var(--color-default-contrast)] bg-[var(--color-default)] text-[0.75rem] py-[0.2em] px-[0.8em] rounded-[2em]"
style="word-break: break-all;"
>
Our children shall receive education for life.
</span>
@ -3373,6 +3385,7 @@ exports[`GroupProfileSlug given a puplic group "yoga-practice" given a curre
>
<h3
class="ds-heading ds-heading-h3 ds-heading-align-center ds-heading-no-margin"
style="word-break: break-all;"
>
Yoga Practice
@ -3381,6 +3394,7 @@ exports[`GroupProfileSlug given a puplic group "yoga-practice" given a curre
<p
class="ds-text ds-text-center ds-text-soft"
style="word-break: break-all;"
>
&yoga-practice
@ -4226,6 +4240,7 @@ exports[`GroupProfileSlug given a puplic group "yoga-practice" given a curre
>
<h3
class="ds-heading ds-heading-h3 ds-heading-align-center ds-heading-no-margin"
style="word-break: break-all;"
>
Yoga Practice
@ -4234,6 +4249,7 @@ exports[`GroupProfileSlug given a puplic group "yoga-practice" given a curre
<p
class="ds-text ds-text-center ds-text-soft"
style="word-break: break-all;"
>
&yoga-practice
@ -5025,6 +5041,7 @@ exports[`GroupProfileSlug given a puplic group "yoga-practice" given a curre
>
<h3
class="ds-heading ds-heading-h3 ds-heading-align-center ds-heading-no-margin"
style="word-break: break-all;"
>
Yoga Practice
@ -5033,6 +5050,7 @@ exports[`GroupProfileSlug given a puplic group "yoga-practice" given a curre
<p
class="ds-text ds-text-center ds-text-soft"
style="word-break: break-all;"
>
&yoga-practice
@ -5938,6 +5956,7 @@ exports[`GroupProfileSlug given a puplic group "yoga-practice" given a curre
>
<h3
class="ds-heading ds-heading-h3 ds-heading-align-center ds-heading-no-margin"
style="word-break: break-all;"
>
Yoga Practice
@ -5946,6 +5965,7 @@ exports[`GroupProfileSlug given a puplic group "yoga-practice" given a curre
<p
class="ds-text ds-text-center ds-text-soft"
style="word-break: break-all;"
>
&yoga-practice
@ -6973,6 +6993,7 @@ exports[`GroupProfileSlug given a puplic group "yoga-practice" given a hidde
>
<h3
class="ds-heading ds-heading-h3 ds-heading-align-center ds-heading-no-margin"
style="word-break: break-all;"
>
Investigative Journalism
@ -6981,6 +7002,7 @@ exports[`GroupProfileSlug given a puplic group "yoga-practice" given a hidde
<p
class="ds-text ds-text-center ds-text-soft"
style="word-break: break-all;"
>
&investigative-journalism
@ -7282,6 +7304,7 @@ exports[`GroupProfileSlug given a puplic group "yoga-practice" given a hidde
>
<span
class="os-badge inline-flex w-fit items-center gap-[0.25em] font-semibold text-[var(--color-default-contrast)] bg-[var(--color-default)] text-[0.75rem] py-[0.2em] px-[0.8em] rounded-[2em]"
style="word-break: break-all;"
>
Investigative journalists share ideas and insights and can collaborate.
</span>
@ -8017,6 +8040,7 @@ exports[`GroupProfileSlug given a puplic group "yoga-practice" given a hidde
>
<h3
class="ds-heading ds-heading-h3 ds-heading-align-center ds-heading-no-margin"
style="word-break: break-all;"
>
Investigative Journalism
@ -8025,6 +8049,7 @@ exports[`GroupProfileSlug given a puplic group "yoga-practice" given a hidde
<p
class="ds-text ds-text-center ds-text-soft"
style="word-break: break-all;"
>
&investigative-journalism
@ -8325,6 +8350,7 @@ exports[`GroupProfileSlug given a puplic group "yoga-practice" given a hidde
>
<span
class="os-badge inline-flex w-fit items-center gap-[0.25em] font-semibold text-[var(--color-default-contrast)] bg-[var(--color-default)] text-[0.75rem] py-[0.2em] px-[0.8em] rounded-[2em]"
style="word-break: break-all;"
>
Investigative journalists share ideas and insights and can collaborate.
</span>

View File

@ -29,11 +29,14 @@
</client-only>
<div class="ds-my-small">
<!-- group name -->
<h3 class="ds-heading ds-heading-h3 ds-heading-align-center ds-heading-no-margin">
<h3
class="ds-heading ds-heading-h3 ds-heading-align-center ds-heading-no-margin"
style="word-break: break-all"
>
{{ groupName }}
</h3>
<!-- group slug -->
<p class="ds-text ds-text-center ds-text-soft">
<p class="ds-text ds-text-center ds-text-soft" style="word-break: break-all">
{{ `&${groupSlug}` }}
</p>
<!-- group location -->
@ -160,7 +163,7 @@
</p>
<div class="ds-my-xx-small"></div>
<div class="chip" align="center">
<os-badge>{{ group.about }}</os-badge>
<os-badge style="word-break: break-all">{{ group.about }}</os-badge>
</div>
</div>
</template>

View File

@ -2,7 +2,11 @@
<div>
<!-- feed top row: filter (left) + create post (right) -->
<div class="feed-top-row">
<div v-if="SHOW_CONTENT_FILTER_MASONRY_GRID" class="filterButtonMenu">
<div
v-if="SHOW_CONTENT_FILTER_MASONRY_GRID"
class="filterButtonMenu"
:class="{ 'hide-filter': hideByScroll }"
>
<os-button
class="my-filter-button"
v-if="
@ -75,7 +79,6 @@
placement: 'left',
}"
class="post-add-button"
:class="{ 'hide-filter': hideByScroll }"
variant="primary"
appearance="filled"
circle
@ -187,7 +190,7 @@ export default {
const { hashtag = null } = this.$route.query
return {
hideByScroll: false,
revScrollpos: 0,
prevScrollpos: 0,
showFilter: false,
developerNoAutoClosingFilterMenu: false, // stops automatic closing of filter menu for developer purposes: default is 'false'
showDonations: false,