fix: wire magzine primary color palette

Author: tangly1024

conf/themeColorPalette.js

@@ -64,7 +64,7 @@ const THEME_COLOR_DEFAULTS = {
   },
   hexo: { PRIMARY: '#928CEE', BG: '#f5f5f5', TEXT: '#374151' },
   landing: { PRIMARY: '#ef4444' },
-  magzine: { BG: '#f6f6f1' },
+  magzine: { PRIMARY: '#7BE986', PRIMARY_DARK: '#62BA6B', BG: '#f6f6f1' },
   matery: { PRIMARY: '#4338ca', BG: '#f5f5f5' },
   medium: { PRIMARY: '#4f46e5' },
   movie: { PRIMARY: '#2563eb', PRIMARY_DARK: '#ca8a04' },

conf/themeSwitch.manifest.js

@@ -201,11 +201,13 @@ export const THEME_SWITCH_MANIFEST = {
     name: 'Magazine',
     summary: '杂志封面与大图列表风格。',
     palette: [
+      { key: 'MAGZINE_COLOR_PRIMARY', cssVar: '--magzine-color-primary', label: '主色', defaultValue: '#7BE986' },
       { key: 'MAGZINE_COLOR_BG', cssVar: '--magzine-color-bg', label: '页面背景', defaultValue: '#f6f6f1' },
       { key: 'MAGZINE_COLOR_CARD', cssVar: '--magzine-color-card', label: '卡片背景', defaultValue: '#ffffff' },
       { key: 'MAGZINE_COLOR_TEXT', cssVar: '--magzine-color-text', label: '主文字', defaultValue: '#111827' },
       { key: 'MAGZINE_COLOR_BORDER', cssVar: '--magzine-color-border', label: '边框', defaultValue: '#d1d5db' },
       { key: 'MAGZINE_COLOR_SCROLLBAR', cssVar: '--magzine-color-scrollbar', label: '滚动条', defaultValue: '#4e4e4e' },
+      { key: 'MAGZINE_COLOR_PRIMARY_DARK', cssVar: '--magzine-color-primary-dark', label: '深色模式：主色', defaultValue: '#62BA6B' },
       { key: 'MAGZINE_COLOR_BG_DARK', cssVar: '--magzine-color-bg-dark', label: '深色模式：页面背景', defaultValue: '#0b0f19' },
       { key: 'MAGZINE_COLOR_NAV_DARK', cssVar: '--magzine-color-nav-dark', label: '深色模式：导航背景', defaultValue: '#111827' },
       { key: 'MAGZINE_COLOR_CARD_DARK', cssVar: '--magzine-color-card-dark', label: '深色模式：卡片背景', defaultValue: '#1f2937' },

themes/magzine/components/BannerItem.js

@@ -27,7 +27,7 @@ export default function BannerItem() {
       <h2 className='text-2xl font-semibold'>{title}</h2>
       <h3 className='text-sm'>{description}</h3>
       {button && (
-        <div className='mt-2 text-center px-6 py-3 font-semibold rounded-3xl text-black bg-[#7BE986] hover:bg-[#62BA6B]'>
+        <div className='mt-2 text-center px-6 py-3 font-semibold rounded-3xl text-black bg-[var(--magzine-console-primary)] hover:bg-[var(--magzine-console-primary)]'>
           <SmartLink href={url}>{text}</SmartLink>
         </div>
       )}

themes/magzine/components/CTA.js

@@ -12,7 +12,7 @@ export default function CTA({ notice }) {
       <Announcement
         post={notice}
         className={
-          'cta text-center text-black bg-[#7BE986] dark:bg-hexo-black-gray py-16'
+          'cta text-center text-black bg-[var(--magzine-console-primary)] py-16'
         }
       />
     </>

themes/magzine/components/TouchMeCard.js

@@ -16,7 +16,7 @@ export default function TouchMeCard() {
   return (
     <div className={'relative h-32 text-black flex flex-col'}>
       <FlipCard
-        className='cursor-pointer lg:py-8 px-4 py-4 border bg-[#7BE986] dark:bg-yellow-600 dark:border-gray-600'
+        className='cursor-pointer lg:py-8 px-4 py-4 border bg-[var(--magzine-console-primary)] dark:border-gray-600'
         frontContent={
           <div className='h-full'>
             <h2 className='font-[1000] text-3xl'>

themes/magzine/config.js

@@ -1,4 +1,6 @@
 const CONFIG = {
+  MAGZINE_COLOR_PRIMARY: '#7BE986',
+  MAGZINE_COLOR_PRIMARY_DARK: '#62BA6B',
   MAGZINE_COLOR_BG: '#f6f6f1',
   MAGZINE_COLOR_SCROLLBAR: '#4e4e4e',
 

themes/magzine/style.js

@@ -1,5 +1,6 @@
 /* eslint-disable react/no-unknown-property */
 import CONFIG from './config'
+import { buildThemePrimaryCss } from '@/lib/themeColorCss'
 import { themeConsoleStyle } from '@/lib/themeConsoleStyle'
 /**
  * 此处样式只对当前主题生效
@@ -28,6 +29,7 @@ const Style = () => {
       }
 
       ${themeConsoleStyle('magzine', CONFIG)}
+      ${buildThemePrimaryCss('#theme-magzine', '--magzine-console-primary')}
   `}</style>
   )
 }