mirror of
https://github.com/versia-pub/frontend.git
synced 2025-12-06 08:28:20 +01:00
48 lines
1.9 KiB
Vue
48 lines
1.9 KiB
Vue
<template>
|
|
<div class="from-background-600 to-background-900 bg-gradient-to-tl relative min-h-dvh">
|
|
<SquarePattern />
|
|
<Navigation />
|
|
|
|
<div class="relative md:pl-20 min-h-dvh flex flex-row overflow-hidden justify-center xl:justify-between">
|
|
<OverlayScrollbarsComponent :defer="true" class="w-full max-h-dvh overflow-y-auto" :element="'main'">
|
|
<slot />
|
|
</OverlayScrollbarsComponent>
|
|
<CollapsibleAside v-if="width > 1280 && identity" direction="right"
|
|
class="max-w-md max-h-dvh overflow-y-auto w-full hidden absolute inset-y-0 xl:flex">
|
|
<TimelineScroller>
|
|
<Notifications />
|
|
</TimelineScroller>
|
|
</CollapsibleAside>
|
|
</div>
|
|
</div>
|
|
<ComposerModal />
|
|
<AttachmentDialog />
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import ComposerModal from "~/components/composer/modal.client.vue";
|
|
import SquarePattern from "~/components/graphics/square-pattern.vue";
|
|
import CollapsibleAside from "~/components/sidebars/collapsible-aside.vue";
|
|
import Navigation from "~/components/sidebars/navigation.vue";
|
|
import AttachmentDialog from "~/components/social-elements/notes/attachment-dialog.vue";
|
|
import Notifications from "~/components/timelines/notifications.vue";
|
|
import TimelineScroller from "~/components/timelines/timeline-scroller.vue";
|
|
import { OverlayScrollbarsComponent } from "#imports";
|
|
const { width } = useWindowSize();
|
|
|
|
const { n } = useMagicKeys();
|
|
const activeElement = useActiveElement();
|
|
const notUsingInput = computed(
|
|
() =>
|
|
activeElement.value?.tagName !== "INPUT" &&
|
|
activeElement.value?.tagName !== "TEXTAREA",
|
|
);
|
|
|
|
watchEffect(async () => {
|
|
if (n?.value && notUsingInput.value) {
|
|
// Wait 50ms
|
|
await new Promise((resolve) => setTimeout(resolve, 50));
|
|
useEvent("composer:open");
|
|
}
|
|
});
|
|
</script> |