feat(projects): 新增导航模式配置

src/components/common/ColorBlock/index.vue

@@ -0,0 +1,28 @@
+<template>
+  <div class="flex-center w-20px h-20px mx-6px mb-8px cursor-pointer rounded-2px" :style="{ backgroundColor: color }">
+    <icon-ic-outline-check
+      v-if="checked"
+      class="text-14px text-white"
+      :class="[isWhite ? 'text-gray-700' : 'text-white']"
+    />
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { computed } from 'vue';
+
+const props = defineProps({
+  color: {
+    type: String,
+    required: true
+  },
+  checked: {
+    type: Boolean,
+    default: false
+  }
+});
+
+const whiteColors = ['#ffffff', '#fff', 'rgb(255,255,255)'];
+const isWhite = computed(() => whiteColors.includes(props.color));
+</script>
+<style scoped></style>

src/components/common/index.ts

@@ -1,3 +1,4 @@
 import AppProviderContent from './AppProviderContent/index.vue';
+import ColorBlock from './ColorBlock/index.vue';
 
-export { AppProviderContent };
+export { AppProviderContent, ColorBlock };

src/components/index.ts

@@ -1 +1 @@
-export { AppProviderContent } from './common';
+export { AppProviderContent, ColorBlock } from './common';