From 51de7caa601bd244b5cccf81505d253e46da36c8 Mon Sep 17 00:00:00 2001 From: VictorPuga <39507381+VictorPuga@users.noreply.github.com> Date: Sat, 6 Dec 2025 13:22:29 -0600 Subject: [PATCH 1/8] Added documentation homepage --- src/mixins/indexDataFetcher.js | 2 + src/routes.js | 9 + src/setup-utils/SwiftDocCRenderRouter.js | 5 +- src/stores/IndexStore.js | 5 + src/views/Index.vue | 360 +++++++++++++++++++++++ 5 files changed, 379 insertions(+), 2 deletions(-) create mode 100644 src/views/Index.vue diff --git a/src/mixins/indexDataFetcher.js b/src/mixins/indexDataFetcher.js index 10d41881d..2940a80df 100644 --- a/src/mixins/indexDataFetcher.js +++ b/src/mixins/indexDataFetcher.js @@ -28,8 +28,10 @@ export default { interfaceLanguages, references = {}, } = await fetchData(this.indexDataPath); + const topLevelNodes = Object.values(interfaceLanguages || {}).flat(); const flatChildren = Object.freeze(flattenNavigationIndex(interfaceLanguages)); IndexStore.setFlatChildren(flatChildren); + IndexStore.setTopLevelNodes(topLevelNodes); IndexStore.setTechnologyProps(extractTechnologyProps(interfaceLanguages)); IndexStore.setReferences(references); IndexStore.setIncludedArchiveIdentifiers(includedArchiveIdentifiers); diff --git a/src/routes.js b/src/routes.js index 11343bed5..d916fa49e 100644 --- a/src/routes.js +++ b/src/routes.js @@ -16,6 +16,14 @@ import { import ServerError from 'theme/views/ServerError.vue'; import NotFound from 'theme/views/NotFound.vue'; +export const homeRoute = { + path: '/', + name: 'home-index', + component: () => import( + /* webpackChunkName: "home-index" */ 'theme/views/Index.vue' + ), +}; + export const fallbackRoutes = [ { path: '*', @@ -54,6 +62,7 @@ export const pagesRoutes = [ ]; export default [ + homeRoute, ...pagesRoutes, ...fallbackRoutes, ]; diff --git a/src/setup-utils/SwiftDocCRenderRouter.js b/src/setup-utils/SwiftDocCRenderRouter.js index 26a70308d..8558a9b89 100644 --- a/src/setup-utils/SwiftDocCRenderRouter.js +++ b/src/setup-utils/SwiftDocCRenderRouter.js @@ -14,12 +14,13 @@ import { restoreScrollOnReload, scrollBehavior, } from 'docc-render/utils/router-utils'; -import routes, { fallbackRoutes } from 'docc-render/routes'; +import { homeRoute, pagesRoutes, fallbackRoutes } from 'docc-render/routes'; import { baseUrl } from 'docc-render/utils/theme-settings'; import { addPrefixedRoutes } from 'docc-render/utils/route-utils'; const defaultRoutes = [ - ...addPrefixedRoutes(routes), + homeRoute, + ...addPrefixedRoutes(pagesRoutes), ...fallbackRoutes, ]; diff --git a/src/stores/IndexStore.js b/src/stores/IndexStore.js index 39333424f..600f5b290 100644 --- a/src/stores/IndexStore.js +++ b/src/stores/IndexStore.js @@ -11,6 +11,7 @@ export default { state: { flatChildren: null, + topLevelNodes: [], references: {}, apiChanges: null, apiChangesVersion: null, @@ -21,6 +22,7 @@ export default { }, reset() { this.state.flatChildren = null; + this.state.topLevelNodes = []; this.state.references = {}; this.state.apiChanges = null; this.state.apiChangesVersion = null; @@ -35,6 +37,9 @@ export default { setReferences(references) { this.state.references = references; }, + setTopLevelNodes(nodes) { + this.state.topLevelNodes = nodes || []; + }, setApiChanges(diff) { this.state.apiChanges = diff; }, diff --git a/src/views/Index.vue b/src/views/Index.vue new file mode 100644 index 000000000..126e464e5 --- /dev/null +++ b/src/views/Index.vue @@ -0,0 +1,360 @@ + + + + + + + From 8dba1ef0fcb97ce645be72d3ecbc214d61108ced Mon Sep 17 00:00:00 2001 From: VictorPuga <39507381+VictorPuga@users.noreply.github.com> Date: Sun, 7 Dec 2025 13:32:02 -0600 Subject: [PATCH 2/8] Added theme variables --- src/views/Index.vue | 34 +++++++++++++++++++--------------- 1 file changed, 19 insertions(+), 15 deletions(-) diff --git a/src/views/Index.vue b/src/views/Index.vue index 126e464e5..953e282b2 100644 --- a/src/views/Index.vue +++ b/src/views/Index.vue @@ -229,9 +229,9 @@ export default { min-width: 28px; padding: 4px 10px; border-radius: 14px; - background: #f1f2f6; + background: var(--color-fill-secondary); font-weight: 600; - color: #1d1d1f; + color: var(--color-figure-gray); font-size: 0.9rem; } @@ -262,16 +262,20 @@ export default { font-size: 0.75rem; padding: 2px 8px; border-radius: 999px; - background: #fde68a; - color: #92400e; + background: var(--color-standard-yellow); + color: var(--color-figure-orange); } .hero { - background: radial-gradient(120% 120% at 20% 20%, #2c2c34 0%, #111118 55%); - color: #f5f5f7; + background: linear-gradient( + 315deg, + var(--color-fill-secondary), + var(--color-fill-tertiary) + ); + color: var(--colors-header-text, var(--color-header-text)); padding: 48px 36px; border-radius: 20px; - box-shadow: 0 20px 60px rgba(0, 0, 0, 0.45); + box-shadow: 0 20px 60px var(--color-card-shadow); text-align: center; position: relative; overflow: hidden; @@ -289,7 +293,7 @@ export default { .hero__lede { margin: 0; - color: #d1d1d6; + color: var(--colors-text, var(--color-text)); font-size: 1.1rem; } @@ -308,10 +312,10 @@ export default { flex-direction: column; gap: 8px; padding: 16px; - background: #15151c; - color: #f5f5f7; + background: var(--color-card-background); + color: var(--color-card-content-text); border-radius: 12px; - border: 1px solid #222230; + border: 1px solid var(--color-link-block-card-border); text-decoration: none; position: relative; transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease; @@ -319,8 +323,8 @@ export default { .feature-card:hover { transform: translateY(-2px); - box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35); - border-color: #2e2e3e; + box-shadow: 0 10px 30px var(--color-card-shadow); + border-color: var(--color-navigator-item-hover); } .feature-card__icon { @@ -343,8 +347,8 @@ export default { font-size: 0.75rem; padding: 2px 8px; border-radius: 999px; - background: #fde68a; - color: #92400e; + background: var(--color-standard-yellow); + color: var(--color-figure-orange); } @media (max-width: 768px) { From c0925b5fdc3ff4954b2731ef980201475baf6b49 Mon Sep 17 00:00:00 2001 From: VictorPuga <39507381+VictorPuga@users.noreply.github.com> Date: Sun, 7 Dec 2025 13:34:29 -0600 Subject: [PATCH 3/8] Removed unused styles --- src/views/Index.vue | 52 +-------------------------------------------- 1 file changed, 1 insertion(+), 51 deletions(-) diff --git a/src/views/Index.vue b/src/views/Index.vue index 953e282b2..0ef329be6 100644 --- a/src/views/Index.vue +++ b/src/views/Index.vue @@ -224,54 +224,8 @@ export default { margin-bottom: 12px; } -.index-section__count { - display: inline-flex; - min-width: 28px; - padding: 4px 10px; - border-radius: 14px; - background: var(--color-fill-secondary); - font-weight: 600; - color: var(--color-figure-gray); - font-size: 0.9rem; -} - -.index-list { - list-style: none; - padding: 0; - margin: 0; -} - -.index-list__item { - display: flex; - align-items: center; - gap: 8px; - padding: 8px 0; - border-bottom: 1px solid #e5e5ea; -} - -.index-list__link { - color: inherit; - text-decoration: none; -} - -.index-list__link:hover { - text-decoration: underline; -} - -.index-list__tag { - font-size: 0.75rem; - padding: 2px 8px; - border-radius: 999px; - background: var(--color-standard-yellow); - color: var(--color-figure-orange); -} - .hero { - background: linear-gradient( - 315deg, - var(--color-fill-secondary), - var(--color-fill-tertiary) - ); + background: linear-gradient(315deg, var(--color-fill-secondary), var(--color-fill-tertiary)); color: var(--colors-header-text, var(--color-header-text)); padding: 48px 36px; border-radius: 20px; @@ -281,10 +235,6 @@ export default { overflow: hidden; } -.hero::after { - content: none; -} - .hero__title { font-size: 2.6rem; line-height: 1.2; From e6f866252b7bc68c61bd7a2c9d1a74e053f514a1 Mon Sep 17 00:00:00 2001 From: VictorPuga <39507381+VictorPuga@users.noreply.github.com> Date: Sun, 7 Dec 2025 13:48:34 -0600 Subject: [PATCH 4/8] Simplified styles --- src/views/Index.vue | 42 +++++++++++++++++++++++------------------- 1 file changed, 23 insertions(+), 19 deletions(-) diff --git a/src/views/Index.vue b/src/views/Index.vue index 0ef329be6..20f7c4dd3 100644 --- a/src/views/Index.vue +++ b/src/views/Index.vue @@ -208,9 +208,9 @@ export default { From e0d1327a9d400ed2ccb129e8fb3e893172906056 Mon Sep 17 00:00:00 2001 From: VictorPuga <39507381+VictorPuga@users.noreply.github.com> Date: Sun, 7 Dec 2025 13:59:44 -0600 Subject: [PATCH 5/8] Improved hero UI --- src/views/Index.vue | 19 +++++++++---------- 1 file changed, 9 insertions(+), 10 deletions(-) diff --git a/src/views/Index.vue b/src/views/Index.vue index 20f7c4dd3..22579fe40 100644 --- a/src/views/Index.vue +++ b/src/views/Index.vue @@ -143,8 +143,8 @@ export default { data: () => ({ // fallback interface language used by indexDataGetter interfaceLanguage: Language.swift.key.url, - heroTitle: 'Apple Developer Documentation', - heroCopy: 'Browse the latest sample code, articles, tutorials, and API reference.', + heroTitle: 'Developer Documentation', + heroCopy: 'Browse the latest API reference.', store: DocumentationTopicStore, BreakpointName, }), @@ -231,9 +231,10 @@ export default { border-radius: 20px; box-shadow: 0 20px 60px var(--color-card-shadow); text-align: center; - width: fit-content; - max-width: 100%; + width: 50%; margin: 0 auto 32px; + display: flex; + flex-direction: column; } .hero__title { @@ -256,6 +257,10 @@ export default { } @media (max-width: 1024px) { + .hero { + width: unset; + } + .card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } @@ -309,10 +314,4 @@ export default { color: var(--color-figure-orange); } -@media (max-width: 768px) { - .hero { - padding: 28px 20px; - text-align: left; - } -} From 7653d3bac89d007684670e3200596c4f6a8a66a6 Mon Sep 17 00:00:00 2001 From: VictorPuga <39507381+VictorPuga@users.noreply.github.com> Date: Sun, 7 Dec 2025 14:11:05 -0600 Subject: [PATCH 6/8] Added localization --- src/lang/locales/en-US.json | 6 +++++- src/lang/locales/ja-JP.json | 6 +++++- src/lang/locales/ko-KR.json | 6 +++++- src/lang/locales/zh-CN.json | 6 +++++- src/views/Index.vue | 6 ++---- 5 files changed, 22 insertions(+), 8 deletions(-) diff --git a/src/lang/locales/en-US.json b/src/lang/locales/en-US.json index 04f995b89..d43ffb55d 100644 --- a/src/lang/locales/en-US.json +++ b/src/lang/locales/en-US.json @@ -69,7 +69,11 @@ "view-symbol": "View symbol", "view-sample-code": "View sample code" }, - "view-more": "View more" + "view-more": "View more", + "hero": { + "title": "Developer Documentation", + "copy": "Browse the latest API reference." + } }, "declarations": { "hide-other-declarations": "Hide other declarations", diff --git a/src/lang/locales/ja-JP.json b/src/lang/locales/ja-JP.json index 280bffe1d..b24244253 100644 --- a/src/lang/locales/ja-JP.json +++ b/src/lang/locales/ja-JP.json @@ -69,7 +69,11 @@ "view-symbol": "記号を表示", "view-sample-code": "サンプルコードを表示" }, - "view-more": "さらに表示" + "view-more": "さらに表示", + "hero": { + "title": "デベロッパドキュメント", + "copy": "最新のAPIリファレンスを閲覧できます。" + } }, "declarations": { "hide-other-declarations": "ほかの宣言を非表示", diff --git a/src/lang/locales/ko-KR.json b/src/lang/locales/ko-KR.json index 68b1afe7c..7dad7ec32 100644 --- a/src/lang/locales/ko-KR.json +++ b/src/lang/locales/ko-KR.json @@ -69,7 +69,11 @@ "view-symbol": "기호 보기", "view-sample-code": "샘플 코드 보기" }, - "view-more": "더 보기" + "view-more": "더 보기", + "hero": { + "title": "개발자 문서", + "copy": "최신 API 레퍼런스를 확인하세요." + } }, "declarations": { "hide-other-declarations": "다른 선언 가리기", diff --git a/src/lang/locales/zh-CN.json b/src/lang/locales/zh-CN.json index 5b779adf1..70236c2de 100644 --- a/src/lang/locales/zh-CN.json +++ b/src/lang/locales/zh-CN.json @@ -69,7 +69,11 @@ "view-symbol": "查看符号", "view-sample-code": "查看示例代码" }, - "view-more": "查看更多" + "view-more": "查看更多", + "hero": { + "title": "开发者文档", + "copy": "浏览最新的 API 参考。" + } }, "declarations": { "hide-other-declarations": "隐藏其他声明", diff --git a/src/views/Index.vue b/src/views/Index.vue index 22579fe40..85a12288b 100644 --- a/src/views/Index.vue +++ b/src/views/Index.vue @@ -53,9 +53,9 @@