From 133f21b9ca43642338a0c9f7b37d1b92d373f622 Mon Sep 17 00:00:00 2001
From: CatsJuice <wp1298554944@hotmail.com>
Date: Fri, 13 Dec 2024 07:55:07 +0000
Subject: [PATCH] fix(mobile): tag and detail page dark mode adaption (#9145)

---
 .../core/src/mobile/pages/workspace/collection/detail.tsx     | 2 +-
 .../frontend/core/src/mobile/pages/workspace/tag/detail.tsx   | 2 +-
 .../core/src/mobile/views/all-docs/collection/detail.css.ts   | 4 ++++
 .../core/src/mobile/views/all-docs/collection/detail.tsx      | 1 +
 .../core/src/mobile/views/all-docs/tag/detail-header.tsx      | 1 +
 .../frontend/core/src/mobile/views/all-docs/tag/detail.css.ts | 3 +++
 6 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/packages/frontend/core/src/mobile/pages/workspace/collection/detail.tsx b/packages/frontend/core/src/mobile/pages/workspace/collection/detail.tsx
index c8de005be5..6add099d7a 100644
--- a/packages/frontend/core/src/mobile/pages/workspace/collection/detail.tsx
+++ b/packages/frontend/core/src/mobile/pages/workspace/collection/detail.tsx
@@ -14,7 +14,7 @@ import { AppTabs } from '../../../components';
 import { CollectionDetail } from '../../../views';
 
 export const Component = () => {
-  useThemeColorV2('layer/background/secondary');
+  useThemeColorV2('layer/background/mobile/primary');
   const { collectionService, globalContextService, workspaceService } =
     useServices({
       WorkspaceService,
diff --git a/packages/frontend/core/src/mobile/pages/workspace/tag/detail.tsx b/packages/frontend/core/src/mobile/pages/workspace/tag/detail.tsx
index 295b0e6695..25e7ffb79b 100644
--- a/packages/frontend/core/src/mobile/pages/workspace/tag/detail.tsx
+++ b/packages/frontend/core/src/mobile/pages/workspace/tag/detail.tsx
@@ -12,7 +12,7 @@ import { useParams } from 'react-router-dom';
 import { TagDetail } from '../../../views';
 
 export const Component = () => {
-  useThemeColorV2('layer/background/secondary');
+  useThemeColorV2('layer/background/mobile/primary');
   const params = useParams();
   const tagId = params.tagId;
 
diff --git a/packages/frontend/core/src/mobile/views/all-docs/collection/detail.css.ts b/packages/frontend/core/src/mobile/views/all-docs/collection/detail.css.ts
index 5f1aaf9227..04bdadfba9 100644
--- a/packages/frontend/core/src/mobile/views/all-docs/collection/detail.css.ts
+++ b/packages/frontend/core/src/mobile/views/all-docs/collection/detail.css.ts
@@ -2,6 +2,10 @@ import { bodyEmphasized } from '@toeverything/theme/typography';
 import { cssVarV2 } from '@toeverything/theme/v2';
 import { style } from '@vanilla-extract/css';
 
+export const header = style({
+  background: cssVarV2.layer.background.mobile.primary,
+});
+
 export const headerContent = style([
   bodyEmphasized,
   {
diff --git a/packages/frontend/core/src/mobile/views/all-docs/collection/detail.tsx b/packages/frontend/core/src/mobile/views/all-docs/collection/detail.tsx
index e1a688f567..1c07feb55a 100644
--- a/packages/frontend/core/src/mobile/views/all-docs/collection/detail.tsx
+++ b/packages/frontend/core/src/mobile/views/all-docs/collection/detail.tsx
@@ -12,6 +12,7 @@ import * as styles from './detail.css';
 export const DetailHeader = ({ collection }: { collection: Collection }) => {
   return (
     <PageHeader
+      className={styles.header}
       back
       suffix={
         <MobileMenu items={<AllDocsMenu />}>
diff --git a/packages/frontend/core/src/mobile/views/all-docs/tag/detail-header.tsx b/packages/frontend/core/src/mobile/views/all-docs/tag/detail-header.tsx
index c588258089..ec1434ad80 100644
--- a/packages/frontend/core/src/mobile/views/all-docs/tag/detail-header.tsx
+++ b/packages/frontend/core/src/mobile/views/all-docs/tag/detail-header.tsx
@@ -12,6 +12,7 @@ export const TagDetailHeader = ({ tag }: { tag: Tag }) => {
   const color = useLiveData(tag.color$);
   return (
     <PageHeader
+      className={styles.header}
       back
       suffix={
         <MobileMenu items={<AllDocsMenu />}>
diff --git a/packages/frontend/core/src/mobile/views/all-docs/tag/detail.css.ts b/packages/frontend/core/src/mobile/views/all-docs/tag/detail.css.ts
index cdc291364d..256457b147 100644
--- a/packages/frontend/core/src/mobile/views/all-docs/tag/detail.css.ts
+++ b/packages/frontend/core/src/mobile/views/all-docs/tag/detail.css.ts
@@ -2,6 +2,9 @@ import { bodyEmphasized } from '@toeverything/theme/typography';
 import { cssVarV2 } from '@toeverything/theme/v2';
 import { style } from '@vanilla-extract/css';
 
+export const header = style({
+  background: cssVarV2.layer.background.mobile.primary,
+});
 export const headerContent = style([
   bodyEmphasized,
   {