feat: render app shell with ssr to improve loading experience (#448)
This commit is contained in:
parent
b545efeacc
commit
9395b7031e
35 changed files with 169 additions and 127 deletions
|
@ -29,28 +29,30 @@ useEventListener('keydown', (e: KeyboardEvent) => {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<ModalDialog v-model="isSigninDialogOpen" py-4 px-8 max-w-125>
|
||||
<UserSignIn />
|
||||
</ModalDialog>
|
||||
<ModalDialog v-model="isPreviewHelpOpen" max-w-125>
|
||||
<HelpPreview @close="closePreviewHelp()" />
|
||||
</ModalDialog>
|
||||
<ModalDialog v-model="isPublishDialogOpen" max-w-180 flex>
|
||||
<!-- This `w-0` style is used to avoid overflow problems in flex layouts,so don't remove it unless you know what you're doing -->
|
||||
<PublishWidget :draft-key="dialogDraftKey" expanded flex-1 w-0 />
|
||||
</ModalDialog>
|
||||
<ModalDialog
|
||||
v-model="isMediaPreviewOpen"
|
||||
pointer-events-none
|
||||
w-full max-w-full h-full max-h-full
|
||||
bg-transparent border-0 shadow-none
|
||||
>
|
||||
<ModalMediaPreview v-if="isMediaPreviewOpen" @close="closeMediaPreview()" />
|
||||
</ModalDialog>
|
||||
<ModalDialog v-model="isEditHistoryDialogOpen" max-w-125>
|
||||
<StatusEditPreview :edit="statusEdit" />
|
||||
</ModalDialog>
|
||||
<ModalDialog v-model="isCommandPanelOpen" max-w-fit flex>
|
||||
<CommandPanel @close="closeCommandPanel()" />
|
||||
</ModalDialog>
|
||||
<template v-if="isMastoInitialised">
|
||||
<ModalDialog v-model="isSigninDialogOpen" py-4 px-8 max-w-125>
|
||||
<UserSignIn />
|
||||
</ModalDialog>
|
||||
<ModalDialog v-model="isPreviewHelpOpen" max-w-125>
|
||||
<HelpPreview @close="closePreviewHelp()" />
|
||||
</ModalDialog>
|
||||
<ModalDialog v-model="isPublishDialogOpen" max-w-180 flex>
|
||||
<!-- This `w-0` style is used to avoid overflow problems in flex layouts,so don't remove it unless you know what you're doing -->
|
||||
<PublishWidget :draft-key="dialogDraftKey" expanded flex-1 w-0 />
|
||||
</ModalDialog>
|
||||
<ModalDialog
|
||||
v-model="isMediaPreviewOpen"
|
||||
pointer-events-none
|
||||
w-full max-w-full h-full max-h-full
|
||||
bg-transparent border-0 shadow-none
|
||||
>
|
||||
<ModalMediaPreview v-if="isMediaPreviewOpen" @close="closeMediaPreview()" />
|
||||
</ModalDialog>
|
||||
<ModalDialog v-model="isEditHistoryDialogOpen" max-w-125>
|
||||
<StatusEditPreview :edit="statusEdit" />
|
||||
</ModalDialog>
|
||||
<ModalDialog v-model="isCommandPanelOpen" max-w-fit flex>
|
||||
<CommandPanel @close="closeCommandPanel()" />
|
||||
</ModalDialog>
|
||||
</template>
|
||||
</template>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue