feat: 重做新手导览

按新的顺序重写 main 导览(10 个内容点,导航 + 高亮共 16 步):
主页、登录 StarLight、侧栏公告、创建 StarLight 实例、发现内容、
皮肤选择器、实例库、实验室、下载、设置的更新页。

- onboardingConfig.ts 重写 onboardingTours.main,并新增 home-intro/
  account-login/announcement/create-starlight/settings-updates 文案;
- HomeAnnouncementEntry.vue 增加 data-onboarding-id="home-announcement"
  锚点;
- en-US / zh-CN 补齐上述新增文案。
This commit is contained in:
AxTps committed 2026-10-01 09:21:39 +08:00
1 parent 0a6fa0eb35
commit c7d1e44719
4 files changed
+146 -114

No files matched your search

@@ -11,6 +11,7 @@ function open() {
<template>
<section
data-onboarding-id="home-announcement"
class="flex min-w-0 flex-col gap-3 border-0 border-b-[1px] border-solid border-[--brand-gradient-border] p-4"
>
<button
@@ -276,6 +276,48 @@ export const onboardingMessages = defineMessages({
},
skip: { id: 'app.onboarding.action.skip', defaultMessage: 'Leave the tour' },
mascotAlt: { id: 'app.onboarding.mascot-alt', defaultMessage: 'Starlight guide' },
homeIntroTitle: { id: 'app.onboarding.home-intro.title', defaultMessage: 'Welcome home' },
homeIntroDescription: {
id: 'app.onboarding.home-intro.description',
defaultMessage:
'This is your home page. It shows your instances, recent activity, and quick shortcuts to get playing.',
},
accountLoginTitle: {
id: 'app.onboarding.account-login.title',
defaultMessage: 'Sign in to StarLight',
},
accountLoginDescription: {
id: 'app.onboarding.account-login.description',
defaultMessage:
'Sign in to the StarLight skin site here to use your StarLight players, install hosted modpacks, and sync your account.',
},
announcementTitle: {
id: 'app.onboarding.announcement.title',
defaultMessage: 'Latest announcements',
},
announcementDescription: {
id: 'app.onboarding.announcement.description',
defaultMessage:
'Open the announcement entry in the sidebar to read the latest news, rules, and server notices.',
},
createStarlightTitle: {
id: 'app.onboarding.create-starlight.title',
defaultMessage: 'Create a StarLight instance',
},
createStarlightDescription: {
id: 'app.onboarding.create-starlight.description',
defaultMessage:
'Use Create new instance here. A StarLight instance installs the server-selected modpack and versions, then keeps them updated before each launch.',
},
settingsUpdatesTitle: {
id: 'app.onboarding.settings-updates.title',
defaultMessage: 'Stay up to date',
},
settingsUpdatesDescription: {
id: 'app.onboarding.settings-updates.description',
defaultMessage:
'The Updates tab controls the update channel, checks for new launcher versions, and shows the changelog.',
},
})
const step = (
@@ -331,20 +373,29 @@ const settingsTourSteps: Array<[string, string, MessageDescriptor, MessageDescri
export const onboardingTours: Record<OnboardingMode, OnboardingStep[]> = {
main: [
step(
'welcome',
'manual',
copy(
onboardingMessages.welcomeTitle,
onboardingMessages.welcomeDescription,
onboardingMessages.start,
),
inspect(
'home-intro',
'home-widget-grid',
onboardingMessages.homeIntroTitle,
onboardingMessages.homeIntroDescription,
),
inspect(
'home-layout-switch',
'home-layout-switch',
onboardingMessages.homeLayoutTitle,
onboardingMessages.homeLayoutDescription,
'account-login',
'account-entry',
onboardingMessages.accountLoginTitle,
onboardingMessages.accountLoginDescription,
),
inspect(
'announcement',
'home-announcement',
onboardingMessages.announcementTitle,
onboardingMessages.announcementDescription,
),
inspect(
'create-starlight',
'create-instance',
onboardingMessages.createStarlightTitle,
onboardingMessages.createStarlightDescription,
),
step(
'discover-navigation',
@@ -362,22 +413,6 @@ export const onboardingTours: Record<OnboardingMode, OnboardingStep[]> = {
onboardingMessages.browseTitle,
onboardingMessages.browseDescription,
),
step(
'discover-favorites-navigation',
'navigate',
copy(
onboardingMessages.favoritesTitle,
onboardingMessages.favoritesDescription,
onboardingMessages.clickFavorites,
),
control('browse-favorites-tab', '/browse/favorites'),
),
inspect(
'discover-favorites-content',
'browse-favorites-content',
onboardingMessages.favoritesTitle,
onboardingMessages.favoritesDescription,
),
step(
'skins-navigation',
'navigate',
@@ -394,6 +429,22 @@ export const onboardingTours: Record<OnboardingMode, OnboardingStep[]> = {
onboardingMessages.skinsPageTitle,
onboardingMessages.skinsPageDescription,
),
step(
'library-navigation',
'navigate',
copy(
onboardingMessages.libraryTitle,
onboardingMessages.libraryDescription,
onboardingMessages.clickLibrary,
),
control('nav-library', '/library'),
),
inspect(
'library-content',
'library-content',
onboardingMessages.libraryPageTitle,
onboardingMessages.libraryPageDescription,
),
step(
'lab-navigation',
'navigate',
@@ -428,7 +479,7 @@ export const onboardingTours: Record<OnboardingMode, OnboardingStep[]> = {
),
step(
'settings-navigation',
'activate',
'navigate',
copy(
onboardingMessages.settingsTitle,
onboardingMessages.settingsDescription,
@@ -436,95 +487,15 @@ export const onboardingTours: Record<OnboardingMode, OnboardingStep[]> = {
),
control('nav-settings', '/settings'),
),
...settingsTourSteps.map(([id, targetId, title, description], index) =>
step(id, 'activate', copy(title, description, onboardingMessages.clickTab), {
...control(targetId),
closeSettingsAfter: index === settingsTourSteps.length - 1,
}),
),
step(
'library-navigation',
'navigate',
copy(
onboardingMessages.libraryTitle,
onboardingMessages.libraryDescription,
onboardingMessages.clickLibrary,
),
control('nav-library', '/library'),
),
inspect(
'library-content',
'library-content',
onboardingMessages.libraryPageTitle,
onboardingMessages.libraryPageDescription,
),
step(
'create-instance',
'navigate',
copy(
onboardingMessages.createTitle,
onboardingMessages.createDescription,
onboardingMessages.clickCreate,
),
control('create-instance', '/create'),
),
inspect(
'creation-instance-mode',
'creation-instance-mode',
onboardingMessages.instanceModeTitle,
onboardingMessages.instanceModeDescription,
),
step(
'creation-flow',
'settings-updates',
'activate',
copy(
onboardingMessages.creationTitle,
onboardingMessages.creationDescription,
onboardingMessages.clickCreationMethod,
onboardingMessages.settingsUpdatesTitle,
onboardingMessages.settingsUpdatesDescription,
onboardingMessages.clickTab,
),
{
targetId: 'creation-methods',
branchByTarget: {
'creation-method-starlight': { next: 'complete' },
'creation-method-custom': { creationPath: 'custom', next: 'creation-name' },
'creation-method-import': { next: 'complete' },
},
},
),
inspect(
'creation-name',
'creation-name',
onboardingMessages.creationNameTitle,
onboardingMessages.creationNameDescription,
),
inspect(
'creation-loader',
'creation-loader',
onboardingMessages.creationLoaderTitle,
onboardingMessages.creationLoaderDescription,
),
step(
'creation-version',
'inspect',
copy(
onboardingMessages.creationVersionTitle,
onboardingMessages.creationVersionDescription,
onboardingMessages.continueArea,
),
{
targetId: 'creation-game-version',
nextByCreationPath: { custom: 'creation-confirm' },
},
),
step(
'creation-confirm',
'inspect',
copy(
onboardingMessages.creationConfirmTitle,
onboardingMessages.creationConfirmDescription,
onboardingMessages.finishArea,
),
{ targetId: 'creation-confirm' },
control('settings-tab-updates'),
),
],
instance: [
@@ -5975,6 +5975,36 @@
"app.onboarding.welcome.title": {
"message": "Everything is ready"
},
"app.onboarding.home-intro.title": {
"message": "Welcome home"
},
"app.onboarding.home-intro.description": {
"message": "This is your home page. It shows your instances, recent activity, and quick shortcuts to get playing."
},
"app.onboarding.account-login.title": {
"message": "Sign in to StarLight"
},
"app.onboarding.account-login.description": {
"message": "Sign in to the StarLight skin site here to use your StarLight players, install hosted modpacks, and sync your account."
},
"app.onboarding.announcement.title": {
"message": "Latest announcements"
},
"app.onboarding.announcement.description": {
"message": "Open the announcement entry in the sidebar to read the latest news, rules, and server notices."
},
"app.onboarding.create-starlight.title": {
"message": "Create a StarLight instance"
},
"app.onboarding.create-starlight.description": {
"message": "Use Create new instance here. A StarLight instance installs the server-selected modpack and versions, then keeps them updated before each launch."
},
"app.onboarding.settings-updates.title": {
"message": "Stay up to date"
},
"app.onboarding.settings-updates.description": {
"message": "The Updates tab controls the update channel, checks for new launcher versions, and shows the changelog."
},
"app.project.curseforge.loading": {
"message": "Loading CurseForge project…"
},
@@ -6061,6 +6061,36 @@
"app.onboarding.welcome.title": {
"message": "一切就绪"
},
"app.onboarding.home-intro.title": {
"message": "欢迎回家"
},
"app.onboarding.home-intro.description": {
"message": "这里是你的主页,展示你的实例、最近活动和快速开始游戏的入口。"
},
"app.onboarding.account-login.title": {
"message": "登录 StarLight"
},
"app.onboarding.account-login.description": {
"message": "在这里登录 StarLight 皮肤站,即可使用皮肤站玩家、安装托管整合包并同步你的账号。"
},
"app.onboarding.announcement.title": {
"message": "最新公告"
},
"app.onboarding.announcement.description": {
"message": "打开侧栏的公告入口,查看最新消息、服规与服务器通知。"
},
"app.onboarding.create-starlight.title": {
"message": "创建 StarLight 实例"
},
"app.onboarding.create-starlight.description": {
"message": "点击这里的“创建新实例”。StarLight 实例会安装服务器指定的整合包与版本,并在每次启动前保持更新。"
},
"app.onboarding.settings-updates.title": {
"message": "保持最新"
},
"app.onboarding.settings-updates.description": {
"message": "“更新”页用于设置更新通道、检查启动器新版本并查看更新日志。"
},
"app.project.curseforge.loading": {
"message": "正在加载 CurseForge 项目…"
},