c2a95b484f
* New Text Styles. Initial FE2 changes * More fe2 styling classes * Minor update * Minor update * Fix build * More updates for discussion * More styling updates * Minor updates to inputs * More text updates * More font class swapping * Revert dui3 changes * Confirmed Lineheights * Add story files for new text styles * Minor copy changes * Minor typo * andrew/web-1371-misalignment-in-account-dropdown * andrew/web-1374-settings-text-styles-are-not-right * andrew/web-1375-nav-texts-should-be-14px * andrew/web-1376-decrease-size-of-versions-header * andrew/web-1377-version-card-title * semibold>medium * Measure mode * Changes from PR * Tweaked nav menu * Revert prose change. Add prose-sm --------- Co-authored-by: Mike Tasset <mike.tasset@gmail.com>
40 lines
1.4 KiB
Vue
40 lines
1.4 KiB
Vue
<template>
|
|
<ProjectPageStatsBlock>
|
|
<template #top>
|
|
<div class="flex items-center">
|
|
<div class="flex items-center justify-between w-full">
|
|
<div class="flex items-center gap-1 flex-grow select-none">
|
|
<span class="text-heading-sm text-foreground">Collaborators</span>
|
|
</div>
|
|
<div class="text-body-xs flex items-center capitalize">
|
|
{{ project.role?.split(':').reverse()[0] }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<template #bottom>
|
|
<div class="flex items-center justify-between mt-1">
|
|
<UserAvatarGroup :users="teamUsers" class="max-w-[104px]" />
|
|
<div v-if="canEdit">
|
|
<FormButton class="ml-2" :to="projectCollaboratorsRoute(project.id)">
|
|
Manage
|
|
</FormButton>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</ProjectPageStatsBlock>
|
|
</template>
|
|
<script setup lang="ts">
|
|
import { canEditProject } from '~~/lib/projects/helpers/permissions'
|
|
import type { ProjectPageTeamInternals_ProjectFragment } from '~~/lib/common/generated/gql/graphql'
|
|
import { projectCollaboratorsRoute } from '~~/lib/common/helpers/route'
|
|
|
|
const props = defineProps<{
|
|
project: ProjectPageTeamInternals_ProjectFragment
|
|
}>()
|
|
|
|
const canEdit = computed(() => canEditProject(props.project))
|
|
|
|
const teamUsers = computed(() => props.project.team.map((t) => t.user))
|
|
</script>
|