mirror of
https://github.com/elk-zone/elk.git
synced 2024-11-22 09:25:24 +03:00
feat: floating back button for xl
This commit is contained in:
parent
b4408422a8
commit
f177ea1ea8
3 changed files with 23 additions and 14 deletions
|
@ -14,7 +14,7 @@ defineProps<{
|
||||||
pt="[env(safe-area-inset-top,0)]"
|
pt="[env(safe-area-inset-top,0)]"
|
||||||
border="b base" bg="[rgba(var(--c-bg-base-rgb),0.7)]"
|
border="b base" bg="[rgba(var(--c-bg-base-rgb),0.7)]"
|
||||||
>
|
>
|
||||||
<div :class="{ 'xl:hidden': !back }" flex justify-between px5 py2>
|
<div xl:hidden flex justify-between px5 py2>
|
||||||
<div flex gap-3 items-center overflow-hidden py2>
|
<div flex gap-3 items-center overflow-hidden py2>
|
||||||
<NuxtLink
|
<NuxtLink
|
||||||
v-if="backOnSmallScreen || back" flex="~ gap1" items-center btn-text p-0
|
v-if="backOnSmallScreen || back" flex="~ gap1" items-center btn-text p-0
|
||||||
|
|
|
@ -6,6 +6,7 @@ const { env } = buildInfo
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<!-- Use external to force refresh page and jump to top of timeline -->
|
<!-- Use external to force refresh page and jump to top of timeline -->
|
||||||
|
<div flex justify-between>
|
||||||
<NuxtLink
|
<NuxtLink
|
||||||
flex items-end gap-4
|
flex items-end gap-4
|
||||||
py2 px-5
|
py2 px-5
|
||||||
|
@ -19,4 +20,12 @@ const { env } = buildInfo
|
||||||
{{ $t('app_name') }} <sup text-sm italic text-secondary mt-1>{{ env === 'release' ? 'alpha' : env }}</sup>
|
{{ $t('app_name') }} <sup text-sm italic text-secondary mt-1>{{ env === 'release' ? 'alpha' : env }}</sup>
|
||||||
</div>
|
</div>
|
||||||
</NuxtLink>
|
</NuxtLink>
|
||||||
|
<div hidden xl:flex items-center me-8 mt-2>
|
||||||
|
<NuxtLink
|
||||||
|
@click="$router.go(-1)"
|
||||||
|
>
|
||||||
|
<div i-ri:arrow-left-line class="rtl-flip" btn-text />
|
||||||
|
</NuxtLink>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
@ -61,7 +61,7 @@ onReactivated(() => {
|
||||||
<template>
|
<template>
|
||||||
<MainContent back>
|
<MainContent back>
|
||||||
<template v-if="!pending">
|
<template v-if="!pending">
|
||||||
<div v-if="status" mt--1px border="b base" mb="50vh">
|
<div v-if="status" xl:mt-4 border="b base" mb="50vh">
|
||||||
<template v-for="comment of context?.ancestors" :key="comment.id">
|
<template v-for="comment of context?.ancestors" :key="comment.id">
|
||||||
<StatusCard
|
<StatusCard
|
||||||
:status="comment" :actions="comment.visibility !== 'direct'" context="account"
|
:status="comment" :actions="comment.visibility !== 'direct'" context="account"
|
||||||
|
|
Loading…
Reference in a new issue