zio
/
elk
2
0
Fork 0
Code Packages Releases 2 Activity

fix: improve SSR for settings back button

zio/stable
Anthony Fu 2022-12-28 02:12:56 +01:00
parent d8d163dbd0
commit d09b4deb52
7 changed files with 14 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
components/main/MainContent.vue
View File

@ -1,6 +1,9 @@
<script setup lang="ts"> <script setup lang="ts">
defineProps<{ defineProps<{
back?: boolean /**
* Show the back button on small screens
*/
backOnSmallScreen?: boolean
}>() }>()
</script> </script>
@ -12,7 +15,10 @@ defineProps<{
> >
<div flex justify-between px5 py4> <div flex justify-between px5 py4>
<div flex gap-3 items-center overflow-hidden> <div flex gap-3 items-center overflow-hidden>
<NuxtLink v-show="back" flex="~ gap1" items-center btn-text p-0 @click="$router.go(-1)"> <NuxtLink
v-if="backOnSmallScreen" lg:hidden flex="~ gap1" items-center btn-text p-0
@click="$router.go(-1)"
>
<div i-ri:arrow-left-line /> <div i-ri:arrow-left-line />
</NuxtLink> </NuxtLink>
<div truncate> <div truncate>

6
pages/settings/about/index.vue
View File

@ -1,9 +1,5 @@
<script lang="ts" setup>
const { lg } = breakpoints
</script>
<template> <template>
<MainContent :back="!lg"> <MainContent back-on-small-screen>
<template #title> <template #title>
<div text-lg font-bold flex items-center gap-2 @click="$scrollToTop"> <div text-lg font-bold flex items-center gap-2 @click="$scrollToTop">
<span>{{ $t('settings.about.label') }}</span> <span>{{ $t('settings.about.label') }}</span>

6
pages/settings/interface/index.vue
View File

@ -1,9 +1,5 @@
<script lang="ts" setup>
const { lg } = breakpoints
</script>
<template> <template>
<MainContent :back="!lg"> <MainContent back-on-small-screen>
<template #title> <template #title>
<div text-lg font-bold flex items-center gap-2 @click="$scrollToTop"> <div text-lg font-bold flex items-center gap-2 @click="$scrollToTop">
<span>{{ $t('settings.interface.label') }}</span> <span>{{ $t('settings.interface.label') }}</span>

6
pages/settings/language/index.vue
View File

@ -1,9 +1,5 @@
<script lang="ts" setup>
const { lg } = breakpoints
</script>
<template> <template>
<MainContent :back="!lg"> <MainContent back-on-small-screen>
<template #title> <template #title>
<div text-lg font-bold flex items-center gap-2 @click="$scrollToTop"> <div text-lg font-bold flex items-center gap-2 @click="$scrollToTop">
<span>{{ $t('settings.language.label') }}</span> <span>{{ $t('settings.language.label') }}</span>

6
pages/settings/preferences/index.vue
View File

@ -1,9 +1,5 @@
<script lang="ts" setup>
const { lg } = breakpoints
</script>
<template> <template>
<MainContent :back="!lg"> <MainContent back-on-small-screen>
<template #title> <template #title>
<div text-lg font-bold flex items-center gap-2 @click="$scrollToTop"> <div text-lg font-bold flex items-center gap-2 @click="$scrollToTop">
<span>{{ $t('settings.preferences.label') }}</span> <span>{{ $t('settings.preferences.label') }}</span>

6
pages/settings/profile/index.vue
View File

@ -1,9 +1,5 @@
<script lang="ts" setup>
const { lg } = breakpoints
</script>
<template> <template>
<MainContent :back="!lg"> <MainContent back-on-small-screen>
<template #title> <template #title>
<div text-lg font-bold flex items-center gap-2 @click="$scrollToTop"> <div text-lg font-bold flex items-center gap-2 @click="$scrollToTop">
<span>{{ $t('settings.profile.label') }}</span> <span>{{ $t('settings.profile.label') }}</span>

2
pages/settings/users/index.vue
View File

@ -63,7 +63,7 @@ async function importTokens() {
</script> </script>
<template> <template>
<MainContent :back="!lg"> <MainContent back-on-small-screen>
<template #title> <template #title>
<div text-lg font-bold flex items-center gap-2 @click="$scrollToTop"> <div text-lg font-bold flex items-center gap-2 @click="$scrollToTop">
<span>{{ $t('settings.users.label') }}</span> <span>{{ $t('settings.users.label') }}</span>