feat(projects): add recommend color switch

soybeanjs · Jun 6, 2024 · 7fa5136 · 7fa5136
1 parent 4975d11
commit 7fa5136
Show file tree

Hide file tree

Showing 4 changed files with 26 additions and 0 deletions.
diff --git a/src/layouts/modules/theme-drawer/modules/theme-color.vue b/src/layouts/modules/theme-drawer/modules/theme-color.vue
@@ -18,6 +18,26 @@ function handleUpdateColor(color: string, key: App.Theme.ThemeColorKey) {
 <template>
   <ADivider>{{ $t('theme.themeColor.title') }}</ADivider>
   <div class="flex-col-stretch gap-12px">
+    <ATooltip placement="topLeft">
+      <SettingItem key="recommend-color" :label="$t('theme.recommendColor')">
+        <ASwitch v-model:checked="themeStore.recommendColor" />
+      </SettingItem>
+      <template #title>
+        <p>
+          <span class="pr-12px">{{ $t('theme.recommendColorDesc') }}</span>
+          <br />
+          <AButton
+            type="link"
+            href="https://uicolors.app/create"
+            target="_blank"
+            rel="noopener noreferrer"
+            class="text-gray"
+          >
+            https://uicolors.app/create
+          </AButton>
+        </p>
+      </template>
+    </ATooltip>
     <SettingItem v-for="(_, key) in themeStore.themeColors" :key="key" :label="$t(`theme.themeColor.${key}`)">
       <template v-if="key === 'info'" #suffix>
         <ACheckbox v-model:checked="themeStore.isInfoFollowPrimary">

diff --git a/src/locales/langs/en-us.ts b/src/locales/langs/en-us.ts
@@ -65,6 +65,8 @@ const local: App.I18n.Schema = {
       'vertical-mix': 'Vertical Mix Menu Mode',
       'horizontal-mix': 'Horizontal Mix menu Mode'
     },
+    recommendColor: 'Apply Recommended Color Algorithm',
+    recommendColorDesc: 'The recommended color algorithm refers to',
     themeColor: {
       title: 'Theme Color',
       primary: 'Primary',

diff --git a/src/locales/langs/zh-cn.ts b/src/locales/langs/zh-cn.ts
@@ -65,6 +65,8 @@ const local: App.I18n.Schema = {
       horizontal: '顶部菜单模式',
       'horizontal-mix': '顶部菜单混合模式'
     },
+    recommendColor: '应用推荐算法的颜色',
+    recommendColorDesc: '推荐颜色的算法参照',
     themeColor: {
       title: '主题颜色',
       primary: '主色',

diff --git a/src/typings/app.d.ts b/src/typings/app.d.ts
@@ -302,6 +302,8 @@ declare namespace App {
         themeSchema: { title: string } & Record<UnionKey.ThemeScheme, string>;
         grayscale: string;
         layoutMode: { title: string } & Record<UnionKey.ThemeLayoutMode, string>;
+        recommendColor: string;
+        recommendColorDesc: string;
         themeColor: {
           title: string;
           followPrimary: string;