diff --git a/packages/frontend/src/components/MkVisitorDashboard.vue b/packages/frontend/src/components/MkVisitorDashboard.vue index 50520b5d9d..8bef225de5 100644 --- a/packages/frontend/src/components/MkVisitorDashboard.vue +++ b/packages/frontend/src/components/MkVisitorDashboard.vue @@ -12,7 +12,7 @@ SPDX-License-Identifier: AGPL-3.0-only

- {{ instanceName }} + {{ instanceName }}

diff --git a/packages/frontend/src/ui/visitor.vue b/packages/frontend/src/ui/visitor.vue index 3e07959458..465960b51b 100644 --- a/packages/frontend/src/ui/visitor.vue +++ b/packages/frontend/src/ui/visitor.vue @@ -8,16 +8,18 @@ SPDX-License-Identifier: AGPL-3.0-only
-
-
+
+
- +
+ + {{ instanceName }} + {{ i18n.ts.signup }} +
@@ -38,6 +40,7 @@ import { i18n } from '@/i18n.js'; import MkVisitorDashboard from '@/components/MkVisitorDashboard.vue'; import { mainRouter } from '@/router.js'; import { DI } from '@/di.js'; +import MkButton from '@/components/MkButton.vue'; const isRoot = computed(() => mainRouter.currentRoute.value.name === 'index'); @@ -93,16 +96,26 @@ onMounted(() => { min-width: 0; } -.homeButton { - position: fixed; - z-index: 1000; - bottom: 16px; - right: 16px; - width: 60px; - height: 60px; +.header { + padding: 16px; + display: flex; + align-items: center; background: var(--MI_THEME-panel); - border-radius: 999px; - box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3); +} + +.headerIcon { + width: 48px; + vertical-align: bottom; + border-radius: 8px; +} + +.headerTitle { + margin: 0 16px; + font-weight: bold; +} + +.headerButton { + margin-left: auto; } .side { @@ -112,7 +125,7 @@ onMounted(() => { background: var(--MI_THEME-accent); } -.banner { +.sideBanner { position: absolute; top: 0; left: 0; @@ -124,7 +137,7 @@ onMounted(() => { mask-image: linear-gradient(rgba(0, 0, 0, 1.0), transparent); } -.dashboard { +.sideDashboard { padding: 32px; }