Front-end fixes

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
Thomas Citharel 2022-11-06 12:53:56 +01:00
parent e812b4291b
commit b860dadbfb
No known key found for this signature in database
GPG key ID: A061B9DDE0CA0773
5 changed files with 32 additions and 27 deletions

View file

@ -20,9 +20,9 @@
<div class="flex-1"> <div class="flex-1">
<div class="p-2 flex gap-2"> <div class="p-2 flex gap-2">
<div class=""> <div class="">
<figure class="" v-if="member.parent.avatar"> <figure class="h-12 w-12" v-if="member.parent.avatar">
<img <img
class="rounded-lg" class="rounded-full w-full h-full object-cover"
:src="member.parent.avatar.url" :src="member.parent.avatar.url"
alt="" alt=""
width="48" width="48"

View file

@ -27,7 +27,7 @@
paginated paginated
backend-pagination backend-pagination
backend-filtering backend-filtering
:debounce-search="200" :debounce-search="500"
v-model:current-page="page" v-model:current-page="page"
:aria-next-label="t('Next page')" :aria-next-label="t('Next page')"
:aria-previous-label="t('Previous page')" :aria-previous-label="t('Previous page')"
@ -72,9 +72,12 @@
<AccountGroup v-else :size="48" /> <AccountGroup v-else :size="48" />
<div class=""> <div class="">
<div class="prose dark:prose-invert"> <div class="prose dark:prose-invert">
<strong v-if="props.row.name">{{ props.row.name }}</strong <p v-if="props.row.name" class="font-bold mb-0">
><br v-if="props.row.name" /> {{ props.row.name }}
<small>@{{ props.row.preferredUsername }}</small> </p>
<span class="text-sm"
>@{{ props.row.preferredUsername }}</span
>
</div> </div>
</div> </div>
</article> </article>
@ -117,7 +120,7 @@ import {
} from "vue-use-route-query"; } from "vue-use-route-query";
import { useI18n } from "vue-i18n"; import { useI18n } from "vue-i18n";
import { useHead } from "@vueuse/head"; import { useHead } from "@vueuse/head";
import { computed } from "vue"; import { computed, ref } from "vue";
import { Paginate } from "@/types/paginate"; import { Paginate } from "@/types/paginate";
import { IGroup } from "@/types/actor"; import { IGroup } from "@/types/actor";
import AccountGroup from "vue-material-design-icons/AccountGroup.vue"; import AccountGroup from "vue-material-design-icons/AccountGroup.vue";
@ -126,9 +129,10 @@ const PROFILES_PER_PAGE = 10;
const { restrictions } = useRestrictions(); const { restrictions } = useRestrictions();
const preferredUsername = useRouteQuery("preferredUsername", ""); const preferredUsername = ref("");
const name = useRouteQuery("name", ""); const name = ref("");
const domain = useRouteQuery("domain", ""); const domain = ref("");
const local = useRouteQuery("local", false, booleanTransformer); const local = useRouteQuery("local", false, booleanTransformer);
const suspended = useRouteQuery("suspended", false, booleanTransformer); const suspended = useRouteQuery("suspended", false, booleanTransformer);
const page = useRouteQuery("page", 1, integerTransformer); const page = useRouteQuery("page", 1, integerTransformer);

View file

@ -20,7 +20,7 @@
paginated paginated
backend-pagination backend-pagination
backend-filtering backend-filtering
:debounce-search="200" :debounce-search="500"
v-model:current-page="page" v-model:current-page="page"
:aria-next-label="t('Next page')" :aria-next-label="t('Next page')"
:aria-previous-label="t('Previous page')" :aria-previous-label="t('Previous page')"
@ -102,7 +102,7 @@ import RouteName from "@/router/name";
import EmptyContent from "@/components/Utils/EmptyContent.vue"; import EmptyContent from "@/components/Utils/EmptyContent.vue";
import { useQuery } from "@vue/apollo-composable"; import { useQuery } from "@vue/apollo-composable";
import { useI18n } from "vue-i18n"; import { useI18n } from "vue-i18n";
import { computed } from "vue"; import { computed, ref } from "vue";
import { useHead } from "@vueuse/head"; import { useHead } from "@vueuse/head";
import { import {
useRouteQuery, useRouteQuery,
@ -115,9 +115,10 @@ import Account from "vue-material-design-icons/Account.vue";
const PROFILES_PER_PAGE = 10; const PROFILES_PER_PAGE = 10;
const preferredUsername = useRouteQuery("preferredUsername", ""); const preferredUsername = ref("");
const name = useRouteQuery("name", ""); const name = ref("");
const domain = useRouteQuery("domain", ""); const domain = ref("");
const local = useRouteQuery("local", false, booleanTransformer); const local = useRouteQuery("local", false, booleanTransformer);
const suspended = useRouteQuery("suspended", false, booleanTransformer); const suspended = useRouteQuery("suspended", false, booleanTransformer);
const page = useRouteQuery("page", 1, integerTransformer); const page = useRouteQuery("page", 1, integerTransformer);

View file

@ -1,9 +1,9 @@
<template> <template>
<section class="container mx-auto"> <section class="container mx-auto">
<h1 class="title">{{ $t("My groups") }}</h1> <h1 class="title">{{ t("My groups") }}</h1>
<p> <p>
{{ {{
$t( t(
"Groups are spaces for coordination and preparation to better organize events and manage your community." "Groups are spaces for coordination and preparation to better organize events and manage your community."
) )
}} }}
@ -13,7 +13,7 @@
tag="router-link" tag="router-link"
variant="primary" variant="primary"
:to="{ name: RouteName.CREATE_GROUP }" :to="{ name: RouteName.CREATE_GROUP }"
>{{ $t("Create group") }}</o-button >{{ t("Create group") }}</o-button
> >
</div> </div>
<o-loading v-model:active="loading"></o-loading> <o-loading v-model:active="loading"></o-loading>
@ -35,10 +35,10 @@
v-show="membershipsPages.total > limit" v-show="membershipsPages.total > limit"
v-model="page" v-model="page"
:per-page="limit" :per-page="limit"
:aria-next-label="$t('Next page')" :aria-next-label="t('Next page')"
:aria-previous-label="$t('Previous page')" :aria-previous-label="t('Previous page')"
:aria-page-label="$t('Page')" :aria-page-label="t('Page')"
:aria-current-label="$t('Current page')" :aria-current-label="t('Current page')"
> >
</o-pagination> </o-pagination>
</section> </section>
@ -51,7 +51,7 @@
<div class="img-container" :class="{ webp: supportsWebPFormat }" /> <div class="img-container" :class="{ webp: supportsWebPFormat }" />
<div class="text-center"> <div class="text-center">
<p> <p>
{{ $t("You are not part of any group.") }} {{ t("You are not part of any group.") }}
<i18n-t <i18n-t
keypath="Do you wish to {create_group} or {explore_groups}?" keypath="Do you wish to {create_group} or {explore_groups}?"
> >
@ -59,14 +59,14 @@
<o-button <o-button
tag="router-link" tag="router-link"
:to="{ name: RouteName.CREATE_GROUP }" :to="{ name: RouteName.CREATE_GROUP }"
>{{ $t("create a group") }}</o-button >{{ t("create a group") }}</o-button
> >
</template> </template>
<template #explore_groups> <template #explore_groups>
<o-button <o-button
tag="router-link" tag="router-link"
:to="{ name: RouteName.SEARCH }" :to="{ name: RouteName.SEARCH }"
>{{ $t("explore the groups") }}</o-button >{{ t("explore the groups") }}</o-button
> >
</template> </template>
</i18n-t> </i18n-t>

View file

@ -21,11 +21,11 @@
> >
<div class="flex gap-1"> <div class="flex gap-1">
<div class="flex gap-1"> <div class="flex gap-1">
<figure class="" v-if="log.actor?.avatar"> <figure class="h-10 w-10" v-if="log.actor?.avatar">
<img <img
alt="" alt=""
:src="log.actor.avatar?.url" :src="log.actor.avatar?.url"
class="rounded-full" class="object-cover rounded-full h-full w-full"
width="36" width="36"
height="36" height="36"
/> />