【需求 17679】 wip: 先推一版，初始化项目等

.eslintrc-auto-import.json

+{
+  "globals": {
+    "Component": true,
+    "ComponentPublicInstance": true,
+    "ComputedRef": true,
+    "DirectiveBinding": true,
+    "EffectScope": true,
+    "ElMessage": true,
+    "ElMessageBox": true,
+    "ExtractDefaultPropTypes": true,
+    "ExtractPropTypes": true,
+    "ExtractPublicPropTypes": true,
+    "InjectionKey": true,
+    "MaybeRef": true,
+    "MaybeRefOrGetter": true,
+    "PropType": true,
+    "Ref": true,
+    "ShallowRef": true,
+    "Slot": true,
+    "Slots": true,
+    "VNode": true,
+    "WritableComputedRef": true,
+    "computed": true,
+    "createApp": true,
+    "customRef": true,
+    "defineAsyncComponent": true,
+    "defineComponent": true,
+    "effectScope": true,
+    "getCurrentInstance": true,
+    "getCurrentScope": true,
+    "getCurrentWatcher": true,
+    "h": true,
+    "inject": true,
+    "isProxy": true,
+    "isReactive": true,
+    "isReadonly": true,
+    "isRef": true,
+    "isShallow": true,
+    "markRaw": true,
+    "nextTick": true,
+    "onActivated": true,
+    "onBeforeMount": true,
+    "onBeforeRouteLeave": true,
+    "onBeforeRouteUpdate": true,
+    "onBeforeUnmount": true,
+    "onBeforeUpdate": true,
+    "onDeactivated": true,
+    "onErrorCaptured": true,
+    "onMounted": true,
+    "onRenderTracked": true,
+    "onRenderTriggered": true,
+    "onScopeDispose": true,
+    "onServerPrefetch": true,
+    "onUnmounted": true,
+    "onUpdated": true,
+    "onWatcherCleanup": true,
+    "provide": true,
+    "reactive": true,
+    "readonly": true,
+    "ref": true,
+    "resolveComponent": true,
+    "shallowReactive": true,
+    "shallowReadonly": true,
+    "shallowRef": true,
+    "toRaw": true,
+    "toRef": true,
+    "toRefs": true,
+    "toValue": true,
+    "triggerRef": true,
+    "unref": true,
+    "useAttrs": true,
+    "useCssModule": true,
+    "useCssVars": true,
+    "useId": true,
+    "useLink": true,
+    "useModel": true,
+    "useRoute": true,
+    "useRouter": true,
+    "useSlots": true,
+    "useTemplateRef": true,
+    "watch": true,
+    "watchEffect": true,
+    "watchPostEffect": true,
+    "watchSyncEffect": true
+  }
+}

auto-imports.d.ts

+/* eslint-disable */
+/* prettier-ignore */
+// @ts-nocheck
+// noinspection JSUnusedGlobalSymbols
+// Generated by unplugin-auto-import
+// biome-ignore lint: disable
+export {}
+declare global {
+  const EffectScope: typeof import('vue').EffectScope
+  const ElMessage: typeof import('element-plus/es').ElMessage
+  const ElMessageBox: typeof import('element-plus/es').ElMessageBox
+  const ElSwitch: typeof import('element-plus/es').ElSwitch
+  const computed: typeof import('vue').computed
+  const createApp: typeof import('vue').createApp
+  const customRef: typeof import('vue').customRef
+  const defineAsyncComponent: typeof import('vue').defineAsyncComponent
+  const defineComponent: typeof import('vue').defineComponent
+  const effectScope: typeof import('vue').effectScope
+  const getCurrentInstance: typeof import('vue').getCurrentInstance
+  const getCurrentScope: typeof import('vue').getCurrentScope
+  const getCurrentWatcher: typeof import('vue').getCurrentWatcher
+  const h: typeof import('vue').h
+  const inject: typeof import('vue').inject
+  const isProxy: typeof import('vue').isProxy
+  const isReactive: typeof import('vue').isReactive
+  const isReadonly: typeof import('vue').isReadonly
+  const isRef: typeof import('vue').isRef
+  const isShallow: typeof import('vue').isShallow
+  const markRaw: typeof import('vue').markRaw
+  const nextTick: typeof import('vue').nextTick
+  const onActivated: typeof import('vue').onActivated
+  const onBeforeMount: typeof import('vue').onBeforeMount
+  const onBeforeRouteLeave: typeof import('vue-router').onBeforeRouteLeave
+  const onBeforeRouteUpdate: typeof import('vue-router').onBeforeRouteUpdate
+  const onBeforeUnmount: typeof import('vue').onBeforeUnmount
+  const onBeforeUpdate: typeof import('vue').onBeforeUpdate
+  const onDeactivated: typeof import('vue').onDeactivated
+  const onErrorCaptured: typeof import('vue').onErrorCaptured
+  const onMounted: typeof import('vue').onMounted
+  const onRenderTracked: typeof import('vue').onRenderTracked
+  const onRenderTriggered: typeof import('vue').onRenderTriggered
+  const onScopeDispose: typeof import('vue').onScopeDispose
+  const onServerPrefetch: typeof import('vue').onServerPrefetch
+  const onUnmounted: typeof import('vue').onUnmounted
+  const onUpdated: typeof import('vue').onUpdated
+  const onWatcherCleanup: typeof import('vue').onWatcherCleanup
+  const provide: typeof import('vue').provide
+  const reactive: typeof import('vue').reactive
+  const readonly: typeof import('vue').readonly
+  const ref: typeof import('vue').ref
+  const resolveComponent: typeof import('vue').resolveComponent
+  const shallowReactive: typeof import('vue').shallowReactive
+  const shallowReadonly: typeof import('vue').shallowReadonly
+  const shallowRef: typeof import('vue').shallowRef
+  const toRaw: typeof import('vue').toRaw
+  const toRef: typeof import('vue').toRef
+  const toRefs: typeof import('vue').toRefs
+  const toValue: typeof import('vue').toValue
+  const triggerRef: typeof import('vue').triggerRef
+  const unref: typeof import('vue').unref
+  const useAttrs: typeof import('vue').useAttrs
+  const useCssModule: typeof import('vue').useCssModule
+  const useCssVars: typeof import('vue').useCssVars
+  const useId: typeof import('vue').useId
+  const useLink: typeof import('vue-router').useLink
+  const useModel: typeof import('vue').useModel
+  const useRoute: typeof import('vue-router').useRoute
+  const useRouter: typeof import('vue-router').useRouter
+  const useSlots: typeof import('vue').useSlots
+  const useTemplateRef: typeof import('vue').useTemplateRef
+  const watch: typeof import('vue').watch
+  const watchEffect: typeof import('vue').watchEffect
+  const watchPostEffect: typeof import('vue').watchPostEffect
+  const watchSyncEffect: typeof import('vue').watchSyncEffect
+}
+// for type re-export
+declare global {
+  // @ts-ignore
+  export type { Component, Slot, Slots, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, ShallowRef, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue'
+  import('vue')
+}

components.d.ts

+/* eslint-disable */
+// @ts-nocheck
+// biome-ignore lint: disable
+// oxlint-disable
+// ------
+// Generated by unplugin-vue-components
+// Read more: https://github.com/vuejs/core/pull/3399
+import { GlobalComponents } from 'vue'
+
+export {}
+
+/* prettier-ignore */
+declare module 'vue' {
+  export interface GlobalComponents {
+    BaseButton: typeof import('./src/components/common/ElComponents/ElButton/BaseButton.vue')['default']
+    ElAvatar: typeof import('element-plus/es')['ElAvatar']
+    ElButton: typeof import('element-plus/es')['ElButton']
+    ElButtonGroup: typeof import('element-plus/es')['ElButtonGroup']
+    ElCard: typeof import('element-plus/es')['ElCard']
+    ElCarousel: typeof import('element-plus/es')['ElCarousel']
+    ElCarouselItem: typeof import('element-plus/es')['ElCarouselItem']
+    ElCheckbox: typeof import('element-plus/es')['ElCheckbox']
+    ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider']
+    ElDatePicker: typeof import('element-plus/es')['ElDatePicker']
+    ElDatePickerPanel: typeof import('element-plus/es')['ElDatePickerPanel']
+    ElDialog: typeof import('element-plus/es')['ElDialog']
+    ElDivider: typeof import('element-plus/es')['ElDivider']
+    ElDropdown: typeof import('element-plus/es')['ElDropdown']
+    ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem']
+    ElDropdownMenu: typeof import('element-plus/es')['ElDropdownMenu']
+    ElEmpty: typeof import('element-plus/es')['ElEmpty']
+    ElForm: typeof import('element-plus/es')['ElForm']
+    ElFormItem: typeof import('element-plus/es')['ElFormItem']
+    ElIcon: typeof import('element-plus/es')['ElIcon']
+    ElImage: typeof import('element-plus/es')['ElImage']
+    ElInput: typeof import('element-plus/es')['ElInput']
+    ElLink: typeof import('element-plus/es')['ElLink']
+    ElOption: typeof import('element-plus/es')['ElOption']
+    ElPagination: typeof import('element-plus/es')['ElPagination']
+    ElPopover: typeof import('element-plus/es')['ElPopover']
+    ElProgress: typeof import('element-plus/es')['ElProgress']
+    ElRadio: typeof import('element-plus/es')['ElRadio']
+    ElRadioButton: typeof import('element-plus/es')['ElRadioButton']
+    ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
+    ElSelect: typeof import('element-plus/es')['ElSelect']
+    ElSkeleton: typeof import('element-plus/es')['ElSkeleton']
+    ElSwitch: typeof import('element-plus/es')['ElSwitch']
+    ElTable: typeof import('element-plus/es')['ElTable']
+    ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
+    ElTag: typeof import('element-plus/es')['ElTag']
+    ElTooltip: typeof import('element-plus/es')['ElTooltip']
+    ElUpload: typeof import('element-plus/es')['ElUpload']
+    HelloWorld: typeof import('./src/components/HelloWorld.vue')['default']
+    IconCommunity: typeof import('./src/components/icons/IconCommunity.vue')['default']
+    IconDocumentation: typeof import('./src/components/icons/IconDocumentation.vue')['default']
+    IconEcosystem: typeof import('./src/components/icons/IconEcosystem.vue')['default']
+    IconSupport: typeof import('./src/components/icons/IconSupport.vue')['default']
+    IconTooling: typeof import('./src/components/icons/IconTooling.vue')['default']
+    RouterLink: typeof import('vue-router')['RouterLink']
+    RouterView: typeof import('vue-router')['RouterView']
+    SelectTags: typeof import('./src/components/common/SelectTags/index.vue')['default']
+    SvgIcon: typeof import('./src/components/common/SvgIcon/svgIcon.vue')['default']
+    Tabs: typeof import('./src/components/common/Tabs/index.tsx')['default']
+    TheWelcome: typeof import('./src/components/TheWelcome.vue')['default']
+    UploadFile: typeof import('./src/components/common/UploadFile/index.vue')['default']
+    UploadVideo: typeof import('./src/components/common/UploadVideo/index.vue')['default']
+    WelcomeItem: typeof import('./src/components/WelcomeItem.vue')['default']
+  }
+  export interface GlobalDirectives {
+    vLoading: typeof import('element-plus/es')['ElLoadingDirective']
+  }
+}
+
+// For TSX support
+declare global {
+  const BaseButton: typeof import('./src/components/common/ElComponents/ElButton/BaseButton.vue')['default']
+  const ElAvatar: typeof import('element-plus/es')['ElAvatar']
+  const ElButton: typeof import('element-plus/es')['ElButton']
+  const ElButtonGroup: typeof import('element-plus/es')['ElButtonGroup']
+  const ElCard: typeof import('element-plus/es')['ElCard']
+  const ElCarousel: typeof import('element-plus/es')['ElCarousel']
+  const ElCarouselItem: typeof import('element-plus/es')['ElCarouselItem']
+  const ElCheckbox: typeof import('element-plus/es')['ElCheckbox']
+  const ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider']
+  const ElDatePicker: typeof import('element-plus/es')['ElDatePicker']
+  const ElDatePickerPanel: typeof import('element-plus/es')['ElDatePickerPanel']
+  const ElDialog: typeof import('element-plus/es')['ElDialog']
+  const ElDivider: typeof import('element-plus/es')['ElDivider']
+  const ElDropdown: typeof import('element-plus/es')['ElDropdown']
+  const ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem']
+  const ElDropdownMenu: typeof import('element-plus/es')['ElDropdownMenu']
+  const ElEmpty: typeof import('element-plus/es')['ElEmpty']
+  const ElForm: typeof import('element-plus/es')['ElForm']
+  const ElFormItem: typeof import('element-plus/es')['ElFormItem']
+  const ElIcon: typeof import('element-plus/es')['ElIcon']
+  const ElImage: typeof import('element-plus/es')['ElImage']
+  const ElInput: typeof import('element-plus/es')['ElInput']
+  const ElLink: typeof import('element-plus/es')['ElLink']
+  const ElOption: typeof import('element-plus/es')['ElOption']
+  const ElPagination: typeof import('element-plus/es')['ElPagination']
+  const ElPopover: typeof import('element-plus/es')['ElPopover']
+  const ElProgress: typeof import('element-plus/es')['ElProgress']
+  const ElRadio: typeof import('element-plus/es')['ElRadio']
+  const ElRadioButton: typeof import('element-plus/es')['ElRadioButton']
+  const ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
+  const ElSelect: typeof import('element-plus/es')['ElSelect']
+  const ElSkeleton: typeof import('element-plus/es')['ElSkeleton']
+  const ElSwitch: typeof import('element-plus/es')['ElSwitch']
+  const ElTable: typeof import('element-plus/es')['ElTable']
+  const ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
+  const ElTag: typeof import('element-plus/es')['ElTag']
+  const ElTooltip: typeof import('element-plus/es')['ElTooltip']
+  const ElUpload: typeof import('element-plus/es')['ElUpload']
+  const HelloWorld: typeof import('./src/components/HelloWorld.vue')['default']
+  const IconCommunity: typeof import('./src/components/icons/IconCommunity.vue')['default']
+  const IconDocumentation: typeof import('./src/components/icons/IconDocumentation.vue')['default']
+  const IconEcosystem: typeof import('./src/components/icons/IconEcosystem.vue')['default']
+  const IconSupport: typeof import('./src/components/icons/IconSupport.vue')['default']
+  const IconTooling: typeof import('./src/components/icons/IconTooling.vue')['default']
+  const RouterLink: typeof import('vue-router')['RouterLink']
+  const RouterView: typeof import('vue-router')['RouterView']
+  const SelectTags: typeof import('./src/components/common/SelectTags/index.vue')['default']
+  const SvgIcon: typeof import('./src/components/common/SvgIcon/svgIcon.vue')['default']
+  const Tabs: typeof import('./src/components/common/Tabs/index.tsx')['default']
+  const TheWelcome: typeof import('./src/components/TheWelcome.vue')['default']
+  const UploadFile: typeof import('./src/components/common/UploadFile/index.vue')['default']
+  const UploadVideo: typeof import('./src/components/common/UploadVideo/index.vue')['default']
+  const WelcomeItem: typeof import('./src/components/WelcomeItem.vue')['default']
+}
\ No newline at end of file

eslint.config.ts

@@ -4,8 +4,8 @@ import pluginVue from 'eslint-plugin-vue'
 import skipFormatting from '@vue/eslint-config-prettier/skip-formatting'
 
 // To allow more languages other than `ts` in `.vue` files, uncomment the following lines:
-// import { configureVueProject } from '@vue/eslint-config-typescript'
-// configureVueProject({ scriptLangs: ['ts', 'tsx'] })
+import { configureVueProject } from '@vue/eslint-config-typescript'
+configureVueProject({ scriptLangs: ['ts', 'tsx'] })
 // More info at https://github.com/vuejs/eslint-config-typescript/#advanced-setup
 
 export default defineConfigWithVueTs(
@@ -19,4 +19,16 @@ export default defineConfigWithVueTs(
   pluginVue.configs['flat/essential'],
   vueTsConfigs.recommended,
   skipFormatting,
+  {
+    rules: {
+      'vue/multi-word-component-names': [
+        'error',
+        {
+          ignores: ['index'],
+        },
+      ],
+      '@typescript-eslint/ban-ts-comment': 'off',
+      '@typescript-eslint/no-explicit-any': 'off',
+    },
+  },
 )

package.json

@@ -16,6 +16,12 @@
     "format": "prettier --write src/"
   },
   "dependencies": {
+    "@element-plus/icons-vue": "^2.3.2",
+    "@vueuse/components": "^14.0.0",
+    "@vueuse/core": "^14.0.0",
+    "axios": "^1.13.0",
+    "dayjs": "^1.11.19",
+    "element-plus": "^2.11.5",
     "pinia": "^3.0.3",
     "vue": "^3.5.22",
     "vue-router": "^4.6.3"
@@ -33,8 +39,13 @@
     "jiti": "^2.6.1",
     "npm-run-all2": "^8.0.4",
     "prettier": "3.6.2",
+    "sass-embedded": "^1.93.2",
     "typescript": "~5.9.0",
+    "unocss": "^66.5.4",
+    "unplugin-auto-import": "^20.2.0",
+    "unplugin-vue-components": "^30.0.0",
     "vite": "^7.1.11",
+    "vite-plugin-svg-icons": "^2.0.1",
     "vite-plugin-vue-devtools": "^8.0.3",
     "vue-tsc": "^3.1.1"
   }

src/App.vue

-<script setup lang="ts">
-import { RouterLink, RouterView } from 'vue-router'
-import HelloWorld from './components/HelloWorld.vue'
-</script>
-
 <template>
-  <header>
-    <img alt="Vue logo" class="logo" src="@/assets/logo.svg" width="125" height="125" />
-
-    <div class="wrapper">
-      <HelloWorld msg="You did it!" />
-
-      <nav>
-        <RouterLink to="/">Home11</RouterLink>
-        <RouterLink to="/about">About</RouterLink>
-      </nav>
-    </div>
-  </header>
-
-  <RouterView />
+  <el-config-provider :locale="locale">
+    <router-view v-slot="{ Component }">
+      <component :is="Component" />
+    </router-view>
+  </el-config-provider>
 </template>
-
-<style scoped>
-header {
-  line-height: 1.5;
-  max-height: 100vh;
-}
-
-.logo {
-  display: block;
-  margin: 0 auto 2rem;
-}
-
-nav {
-  width: 100%;
-  font-size: 12px;
-  text-align: center;
-  margin-top: 2rem;
-}
-
-nav a.router-link-exact-active {
-  color: var(--color-text);
-}
-
-nav a.router-link-exact-active:hover {
-  background-color: transparent;
-}
-
-nav a {
-  display: inline-block;
-  padding: 0 1rem;
-  border-left: 1px solid var(--color-border);
-}
-
-nav a:first-of-type {
-  border: 0;
-}
-
-@media (min-width: 1024px) {
-  header {
-    display: flex;
-    place-items: center;
-    padding-right: calc(var(--section-gap) / 2);
-  }
-
-  .logo {
-    margin: 0 2rem 0 0;
-  }
-
-  header .wrapper {
-    display: flex;
-    place-items: flex-start;
-    flex-wrap: wrap;
-  }
-
-  nav {
-    text-align: left;
-    margin-left: -1rem;
-    font-size: 1rem;
-
-    padding: 1rem 0;
-    margin-top: 1rem;
-  }
-}
-</style>
+<script setup lang="ts">
+import zhCn from 'element-plus/es/locale/lang/zh-cn'
+import { useUserStore } from '@/stores/user'
+const locale = ref(zhCn)
+const userStore = useUserStore()
+userStore.fetchUserInfo().then((res) => {
+  console.log(res)
+})
+</script>

src/api/article/index.ts

+import service from '@/utils/request/index'
+import type { AddOrUpdateArticleDto, ArticleItemDto, ArticleSearchParams } from './types'
+import type { BackendServicePageResult } from '@/utils/request/types'
+/**
+ * 发布文章
+ */
+export const addOrUpdateArticle = (data: AddOrUpdateArticleDto) => {
+  return service.request<boolean>({
+    url: '/api/cultureArticle/addOrUpdateArticle',
+    method: 'POST',
+    data,
+  })
+}
+
+/**
+ * 文章列表
+ */
+export const getArticleList = (data: ArticleSearchParams) => {
+  return service.request<BackendServicePageResult<ArticleItemDto>>({
+    url: '/api/cultureArticle/listByPage',
+    method: 'POST',
+    data,
+  })
+}
+
+/**
+ * 文章详情
+ */
+export const getArticleDetail = (articleId: number | string) => {
+  return service.request<ArticleItemDto>({
+    url: `/api/cultureArticle/getArticleDetail?articleId=${articleId}`,
+    method: 'POST',
+  })
+}

src/api/article/types.ts

+import { ArticleTypeEnum, ReleaseStatusEnum, BooleanFlag } from '@/constants'
+import type { PageSearchParams } from '@/utils/request/types'
+
+/**
+ * 搜索文章的参数
+ */
+export interface ArticleSearchParams extends PageSearchParams {
+  type?: ArticleTypeEnum
+}
+
+/**
+ * 添加或更新文章DTO（带枚举版本）
+ */
+export interface AddOrUpdateArticleDto {
+  /** 内容 */
+  content?: string
+
+  /** 创建人id */
+  createUserId?: number
+
+  /** 描述 */
+  description?: string
+
+  /** 封面图 */
+  faceUrl?: string
+
+  /** id，编辑时必传 */
+  id?: number
+
+  /** 是否关联同事 */
+  isRelateColleague?: number
+
+  /** 主标签id */
+  mainTagId?: number
+
+  /** 发布状态 */
+  releaseStatus?: ReleaseStatusEnum
+
+  /** 标签列表 */
+  tagList?: { tagId: number; sort: number }[]
+
+  /** 标题 */
+  title?: string
+
+  /** 文章类型 */
+  type?: ArticleTypeEnum
+
+  /** 视频url */
+  videoUrl?: string
+}
+
+/**
+ *  文章详情
+ */
+
+// 更严格的类型定义
+export interface ArticleItemDto {
+  id: number
+  title: string
+  content: string
+  faceUrl: string
+  videoUrl: string
+  description: string
+  createUserId: number
+  createTime: number
+  viewCount: number
+  isRecommend: BooleanFlag
+  type: string
+  isRelateColleague: BooleanFlag
+  releaseStatus: ReleaseStatusEnum
+  tagNameList: string[]
+  praiseCount: number
+  collectionCount: number
+  replyCount: number
+  hasPraised: BooleanFlag
+}

src/api/carousel/index.ts

+import service from '@/utils/request/index'
+import type { CarouselItemDto } from './types'
+import { BooleanFlag } from '@/constants'
+/**
+ * 获取轮播图列表
+ */
+export const getCarouselList = () => {
+  return service.request<CarouselItemDto[]>({
+    url: '/api/cultureCarousel/listNoPage',
+    method: 'POST',
+    data: {
+      isRelease: BooleanFlag.YES,
+    },
+  })
+}

src/api/carousel/types.ts

+import { BooleanFlag } from '@/constants'
+
+/**
+ * 轮播图的item
+ */
+export interface CarouselItemDto {
+  articleId: number
+  assetUrl: string
+  isRelease: BooleanFlag
+  sort: number
+  type: BooleanFlag
+  url: string
+}

src/api/column/index.ts

+// 专栏列表
+import service from '@/utils/request/index'
+import type { ColumnItemDto } from './types'
+/**
+ * 获取专栏列表
+ */
+export const getColumnList = () => {
+  return service.request<ColumnItemDto[]>({
+    url: '/api/cultureColumn/listNoPage?type=column',
+    method: 'POST',
+  })
+}

src/api/column/types.ts

+import { BooleanFlag } from '@/constants'
+export interface ColumnItemDto {
+  color: string
+  createTime: number
+  createUserId: number
+  id: number
+  isDelete: BooleanFlag
+  sort: number
+  status: BooleanFlag
+  title: string
+  type: 'column'
+}

src/api/common/index.ts

+// 常规的接口
+import service from '@/utils/request/index'
+import type { FielItemDto } from './types'
+/**
+ * 获取常规的接口
+ */
+export const uploadFile = (file: File, onProgress?: (progress: number) => void) => {
+  const formData = new FormData()
+  formData.append('file', file)
+  return service.request<FielItemDto>({
+    url: '/mobiles/file-upload/singleUpload',
+    method: 'POST',
+    data: formData,
+    onUploadProgress: (progressEvent) => {
+      const percentCompleted = Math.round((progressEvent.loaded * 100) / (progressEvent.total || 1))
+      onProgress?.(percentCompleted)
+    },
+  })
+}

src/api/common/types.ts

+export interface FielItemDto {
+  fileId: string
+  fileName: string
+  fileUrl: string
+  finalName: string
+  msg: string
+  status: number
+}

src/api/index.ts

+// 企业文化接口
+export * from './task'
+export * from './sign'
+export * from './article'
+export * from './shop'
+export * from './carousel'
+export * from './column'
+export * from './interview'
+export * from './tag'
+export * from './common'
+export * from './article'
+export * from './user'
+// 导出类型
+export * from './task/types'
+export * from './shop/types'
+export * from './article/types'
+export * from './carousel/types'
+export * from './column/types'
+export * from './interview/types'
+export * from './tag/types'
+export * from './article/types'
+export * from './user/types'
+export * from './common/types'

src/api/interview/index.ts

+// 专栏列表
+import service from '@/utils/request/index'
+import type { ColumnItemDto } from './types'
+/**
+ * 获取专栏列表
+ */
+export const getInterviewList = () => {
+  return service.request<ColumnItemDto[]>({
+    url: '/api/cultureColumn/listNoPage?type=interview',
+    method: 'POST',
+  })
+}

src/api/interview/types.ts

+import { BooleanFlag } from '@/constants'
+export interface InterviewItemDto {
+  color: string
+  createTime: number
+  createUserId: number
+  id: number
+  isDelete: BooleanFlag
+  sort: number
+  status: BooleanFlag
+  title: string
+  type: 'column'
+}

src/api/login/index.ts

+import service from '@/utils/request/index'
+import type { LoginParams, LoginResponseDto } from './types'
+
+/**
+ * 登录
+ */
+export const loginByEmail = (data: LoginParams) => {
+  return service.request<LoginResponseDto>({
+    url: '/api/auth/login',
+    method: 'POST',
+    data,
+  })
+}

src/api/login/types.ts

+export interface LoginParams {
+  email: string
+  password: string
+}
+
+export interface LoginResponseDto {
+  id: number
+  account: string
+  name: string
+  email: string
+  avatar: string
+  deptId: number | null
+  roleList: any[] | null
+  deptName: string | null
+  roleNames: string | null
+  permissions: any[] | null
+  userRelated: any[] | null
+  isOfficialAccount: boolean | null
+  firstDeptId: number | null
+  password: string | null
+  enabled: boolean
+  username: string
+  authorities: any[] | null
+  accountNonExpired: boolean
+  credentialsNonExpired: boolean
+  accountNonLocked: boolean
+}

src/api/shop/index.ts

+import service from '@/utils/request/index'
+import type { BackendServicePageResult, PageSearchParams } from '@/utils/request/types'
+import type { ShopItem, YaBiData } from './types'
+/**
+ * 积分商城列表
+ */
+export const getShopItemList = (data: PageSearchParams) => {
+  return service.request<BackendServicePageResult<ShopItem>>({
+    url: '/api/culture/shop/item/pageList',
+    method: 'POST',
+    data,
+  })
+}
+
+/**
+ * 获取用户YA币兑换记录
+ */
+export const getYabiExchangeList = (data: PageSearchParams) => {
+  return service.request<BackendServicePageResult<any>>({
+    url: '/api/culture/action/record/yabiList',
+    method: 'POST',
+    data,
+  })
+}
+
+/**
+ * 获取用户亚币相关数据
+ */
+export const getYaBiData = () => {
+  return service.request<YaBiData>({
+    url: '/api/culture/action/record/yabiData',
+    method: 'POST',
+    data: {},
+  })
+}

src/api/shop/types.ts

+/**
+ * 积分商城商品类型
+ */
+export interface ShopItem {
+  id: number
+  description: string
+  enable: number
+  imageUrl: string
+  itemType: number
+  itemTypeName: string
+  name: string
+  price: number
+  region: string
+  soldOut: boolean
+  sotrOrder: number
+  stock: number
+}
+
+/**
+ * yabi信息对象类型
+ */
+export interface YaBiData {
+  currentValue: number
+}

src/api/sign/index.ts

+import service from '@/utils/request/index'
+/**
+ * 每日签到
+ */
+export const dailySign = () => {
+  return service.request({
+    url: '/api/culture/action/record/operate',
+    method: 'POST',
+    data: {
+      subType: 'sign_in_normal_ayabi',
+    },
+  })
+}

src/api/tag/index.ts

+import service from '@/utils/request/index'
+import type { TagItemDto } from './types'
+
+/**
+ * 获取标签 不分页
+ */
+export const getTagList = () => {
+  return service.request<TagItemDto[]>({
+    url: '/api/cultureTag/listNoPage',
+    method: 'POST',
+    data: {
+      type: 'culture',
+    },
+  })
+}

src/api/tag/types.ts

+export interface TagItemDto {
+  color: string
+  createId: string
+  createTime: number
+  description: string
+  id: number
+  imgUrl: string
+  style: number
+  title: string
+  type: string
+}

src/api/task/index.ts

+import service from '@/utils/request/index'
+import type { BackendServicePageResult, PageSearchParams } from '@/utils/request/types'
+/**
+ * 获取任务列表
+ */
+export const getTaskList = (data: PageSearchParams) => {
+  return service.request<BackendServicePageResult<any>>({
+    url: '/api/culture/task/config/getList',
+    method: 'POST',
+    data,
+  })
+}

src/api/user/index.ts

+import service from '@/utils/request/index'
+import type { UpdateUserInfoDto } from './types'
+/**
+ * 更新用户信息
+ */
+export const updateUserInfo = (data: UpdateUserInfoDto) => {
+  return service.request({
+    url: '/api/personalCenter/updateUser',
+    method: 'POST',
+    data,
+  })
+}

src/api/user/types.ts

+export interface UpdateUserInfoDto {
+  hiddenAvatar: string
+  hiddenName: string
+  signature: string
+}

src/assets/svg/collect.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1662518356637" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5502" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M284.458667 941.397333c-36.437333 15.637333-68.48-7.68-64.896-47.168l22.613333-248.917333-164.394667-188.053333c-26.069333-29.824-13.653333-67.562667 24.789334-76.309334l243.370666-55.381333 127.786667-214.677333c20.288-34.090667 59.946667-34.069333 80.213333 0l127.786667 214.677333 243.370667 55.381333c38.656 8.789333 50.858667 46.485333 24.789333 76.309334l-164.394667 188.053333 22.741334 249.002667c3.605333 39.509333-28.458667 62.805333-64.896 47.146666l-229.504-98.517333-229.376 98.453333z" p-id="5503"></path></svg>

src/assets/svg/comment.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1662518435358" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7424" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M512 512m-450.56 0a450.56 450.56 0 1 0 901.12 0 450.56 450.56 0 1 0-901.12 0Z"  p-id="7425"></path><path d="M276.48 512m-71.68 0a71.68 71.68 0 1 0 143.36 0 71.68 71.68 0 1 0-143.36 0Z" fill="#FFFFFF" p-id="7426"></path><path d="M512 512m-71.68 0a71.68 71.68 0 1 0 143.36 0 71.68 71.68 0 1 0-143.36 0Z" fill="#FFFFFF" p-id="7427"></path><path d="M747.52 512m-71.68 0a71.68 71.68 0 1 0 143.36 0 71.68 71.68 0 1 0-143.36 0Z" fill="#FFFFFF" p-id="7428"></path><path d="M880.64 737.28l39.1168 117.3504a40.96 40.96 0 0 1-46.8992 53.10464L737.28 880.59904 880.64 737.28z" p-id="7429"></path></svg>

src/assets/svg/culture/answer.svg

+<svg width="87" height="77" viewBox="0 0 87 77" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g opacity="0.2" filter="url(#filter0_f_4018_5059)">
+<path d="M51.1875 11.3571C52.8475 10.7719 54.5293 10.6202 55.8096 11.498C56.4497 11.9423 57.0573 12.8309 57.6106 13.7953C58.164 14.7923 58.6956 15.9627 59.1622 17.0788C59.6287 18.195 60.0193 19.2679 60.3014 20.0589C60.4425 20.449 60.551 20.785 60.6269 21.0126C60.6703 21.1209 60.692 21.2185 60.7137 21.2726C60.7137 21.2726 60.7137 21.2835 60.7137 21.2943C60.7137 21.2943 60.7137 21.3051 60.7246 21.316C60.7571 21.3702 60.8114 21.446 60.8765 21.5436C61.0067 21.7278 61.1803 21.9879 61.3756 22.2588C61.777 22.8223 62.1893 23.3858 62.3955 23.5917C62.4606 23.6567 62.5365 23.7542 62.6016 23.8518C62.6776 23.9493 62.7644 24.0902 62.862 24.2419C63.0573 24.5561 63.3177 24.9788 63.6106 25.4881C64.1965 26.5176 64.9343 27.9155 65.6613 29.5302C67.1152 32.7595 68.5799 36.9425 68.7426 40.8653C68.9054 44.6907 68.786 47.7141 67.9181 50.1307C67.0284 52.6014 65.3792 54.4003 62.5908 55.8308C57.2526 58.5724 45.0465 61.7042 25.2562 58.4858L23.3141 58.1498C23.3141 58.1498 23.3033 58.1498 23.2924 58.1498C23.2707 58.1498 23.249 58.1498 23.2056 58.1281C23.1297 58.1173 23.032 58.0956 22.891 58.0631C22.6197 57.9981 22.24 57.9114 21.7843 57.7814C20.862 57.5105 19.6143 57.0878 18.3015 56.4268C15.7734 55.1697 12.9199 53.0349 11.8349 49.5672L11.7373 49.2312C11.7373 49.2312 11.7373 49.2204 11.7373 49.2096C11.7373 49.1879 11.7264 49.1662 11.7156 49.1337C11.6939 49.0687 11.6722 48.9603 11.6505 48.8303C11.5962 48.5702 11.5311 48.1801 11.466 47.6816C11.3467 46.6738 11.249 45.2108 11.3575 43.3144C11.5637 39.5324 12.5619 34.0599 15.6866 27.2436C15.6866 27.2436 15.6866 27.2436 15.6866 27.222C15.6866 27.2003 15.7083 27.1786 15.7192 27.1569C15.7517 27.1028 15.7843 27.0161 15.8385 26.9077C15.947 26.691 16.1098 26.3875 16.3268 26.0191C16.7716 25.2714 17.4443 24.2744 18.3883 23.2016C20.2761 21.0776 23.2382 18.6935 27.5347 17.7616C30.909 17.0247 34.2725 16.6562 36.7897 16.472C38.0483 16.3853 39.1007 16.3311 39.8385 16.3094C40.2074 16.2986 40.5004 16.2878 40.6957 16.2878C40.7933 16.2878 40.8693 16.2878 40.9235 16.2878H41.0863C41.0863 16.2878 41.108 16.2878 41.1297 16.2878C41.1731 16.2878 41.2599 16.2878 41.3575 16.2878C41.5745 16.2878 41.9 16.2553 42.334 16.1469C43.1911 15.941 44.4714 15.4425 46.0447 14.2721C47.6938 13.0368 49.4949 11.9423 51.1767 11.3462L51.1875 11.3571Z" fill="url(#paint0_linear_4018_5059)"/>
+<path d="M51.1875 11.3571C52.8475 10.7719 54.5293 10.6202 55.8096 11.498C56.4497 11.9423 57.0573 12.8309 57.6106 13.7953C58.164 14.7923 58.6956 15.9627 59.1622 17.0788C59.6287 18.195 60.0193 19.2679 60.3014 20.0589C60.4425 20.449 60.551 20.785 60.6269 21.0126C60.6703 21.1209 60.692 21.2185 60.7137 21.2726C60.7137 21.2726 60.7137 21.2835 60.7137 21.2943C60.7137 21.2943 60.7137 21.3051 60.7246 21.316C60.7571 21.3702 60.8114 21.446 60.8765 21.5436C61.0067 21.7278 61.1803 21.9879 61.3756 22.2588C61.777 22.8223 62.1893 23.3858 62.3955 23.5917C62.4606 23.6567 62.5365 23.7542 62.6016 23.8518C62.6776 23.9493 62.7644 24.0902 62.862 24.2419C63.0573 24.5561 63.3177 24.9788 63.6106 25.4881C64.1965 26.5176 64.9343 27.9155 65.6613 29.5302C67.1152 32.7595 68.5799 36.9425 68.7426 40.8653C68.9054 44.6907 68.786 47.7141 67.9181 50.1307C67.0284 52.6014 65.3792 54.4003 62.5908 55.8308C57.2526 58.5724 45.0465 61.7042 25.2562 58.4858L23.3141 58.1498C23.3141 58.1498 23.3033 58.1498 23.2924 58.1498C23.2707 58.1498 23.249 58.1498 23.2056 58.1281C23.1297 58.1173 23.032 58.0956 22.891 58.0631C22.6197 57.9981 22.24 57.9114 21.7843 57.7814C20.862 57.5105 19.6143 57.0878 18.3015 56.4268C15.7734 55.1697 12.9199 53.0349 11.8349 49.5672L11.7373 49.2312C11.7373 49.2312 11.7373 49.2204 11.7373 49.2096C11.7373 49.1879 11.7264 49.1662 11.7156 49.1337C11.6939 49.0687 11.6722 48.9603 11.6505 48.8303C11.5962 48.5702 11.5311 48.1801 11.466 47.6816C11.3467 46.6738 11.249 45.2108 11.3575 43.3144C11.5637 39.5324 12.5619 34.0599 15.6866 27.2436C15.6866 27.2436 15.6866 27.2436 15.6866 27.222C15.6866 27.2003 15.7083 27.1786 15.7192 27.1569C15.7517 27.1028 15.7843 27.0161 15.8385 26.9077C15.947 26.691 16.1098 26.3875 16.3268 26.0191C16.7716 25.2714 17.4443 24.2744 18.3883 23.2016C20.2761 21.0776 23.2382 18.6935 27.5347 17.7616C30.909 17.0247 34.2725 16.6562 36.7897 16.472C38.0483 16.3853 39.1007 16.3311 39.8385 16.3094C40.2074 16.2986 40.5004 16.2878 40.6957 16.2878C40.7933 16.2878 40.8693 16.2878 40.9235 16.2878H41.0863C41.0863 16.2878 41.108 16.2878 41.1297 16.2878C41.1731 16.2878 41.2599 16.2878 41.3575 16.2878C41.5745 16.2878 41.9 16.2553 42.334 16.1469C43.1911 15.941 44.4714 15.4425 46.0447 14.2721C47.6938 13.0368 49.4949 11.9423 51.1767 11.3462L51.1875 11.3571Z" stroke="url(#paint1_linear_4018_5059)"/>
+</g>
+<path d="M51.1875 11.3571C52.8475 10.7719 54.5293 10.6202 55.8096 11.498C56.4497 11.9423 57.0573 12.8309 57.6106 13.7953C58.164 14.7923 58.6956 15.9627 59.1622 17.0788C59.6287 18.195 60.0193 19.2679 60.3014 20.0589C60.4425 20.449 60.551 20.785 60.6269 21.0126C60.6703 21.1209 60.692 21.2185 60.7137 21.2726C60.7137 21.2726 60.7137 21.2835 60.7137 21.2943C60.7137 21.2943 60.7137 21.3051 60.7246 21.316C60.7571 21.3702 60.8114 21.446 60.8765 21.5436C61.0067 21.7278 61.1803 21.9879 61.3756 22.2588C61.777 22.8223 62.1893 23.3858 62.3955 23.5917C62.4606 23.6567 62.5365 23.7542 62.6016 23.8518C62.6776 23.9493 62.7644 24.0902 62.862 24.2419C63.0573 24.5561 63.3177 24.9788 63.6106 25.4881C64.1965 26.5176 64.9343 27.9155 65.6613 29.5302C67.1152 32.7595 68.5799 36.9425 68.7426 40.8653C68.9054 44.6907 68.786 47.7141 67.9181 50.1307C67.0284 52.6014 65.3792 54.4003 62.5908 55.8308C57.2526 58.5724 45.0465 61.7042 25.2562 58.4858L23.3141 58.1498C23.3141 58.1498 23.3033 58.1498 23.2924 58.1498C23.2707 58.1498 23.249 58.1498 23.2056 58.1281C23.1297 58.1173 23.032 58.0956 22.891 58.0631C22.6197 57.9981 22.24 57.9114 21.7843 57.7814C20.862 57.5105 19.6143 57.0878 18.3015 56.4268C15.7734 55.1697 12.9199 53.0349 11.8349 49.5672L11.7373 49.2312C11.7373 49.2312 11.7373 49.2204 11.7373 49.2096C11.7373 49.1879 11.7264 49.1662 11.7156 49.1337C11.6939 49.0687 11.6722 48.9603 11.6505 48.8303C11.5962 48.5702 11.5311 48.1801 11.466 47.6816C11.3467 46.6738 11.249 45.2108 11.3575 43.3144C11.5637 39.5324 12.5619 34.0599 15.6866 27.2436C15.6866 27.2436 15.6866 27.2436 15.6866 27.222C15.6866 27.2003 15.7083 27.1786 15.7192 27.1569C15.7517 27.1028 15.7843 27.0161 15.8385 26.9077C15.947 26.691 16.1098 26.3875 16.3268 26.0191C16.7716 25.2714 17.4443 24.2744 18.3883 23.2016C20.2761 21.0776 23.2382 18.6935 27.5347 17.7616C30.909 17.0247 34.2725 16.6562 36.7897 16.472C38.0483 16.3853 39.1007 16.3311 39.8385 16.3094C40.2074 16.2986 40.5004 16.2878 40.6957 16.2878C40.7933 16.2878 40.8693 16.2878 40.9235 16.2878H41.0863C41.0863 16.2878 41.108 16.2878 41.1297 16.2878C41.1731 16.2878 41.2599 16.2878 41.3575 16.2878C41.5745 16.2878 41.9 16.2553 42.334 16.1469C43.1911 15.941 44.4714 15.4425 46.0447 14.2721C47.6938 13.0368 49.4949 11.9423 51.1767 11.3462L51.1875 11.3571Z" fill="url(#paint2_linear_4018_5059)" stroke="url(#paint3_linear_4018_5059)"/>
+<path d="M19.7777 33.1492C20.8952 29.5189 23.5101 26.4955 27.0146 24.9784C28.3491 24.404 29.9007 23.9814 31.6475 23.9056C37.5715 23.6346 45.6005 22.6593 52.067 24.5341C54.5299 25.2493 56.7433 26.6472 58.36 28.6412C58.8699 29.2697 59.7379 30.9819 60.0634 31.9572C60.888 34.428 62.0164 43.3249 62.0164 44.311C62.0164 45.9365 61.756 51.745 53.7053 53.4138C45.6547 55.0935 37.7017 55.7762 25.2244 53.002C25.2244 53.002 18.1285 51.474 18.3672 43.9751C18.53 38.936 19.0182 37.6356 19.7777 33.1492Z" fill="url(#paint4_linear_4018_5059)"/>
+<path d="M18.4431 42.9248C18.4431 42.9248 25.4195 43.5642 25.7776 53.1655C25.7776 53.1655 17.4666 51.8651 18.4431 42.9248Z" fill="#82BCFC"/>
+<path d="M61.9296 43.4111C61.9296 43.4111 55.105 43.8879 54.7578 53.1641C54.7578 53.1641 62.9061 51.3761 61.9296 43.4111Z" fill="#82BCFC"/>
+<path d="M33.2643 38.0477C33.1015 38.0477 32.9279 37.9827 32.8086 37.8526C32.559 37.6034 32.559 37.1916 32.8086 36.9315L34.9243 34.8183L32.6567 32.8461C32.3854 32.6077 32.3637 32.1959 32.5916 31.925C32.8303 31.654 33.2426 31.6324 33.5138 31.8599L36.3022 34.2982C36.4324 34.4174 36.5192 34.5908 36.5192 34.7642C36.5192 34.9484 36.4541 35.1218 36.3239 35.241L33.7091 37.8418C33.5789 37.9718 33.4162 38.0368 33.2534 38.0368L33.2643 38.0477Z" fill="#2585F7"/>
+<path d="M46.4455 38.0481C46.2828 38.0481 46.1092 37.9831 45.9898 37.853L43.375 35.2522C43.2448 35.1222 43.1797 34.9488 43.1797 34.7754C43.1797 34.5912 43.2665 34.4286 43.3967 34.3094L46.1851 31.8712C46.4564 31.6328 46.8687 31.6653 47.1074 31.9362C47.3461 32.2071 47.3135 32.6189 47.0423 32.8573L44.7746 34.8296L46.8904 36.9427C47.1399 37.192 47.1399 37.6038 46.8904 37.8638C46.7602 37.9939 46.5974 38.0589 46.4347 38.0589L46.4455 38.0481Z" fill="#2585F7"/>
+<path d="M40.11 41.1361C40.11 41.1361 41.846 40.4533 43.3542 41.2878C43.7556 40.1066 43.5386 38.8604 43.5386 38.8604H36.5404C36.5404 38.8604 36.2583 40.3558 36.8985 41.6237C37.3542 41.2661 38.4609 40.6267 40.1317 41.1361H40.11Z" fill="#FFE6AF"/>
+<path d="M40.11 41.1361C40.11 41.1361 41.846 40.4533 43.3542 41.2878C43.7556 40.1066 43.5386 38.8604 43.5386 38.8604H36.5404C36.5404 38.8604 36.2583 40.3558 36.8985 41.6237C37.3542 41.2661 38.4609 40.6267 40.1317 41.1361H40.11Z" fill="url(#paint5_linear_4018_5059)"/>
+<path d="M40.0226 43.3477C42.084 43.3911 42.9737 42.3724 43.3426 41.2888C41.8453 40.4543 40.0985 41.137 40.0985 41.137C38.4276 40.6277 37.3318 41.2671 36.8652 41.6247C37.3101 42.5241 38.2215 43.3044 40.0117 43.3477H40.0226Z" fill="url(#paint6_linear_4018_5059)"/>
+<path d="M40.0226 43.3477C42.0949 43.3911 42.9737 42.3724 43.3426 41.2888C41.8453 40.4543 40.0985 41.137 40.0985 41.137C38.4276 40.6277 37.3318 41.2671 36.8652 41.6247C37.3101 42.5241 38.2215 43.3044 40.0117 43.3477H40.0226Z" fill="url(#paint7_linear_4018_5059)"/>
+<foreignObject x="23.5" y="20.5" width="73" height="70"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(12px);clip-path:url(#bgblur_0_4018_5059_clip_path);height:100%;width:100%"></div></foreignObject><path data-figma-bg-blur-radius="24" d="M52.2578 66.25C49.8034 66.2499 47.75 64.521 47.75 62.3154L47.75 51.2627C47.75 49.0572 49.8034 47.3282 52.2578 47.3281L53.0537 47.3281L53.8096 45.3682C53.9283 45.0605 54.1981 44.8645 54.4873 44.7881C54.7773 44.7116 55.1122 44.7471 55.3887 44.9316L58.9795 47.3281L67.7422 47.3281C70.1966 47.3282 72.25 49.0572 72.25 51.2627L72.25 62.3154C72.25 64.521 70.1966 66.2499 67.7422 66.25L52.2578 66.25Z" fill="#3EA0FE" fill-opacity="0.35" stroke="url(#paint8_linear_4018_5059)" stroke-width="0.5"/>
+<g filter="url(#filter2_d_4018_5059)">
+<path d="M68.0508 52.623L70.8633 59.5791H69.751L69.1562 58.0293L69.1074 57.9004H65.9668L65.918 58.0312L65.3428 59.5791H64.3184L67.0459 52.623H68.0508ZM67.3252 54.2021L66.3701 56.7852L66.2705 57.0547H68.7871L68.6846 56.7832L67.6992 54.2002L67.5098 53.7031L67.3252 54.2021Z" fill="url(#paint9_linear_4018_5059)" stroke="url(#paint10_linear_4018_5059)" stroke-width="0.4"/>
+<path d="M59.9648 52.2002C60.3626 52.2002 60.6999 52.2729 60.9824 52.4111C61.2661 52.55 61.4772 52.7394 61.623 52.9785L61.624 52.9805C61.77 53.2141 61.8447 53.4817 61.8447 53.7891C61.8447 54.1982 61.7172 54.5212 61.4697 54.7744C61.2092 55.0411 60.8282 55.3042 60.3174 55.5596L60.0771 55.6797L60.2617 55.875L61.5176 57.2119L61.7197 57.4268L61.8447 57.1592C62.0603 56.6964 62.21 56.1817 62.2979 55.6172H63.2832C63.1219 56.4946 62.8311 57.2622 62.4092 57.9219L62.3242 58.0537L62.4326 58.168L63.7793 59.5781H62.5928L61.8887 58.8359L61.7539 58.6953L61.6094 58.8252C60.9635 59.4077 60.201 59.6982 59.3115 59.6982C58.6784 59.6982 58.1665 59.5618 57.7637 59.2998L57.5977 59.1797C57.1892 58.8411 56.9795 58.3724 56.9795 57.748C56.9795 57.2286 57.1161 56.8253 57.374 56.5205C57.6475 56.1973 58.0294 55.9075 58.5273 55.6553L58.7568 55.54L58.5889 55.3457C58.3353 55.0531 58.1648 54.8026 58.0684 54.5928C57.9789 54.377 57.9336 54.1527 57.9336 53.9189C57.9337 53.5521 58.0251 53.2487 58.1992 52.999C58.356 52.7743 58.5585 52.5968 58.8096 52.4668L58.9199 52.4141L58.9219 52.4131C59.2353 52.2718 59.5821 52.2002 59.9648 52.2002ZM59.1221 56.1377C58.7933 56.3266 58.5274 56.535 58.334 56.7656C58.1286 57.0107 58.0264 57.3016 58.0264 57.6279C58.0265 58.006 58.157 58.3212 58.4316 58.5459L58.4336 58.5479C58.7052 58.7636 59.0509 58.8623 59.4521 58.8623C60.0234 58.8623 60.5483 58.6453 61.0215 58.2295L61.1768 58.0928L61.0352 57.9424L59.3672 56.1738L59.2588 56.0586L59.1221 56.1377ZM59.915 52.9961C59.6479 52.9961 59.4104 53.0715 59.2207 53.2354L59.2178 53.2383C59.0256 53.4122 58.9404 53.6531 58.9404 53.9297C58.9405 54.1059 58.9875 54.2827 59.0713 54.458L59.0723 54.4609C59.1566 54.6295 59.2998 54.8281 59.4912 55.0537L59.5908 55.1709L59.7295 55.1045C60.0611 54.9456 60.3269 54.7778 60.5156 54.5967L60.5186 54.5938C60.7218 54.3905 60.8281 54.1424 60.8281 53.8594C60.8281 53.6166 60.7423 53.406 60.5674 53.2451H60.5684C60.3966 53.0735 60.1713 52.9962 59.915 52.9961Z" fill="url(#paint11_linear_4018_5059)" stroke="url(#paint12_linear_4018_5059)" stroke-width="0.4"/>
+<path d="M52.5068 52.4902C53.1307 52.4902 53.689 52.6357 54.1855 52.9248L54.1875 52.9268C54.6882 53.2084 55.0846 53.6183 55.376 54.1631L55.4805 54.3721C55.7081 54.8678 55.8242 55.4388 55.8242 56.0889C55.8242 56.8125 55.682 57.4401 55.4043 57.9766C55.1249 58.5096 54.7501 58.9204 54.2803 59.2148L54.0527 59.3584L54.2549 59.5352L56.2168 61.2549H54.8018L53.0088 59.7246L52.9453 59.6709L52.8623 59.6777C52.7033 59.691 52.5856 59.6973 52.5068 59.6973C51.8824 59.6972 51.3203 59.554 50.8164 59.2705C50.3227 58.9823 49.93 58.5691 49.6387 58.0244C49.3487 57.4824 49.2002 56.8392 49.2002 56.0889C49.2002 55.3454 49.3486 54.7054 49.6387 54.1631C49.9304 53.6177 50.3233 53.2072 50.8174 52.9258H50.8184C51.322 52.6362 51.8832 52.4903 52.5068 52.4902ZM52.5068 53.4268C52.0809 53.4268 51.696 53.5408 51.3594 53.7725C51.0296 53.9973 50.776 54.3169 50.5957 54.7207V54.7227C50.4218 55.1212 50.3379 55.5782 50.3379 56.0889C50.3379 56.5996 50.4214 57.0594 50.5947 57.4639L50.5957 57.4668C50.7757 57.87 51.0285 58.1917 51.3564 58.4229L51.3613 58.4258C51.6979 58.6501 52.082 58.7607 52.5068 58.7607C52.9317 58.7607 53.3137 58.6503 53.6445 58.4248L53.6455 58.4238C53.9807 58.1929 54.2343 57.8711 54.4082 57.4668C54.5891 57.0616 54.6767 56.6007 54.6768 56.0889C54.6768 55.5783 54.5888 55.1213 54.4082 54.7227C54.2341 54.317 53.98 53.9964 53.6426 53.7715C53.3125 53.5404 52.9313 53.4268 52.5068 53.4268Z" fill="url(#paint13_linear_4018_5059)" stroke="url(#paint14_linear_4018_5059)" stroke-width="0.4"/>
+</g>
+<defs>
+<filter id="filter0_f_4018_5059" x="0.810547" y="0.378906" width="78.4941" height="69.9707" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="5" result="effect1_foregroundBlur_4018_5059"/>
+</filter>
+<clipPath id="bgblur_0_4018_5059_clip_path" transform="translate(-23.5 -20.5)"><path d="M52.2578 66.25C49.8034 66.2499 47.75 64.521 47.75 62.3154L47.75 51.2627C47.75 49.0572 49.8034 47.3282 52.2578 47.3281L53.0537 47.3281L53.8096 45.3682C53.9283 45.0605 54.1981 44.8645 54.4873 44.7881C54.7773 44.7116 55.1122 44.7471 55.3887 44.9316L58.9795 47.3281L67.7422 47.3281C70.1966 47.3282 72.25 49.0572 72.25 51.2627L72.25 62.3154C72.25 64.521 70.1966 66.2499 67.7422 66.25L52.2578 66.25Z"/>
+</clipPath><filter id="filter2_d_4018_5059" x="34" y="37" width="52.1602" height="39.4551" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dx="5" dy="5"/>
+<feGaussianBlur stdDeviation="5"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0.25098 0 0 0 0 0.588235 0 0 0 0 0.996078 0 0 0 0.5 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_4018_5059"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_4018_5059" result="shape"/>
+</filter>
+<linearGradient id="paint0_linear_4018_5059" x1="40.0555" y1="11.4221" x2="40.0555" y2="59.3202" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFEBCB"/>
+<stop offset="0.0001" stop-color="#96B9FF"/>
+<stop offset="1" stop-color="#4B6FFD"/>
+</linearGradient>
+<linearGradient id="paint1_linear_4018_5059" x1="21.4805" y1="16.7212" x2="58.5784" y2="59.9718" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0.1"/>
+</linearGradient>
+<linearGradient id="paint2_linear_4018_5059" x1="40.0555" y1="11.4221" x2="40.0555" y2="59.3202" gradientUnits="userSpaceOnUse">
+<stop offset="0.04" stop-color="#B2D5F8"/>
+<stop offset="0.32" stop-color="#74B5FC"/>
+<stop offset="1" stop-color="#3791FF"/>
+</linearGradient>
+<linearGradient id="paint3_linear_4018_5059" x1="21.4805" y1="16.7212" x2="58.5784" y2="59.9718" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0.1"/>
+</linearGradient>
+<linearGradient id="paint4_linear_4018_5059" x1="40.1864" y1="23.4071" x2="40.1864" y2="54.8659" gradientUnits="userSpaceOnUse">
+<stop stop-color="#F8FCFF"/>
+<stop offset="1" stop-color="#E7F8FF"/>
+</linearGradient>
+<linearGradient id="paint5_linear_4018_5059" x1="40.0124" y1="38.8604" x2="40.0449" y2="41.472" gradientUnits="userSpaceOnUse">
+<stop stop-color="#719CFF"/>
+<stop offset="1" stop-color="#0D73E7"/>
+</linearGradient>
+<linearGradient id="paint6_linear_4018_5059" x1="40.0877" y1="38.8613" x2="40.1093" y2="41.473" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFAB71"/>
+<stop offset="1" stop-color="#FF5F19"/>
+</linearGradient>
+<linearGradient id="paint7_linear_4018_5059" x1="40.1094" y1="40.8661" x2="40.1094" y2="43.3477" gradientUnits="userSpaceOnUse">
+<stop stop-color="white"/>
+<stop offset="1" stop-color="#93BEFF"/>
+</linearGradient>
+<linearGradient id="paint8_linear_4018_5059" x1="45.0526" y1="67.1654" x2="72.1945" y2="70.6651" gradientUnits="userSpaceOnUse">
+<stop offset="0.652722" stop-color="white" stop-opacity="0.2"/>
+</linearGradient>
+<linearGradient id="paint9_linear_4018_5059" x1="70.6544" y1="53.7512" x2="62.7063" y2="54.0025" gradientUnits="userSpaceOnUse">
+<stop stop-color="white"/>
+<stop offset="1" stop-color="white" stop-opacity="0.2"/>
+</linearGradient>
+<linearGradient id="paint10_linear_4018_5059" x1="65.1612" y1="53.2798" x2="69.8816" y2="58.9506" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+<linearGradient id="paint11_linear_4018_5059" x1="63.7164" y1="53.4263" x2="55.3985" y2="53.6827" gradientUnits="userSpaceOnUse">
+<stop stop-color="white"/>
+<stop offset="1" stop-color="white" stop-opacity="0.2"/>
+</linearGradient>
+<linearGradient id="paint12_linear_4018_5059" x1="57.9678" y1="52.9202" x2="63.0587" y2="58.8804" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+<linearGradient id="paint13_linear_4018_5059" x1="56.1986" y1="53.945" x2="47.5655" y2="54.183" gradientUnits="userSpaceOnUse">
+<stop stop-color="white"/>
+<stop offset="1" stop-color="white" stop-opacity="0.2"/>
+</linearGradient>
+<linearGradient id="paint14_linear_4018_5059" x1="50.2333" y1="53.3578" x2="56.2075" y2="59.6129" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+</defs>
+</svg>

src/assets/svg/culture/answer_ask.svg

+<svg width="51" height="52" viewBox="0 0 51 52" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M23.8509 12H35.1198C36.8313 12 38.2188 13.372 38.2188 15.0644V24.2578C38.2188 25.9502 36.8313 27.3222 35.1198 27.3222H34.4155L33.8211 29.0856C33.6985 29.4494 33.2495 29.5848 32.9424 29.3505L30.2836 27.3222H23.8509C22.1394 27.3222 20.752 25.9502 20.752 24.2578V15.0644C20.752 13.372 22.1394 12 23.8509 12Z" fill="url(#paint0_linear_4018_5830)"/>
+<g opacity="0.5" filter="url(#filter0_f_4018_5830)">
+<path d="M21.3242 19.4551H29.5344C30.7814 19.4551 31.7922 20.4547 31.7922 21.6877V28.3858C31.7922 29.6188 30.7814 30.6184 29.5344 30.6184C29.2278 30.6184 28.9553 30.8141 28.8574 31.1047L28.5882 31.9031C28.4989 32.1682 28.1718 32.2668 27.948 32.0962C26.6915 31.1376 25.1548 30.6184 23.5744 30.6184H21.3242C20.0773 30.6184 19.0664 29.6188 19.0664 28.3858V21.6877C19.0664 20.4547 20.0773 19.4551 21.3242 19.4551Z" fill="#EB6F0A"/>
+</g>
+<foreignObject x="-16.5" y="-8.03516" width="76" height="76"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(12px);clip-path:url(#bgblur_0_4018_5830_clip_path);height:100%;width:100%"></div></foreignObject><path data-figma-bg-blur-radius="24" d="M30.21 16.2148C32.9909 16.215 35.25 18.4454 35.25 21.2021V35.4131C35.2498 38.1697 32.9908 40.3993 30.21 40.3994C29.6667 40.3994 29.1833 40.7469 29.0098 41.2617L28.4395 42.9551C28.1945 43.6819 27.3012 43.9478 26.6924 43.4834L23.1191 40.7588C22.8143 40.5263 22.4419 40.3995 22.0586 40.3994H12.79C10.0092 40.3993 7.75015 38.1697 7.75 35.4131V21.2021C7.75 18.4454 10.0091 16.215 12.79 16.2148H30.21Z" fill="#FFCBB9" fill-opacity="0.35" stroke="url(#paint1_linear_4018_5830)" stroke-width="0.5" stroke-linecap="round" stroke-linejoin="round"/>
+<g filter="url(#filter2_d_4018_5830)">
+<path d="M31.1504 24.0986L34.4072 32.1543H33.0615L32.3721 30.3535L32.3232 30.2256H28.7539L28.7061 30.3555L28.0381 32.1543H26.7959L29.9541 24.0986H31.1504ZM30.3232 25.9551L29.2256 28.9238L29.126 29.1934H31.9326L31.8291 28.9219L30.6973 25.9531L30.5078 25.4551L30.3232 25.9551Z" fill="url(#paint2_linear_4018_5830)" stroke="url(#paint3_linear_4018_5830)" stroke-width="0.4"/>
+<path d="M21.834 23.6143C22.2948 23.6143 22.6871 23.6981 23.0166 23.8594C23.3475 24.0213 23.5947 24.2431 23.7656 24.5234L23.7666 24.5254C23.9376 24.7991 24.0254 25.1123 24.0254 25.4707C24.0253 25.948 23.8755 26.3267 23.585 26.624C23.2824 26.9338 22.8417 27.2378 22.2529 27.5322L22.0127 27.6523L22.1963 27.8486L23.6406 29.3848L23.8428 29.6006L23.9678 29.332C24.2174 28.7959 24.3902 28.1986 24.4902 27.542H25.6846C25.4999 28.5688 25.162 29.4664 24.6689 30.2373L24.584 30.3701L24.6924 30.4834L26.2881 32.1553H24.8418L24.0234 31.2939L23.8896 31.1523L23.7451 31.2832C22.9971 31.9579 22.1128 32.2939 21.083 32.2939C20.2477 32.2939 19.5916 32.0881 19.0967 31.6934C18.6175 31.2975 18.3721 30.7483 18.3721 30.0215C18.3721 29.4191 18.5311 28.9486 18.833 28.5918C19.1506 28.2165 19.5929 27.8812 20.168 27.5898L20.3965 27.4736L20.2295 27.2803C19.9356 26.9412 19.7362 26.6488 19.624 26.4033C19.5206 26.1525 19.4697 25.8916 19.4697 25.6201C19.4698 25.193 19.576 24.8377 19.7803 24.5449C19.9894 24.2453 20.2683 24.0185 20.6211 23.8633L20.6221 23.8623C20.9867 23.6978 21.39 23.6143 21.834 23.6143ZM20.8799 28.1963C20.5041 28.4122 20.2019 28.6495 19.9824 28.9111C19.7508 29.1872 19.6358 29.5145 19.6357 29.8828C19.6357 30.3101 19.7821 30.6642 20.0898 30.916L20.0918 30.918C20.3976 31.1608 20.7886 31.2734 21.2451 31.2734C21.8933 31.2733 22.4892 31.0273 23.0283 30.5537L23.1846 30.417L23.042 30.2656L21.125 28.2324L21.0166 28.1182L20.8799 28.1963ZM21.7764 24.5889C21.4751 24.5889 21.2098 24.6735 20.998 24.8564L20.9951 24.8604C20.7821 25.0532 20.6866 25.3203 20.6865 25.6318C20.6865 25.8291 20.7382 26.0282 20.833 26.2266L20.835 26.2295C20.9303 26.4201 21.0921 26.6466 21.3115 26.9053L21.4111 27.0225L21.5508 26.9561C21.9304 26.7741 22.2325 26.5822 22.4463 26.377L22.4492 26.374C22.6775 26.1457 22.7959 25.8679 22.7959 25.5508C22.7958 25.2759 22.6986 25.039 22.499 24.8594H22.498C22.3082 24.6741 22.0608 24.5889 21.7764 24.5889Z" fill="url(#paint4_linear_4018_5830)" stroke="url(#paint5_linear_4018_5830)" stroke-width="0.4"/>
+<path d="M13.2598 23.9482C13.9817 23.9482 14.6285 24.117 15.2041 24.4521L15.207 24.4541C15.7876 24.7807 16.2466 25.256 16.584 25.8867L16.585 25.8887C16.9283 26.5169 17.1035 27.2573 17.1035 28.1152C17.1035 28.951 16.939 29.6772 16.6172 30.2988C16.2936 30.916 15.8595 31.3928 15.3145 31.7344L15.0869 31.877L15.2891 32.0547L17.6045 34.084H15.8877L13.8174 32.3174L13.7539 32.2637L13.6709 32.2705C13.4879 32.2858 13.3515 32.293 13.2598 32.293C12.5372 32.2929 11.8858 32.1273 11.3018 31.7988C10.7288 31.4645 10.274 30.9844 9.93652 30.3535C9.60062 29.7254 9.42877 28.9816 9.42871 28.1152C9.42871 27.2566 9.60034 26.5152 9.93652 25.8867C10.2743 25.2554 10.7297 24.7796 11.3027 24.4531H11.3037C11.8875 24.1175 12.5379 23.9483 13.2598 23.9482ZM13.2598 25.085C12.8358 25.085 12.4486 25.1845 12.1025 25.3857L11.957 25.4775C11.5834 25.7325 11.296 26.095 11.0908 26.5547L11.0898 26.5557C10.8919 27.0093 10.7959 27.5313 10.7959 28.1152C10.796 28.6991 10.8925 29.2231 11.0898 29.6836L11.0908 29.6865C11.2959 30.146 11.5829 30.5112 11.9551 30.7734L11.959 30.7764C12.3407 31.0308 12.7768 31.1562 13.2598 31.1562C13.7427 31.1562 14.1758 31.0309 14.5508 30.7754L14.5518 30.7744C14.9329 30.5118 15.222 30.1455 15.4199 29.6836L15.4189 29.6826C15.6238 29.2222 15.7246 28.6986 15.7246 28.1152C15.7246 27.5308 15.6241 27.0088 15.418 26.5547C15.2199 26.0939 14.9317 25.7313 14.5498 25.4766H14.5488C14.1746 25.2143 13.7424 25.085 13.2598 25.085Z" fill="url(#paint6_linear_4018_5830)" stroke="url(#paint7_linear_4018_5830)" stroke-width="0.4"/>
+</g>
+<defs>
+<filter id="filter0_f_4018_5830" x="0.0664062" y="0.455078" width="50.7266" height="50.7256" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="9.5" result="effect1_foregroundBlur_4018_5830"/>
+</filter>
+<clipPath id="bgblur_0_4018_5830_clip_path" transform="translate(16.5 8.03516)"><path d="M30.21 16.2148C32.9909 16.215 35.25 18.4454 35.25 21.2021V35.4131C35.2498 38.1697 32.9908 40.3993 30.21 40.3994C29.6667 40.3994 29.1833 40.7469 29.0098 41.2617L28.4395 42.9551C28.1945 43.6819 27.3012 43.9478 26.6924 43.4834L23.1191 40.7588C22.8143 40.5263 22.4419 40.3995 22.0586 40.3994H12.79C10.0092 40.3993 7.75015 38.1697 7.75 35.4131V21.2021C7.75 18.4454 10.0091 16.215 12.79 16.2148H30.21Z"/>
+</clipPath><filter id="filter2_d_4018_5830" x="-5.77148" y="8.41406" width="55.4746" height="40.8691" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dx="5" dy="5"/>
+<feGaussianBlur stdDeviation="5"/>
+<feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 0.521569 0 0 0 0 0.133333 0 0 0 0.5 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_4018_5830"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_4018_5830" result="shape"/>
+</filter>
+<linearGradient id="paint0_linear_4018_5830" x1="40.2774" y1="22.3708" x2="29.4854" y2="29.4668" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FD7A0D"/>
+<stop offset="1" stop-color="#FF9F58"/>
+</linearGradient>
+<linearGradient id="paint1_linear_4018_5830" x1="12.298" y1="19.6104" x2="32.4516" y2="43.9467" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+<linearGradient id="paint2_linear_4018_5830" x1="33.666" y1="32.1874" x2="31.9631" y2="23.6602" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.2"/>
+<stop offset="0.264434" stop-color="white" stop-opacity="0.723067"/>
+<stop offset="1" stop-color="white"/>
+</linearGradient>
+<linearGradient id="paint3_linear_4018_5830" x1="41.1813" y1="38.6783" x2="38.8122" y2="23.0178" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.2"/>
+<stop offset="0.399023" stop-color="white" stop-opacity="0.723067"/>
+<stop offset="1" stop-color="white"/>
+</linearGradient>
+<linearGradient id="paint4_linear_4018_5830" x1="25.6689" y1="32.3145" x2="23.7965" y2="23.1768" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.2"/>
+<stop offset="0.264434" stop-color="white" stop-opacity="0.723067"/>
+<stop offset="1" stop-color="white"/>
+</linearGradient>
+<linearGradient id="paint5_linear_4018_5830" x1="33.5335" y1="39.2842" x2="30.9263" y2="22.4883" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.2"/>
+<stop offset="0.399023" stop-color="white" stop-opacity="0.723067"/>
+<stop offset="1" stop-color="white"/>
+</linearGradient>
+<linearGradient id="paint6_linear_4018_5830" x1="17.0081" y1="34.0753" x2="14.603" y2="23.5786" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.2"/>
+<stop offset="0.264434" stop-color="white" stop-opacity="0.723067"/>
+<stop offset="1" stop-color="white"/>
+</linearGradient>
+<linearGradient id="paint7_linear_4018_5830" x1="25.169" y1="42.1622" x2="21.8063" y2="22.788" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.2"/>
+<stop offset="0.399023" stop-color="white" stop-opacity="0.723067"/>
+<stop offset="1" stop-color="white"/>
+</linearGradient>
+</defs>
+</svg>

src/assets/svg/culture/ask.svg

+<svg width="58" height="56" viewBox="0 0 58 56" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g filter="url(#filter0_f_4018_4955)">
+<path d="M31.8866 16C39.9716 16 45.8301 22.5763 45.8301 29.874C45.8301 32.2048 45.1482 34.605 43.9515 36.7971C43.7288 37.1579 43.701 37.6157 43.8541 38.0458L44.7864 41.1536C44.9951 41.9028 44.355 42.4577 43.6453 42.2358L40.8344 41.4033C40.069 41.1536 39.4706 41.4727 38.7595 41.9028C36.7278 43.0959 34.1966 43.7064 31.9144 43.7064C25.0123 43.7064 17.9988 38.3927 17.9988 29.8324C17.9988 22.4514 23.9825 16 31.8866 16Z" fill="url(#paint0_linear_4018_4955)"/>
+<g opacity="0.5" filter="url(#filter1_f_4018_4955)">
+<path d="M40.7732 30.012C40.7732 34.9617 36.7496 38.9723 31.786 38.9723C26.8224 38.9723 22.7988 34.9617 22.7988 30.012C22.7988 25.0642 26.8224 21.0518 31.786 21.0518C36.7496 21.0518 40.7732 25.0642 40.7732 30.012Z" fill="#8237FF"/>
+<path d="M40.7732 30.012C40.7732 34.9617 36.7496 38.9723 31.786 38.9723C26.8224 38.9723 22.7988 34.9617 22.7988 30.012C22.7988 25.0642 26.8224 21.0518 31.786 21.0518C36.7496 21.0518 40.7732 25.0642 40.7732 30.012Z" stroke="url(#paint1_linear_4018_4955)"/>
+</g>
+</g>
+<path d="M31.1464 15.1768C39.2314 15.1768 45.0898 21.7728 45.0898 29.0924C45.0898 31.4302 44.408 33.8377 43.2112 36.0363C42.9886 36.3981 42.9607 36.8574 43.1138 37.2887L44.0462 40.4058C44.2549 41.1573 43.6148 41.7139 42.9051 41.4913L40.0941 40.6563C39.3288 40.4058 38.7304 40.7259 38.0193 41.1573C35.9876 42.354 33.4564 42.9663 31.1742 42.9663C24.272 42.9663 17.2585 37.6366 17.2585 29.0507C17.2585 21.6475 23.2423 15.1768 31.1464 15.1768Z" fill="url(#paint2_linear_4018_4955)"/>
+<g opacity="0.5" filter="url(#filter2_f_4018_4955)">
+<path d="M40.033 29.2313C40.033 34.1959 36.0094 38.2185 31.0458 38.2185C26.0822 38.2185 22.0586 34.1959 22.0586 29.2313C22.0586 24.2686 26.0822 20.2441 31.0458 20.2441C36.0094 20.2441 40.033 24.2686 40.033 29.2313Z" fill="#8237FF"/>
+<path d="M40.033 29.2313C40.033 34.1959 36.0094 38.2185 31.0458 38.2185C26.0822 38.2185 22.0586 34.1959 22.0586 29.2313C22.0586 24.2686 26.0822 20.2441 31.0458 20.2441C36.0094 20.2441 40.033 24.2686 40.033 29.2313Z" stroke="url(#paint3_linear_4018_4955)"/>
+</g>
+<foreignObject x="-22.0918" y="-20.6943" width="85.5137" height="85.4609"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(12px);clip-path:url(#bgblur_0_4018_4955_clip_path);height:100%;width:100%"></div></foreignObject><g data-figma-bg-blur-radius="24">
+<mask id="path-5-outside-1_4018_4955" maskUnits="userSpaceOnUse" x="1.9082" y="3.30566" width="38" height="38" fill="black">
+<rect fill="white" x="1.9082" y="3.30566" width="38" height="38"/>
+<path d="M20.7007 4.30566C10.3839 4.30566 2.9082 12.7225 2.9082 22.0626C2.9082 25.0458 3.77829 28.1177 5.30539 30.9233C5.5895 31.385 5.62501 31.971 5.42969 32.5214L4.23997 36.499C3.97362 37.4579 4.79044 38.1681 5.69604 37.884L9.28294 36.8186C10.2596 36.499 11.0231 36.9074 11.9305 37.4579C14.523 38.985 17.753 39.7663 20.6651 39.7663C29.4726 39.7663 38.4221 32.9654 38.4221 22.0093C38.4221 12.5626 30.7866 4.30566 20.7007 4.30566Z"/>
+</mask>
+<path d="M20.7007 4.30566C10.3839 4.30566 2.9082 12.7225 2.9082 22.0626C2.9082 25.0458 3.77829 28.1177 5.30539 30.9233C5.5895 31.385 5.62501 31.971 5.42969 32.5214L4.23997 36.499C3.97362 37.4579 4.79044 38.1681 5.69604 37.884L9.28294 36.8186C10.2596 36.499 11.0231 36.9074 11.9305 37.4579C14.523 38.985 17.753 39.7663 20.6651 39.7663C29.4726 39.7663 38.4221 32.9654 38.4221 22.0093C38.4221 12.5626 30.7866 4.30566 20.7007 4.30566Z" fill="#BA90FF" fill-opacity="0.35"/>
+<path d="M20.7007 5.30566C21.2529 5.30566 21.7007 4.85795 21.7007 4.30566C21.7007 3.75338 21.2529 3.30566 20.7007 3.30566V4.30566V5.30566ZM5.30539 30.9233L4.42707 31.4014C4.43555 31.417 4.44444 31.4323 4.45373 31.4474L5.30539 30.9233ZM5.42969 32.5214L4.48726 32.187C4.48165 32.2028 4.47644 32.2188 4.47163 32.2349L5.42969 32.5214ZM4.23997 36.499L3.28191 36.2124C3.28003 36.2187 3.27821 36.225 3.27646 36.2313L4.23997 36.499ZM5.69604 37.884L5.41131 36.9254C5.40643 36.9269 5.40156 36.9284 5.3967 36.9299L5.69604 37.884ZM9.28294 36.8186L9.56768 37.7772C9.57648 37.7746 9.58525 37.7719 9.59398 37.769L9.28294 36.8186ZM11.9305 37.4579L11.4118 38.3129L11.423 38.3195L11.9305 37.4579ZM20.7007 3.30566C20.1484 3.30566 19.7007 3.75338 19.7007 4.30566C19.7007 4.85795 20.1484 5.30566 20.7007 5.30566V4.30566V3.30566ZM20.7007 4.30566V3.30566C9.79869 3.30566 1.9082 12.2036 1.9082 22.0626H2.9082H3.9082C3.9082 13.2413 10.9691 5.30566 20.7007 5.30566V4.30566ZM2.9082 22.0626H1.9082C1.9082 25.2367 2.8324 28.4717 4.42707 31.4014L5.30539 30.9233L6.18371 30.4452C4.72418 27.7638 3.9082 24.8548 3.9082 22.0626H2.9082ZM5.30539 30.9233L4.45373 31.4474C4.55509 31.6121 4.5979 31.8752 4.48726 32.187L5.42969 32.5214L6.37212 32.8559C6.65213 32.0667 6.62391 31.1579 6.15705 30.3992L5.30539 30.9233ZM5.42969 32.5214L4.47163 32.2349L3.28191 36.2124L4.23997 36.499L5.19803 36.7856L6.38775 32.808L5.42969 32.5214ZM4.23997 36.499L3.27646 36.2313C3.04856 37.0518 3.27555 37.8626 3.85072 38.3929C4.41468 38.9128 5.22347 39.0803 5.99538 38.8382L5.69604 37.884L5.3967 36.9299C5.32657 36.9519 5.27894 36.9488 5.25298 36.9433C5.22592 36.9377 5.21213 36.9277 5.20633 36.9224C5.2013 36.9178 5.19658 36.9117 5.19309 36.8988C5.18989 36.887 5.18149 36.8458 5.20349 36.7666L4.23997 36.499ZM5.69604 37.884L5.98078 38.8426L9.56768 37.7772L9.28294 36.8186L8.99821 35.86L5.41131 36.9254L5.69604 37.884ZM9.28294 36.8186L9.59398 37.769C10.0898 37.6067 10.4791 37.747 11.4118 38.3128L11.9305 37.4579L12.4492 36.6029C11.5671 36.0678 10.4293 35.3913 8.9719 35.8682L9.28294 36.8186ZM11.9305 37.4579L11.423 38.3195C14.1849 39.9464 17.5935 40.7663 20.6651 40.7663V39.7663V38.7663C17.9125 38.7663 14.8611 38.0235 12.438 36.5962L11.9305 37.4579ZM20.6651 39.7663V40.7663C29.9443 40.7663 39.4221 33.595 39.4221 22.0093H38.4221H37.4221C37.4221 32.3358 29.0009 38.7663 20.6651 38.7663V39.7663ZM38.4221 22.0093H39.4221C39.4221 12.0327 31.3609 3.30566 20.7007 3.30566V4.30566V5.30566C30.2123 5.30566 37.4221 13.0926 37.4221 22.0093H38.4221Z" fill="url(#paint4_linear_4018_4955)" mask="url(#path-5-outside-1_4018_4955)"/>
+</g>
+<foreignObject x="-4.82812" y="4.80762" width="50.918" height="34.5459"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(7.5px);clip-path:url(#bgblur_1_4018_4955_clip_path);height:100%;width:100%"></div></foreignObject><g filter="url(#filter4_d_4018_4955)" data-figma-bg-blur-radius="15">
+<mask id="path-7-inside-2_4018_4955" fill="white">
+<path d="M12.4443 19.8076C13.7051 19.8076 14.7178 20.8203 14.7178 22.0811C14.7175 23.3238 13.7049 24.3358 12.4443 24.3535C11.2017 24.3533 10.1721 23.3237 10.1719 22.0811C10.1719 20.8205 11.1838 19.8078 12.4443 19.8076ZM20.6318 19.8076C21.8922 19.8079 22.9041 20.8196 22.9043 22.0801C22.9043 23.3229 21.8924 24.3533 20.6318 24.3535C19.3711 24.3358 18.3584 23.3232 18.3584 22.0625C18.3585 20.8196 19.3889 19.7899 20.6318 19.8076ZM28.8174 19.8076C30.0779 19.8078 31.0897 20.8196 31.0898 22.0801C31.0898 23.323 30.078 24.3533 28.8174 24.3535C27.5566 24.3535 26.5439 23.3231 26.5439 22.0801C26.5441 20.8195 27.5567 19.8076 28.8174 19.8076Z"/>
+</mask>
+<path d="M12.4443 19.8076C13.7051 19.8076 14.7178 20.8203 14.7178 22.0811C14.7175 23.3238 13.7049 24.3358 12.4443 24.3535C11.2017 24.3533 10.1721 23.3237 10.1719 22.0811C10.1719 20.8205 11.1838 19.8078 12.4443 19.8076ZM20.6318 19.8076C21.8922 19.8079 22.9041 20.8196 22.9043 22.0801C22.9043 23.3229 21.8924 24.3533 20.6318 24.3535C19.3711 24.3358 18.3584 23.3232 18.3584 22.0625C18.3585 20.8196 19.3889 19.7899 20.6318 19.8076ZM28.8174 19.8076C30.0779 19.8078 31.0897 20.8196 31.0898 22.0801C31.0898 23.323 30.078 24.3533 28.8174 24.3535C27.5566 24.3535 26.5439 23.3231 26.5439 22.0801C26.5441 20.8195 27.5567 19.8076 28.8174 19.8076Z" fill="url(#paint5_linear_4018_4955)"/>
+<path d="M12.4443 19.8076V19.4076H12.4443L12.4443 19.8076ZM14.7178 22.0811L15.1178 22.0811V22.0811H14.7178ZM12.4443 24.3535L12.4443 24.7536L12.45 24.7535L12.4443 24.3535ZM10.1719 22.0811H9.77187V22.0811L10.1719 22.0811ZM20.6318 19.8076L20.6261 20.2076L20.6318 20.2076L20.6318 19.8076ZM22.9043 22.0801H23.3043V22.08L22.9043 22.0801ZM20.6318 24.3535L20.6262 24.7535L20.6319 24.7535L20.6318 24.3535ZM18.3584 22.0625L17.9584 22.0625V22.0625H18.3584ZM28.8174 19.8076L28.8174 19.4076H28.8174V19.8076ZM31.0898 22.0801H31.4898V22.08L31.0898 22.0801ZM28.8174 24.3535V24.7535H28.8174L28.8174 24.3535ZM26.5439 22.0801L26.1439 22.08V22.0801H26.5439ZM12.4443 19.8076V20.2076C13.4842 20.2076 14.3178 21.0412 14.3178 22.0811H14.7178H15.1178C15.1178 20.5994 13.926 19.4076 12.4443 19.4076V19.8076ZM14.7178 22.0811L14.3178 22.081C14.3176 23.0997 13.486 23.9388 12.4387 23.9536L12.4443 24.3535L12.45 24.7535C13.9238 24.7327 15.1175 23.548 15.1178 22.0811L14.7178 22.0811ZM12.4443 24.3535L12.4444 23.9535C11.4226 23.9533 10.5721 23.1028 10.5719 22.081L10.1719 22.0811L9.77187 22.0811C9.77218 23.5446 10.9808 24.7532 12.4443 24.7535L12.4443 24.3535ZM10.1719 22.0811H10.5719C10.5719 21.0412 11.4049 20.2078 12.4444 20.2076L12.4443 19.8076L12.4443 19.4076C10.9627 19.4079 9.77187 20.5997 9.77187 22.0811H10.1719ZM20.6318 19.8076L20.6318 20.2076C21.6713 20.2078 22.5042 21.0406 22.5043 22.0801L22.9043 22.0801L23.3043 22.08C23.3041 20.5987 22.1132 19.4079 20.6319 19.4076L20.6318 19.8076ZM22.9043 22.0801H22.5043C22.5043 23.1042 21.6693 23.9533 20.6318 23.9535L20.6318 24.3535L20.6319 24.7535C22.1155 24.7532 23.3043 23.5416 23.3043 22.0801H22.9043ZM20.6318 24.3535L20.6375 23.9536C19.5921 23.9388 18.7584 23.1012 18.7584 22.0625H18.3584H17.9584C17.9584 23.5452 19.1501 24.7327 20.6262 24.7535L20.6318 24.3535ZM18.3584 22.0625L18.7584 22.0625C18.7585 21.0395 19.6095 20.1931 20.6261 20.2076L20.6318 19.8076L20.6375 19.4077C19.1683 19.3867 17.9585 20.5996 17.9584 22.0625L18.3584 22.0625ZM28.8174 19.8076L28.8173 20.2076C29.8569 20.2078 30.6897 21.0405 30.6898 22.0801L31.0898 22.0801L31.4898 22.08C31.4896 20.5987 30.2988 19.4078 28.8174 19.4076L28.8174 19.8076ZM31.0898 22.0801H30.6898C30.6898 23.1042 29.8548 23.9534 28.8173 23.9535L28.8174 24.3535L28.8174 24.7535C30.3011 24.7533 31.4898 23.5417 31.4898 22.0801H31.0898ZM28.8174 24.3535V23.9535C27.7796 23.9535 26.9439 23.1042 26.9439 22.0801H26.5439H26.1439C26.1439 23.5419 27.3337 24.7535 28.8174 24.7535V24.3535ZM26.5439 22.0801L26.9439 22.0801C26.9441 21.0406 27.7775 20.2076 28.8174 20.2076V19.8076V19.4076C27.336 19.4076 26.1441 20.5984 26.1439 22.08L26.5439 22.0801Z" fill="url(#paint6_linear_4018_4955)" mask="url(#path-7-inside-2_4018_4955)"/>
+</g>
+<defs>
+<filter id="filter0_f_4018_4955" x="7.99805" y="6" width="47.832" height="47.7061" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="5" result="effect1_foregroundBlur_4018_4955"/>
+</filter>
+<filter id="filter1_f_4018_4955" x="5.79883" y="4.05176" width="51.9746" height="51.9209" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="8.5" result="effect1_foregroundBlur_4018_4955"/>
+</filter>
+<filter id="filter2_f_4018_4955" x="5.05859" y="3.24414" width="51.9746" height="51.9746" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="8.5" result="effect1_foregroundBlur_4018_4955"/>
+</filter>
+<clipPath id="bgblur_0_4018_4955_clip_path" transform="translate(22.0918 20.6943)"><path d="M20.7007 4.30566C10.3839 4.30566 2.9082 12.7225 2.9082 22.0626C2.9082 25.0458 3.77829 28.1177 5.30539 30.9233C5.5895 31.385 5.62501 31.971 5.42969 32.5214L4.23997 36.499C3.97362 37.4579 4.79044 38.1681 5.69604 37.884L9.28294 36.8186C10.2596 36.499 11.0231 36.9074 11.9305 37.4579C14.523 38.985 17.753 39.7663 20.6651 39.7663C29.4726 39.7663 38.4221 32.9654 38.4221 22.0093C38.4221 12.5626 30.7866 4.30566 20.7007 4.30566Z"/>
+</clipPath><filter id="filter4_d_4018_4955" x="-4.82812" y="4.80762" width="50.918" height="34.5459" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dx="5" dy="5"/>
+<feGaussianBlur stdDeviation="5"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0.577356 0 0 0 0 0.359375 0 0 0 0 0.9375 0 0 0 0.5 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_4018_4955"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_4018_4955" result="shape"/>
+</filter>
+<clipPath id="bgblur_1_4018_4955_clip_path" transform="translate(4.82812 -4.80762)"><path d="M12.4443 19.8076C13.7051 19.8076 14.7178 20.8203 14.7178 22.0811C14.7175 23.3238 13.7049 24.3358 12.4443 24.3535C11.2017 24.3533 10.1721 23.3237 10.1719 22.0811C10.1719 20.8205 11.1838 19.8078 12.4443 19.8076ZM20.6318 19.8076C21.8922 19.8079 22.9041 20.8196 22.9043 22.0801C22.9043 23.3229 21.8924 24.3533 20.6318 24.3535C19.3711 24.3358 18.3584 23.3232 18.3584 22.0625C18.3585 20.8196 19.3889 19.7899 20.6318 19.8076ZM28.8174 19.8076C30.0779 19.8078 31.0897 20.8196 31.0898 22.0801C31.0898 23.323 30.078 24.3533 28.8174 24.3535C27.5566 24.3535 26.5439 23.3231 26.5439 22.0801C26.5441 20.8195 27.5567 19.8076 28.8174 19.8076Z"/>
+</clipPath><linearGradient id="paint0_linear_4018_4955" x1="31.9144" y1="16" x2="31.9144" y2="43.7064" gradientUnits="userSpaceOnUse">
+<stop stop-color="#BC94FF"/>
+<stop offset="1" stop-color="#9F66FF"/>
+</linearGradient>
+<linearGradient id="paint1_linear_4018_4955" x1="25.6601" y1="23.1395" x2="37.0842" y2="37.3311" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+<linearGradient id="paint2_linear_4018_4955" x1="31.1742" y1="15.1768" x2="31.1742" y2="42.9663" gradientUnits="userSpaceOnUse">
+<stop stop-color="#BC94FF"/>
+<stop offset="1" stop-color="#9F66FF"/>
+</linearGradient>
+<linearGradient id="paint3_linear_4018_4955" x1="24.9198" y1="22.3382" x2="36.3856" y2="36.5388" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+<linearGradient id="paint4_linear_4018_4955" x1="8.56143" y1="8.43687" x2="31.1743" y2="36.4856" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+<linearGradient id="paint5_linear_4018_4955" x1="29.6068" y1="20.6286" x2="6.79479" y2="24.0509" gradientUnits="userSpaceOnUse">
+<stop stop-color="white"/>
+<stop offset="1" stop-color="white" stop-opacity="0.2"/>
+</linearGradient>
+<linearGradient id="paint6_linear_4018_4955" x1="13.5017" y1="20.3372" x2="14.5117" y2="26.0931" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+</defs>
+</svg>

src/assets/svg/culture/collect.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1662518356637" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5502" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M284.458667 941.397333c-36.437333 15.637333-68.48-7.68-64.896-47.168l22.613333-248.917333-164.394667-188.053333c-26.069333-29.824-13.653333-67.562667 24.789334-76.309334l243.370666-55.381333 127.786667-214.677333c20.288-34.090667 59.946667-34.069333 80.213333 0l127.786667 214.677333 243.370667 55.381333c38.656 8.789333 50.858667 46.485333 24.789333 76.309334l-164.394667 188.053333 22.741334 249.002667c3.605333 39.509333-28.458667 62.805333-64.896 47.146666l-229.504-98.517333-229.376 98.453333z" p-id="5503"></path></svg>

src/assets/svg/culture/daily_sign.svg

+<svg width="55" height="58" viewBox="0 0 55 58" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M19.6252 18.3899C19.3258 18.7866 18.6799 20.1358 18.3687 20.8215L18.4087 20.838L14.592 29.7438C12.9973 33.4653 14.3705 36.7579 18.0855 38.2835L27.261 42.0518C31.0111 43.5918 34.3294 42.2808 35.9135 38.5841L39.7533 29.6219L39.754 29.6222C39.7579 29.6124 39.7619 29.6024 39.766 29.5923L39.7857 29.5464L39.7845 29.5459C40.072 28.8249 40.5708 27.4979 40.643 27.0394C41.1328 24.3436 39.8754 21.956 37.2644 20.6028L26.6733 16.2442C23.8412 15.3435 21.2519 16.1356 19.6252 18.3899Z" fill="url(#paint0_linear_4018_5763)"/>
+<g opacity="0.5" filter="url(#filter0_f_4018_5763)">
+<path d="M33.508 22.5757L27.5688 20.2158C25.4145 19.3597 23.607 20.2106 22.6591 22.5225L19.4486 30.3528C18.4852 32.7026 19.1987 34.5199 21.353 35.376L27.2922 37.7359C29.4812 38.6058 31.2409 37.7712 32.2043 35.4213L35.4148 27.5911C36.3627 25.2791 35.697 23.4456 33.508 22.5757Z" fill="#EB6F0A"/>
+</g>
+<foreignObject x="-3.5" y="-1.99219" width="72.6328" height="72.5166"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(12px);clip-path:url(#bgblur_0_4018_5763_clip_path);height:100%;width:100%"></div></foreignObject><g data-figma-bg-blur-radius="24">
+<mask id="path-3-outside-1_4018_5763" maskUnits="userSpaceOnUse" x="20" y="21.5078" width="26" height="26" fill="black">
+<rect fill="white" x="20" y="21.5078" width="26" height="26"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M21.2081 27.1324C21.0862 27.6088 21.0213 29.0889 21.0045 29.8347H44.6285C44.6117 29.0877 44.5468 27.5961 44.4262 27.1324C43.8036 24.4771 41.6633 22.7632 38.667 22.5078H26.9672C23.945 22.7505 21.8307 24.4529 21.2081 27.1324ZM44.6328 39.585V29.835H21V39.5068C21 43.5216 23.6206 46.0244 27.7324 46.0244H37.8887C42.0391 46.0243 44.6327 43.5727 44.6328 39.585Z"/>
+</mask>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M21.2081 27.1324C21.0862 27.6088 21.0213 29.0889 21.0045 29.8347H44.6285C44.6117 29.0877 44.5468 27.5961 44.4262 27.1324C43.8036 24.4771 41.6633 22.7632 38.667 22.5078H26.9672C23.945 22.7505 21.8307 24.4529 21.2081 27.1324ZM44.6328 39.585V29.835H21V39.5068C21 43.5216 23.6206 46.0244 27.7324 46.0244H37.8887C42.0391 46.0243 44.6327 43.5727 44.6328 39.585Z" fill="#FFCBB9" fill-opacity="0.35"/>
+<path d="M21.0045 29.8347L20.5046 29.8234C20.5015 29.9579 20.5529 30.088 20.6469 30.1842C20.741 30.2805 20.8699 30.3347 21.0045 30.3347V29.8347ZM21.2081 27.1324L21.6926 27.2564L21.6951 27.2455L21.2081 27.1324ZM44.6285 29.8347V30.3347C44.7631 30.3347 44.892 30.2805 44.986 30.1842C45.0801 30.088 45.1314 29.9579 45.1284 29.8234L44.6285 29.8347ZM44.4262 27.1324L43.9392 27.2466L43.9423 27.2583L44.4262 27.1324ZM38.667 22.5078L38.7095 22.0096C38.6954 22.0084 38.6812 22.0078 38.667 22.0078V22.5078ZM26.9672 22.5078V22.0078C26.9539 22.0078 26.9405 22.0083 26.9272 22.0094L26.9672 22.5078ZM44.6328 29.835H45.1328C45.1328 29.5588 44.909 29.335 44.6328 29.335V29.835ZM44.6328 39.585L45.1328 39.585V39.585H44.6328ZM21 29.835V29.335C20.7239 29.335 20.5 29.5588 20.5 29.835H21ZM37.8887 46.0244V46.5244H37.8887L37.8887 46.0244ZM21.0045 29.8347L21.5043 29.846C21.5126 29.4785 21.5328 28.9291 21.5659 28.4146C21.6001 27.8808 21.6453 27.4408 21.6925 27.2563L21.2081 27.1324L20.7237 27.0084C20.649 27.3004 20.6008 27.8387 20.5679 28.3505C20.5338 28.8816 20.5131 29.4451 20.5046 29.8234L21.0045 29.8347ZM44.6285 29.8347V29.3347H21.0045V29.8347V30.3347H44.6285V29.8347ZM44.4262 27.1324L43.9423 27.2583C43.9882 27.4348 44.0331 27.8725 44.0673 28.4091C44.1001 28.9251 44.1203 29.4778 44.1286 29.846L44.6285 29.8347L45.1284 29.8234C45.1198 29.4445 45.0992 28.8779 45.0652 28.3455C45.0326 27.8336 44.9848 27.2937 44.9101 27.0065L44.4262 27.1324ZM38.667 22.5078L38.6246 23.006C41.436 23.2456 43.3729 24.8305 43.9394 27.2465L44.4262 27.1324L44.913 27.0182C44.2343 24.1237 41.8907 22.2807 38.7095 22.0096L38.667 22.5078ZM26.9672 22.5078V23.0078H38.667V22.5078V22.0078H26.9672V22.5078ZM21.2081 27.1324L21.6951 27.2455C22.2622 24.8051 24.173 23.2338 27.0072 23.0062L26.9672 22.5078L26.9272 22.0094C23.7169 22.2672 21.3992 24.1007 20.7211 27.0192L21.2081 27.1324ZM44.6328 29.835H44.1328V39.585H44.6328H45.1328V29.835H44.6328ZM21 29.835V30.335H44.6328V29.835V29.335H21V29.835ZM21 39.5068H21.5V29.835H21H20.5V39.5068H21ZM27.7324 46.0244V45.5244C25.778 45.5244 24.2289 44.9312 23.1714 43.9113C22.1159 42.8933 21.5 41.4024 21.5 39.5068H21H20.5C20.5 41.626 21.1944 43.3939 22.4772 44.631C23.7579 45.8662 25.5751 46.5244 27.7324 46.5244V46.0244ZM37.8887 46.0244V45.5244H27.7324V46.0244V46.5244H37.8887V46.0244ZM44.6328 39.585L44.1328 39.5849C44.1327 41.4672 43.5235 42.937 42.4723 43.9379C41.4182 44.9416 39.8663 45.5243 37.8887 45.5244L37.8887 46.0244L37.8887 46.5244C40.0615 46.5243 41.8816 45.8812 43.1619 44.6621C44.4451 43.4403 45.1327 41.6905 45.1328 39.585L44.6328 39.585Z" fill="url(#paint1_linear_4018_5763)" mask="url(#path-3-outside-1_4018_5763)"/>
+</g>
+<foreignObject x="12.2676" y="5.61426" width="41.5" height="35.8311"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(7.5px);clip-path:url(#bgblur_1_4018_5763_clip_path);height:100%;width:100%"></div></foreignObject><g filter="url(#filter2_d_4018_5763)" data-figma-bg-blur-radius="15">
+<mask id="path-5-inside-2_4018_5763" fill="white">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M29.231 25.4675C29.231 26.0278 28.8103 26.4458 28.2493 26.4458C27.6883 26.4458 27.2676 26.0278 27.2676 25.4675V21.5938C27.2676 21.0335 27.6883 20.6143 28.2493 20.6143C28.8103 20.6143 29.231 21.0335 29.231 21.5938V25.4675ZM38.7682 25.4675C38.7682 26.0278 38.3347 26.4458 37.7864 26.4458C37.2254 26.4458 36.8047 26.0278 36.8047 25.4675V21.5938C36.8047 21.0335 37.2254 20.6143 37.7864 20.6143C38.3347 20.6143 38.7682 21.0335 38.7682 21.5938V25.4675Z"/>
+</mask>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M29.231 25.4675C29.231 26.0278 28.8103 26.4458 28.2493 26.4458C27.6883 26.4458 27.2676 26.0278 27.2676 25.4675V21.5938C27.2676 21.0335 27.6883 20.6143 28.2493 20.6143C28.8103 20.6143 29.231 21.0335 29.231 21.5938V25.4675ZM38.7682 25.4675C38.7682 26.0278 38.3347 26.4458 37.7864 26.4458C37.2254 26.4458 36.8047 26.0278 36.8047 25.4675V21.5938C36.8047 21.0335 37.2254 20.6143 37.7864 20.6143C38.3347 20.6143 38.7682 21.0335 38.7682 21.5938V25.4675Z" fill="url(#paint2_linear_4018_5763)"/>
+<path d="M28.2493 26.4458V26.8458C29.0295 26.8458 29.631 26.2504 29.631 25.4675H29.231H28.831C28.831 25.8052 28.591 26.0458 28.2493 26.0458V26.4458ZM27.2676 25.4675H26.8676C26.8676 26.2504 27.4691 26.8458 28.2493 26.8458V26.4458V26.0458C27.9076 26.0458 27.6676 25.8052 27.6676 25.4675H27.2676ZM27.2676 21.5938H26.8676V25.4675H27.2676H27.6676V21.5938H27.2676ZM28.2493 20.6143V20.2143C27.4684 20.2143 26.8676 20.8116 26.8676 21.5938H27.2676H27.6676C27.6676 21.2554 27.9082 21.0143 28.2493 21.0143V20.6143ZM29.231 21.5938H29.631C29.631 20.8116 29.0302 20.2143 28.2493 20.2143V20.6143V21.0143C28.5904 21.0143 28.831 21.2554 28.831 21.5938H29.231ZM29.231 25.4675H29.631V21.5938H29.231H28.831V25.4675H29.231ZM37.7864 26.4458V26.8458C38.5505 26.8458 39.1682 26.2538 39.1682 25.4675H38.7682H38.3682C38.3682 25.8018 38.1189 26.0458 37.7864 26.0458V26.4458ZM36.8047 25.4675H36.4047C36.4047 26.2504 37.0062 26.8458 37.7864 26.8458V26.4458V26.0458C37.4447 26.0458 37.2047 25.8052 37.2047 25.4675H36.8047ZM36.8047 21.5938H36.4047V25.4675H36.8047H37.2047V21.5938H36.8047ZM37.7864 20.6143V20.2143C37.0055 20.2143 36.4047 20.8116 36.4047 21.5938H36.8047H37.2047C37.2047 21.2554 37.4454 21.0143 37.7864 21.0143V20.6143ZM38.7682 21.5938H39.1682C39.1682 20.8082 38.5512 20.2143 37.7864 20.2143V20.6143V21.0143C38.1182 21.0143 38.3682 21.2588 38.3682 21.5938H38.7682ZM38.7682 25.4675H39.1682V21.5938H38.7682H38.3682V25.4675H38.7682Z" fill="url(#paint3_linear_4018_5763)" mask="url(#path-5-inside-2_4018_5763)"/>
+</g>
+<foreignObject x="7.58984" y="13.9629" width="50.3848" height="31.9326"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(7.5px);clip-path:url(#bgblur_2_4018_5763_clip_path);height:100%;width:100%"></div></foreignObject><path opacity="0.5" data-figma-bg-blur-radius="15" d="M22.5892 29.9294C22.5892 30.4691 23.0138 30.8958 23.5829 30.8958L41.9796 30.8958C42.5487 30.8958 42.9746 30.4691 42.9746 29.9294C42.9746 29.3771 42.5487 28.9629 41.9796 28.9629L23.5829 28.9629C23.0138 28.9629 22.5892 29.3771 22.5892 29.9294Z" fill="url(#paint4_linear_4018_5763)" fill-opacity="0.5"/>
+<foreignObject x="13.0938" y="17.6895" width="41.4297" height="38.6406"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(7.5px);clip-path:url(#bgblur_3_4018_5763_clip_path);height:100%;width:100%"></div></foreignObject><g filter="url(#filter4_d_4018_5763)" data-figma-bg-blur-radius="15">
+<path d="M39.3497 34.4304C39.2557 34.5892 39.1362 34.7185 39.0421 34.8146C38.4812 35.3908 37.9167 35.967 37.3522 36.5432L36.7677 37.1397C36.4185 37.4962 36.0693 37.8544 35.7201 38.2109C34.8516 39.1029 33.9541 40.0245 33.0567 40.9202C32.8396 41.1363 32.5501 41.3302 32.2099 41.3302C31.9421 41.3302 31.6399 41.2101 31.3179 40.887C30.8167 40.3846 30.3155 39.8693 29.8306 39.3689C29.608 39.138 29.3818 38.9071 29.1575 38.6763C29.0778 38.5932 28.9964 38.5119 28.915 38.4307C28.7666 38.2811 28.6146 38.1296 28.4663 37.9726C28.0483 37.5239 27.9796 37.0123 28.2727 36.5303C28.5477 36.0796 28.9928 35.9965 29.304 35.9725L29.3854 35.9651L29.4614 35.9984C29.4741 36.0058 29.4922 36.0113 29.5121 36.0168C29.6062 36.0482 29.7491 36.0981 29.8686 36.2052C30.2811 36.5857 30.6828 36.9827 31.0193 37.3226C31.4011 37.7049 31.7865 38.1001 32.1918 38.523C33.8619 36.811 35.588 35.0473 37.3214 33.2817L37.3504 33.254C37.5548 33.0453 37.8081 32.7849 38.1899 32.7129C38.664 32.6224 39.0711 32.796 39.3335 33.2041C39.5813 33.5901 39.5868 34.026 39.3479 34.4304H39.3497Z" fill="url(#paint5_linear_4018_5763)"/>
+<path d="M38.2275 32.9092C38.6215 32.834 38.9469 32.9732 39.165 33.3125C39.3709 33.6331 39.3773 33.9879 39.1758 34.3291L39.1641 34.3477C39.0844 34.4764 38.9863 34.5862 38.8994 34.6748H38.8984C38.3378 35.2507 37.7735 35.8271 37.209 36.4033L36.625 37C36.4503 37.1783 36.2751 37.3565 36.1006 37.5352L35.5771 38.0713C34.7085 38.9635 33.8113 39.8838 32.915 40.7783C32.7133 40.979 32.4725 41.1299 32.21 41.1299C32.0083 41.1299 31.7545 41.0415 31.46 40.7461H31.459C30.9589 40.2449 30.4584 39.7299 29.9736 39.2295L29.3008 38.5371C29.2197 38.4525 29.1365 38.3697 29.0557 38.2891C28.9065 38.1387 28.7572 37.9893 28.6113 37.835C28.4252 37.6347 28.3269 37.4319 28.3008 37.2373C28.2748 37.0439 28.3167 36.8405 28.4424 36.6338L28.4434 36.6348C28.6661 36.2699 29.0247 36.1946 29.3193 36.1719H29.3223L29.3516 36.1689L29.3809 36.1816V36.1787C29.4076 36.1917 29.4331 36.2015 29.4492 36.2061V36.207C29.519 36.2303 29.5965 36.2579 29.667 36.3027L29.7354 36.3545C30.1438 36.7312 30.5421 37.1248 30.877 37.4629L30.8779 37.4639C31.2585 37.845 31.6433 38.239 32.0479 38.6611L32.1904 38.8105L32.335 38.6631C34.0036 36.9526 35.7281 35.1898 37.46 33.4258L37.4883 33.3984L37.4932 33.3936C37.7027 33.1797 37.9153 32.968 38.2266 32.9092H38.2275Z" stroke="url(#paint6_linear_4018_5763)" stroke-width="0.4"/>
+</g>
+<defs>
+<filter id="filter0_f_4018_5763" x="0.0273438" y="0.889648" width="54.8066" height="56.1826" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="9.5" result="effect1_foregroundBlur_4018_5763"/>
+</filter>
+<clipPath id="bgblur_0_4018_5763_clip_path" transform="translate(3.5 1.99219)"><path fill-rule="evenodd" clip-rule="evenodd" d="M21.2081 27.1324C21.0862 27.6088 21.0213 29.0889 21.0045 29.8347H44.6285C44.6117 29.0877 44.5468 27.5961 44.4262 27.1324C43.8036 24.4771 41.6633 22.7632 38.667 22.5078H26.9672C23.945 22.7505 21.8307 24.4529 21.2081 27.1324ZM44.6328 39.585V29.835H21V39.5068C21 43.5216 23.6206 46.0244 27.7324 46.0244H37.8887C42.0391 46.0243 44.6327 43.5727 44.6328 39.585Z"/>
+</clipPath><filter id="filter2_d_4018_5763" x="12.2676" y="5.61426" width="41.5" height="35.8311" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dx="5" dy="5"/>
+<feGaussianBlur stdDeviation="5"/>
+<feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 0.537255 0 0 0 0 0.160784 0 0 0 0.2 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_4018_5763"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_4018_5763" result="shape"/>
+</filter>
+<clipPath id="bgblur_1_4018_5763_clip_path" transform="translate(-12.2676 -5.61426)"><path fill-rule="evenodd" clip-rule="evenodd" d="M29.231 25.4675C29.231 26.0278 28.8103 26.4458 28.2493 26.4458C27.6883 26.4458 27.2676 26.0278 27.2676 25.4675V21.5938C27.2676 21.0335 27.6883 20.6143 28.2493 20.6143C28.8103 20.6143 29.231 21.0335 29.231 21.5938V25.4675ZM38.7682 25.4675C38.7682 26.0278 38.3347 26.4458 37.7864 26.4458C37.2254 26.4458 36.8047 26.0278 36.8047 25.4675V21.5938C36.8047 21.0335 37.2254 20.6143 37.7864 20.6143C38.3347 20.6143 38.7682 21.0335 38.7682 21.5938V25.4675Z"/>
+</clipPath><clipPath id="bgblur_2_4018_5763_clip_path" transform="translate(-7.58984 -13.9629)"><path d="M22.5892 29.9294C22.5892 30.4691 23.0138 30.8958 23.5829 30.8958L41.9796 30.8958C42.5487 30.8958 42.9746 30.4691 42.9746 29.9294C42.9746 29.3771 42.5487 28.9629 41.9796 28.9629L23.5829 28.9629C23.0138 28.9629 22.5892 29.3771 22.5892 29.9294Z"/>
+</clipPath><filter id="filter4_d_4018_5763" x="13.0938" y="17.6895" width="41.4297" height="38.6406" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dx="5" dy="5"/>
+<feGaussianBlur stdDeviation="5"/>
+<feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 0.537255 0 0 0 0 0.160784 0 0 0 0.2 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_4018_5763"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_4018_5763" result="shape"/>
+</filter>
+<clipPath id="bgblur_3_4018_5763_clip_path" transform="translate(-13.0938 -17.6895)"><path d="M39.3497 34.4304C39.2557 34.5892 39.1362 34.7185 39.0421 34.8146C38.4812 35.3908 37.9167 35.967 37.3522 36.5432L36.7677 37.1397C36.4185 37.4962 36.0693 37.8544 35.7201 38.2109C34.8516 39.1029 33.9541 40.0245 33.0567 40.9202C32.8396 41.1363 32.5501 41.3302 32.2099 41.3302C31.9421 41.3302 31.6399 41.2101 31.3179 40.887C30.8167 40.3846 30.3155 39.8693 29.8306 39.3689C29.608 39.138 29.3818 38.9071 29.1575 38.6763C29.0778 38.5932 28.9964 38.5119 28.915 38.4307C28.7666 38.2811 28.6146 38.1296 28.4663 37.9726C28.0483 37.5239 27.9796 37.0123 28.2727 36.5303C28.5477 36.0796 28.9928 35.9965 29.304 35.9725L29.3854 35.9651L29.4614 35.9984C29.4741 36.0058 29.4922 36.0113 29.5121 36.0168C29.6062 36.0482 29.7491 36.0981 29.8686 36.2052C30.2811 36.5857 30.6828 36.9827 31.0193 37.3226C31.4011 37.7049 31.7865 38.1001 32.1918 38.523C33.8619 36.811 35.588 35.0473 37.3214 33.2817L37.3504 33.254C37.5548 33.0453 37.8081 32.7849 38.1899 32.7129C38.664 32.6224 39.0711 32.796 39.3335 33.2041C39.5813 33.5901 39.5868 34.026 39.3479 34.4304H39.3497Z"/>
+</clipPath><linearGradient id="paint0_linear_4018_5763" x1="45.5221" y1="40.5" x2="22.6855" y2="40.4387" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFB37F"/>
+<stop offset="1" stop-color="#FF7B0D"/>
+</linearGradient>
+<linearGradient id="paint1_linear_4018_5763" x1="24.762" y1="25.2475" x2="42.2991" y2="46.5291" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+<linearGradient id="paint2_linear_4018_5763" x1="38.0748" y1="25.5408" x2="38.4095" y2="21.16" gradientUnits="userSpaceOnUse">
+<stop stop-color="white"/>
+<stop offset="1" stop-color="white" stop-opacity="0.2"/>
+</linearGradient>
+<linearGradient id="paint3_linear_4018_5763" x1="37.7587" y1="21.496" x2="42.4166" y2="23.2706" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+<linearGradient id="paint4_linear_4018_5763" x1="28.0913" y1="29.9021" x2="27.3809" y2="27.6419" gradientUnits="userSpaceOnUse">
+<stop stop-color="white"/>
+<stop offset="1" stop-color="white" stop-opacity="0.2"/>
+</linearGradient>
+<linearGradient id="paint5_linear_4018_5763" x1="39.0004" y1="33.999" x2="12.7948" y2="23.4311" gradientUnits="userSpaceOnUse">
+<stop offset="0.0257719" stop-color="white"/>
+<stop offset="1" stop-color="white" stop-opacity="0.2"/>
+</linearGradient>
+<linearGradient id="paint6_linear_4018_5763" x1="33.6473" y1="33.996" x2="37.3561" y2="39.5893" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+</defs>
+</svg>

src/assets/svg/culture/header_bg.svg

+<svg width="1440" height="52" viewBox="0 0 1440 52" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_4018_4776)">
+<rect width="1440" height="52" fill="white"/>
+<g opacity="0.4">
+<g opacity="0.9" filter="url(#filter0_f_4018_4776)">
+<path d="M772.018 297.727C638.936 279.177 564.987 211.476 490.277 150.855C420.344 94.1114 352.005 34.5528 364.844 -32.66C378.486 -104.063 452.013 -168.512 559.749 -212.809C672.877 -259.322 814.042 -285.149 956.779 -276.038C1105.97 -266.516 1256.16 -230.95 1333.5 -163.423C1407.16 -99.1186 1360.33 -20.677 1333.66 53.0078C1307.82 124.405 1291.35 201.192 1184.72 247.653C1071.85 296.834 913.88 317.501 772.018 297.727Z" fill="url(#paint0_linear_4018_4776)" fill-opacity="0.4"/>
+</g>
+<g opacity="0.7" filter="url(#filter1_f_4018_4776)">
+<path opacity="0.8" d="M857.48 195.132C762.64 167.448 681.215 111.153 668.027 52.5871C655.959 -0.994975 738.162 -34.9614 797.598 -70.8048C838.132 -95.2444 887.653 -112.753 948.772 -116.704C1003.95 -120.271 1055.98 -102.542 1111.6 -91.1024C1198.17 -73.2947 1307.77 -78.3568 1358.21 -32.4827C1412.26 16.6699 1393.96 79.8839 1347.86 123.779C1303.9 165.632 1212.07 174.564 1127.87 186.817C1039.07 199.734 947.063 221.283 857.48 195.132Z" fill="#0500FF"/>
+</g>
+<g filter="url(#filter2_f_4018_4776)">
+<path d="M350.157 200.737C213.928 187.476 77.4713 132.294 25.7152 56.7774C-21.6292 -12.3138 61.6784 -78.8585 115.165 -142.166C151.635 -185.339 203.601 -221.451 278.326 -242.246C345.782 -261.018 422.039 -250.322 499.052 -248.999C618.921 -246.942 754.141 -281.511 845.269 -232.516C942.908 -180.017 957.736 -90.2717 925.9 -19.4962C895.544 47.9861 785.074 83.2629 686.216 121.078C581.963 160.955 478.828 213.263 350.157 200.737Z" fill="url(#paint1_linear_4018_4776)"/>
+</g>
+</g>
+</g>
+<defs>
+<filter id="filter0_f_4018_4776" x="-61.5882" y="-702.721" width="1859.51" height="1432.75" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="212.434" result="effect1_foregroundBlur_4018_4776"/>
+</filter>
+<filter id="filter1_f_4018_4776" x="356.946" y="-427.06" width="1344.29" height="944.428" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="154.945" result="effect1_foregroundBlur_4018_4776"/>
+</filter>
+<filter id="filter2_f_4018_4776" x="-283.184" y="-553.803" width="1519.04" height="1051.3" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="147.435" result="effect1_foregroundBlur_4018_4776"/>
+</filter>
+<linearGradient id="paint0_linear_4018_4776" x1="787.426" y1="-33.9855" x2="1583.56" y2="-454.532" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FF0099"/>
+<stop offset="1" stop-color="#FFD600"/>
+</linearGradient>
+<linearGradient id="paint1_linear_4018_4776" x1="301.626" y1="167.422" x2="911.841" y2="-246.846" gradientUnits="userSpaceOnUse">
+<stop stop-color="#16CDEA"/>
+<stop offset="1" stop-color="#D680FF"/>
+</linearGradient>
+<clipPath id="clip0_4018_4776">
+<rect width="1440" height="52" fill="white"/>
+</clipPath>
+</defs>
+</svg>

src/assets/svg/culture/home.svg

+<svg width="63" height="66" viewBox="0 0 63 66" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g filter="url(#filter0_f_4018_4946)">
+<path d="M45.922 47.8398C44.836 48.918 43.3624 49.5217 41.8263 49.5177H21.5527C18.3512 49.5177 15.7523 46.9381 15.7479 43.7561L15.7274 29.1431C15.7551 27.89 16.3492 26.7167 17.3449 25.9488L28.2654 17.187C30.1512 15.5607 32.9396 15.5104 34.8879 17.0676L46.0884 25.9488C47.0413 26.74 47.5929 27.9098 47.5946 29.1431L47.6151 43.771C47.6172 45.2977 47.008 46.7617 45.922 47.8398Z" fill="url(#paint0_linear_4018_4946)"/>
+</g>
+<path d="M45.922 47.8398C44.836 48.918 43.3624 49.5217 41.8263 49.5177H21.5527C18.3512 49.5177 15.7523 46.9381 15.7479 43.7561L15.7274 29.1431C15.7551 27.89 16.3492 26.7167 17.3449 25.9488L28.2654 17.187C30.1512 15.5607 32.9396 15.5104 34.8879 17.0676L46.0884 25.9488C47.0413 26.74 47.5929 27.9098 47.5946 29.1431L47.6151 43.771C47.6172 45.2977 47.008 46.7617 45.922 47.8398Z" fill="url(#paint1_linear_4018_4946)"/>
+<g opacity="0.5" filter="url(#filter1_f_4018_4946)">
+<path d="M37.671 43.8949C36.858 44.36 35.8919 44.4839 34.9859 44.2393L23.0193 41.0414C21.1296 40.5364 20.007 38.6039 20.5118 36.725L22.83 28.0964C23.0462 27.3611 23.584 26.7623 24.2941 26.466L32.1372 23.0169C33.5097 22.3544 35.1635 22.7645 36.0653 23.991L41.2601 30.9999C41.6963 31.6172 41.8354 32.3947 41.6398 33.1229L39.3191 41.7603C39.0769 42.6618 38.4839 43.4298 37.671 43.8949Z" fill="#0062FF"/>
+</g>
+<foreignObject x="-20.8184" y="-7.61719" width="85.3125" height="87.0713"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(12px);clip-path:url(#bgblur_0_4018_4946_clip_path);height:100%;width:100%"></div></foreignObject><path data-figma-bg-blur-radius="24" d="M17.7686 18.3877C20.0426 16.4369 23.3992 16.376 25.7432 18.2432L38.1406 28.0469L38.1494 28.0537C39.3179 29.0214 39.9941 30.4537 39.9941 31.9648V48.1113C39.9941 49.9309 39.2626 51.6746 37.9629 52.958C36.6638 54.2408 34.9039 54.9574 33.0713 54.9531V54.9541H10.6055C6.78645 54.9541 3.68168 51.8879 3.68164 48.0947V31.9531L3.69629 31.666C3.81092 30.2427 4.52424 28.9282 5.66699 28.0479L17.7686 18.3877Z" fill="url(#paint2_linear_4018_4946)" stroke="url(#paint3_linear_4018_4946)" stroke-linecap="round" stroke-linejoin="round"/>
+<foreignObject x="-1.25977" y="30.0732" width="47.4746" height="35.6318"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(7.5px);clip-path:url(#bgblur_1_4018_4946_clip_path);height:100%;width:100%"></div></foreignObject><g filter="url(#filter3_d_4018_4946)" data-figma-bg-blur-radius="15">
+<rect x="13.7402" y="45.0732" width="15.4754" height="3.6315" rx="1.81575" fill="url(#paint4_linear_4018_4946)"/>
+<rect x="13.8402" y="45.1732" width="15.2754" height="3.4315" rx="1.71575" stroke="url(#paint5_linear_4018_4946)" stroke-opacity="0.5" stroke-width="0.2"/>
+</g>
+<defs>
+<filter id="filter0_f_4018_4946" x="0.726562" y="0.932617" width="61.8887" height="63.585" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="7.5" result="effect1_foregroundBlur_4018_4946"/>
+</filter>
+<filter id="filter1_f_4018_4946" x="2.39062" y="4.70215" width="57.3359" height="57.6602" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="9" result="effect1_foregroundBlur_4018_4946"/>
+</filter>
+<clipPath id="bgblur_0_4018_4946_clip_path" transform="translate(20.8184 7.61719)"><path d="M17.7686 18.3877C20.0426 16.4369 23.3992 16.376 25.7432 18.2432L38.1406 28.0469L38.1494 28.0537C39.3179 29.0214 39.9941 30.4537 39.9941 31.9648V48.1113C39.9941 49.9309 39.2626 51.6746 37.9629 52.958C36.6638 54.2408 34.9039 54.9574 33.0713 54.9531V54.9541H10.6055C6.78645 54.9541 3.68168 51.8879 3.68164 48.0947V31.9531L3.69629 31.666C3.81092 30.2427 4.52424 28.9282 5.66699 28.0479L17.7686 18.3877Z"/>
+</clipPath><filter id="filter3_d_4018_4946" x="-1.25977" y="30.0732" width="47.4746" height="35.6318" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dx="5" dy="5"/>
+<feGaussianBlur stdDeviation="6"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0.15375 0 0 0 0 0.522433 0 0 0 0 0.9 0 0 0 0.28 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_4018_4946"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_4018_4946" result="shape"/>
+</filter>
+<clipPath id="bgblur_1_4018_4946_clip_path" transform="translate(1.25977 -30.0732)"><rect x="13.7402" y="45.0732" width="15.4754" height="3.6315" rx="1.81575"/>
+</clipPath><linearGradient id="paint0_linear_4018_4946" x1="47.7062" y1="15.9326" x2="11.3318" y2="44.0154" gradientUnits="userSpaceOnUse">
+<stop stop-color="#39AFFD"/>
+<stop offset="1" stop-color="#477FFF"/>
+</linearGradient>
+<linearGradient id="paint1_linear_4018_4946" x1="47.7062" y1="15.9326" x2="11.3318" y2="44.0154" gradientUnits="userSpaceOnUse">
+<stop stop-color="#39AFFD"/>
+<stop offset="1" stop-color="#477FFF"/>
+</linearGradient>
+<linearGradient id="paint2_linear_4018_4946" x1="21.8381" y1="17.3828" x2="21.8381" y2="54.4544" gradientUnits="userSpaceOnUse">
+<stop stop-color="#91C9FF"/>
+<stop offset="1" stop-color="#3B9FFE"/>
+</linearGradient>
+<linearGradient id="paint3_linear_4018_4946" x1="9.80287" y1="21.7017" x2="40.8699" y2="50.5891" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+<linearGradient id="paint4_linear_4018_4946" x1="28.1185" y1="45.729" x2="11.1888" y2="48.0813" gradientUnits="userSpaceOnUse">
+<stop stop-color="white"/>
+<stop offset="1" stop-color="white" stop-opacity="0.2"/>
+</linearGradient>
+<linearGradient id="paint5_linear_4018_4946" x1="15.4073" y1="46.2914" x2="28.5412" y2="46.6004" gradientUnits="userSpaceOnUse">
+<stop stop-color="white"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+</defs>
+</svg>

src/assets/svg/culture/lettter.svg

+<svg width="44" height="44" viewBox="0 0 44 44" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<rect width="44" height="44" fill="url(#pattern0_3339_802)"/>
+<defs>
+<pattern id="pattern0_3339_802" patternContentUnits="objectBoundingBox" width="1" height="1">
+<use xlink:href="#image0_3339_802" transform="scale(0.005)"/>
+</pattern>
+<image id="image0_3339_802" width="200" height="200" preserveAspectRatio="none" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACtWK6eAAAAAXNSR0IArs4c6QAAEV5JREFUeF7tnXtsHMUdx3+z9/A5zsMkJPjyAEeBhARKbUNCGwgEaBEBFVVUlSr6RxugVVUeimynlQgVFFCL5AdURUJIqKAKoT5EKQ8V1KpAmlJE2sSGQqAUEiOaOATZceLEr/PdlEl8wbnc3e7Mzszt7X5XivKHf/Ob+X1/8/FvZ3a8ywgXFIACJRVg0AYKQIHSCgAQzA4oUEYBAILpAQUACOYAFFBTABVETTe0iogCACQiiUaYagoAEDXd0CoiCgCQiCQaYaopAEDUdEOriCgAQCKSaISppgAAUdMNrSKiAACJSKIRppoCAERNN7SKiAIAJCKJRphqCgAQNd3QKiIKAJCIJBphqikAQNR0Q6uIKABAIpJohKmmAABR081Iq5b2/VuI6OjOzoaHjHQAp9IKABBpyfQ3aGrdu5Yx1kHE1h73zv5CfHJzT/fiN/X3Bo8yCgAQGbUM2Da37b+PiN9VzDVn7M7ezoafG+gWLj0qAEA8CqXbrKV9/5WceAdxainnmxP9PcZY+47Ohjd0jwH+3BUAIO4aabdobtvXScTaJB3f29OVvluyDcx9KgBAfAoo07yptf9axqiDiFbJtPvclu/gjLX3dqZfVWuPVrIKABBZxRTs19+zJzU0nOpkRLcqND+lCSPq2NmV/pEOX/BRXgEAYniGtLTtu4ET6ySipZq7euezLeHNPV3pFzX7hbtpCgAQQ9OhadPBeuaMdhJjNxvq4rhbTg8PZxraP/glGzfaT0SdAxADiW9q338j41xUjbQB96e45ES7Hea07+w84xkb/UWpDwCiMdsXbupL81iqgxP/tka3Eq7YYzw7urn3oaVDEo1gWkaBqgRk/OGYmACJIGU2y2PxSUokOLGKasqI8zhlMjGWnQySPmIsNbdl64I2JrfxVDSZboMr9fMpQOaotke7iiiQqbktm6xIzz46BSA+xENTKQUAiJRcPoxRQXyIV7mmAMSW9gDEltJa+wEgWuUs4wyA2FJaaz8ARKucAMSWnLb6ASC2lEYFsaW01n4AiFY5UUFsyWmrHwCiQ+nJ7dfdQMTKn3odHryMi+dhuKpHAUaczZr3SrkB54ieTK554fEgBRW45yBTgDwdJJEwFjsK5IhuAiAuWgMQO5MxiL0AEA9ZASAeRAqpCQDxkFgA4kGkkJoAEA+JBSAeRAqpCQDxkFgA4kGkkJoAEA+JBSAeRAqpCQDxkFgA4kGkkJoAECLae3TyZoexr5bKcWy8f3F87MNLQjoHEFYZBTKpxu25msV7Spk4E86dZ9Sz3TZFtP6g8BggxB6zGST6CocCTsZZBkDCkUtEYUABAGJAVLgMjwIAJDy5RCQGFAAgBkSFy/AoAEDCk0tEYkABAGJAVLgMjwIAJDy5RCQGFAAgBkSFy/AoAEDCk0tEYkABAGJAVLgMjwIAJDy5RCQGFAAgBkSFy/AoAEACkMtsjtPWvgnaM5Clw+OcZiStn+e0qsLYJKf6FKNz5sVp7VnB/joBALE6NYp39sgbI9R3MHDfnrGiTPPCBH3rglorfal0AkBUVNPY5l97M/T7f49q9Fh9rm7/ch0tnhML5MAjAcjre8Z/3Lgg/kAQM/Dcu2P02kcTQRyatTF94/xaWrM4UF+3OxH7M9uOXvbDa2ZvsyYGEVm9wW5q7b91w+ra7juunxXIm91n3x2jf0QckBvOS9HFSwKZHrrlwcGRfYOT7T3d6UdsQWIFkJZN+1Zyh3USo2uvbknRpq/PthWfVD8AhCjIgNz04ADtP5glTvRCjPjmHV0L35NKsIKxcUCa2/rbiEh8M/zYBUAUsmSxSTUAMiVHjjjf3NO9sNukPMYA+WLrgWaHZQUYV04PAICYTKd/31UESD7Yv3In1t7bsaDXf/SnejACSEv7/i2ffZ7g/mIDBiAm0qjPZxUCcix4TmxLb1fDz/QpcdyTVkCaWveuZYx1ELG1pQYKQHSnUK+/agXkOCXsNXImN/d0Ln5dlyraAGlu238fEb/LbWBBBgTbvERB3ubNL9Ld5hgRv7+na+FP3O3cLXwD0tK+/0pOvIM4tbh3F+xF+s59GfrtW9F+UHjH2jpaNDuYDwq9AyKqCd/pEGvf0Z0u+1UrtznrC5Dmtn2dREzsUnm+glxBRBCPbh+h3YPRPGpy0aIEffMLwT1qIgXI1IxkjDp3dqY3e56gBYZKgDS19l/LGHUQ0SrZjoMOiIjnb+Kw4uDk8cOKCSWJZGWpmP34JKc5KUbLT0/Q6oA+Qc+LowLIVNtdnNPm3u70n2SFVsr+7c8PZfd8kHH2/k/+N201ACIrIuztKKAKyKoVSWpZmeRt62Y5siNVAqTtpcOZGOPxyRzR++9NkAwoAEQ2RbBXrSDLlyXp0uYamlXjUCbL+fdW19kC5FAmxujEZ5gPDefovXcn6PBQzjWbAMRVIhiUUMBrBVm4ME5XX1xLc2Z8zkNFARHxTOaIDwxkWd+eTFlQAAjmv6oCboDMrndowyUzqKH+1F24igOSD1rcdg0MZOmtnvGiOgAQ1emBdqUASaYYbbislhrnlz6mHxhA3EABIJjoqgoUA+SyS2vp/MUJSsTKL6etAtL64qFc3PF2TKWwogAQ1emBdtMBWbYiQWcuSdDK0+OucAjlJrKcvr+6TnpTSrqB6Kz1pUO5OPMGyPSKIna8zlsQD+zfg2AKBlsBAUisjtHyc5MUn1p/nzM3JIDkpc9yossbk7Q6oH+1FuwpEt3RfTyUpSd7RihV8OA2dIDkU1yXYLRhRYqWFNlxiO40QOSFCggwXvzPGB3N8KLihBYQEa0IuWGmQ+saa7SCcnA0Rzv2Zkj8j8u8AqfVOnThogSJ/3VdAoxtfeP0yZHyOQw1IHkx86Dc2DRDi74PbD0COLQo6d2JroOOXsHIjywSgOgG5dHtR2n3YNZ7dmHpWwEdgDzVO+JaMQoHGilAdIEibq0+HMzSEG6xfE98rw6+cnaNV9NT7MTL+j4aypLLo4zorUHcFBW3Xi2LkrR+aTDf0+Q2fvy8vAL//HiCtn00Ife8oMBlJCtIoawClHVnYWs4LMCJdcYfdo1STsMeCgCZNiuwNVzdiLht2apEB0AKVDO1NaySHLTxpoDszpQ3r8etAEgJtXRvDcskBbbeFDAJRn4EAMQlFwDF22S1baWyZasyRgDiUTWA4lEow2YCjH3DOaUtW5WhARBJ1QQoK+Yn6LoV6vvykl3CnIh0bNmqCAlAVFSbOueFrWFF8SSa6dyylej2hCkAUVFtWpvRDKcjE5zEMXtc+hQQT71nJhnVVvi9YQBEQ04FHAIU8Q+g+BNUgCGgEHAE4QIgGrOQB0VUFFxyCgQNDGzzyuVPylrgMa/WoetXpaTaRdX4uV1jNBjQg5+oIAZnJbaGy4tre8tWJdUAREU1yTbYGj5ZsEpt2Uqm7Zg5AFFRTbFN1E8NV3rLViVtAERFNZ9tonZqWIDxx12j4vWxVXcBkAqlTFSTubUOXbVM7wslKhRO0W5tHCY0HS8AMa2wi/8wLuTDAAa2eSsMRmH3YQHF1ilbW+lDBbGltMd+qhWUatiy9ZiCk8wAiIpqFtrkONGiOTFaszjYL5R4/9MMvXNgkpxgnAzRnhkAol1SvQ7F8ZVDYzmaCNhruMTREPFxzqTKu3T0SmTUGwAxKq8+50E5NRyUU7b6lC3vCYDYUlpDP6Ka5HLixDAjZvmWhnMiRpxq4pY71qCbHxcAxI96FWprcyEfpi1blXQBEBXVAtLGNChh27JVSRsAUVEtYG10gxLWLVuVtAEQFdUC2sbvqeFqOmVrKwUAxJbSFvuRPTUs1hm/e3uEPH431WIkle8KgFQ+B8ZGIE4Nr1uapJULin/fu5pP2RoTrcAxALGldIX6EdVkZsH3GqO+MyWTCgAio1YV2wpQlsyJUSbLpb+yVMVh+x46APEtYXU4EB+6Hxzlx17ZGaTX6gRdPQAS9AxpGJ94DVHhq4jEe6eC8u4pDSEacwFAjElbecfiaMrgSK7ky+yicuDQTyYAiB/1Aty2WNUoNVxUk9KJBCABnuQqQ1M9Ho9qUlxtAKIyCwPaRqZqFAsBC/hTVQEgAZ3sMsNSrRql+hCgzJ3hWPtIjUystm0BiG3FNffnt2qUgwTbwXizoubpas+d7qqBaoI1iL3Za7gnU1UD1QRrEMNT16x7W1UD1eRzBbAGMTuntXkXL204NF75D/NEbacLgGibwmYcVbpqlIoqGROv/Qn/ThcAMTOvtXjNHzDU4syAkyhUEwBiYOL4dRnUqlEqrvx2cBjfIQdA/M5mze2DXjWittMFQDRPcD/ubG/f+hlrqbZhO/gIQEzMEkmfomocGgvPN9bDdPARgEhOZt3mYagaYa4mAET3jPfoz+2PmTy6CbxZtVcTAFKBKRbmqlFMzmreDgYgFgGptu1b3dJU4zF6AKJ7FpTwF7WqEZbtYABiGJCoV41yoFTDH2UBEIOAoGqUF7ca1iYAxAAgqBpyogZ5bQJA5HLpah2UY+muAw2YQVCrCQDRNFFQNfQIGbRj9ABEQ16r9YChhtCNuAhSNQEgPlKMquFDPA9Ng3CMHoB4SFQxE1QNReEkm1W6mgAQyYSJqiEW4oVvS5d0A3NJBSp1jB6ASCQKVUNCLAOmlTj4CEA8JhIP/TwKZcHMZjUBIC4JjcqxdAvzWmsXtqoJACmTNlQNrXNauzMbC3gAUiRtqBra57JRhyaPqgCQgtShahidy8acm6omAGQqZXjoZ2zuWnWsu5oAEKJjzzTwXMPqPDbamc5qEmlAUDWMztOKO9dRTQIJyO3PD2Vrk8wxqTCqhkl1g+PbbzVZNT/hKZgjEzx325fqYp6Mpxkx2QbC/gdPD03Mnsm8jUyyA1QNScFCYq5yjD4RYyQqiJdr78HJiS1Xza7xYjvdRgmQjU8NjM6fF0/JduZmjz9mclMo3D+XrSYzkg41zvFWFHYfyAzfe82c2bIKKgHytV98OrDy3ORc2c5K2aNq6FIyHH68HqOfX+fQ/BneAHl55+h/f33LvOWyCikBcsV9n/Q3X5RqiGtYheCAoWzKomHvpZrILNAf+c3hV3u60lfIqqcESHNb/56zz002Lj3T2/1fsUGhasimKpr2pQ4+ylSPrW+OUe/b41YBeYWI1l+6PkW1SfkygqoRzcmuGnVhNZFZnA+P5ehXTw8TI3piZ1d6o+wYlCpIU2v/3YzRPbPrHbp4jdxaHdu3simCfV6BfDURC3OxQHe7xC/iJ54dptFRTpzTPb3d6Z+6tSn8uRog7f3rGSdRRUhAckFT0rWShO0bG7JCw96/Aqk4o1Xz41SfcofjyESOnn95hA4MZI91zDlt7O1OPyE7CjVANvU3shjtyXcmIGlcmqAz5hffUUDVkE0L7AsVqK91qKXB26O3vk8z9OyfR05ywbO0tPehdJ+ssn4AeVysQ6Z3KEBZ0BCnuac5lKwhSiYcGhzJkViQ44ICsgqkZ8WovobRabUOiepR6jo6kaPhEU4HR3LU+9b4iaoxzV5pgS7aKwEiGjYVVBHZ4GEPBWwpwBld0duZflWlP2VARGctbf2Pc6LvqnSMNlDAhgKqi/P82HwBMlVFxGK90Uaw6AMKSCrQ19OVXirZ5iRzX4Dkb7XIoe+IbV8/A0FbKKBTAb+VQ0sFmR5Q/tmIziDhCwooKNDHGW1UXXMU9ue7gpwEyab+47daDq13GF3OceulkF80kVWAczq+AHdoqy4wtFcQ2aBgDwWqQQGtFaQaAsYYoYCMAgBERi3YRk4BABK5lCNgGQUAiIxasI2cAgAkcilHwDIKABAZtWAbOQUASORSjoBlFAAgMmrBNnIKAJDIpRwByygAQGTUgm3kFAAgkUs5ApZRAIDIqAXbyCkAQCKXcgQsowAAkVELtpFTAIBELuUIWEYBACKjFmwjpwAAiVzKEbCMAgBERi3YRk6B/wPA8GVBLAoiTAAAAABJRU5ErkJggg=="/>
+</defs>
+</svg>

src/assets/svg/culture/nav_ban.svg

+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1712731651220"
+	class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5138"
+	xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200">
+	<path
+		d="M624.500364 925.184a204.8 204.8 0 0 0 233.192727-333.312l-233.192727 333.265455z m-45.149091-32.954182l232.029091-331.543273a204.8 204.8 0 0 0-231.982546 331.543273zM426.356364 571.485091c-181.434182 37.469091-280.994909 152.389818-302.638546 350.533818a27.927273 27.927273 0 0 1-55.528727-6.050909c21.504-196.654545 115.898182-325.026909 280.389818-381.207273a283.927273 283.927273 0 1 1 419.374546-109.149091 27.927273 27.927273 0 0 1-50.269091-24.203636 228.072727 228.072727 0 1 0-282.670546 115.898182 27.927273 27.927273 0 0 1-8.657454 54.178909zM721.454545 1005.381818a260.654545 260.654545 0 1 1 0-521.309091 260.654545 260.654545 0 0 1 0 521.309091z"
+		p-id="5139"></path>
+</svg>

src/assets/svg/culture/personal _practice.svg

+<svg width="58" height="53" viewBox="0 0 58 53" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M26.0161 14.9783L26.5779 14.7892C29.4168 13.8313 32.5493 15.3611 33.5575 18.2085L33.8919 19.1551L33.8932 19.1557L37.7455 30.0372C38.707 32.7535 37.2913 35.6961 34.5833 36.6098L34.5626 36.6158L34.5611 36.6174L30.8579 37.8669C30.8546 37.868 30.8507 37.8683 30.8474 37.8694L25.8915 39.5421C23.0526 40.4999 19.92 38.9702 18.9119 36.1228L15.1614 25.5284L14.7239 24.2941C13.7624 21.5778 15.1781 18.6352 17.8861 17.7215L17.9083 17.7139L26.0161 14.9783Z" fill="url(#paint0_linear_4018_5804)"/>
+<g opacity="0.5" filter="url(#filter0_f_4018_5804)">
+<path d="M31.3135 32.7553L29.2421 33.46C27.5622 34.0316 25.7122 33.8697 24.1478 33.0142C22.7689 32.2602 21.718 31.025 21.1999 29.5492L19.7249 25.3479C19.1557 23.7267 19.9692 21.979 21.542 21.4439L26.5903 19.7265C28.2393 19.1655 30.068 20.0874 30.6647 21.787L33.1388 28.834C33.7079 30.4552 32.8927 32.2181 31.3135 32.7553Z" fill="#E46800"/>
+</g>
+<foreignObject x="-1.33594" y="-5.33301" width="69.5801" height="72.833"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(12px);clip-path:url(#bgblur_0_4018_5804_clip_path);height:100%;width:100%"></div></foreignObject><path data-figma-bg-blur-radius="24" d="M43.9932 37.6494C43.9932 40.7442 41.4705 43.25 38.3613 43.25H28.8213C25.5691 43.25 22.9142 40.626 22.9141 37.3877L22.9141 24.541C22.9143 21.4469 25.4481 18.9171 28.5693 18.917H37.4697L37.5205 18.9219C37.5701 18.9322 37.616 18.9577 37.6514 18.9951L43.9248 25.6387C43.9686 25.6851 43.9932 25.7467 43.9932 25.8105V37.6494Z" fill="url(#paint1_linear_4018_5804)" fill-opacity="0.3" stroke="url(#paint2_linear_4018_5804)" stroke-width="0.5" stroke-linecap="round" stroke-linejoin="round"/>
+<foreignObject x="21.1621" y="5.64258" width="35.9727" height="36.1279"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(7.5px);clip-path:url(#bgblur_1_4018_5804_clip_path);height:100%;width:100%"></div></foreignObject><g filter="url(#filter3_d_4018_5804)" data-figma-bg-blur-radius="15">
+<path d="M38.5796 26.7611C39.415 26.7694 40.5764 26.773 41.5616 26.7694C42.0662 26.7683 42.3227 26.1688 41.9727 25.8078C40.7071 24.4993 38.443 22.1577 37.1473 20.8183C36.789 20.4477 36.1621 20.7027 36.1621 21.2163V24.3575C36.1621 25.6755 37.254 26.7611 38.5796 26.7611Z" fill="url(#paint3_linear_4018_5804)"/>
+<path d="M36.3623 21.2158C36.3627 20.8819 36.7709 20.7161 37.0039 20.957L41.8291 25.9473C42.0537 26.1792 41.8926 26.5683 41.5615 26.5693C40.5773 26.5729 39.4164 26.5699 38.582 26.5615H38.5801C37.3638 26.5615 36.3623 25.5639 36.3623 24.3574V21.2158Z" stroke="url(#paint4_linear_4018_5804)" stroke-width="0.4"/>
+</g>
+<defs>
+<filter id="filter0_f_4018_5804" x="0.542969" y="0.5625" width="51.7773" height="52.2344" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="9.5" result="effect1_foregroundBlur_4018_5804"/>
+</filter>
+<clipPath id="bgblur_0_4018_5804_clip_path" transform="translate(1.33594 5.33301)"><path d="M43.9932 37.6494C43.9932 40.7442 41.4705 43.25 38.3613 43.25H28.8213C25.5691 43.25 22.9142 40.626 22.9141 37.3877L22.9141 24.541C22.9143 21.4469 25.4481 18.9171 28.5693 18.917H37.4697L37.5205 18.9219C37.5701 18.9322 37.616 18.9577 37.6514 18.9951L43.9248 25.6387C43.9686 25.6851 43.9932 25.7467 43.9932 25.8105V37.6494Z"/>
+</clipPath><filter id="filter3_d_4018_5804" x="21.1621" y="5.64258" width="35.9727" height="36.1279" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dx="5" dy="5"/>
+<feGaussianBlur stdDeviation="5"/>
+<feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 0.537255 0 0 0 0 0.160784 0 0 0 0.2 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_4018_5804"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_4018_5804" result="shape"/>
+</filter>
+<clipPath id="bgblur_1_4018_5804_clip_path" transform="translate(-21.1621 -5.64258)"><path d="M38.5796 26.7611C39.415 26.7694 40.5764 26.773 41.5616 26.7694C42.0662 26.7683 42.3227 26.1688 41.9727 25.8078C40.7071 24.4993 38.443 22.1577 37.1473 20.8183C36.789 20.4477 36.1621 20.7027 36.1621 21.2163V24.3575C36.1621 25.6755 37.254 26.7611 38.5796 26.7611Z"/>
+</clipPath><linearGradient id="paint0_linear_4018_5804" x1="45" y1="34" x2="18" y2="34.5" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFB37F"/>
+<stop offset="1" stop-color="#FF7B0D"/>
+</linearGradient>
+<linearGradient id="paint1_linear_4018_5804" x1="41.3482" y1="41.7461" x2="32.6843" y2="19.3796" gradientUnits="userSpaceOnUse">
+<stop offset="0.00365973" stop-color="#FFF0E8"/>
+<stop offset="1" stop-color="#FFE1B9"/>
+</linearGradient>
+<linearGradient id="paint2_linear_4018_5804" x1="25.3873" y1="22.7958" x2="50.6779" y2="39.2355" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+<linearGradient id="paint3_linear_4018_5804" x1="39.0639" y1="21.0786" x2="34.9849" y2="24.9074" gradientUnits="userSpaceOnUse">
+<stop offset="0.0769312" stop-color="white"/>
+<stop offset="0.653862" stop-color="white" stop-opacity="0.2"/>
+</linearGradient>
+<linearGradient id="paint4_linear_4018_5804" x1="39.0639" y1="21.5692" x2="46.385" y2="29.6425" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+</defs>
+</svg>

src/assets/svg/culture/points_store.svg

+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="2.0957" y="8.7959" width="27.8093" height="7.58436" rx="3.79218" fill="white"/>
+<rect opacity="0.3" x="12.8398" y="3" width="6.95233" height="3.57373" rx="1.78686" transform="rotate(45 12.8398 3)" fill="white"/>
+<rect opacity="0.3" width="6.95233" height="3.57373" rx="1.78686" transform="matrix(-0.707107 0.707107 0.707107 0.707107 19.0195 3)" fill="white"/>
+<path d="M21.376 11.9561C24.6897 11.9561 27.376 14.6423 27.376 17.9561V22.3887C27.376 25.7024 24.6897 28.3887 21.376 28.3887H10.623C7.30934 28.3887 4.62305 25.7024 4.62305 22.3887V17.9561C4.62305 14.6423 7.30934 11.9561 10.623 11.9561H21.376ZM16 18.3975C15.488 18.3975 15.0723 18.8123 15.0723 19.3242V22.1045C15.0723 22.6164 15.488 23.0322 16 23.0322C16.5118 23.032 16.9268 22.6163 16.9268 22.1045V19.3242C16.9268 18.8124 16.5118 18.3977 16 18.3975Z" fill="white"/>
+</svg>

src/assets/svg/culture/sign_in.svg

+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect opacity="0.4" x="7.13672" y="4" width="3.54545" height="8.86364" rx="1.77273" fill="#FFFEEB"/>
+<rect opacity="0.4" x="21.3184" y="4" width="3.54545" height="8.86364" rx="1.77273" fill="#FFFEEB"/>
+<path d="M27 8.72754C28.1046 8.72754 29 9.62297 29 10.7275V24.4551C28.9999 25.5595 28.1045 26.4551 27 26.4551H5C3.89552 26.4551 3.00014 25.5595 3 24.4551V10.7275C3 9.62297 3.89543 8.72754 5 8.72754H27ZM20.8428 14.2246C20.4522 13.8346 19.8191 13.8343 19.4287 14.2246L15.4082 18.2441L13.1611 15.9971C12.7706 15.6072 12.1374 15.6069 11.7471 15.9971C11.3567 16.3874 11.3571 17.0206 11.7471 17.4111L14.7012 20.3662C15.0917 20.7567 15.7257 20.7567 16.1162 20.3662L20.8428 15.6387C21.2333 15.2481 21.2333 14.6151 20.8428 14.2246Z" fill="white"/>
+</svg>

src/assets/svg/culture/small_coin.svg

+<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M0.367872 9.07337C0.237455 8.80124 0.188706 8.50579 0.129829 8.21475C-0.00628665 7.54637 -0.036042 6.87232 0.0437278 6.19449C0.0684185 5.98724 0.0975408 5.78062 0.122865 5.57336C0.130462 5.51226 0.174145 5.45997 0.164649 5.39572C0.201368 5.24327 0.237455 5.09019 0.282404 4.94089C0.333685 4.77143 0.390663 4.60072 0.457138 4.43567C0.656563 3.93675 0.900937 3.46113 1.20482 3.01639C1.7841 2.16721 2.52672 1.49253 3.41369 0.972192C3.43774 0.958333 3.45927 0.940694 3.48206 0.924945C3.7315 0.817223 3.96385 0.674224 4.21518 0.569652C5.01985 0.235778 5.8549 0.0373428 6.7273 0.00521529C7.31418 -0.0162031 7.89663 0.0272636 8.47084 0.155774C9.10014 0.296253 9.70981 0.494058 10.2821 0.794545C10.6626 0.99487 11.0241 1.22669 11.3615 1.49442C11.4337 1.55175 11.4983 1.61852 11.566 1.68089C11.5432 1.69664 11.516 1.70798 11.4983 1.72813C11.3489 1.89507 11.1982 2.06138 11.0539 2.23273C11.0108 2.28375 11.0108 2.35116 11.0697 2.39714C11.1248 2.44061 11.1881 2.4362 11.2375 2.38706C11.3008 2.3247 11.3615 2.25918 11.4179 2.18989C11.5205 2.0639 11.6414 1.95429 11.7338 1.82074C11.8839 1.91649 11.9934 2.05508 12.1206 2.1754C12.1542 2.2069 12.1846 2.24217 12.2162 2.27556C12.2219 2.28186 12.2276 2.28816 12.2333 2.29383C12.2396 2.30013 12.2453 2.3058 12.2517 2.3121C12.258 2.3184 12.2637 2.3247 12.27 2.331C12.2764 2.3373 12.2827 2.3436 12.2884 2.3499C12.2916 2.38706 12.3201 2.40596 12.3428 2.43116C12.4657 2.56849 12.5828 2.71023 12.6796 2.86772C12.6214 2.8652 12.5714 2.88851 12.5245 2.91937C12.3884 3.00883 12.2504 3.09639 12.1162 3.18899C12.0738 3.21797 12.0364 3.25703 12.0035 3.29671C11.9731 3.33451 11.963 3.38239 11.9946 3.42522C12.0269 3.46869 12.0744 3.48444 12.1263 3.46869C12.158 3.45924 12.189 3.44223 12.2169 3.42459C12.3106 3.36475 12.41 3.31183 12.4929 3.24002C12.5847 3.16002 12.7202 3.13671 12.7797 3.01702C12.8759 3.10647 12.931 3.2249 12.9975 3.33388C13.1823 3.63815 13.3488 3.95249 13.4704 4.28826C13.4033 4.23786 13.3343 4.25424 13.2703 4.29015C13.2266 4.31472 13.1817 4.33236 13.1355 4.34999C13.0114 4.39661 12.8879 4.44638 12.7658 4.49866C12.6942 4.52953 12.6461 4.58119 12.6727 4.6656C12.6936 4.73238 12.767 4.74812 12.8639 4.71159C12.9911 4.66371 13.1178 4.61457 13.245 4.56607C13.3153 4.53961 13.3564 4.56607 13.3786 4.63473C13.4894 4.97491 13.5767 5.32012 13.6356 5.67289C13.6521 5.76991 13.6318 5.79321 13.535 5.80833C13.4128 5.82723 13.2906 5.84676 13.1684 5.86566C13.0912 5.87763 13.0399 5.92046 13.0437 5.99984C13.0481 6.0874 13.1133 6.10756 13.1899 6.10189C13.2178 6.1 13.2456 6.09748 13.2729 6.0937C13.3799 6.07921 13.4868 6.0622 13.5945 6.04961C13.6413 6.04394 13.6882 6.04583 13.6939 6.11449C13.7135 6.35639 13.7394 6.59829 13.7382 6.84145C13.7375 6.95485 13.7312 7.06887 13.735 7.18226C13.7382 7.2799 13.7224 7.30069 13.6223 7.30573C13.4919 7.31329 13.3634 7.28494 13.2336 7.2862C13.1576 7.2862 13.0969 7.30762 13.0905 7.39581C13.0855 7.47141 13.1342 7.51613 13.2266 7.52558C13.3495 7.53818 13.4729 7.55204 13.5957 7.56275C13.6578 7.56842 13.6825 7.59614 13.6768 7.65913C13.6432 8.02199 13.5495 8.37224 13.4533 8.72249C13.4305 8.80565 13.3862 8.82643 13.302 8.80754C13.1982 8.78423 13.1051 8.7332 13.0032 8.708C12.9025 8.6828 12.8417 8.70485 12.8196 8.77919C12.7923 8.8699 12.8531 8.91085 12.9234 8.93668C13.0279 8.97573 13.1336 9.00912 13.2393 9.04314C13.3077 9.06519 13.3292 9.09605 13.3001 9.17291C13.1646 9.53072 12.9994 9.87341 12.8101 10.2054C12.7676 10.2804 12.7373 10.2728 12.6746 10.2369C12.5676 10.1752 12.4714 10.0945 12.3536 10.0536C12.2954 10.0334 12.227 10.0189 12.1922 10.0933C12.1592 10.1632 12.1865 10.2193 12.2491 10.2589C12.3352 10.3131 12.4232 10.3654 12.5087 10.4202C12.6201 10.492 12.6208 10.4996 12.5461 10.613C12.5207 10.6514 12.498 10.6924 12.4707 10.7289C12.2643 11.0061 12.0453 11.2719 11.7978 11.5144C11.7503 11.5611 11.7053 11.5585 11.6616 11.5125C11.5831 11.4294 11.5072 11.3444 11.4274 11.2631C11.3615 11.1957 11.2837 11.1856 11.2305 11.2335C11.1786 11.2801 11.1836 11.3595 11.247 11.4319C11.3122 11.5062 11.3793 11.5787 11.4457 11.6511C11.5363 11.7494 11.5356 11.7715 11.4344 11.8584C11.2406 12.026 11.0494 12.196 10.8291 12.3296C10.7183 12.397 10.6234 12.4883 10.505 12.545C10.4309 12.5803 10.3841 12.5639 10.348 12.4896C10.2998 12.3901 10.2473 12.2918 10.1916 12.196C10.1447 12.1142 10.0681 12.0864 10.0067 12.1261C9.93392 12.1734 9.94152 12.2383 9.97634 12.305C10.0358 12.4197 10.096 12.5343 10.158 12.6477C10.1802 12.688 10.1865 12.7164 10.1352 12.7447C9.76425 12.9514 9.373 13.1101 8.96909 13.2392C8.89755 13.2626 8.86083 13.2455 8.84437 13.1681C8.81714 13.0383 8.78549 12.9098 8.74687 12.7832C8.71648 12.6817 8.61076 12.6553 8.54428 12.7271C8.50376 12.7712 8.51199 12.8247 8.52465 12.8764C8.55251 12.9929 8.58163 13.1095 8.61265 13.2254C8.63101 13.2928 8.62025 13.3325 8.54301 13.3558C8.43855 13.3873 8.33029 13.393 8.22457 13.4163C7.90422 13.4881 7.57755 13.5164 7.25024 13.5334C7.13438 13.5391 7.12172 13.5246 7.12045 13.41C7.11919 13.2808 7.12298 13.1511 7.11602 13.0219C7.11032 12.9142 7.05334 12.8707 6.95965 12.8896C6.87671 12.9066 6.86595 12.9728 6.86405 13.0389C6.86025 13.1681 6.85898 13.2978 6.86215 13.427C6.86405 13.5076 6.83049 13.536 6.75199 13.5353C6.59119 13.5341 6.43101 13.5303 6.27021 13.5171C6.03913 13.4982 5.81058 13.4578 5.58013 13.4326C5.50606 13.4245 5.47757 13.3885 5.49847 13.3136C5.52252 13.2279 5.54215 13.1403 5.56304 13.054C5.5814 12.9759 5.60103 12.8984 5.59723 12.8172C5.5947 12.7624 5.56874 12.7214 5.51303 12.7095C5.45795 12.6975 5.41553 12.7221 5.38957 12.7706C5.37501 12.7977 5.36362 12.8266 5.35602 12.8562C5.32183 12.9904 5.29018 13.1252 5.25789 13.26C5.2427 13.323 5.21547 13.3539 5.1395 13.335C4.76091 13.2411 4.38802 13.1303 4.03222 12.9677C3.92649 12.9192 3.92143 12.9136 3.97461 12.8096C4.04488 12.6729 4.11452 12.5356 4.181 12.3964C4.22215 12.3101 4.20379 12.2414 4.13351 12.2042C4.05058 12.1601 4.0012 12.2162 3.96764 12.2754C3.90497 12.385 3.84926 12.4984 3.79544 12.6131C3.74036 12.7296 3.66059 12.8342 3.62387 12.9589C3.45231 12.9029 3.31176 12.7901 3.16045 12.6981C3.02687 12.6169 2.89961 12.5243 2.76983 12.4361C2.76793 12.4304 2.76413 12.4266 2.7578 12.426C2.74767 12.4191 2.73691 12.4128 2.72678 12.4058C2.67993 12.3567 2.63245 12.3088 2.57041 12.2779L2.56977 12.2773C2.55268 12.249 2.52736 12.232 2.4957 12.2225C2.48367 12.2005 2.46468 12.1879 2.44125 12.1822C2.42353 12.1589 2.40643 12.1356 2.38871 12.1123C2.421 12.1085 2.44569 12.0927 2.46658 12.0675C2.56471 11.9497 2.666 11.8332 2.76223 11.7141C2.81605 11.6474 2.88759 11.5957 2.92684 11.5157C2.95406 11.4596 2.96419 11.4111 2.90911 11.3677C2.8534 11.3236 2.79515 11.3217 2.73944 11.3651C2.71538 11.3834 2.69766 11.4099 2.67803 11.4332C2.56914 11.5629 2.45961 11.6921 2.35136 11.8219C2.3102 11.871 2.26146 11.9163 2.25323 11.985C2.04241 11.8269 1.87274 11.6272 1.69864 11.4332C1.48148 11.1906 1.28902 10.9273 1.11112 10.6546C1.10289 10.642 1.09783 10.6268 1.0915 10.613C1.14721 10.613 1.19216 10.5871 1.23521 10.555C1.38335 10.4448 1.5277 10.3282 1.68724 10.2337C1.77207 10.1834 1.79233 10.1033 1.74802 10.0385C1.7075 9.97862 1.63912 9.97421 1.55049 10.0259C1.38779 10.121 1.2523 10.2545 1.08643 10.3459C1.04402 10.3692 1.00856 10.4076 1.00287 10.4618C0.975642 10.4492 0.963613 10.424 0.949685 10.4001C0.773685 10.1002 0.619843 9.78837 0.486894 9.46772C0.437512 9.34866 0.378634 9.22645 0.369138 9.09227C0.404591 9.10298 0.440045 9.1181 0.47803 9.11117C0.69898 9.07211 0.898405 8.96817 1.10986 8.89951C1.1624 8.8825 1.18393 8.82454 1.16747 8.76722C1.15164 8.71304 1.10733 8.6891 1.05288 8.69225C1.01299 8.69477 0.97311 8.7017 0.935124 8.71367C0.83193 8.74643 0.731901 8.78864 0.62744 8.81572C0.491325 8.85163 0.376102 8.90077 0.369138 9.06582C0.369138 9.06834 0.365973 9.07086 0.364073 9.07337H0.367872ZM1.08643 6.90256C1.09593 10.1544 3.71947 12.7473 7.06031 12.7189C10.279 12.6912 12.9266 10.1657 12.8949 6.87358C12.8626 3.56759 10.2745 1.06542 6.97357 1.0692C3.7239 1.07298 1.10479 3.60665 1.08643 6.90256ZM9.901 1.58702C9.95418 1.58262 9.99407 1.5486 10.0194 1.50072C10.1137 1.32056 10.2062 1.13913 10.2992 0.958333C10.3176 0.922425 10.3201 0.889038 10.2904 0.856281C10.2125 0.772497 10.1099 0.785726 10.058 0.886518C10.0453 0.911086 10.0302 0.934395 10.0175 0.958963C9.93962 1.10952 9.85922 1.25819 9.78641 1.41064C9.74463 1.49757 9.80604 1.58828 9.90163 1.58639L9.901 1.58702ZM1.88666 3.49137C1.94934 3.49074 1.98669 3.46743 2.00505 3.41893C2.02848 3.35593 2.01012 3.30112 1.9563 3.26396C1.80436 3.15876 1.65115 3.05481 1.49605 2.95339C1.4321 2.91181 1.36056 2.91055 1.31435 2.97733C1.26813 3.04473 1.29599 3.10836 1.3593 3.15309C1.50807 3.25766 1.65875 3.36034 1.81006 3.46176C1.83475 3.47814 1.86704 3.48444 1.88666 3.49137ZM8.37018 0.911716C8.36828 0.984161 8.38854 1.03771 8.45881 1.05094C8.54238 1.06668 8.58986 1.01125 8.60886 0.943844C8.66267 0.755488 8.70952 0.564613 8.7551 0.373737C8.76396 0.33657 8.7684 0.277984 8.71268 0.281764C8.64937 0.286174 8.55441 0.217509 8.52402 0.313892C8.46134 0.512327 8.40247 0.712651 8.37018 0.912346V0.911716ZM4.17846 1.50765C4.17403 1.46859 4.16897 1.43206 4.15124 1.39867C4.0721 1.24559 3.9936 1.09188 3.91383 0.939434C3.87838 0.871399 3.80874 0.855021 3.73023 0.898487C3.66819 0.933135 3.66186 0.99046 3.68782 1.05031C3.70997 1.10133 3.73783 1.14921 3.76315 1.19834C3.82456 1.31552 3.88471 1.43332 3.94738 1.55049C3.98094 1.61285 4.03855 1.61978 4.09996 1.60655C4.15187 1.59521 4.17657 1.55868 4.17846 1.50828V1.50765ZM0.202001 7.59866C0.406491 7.57409 0.597052 7.55267 0.78698 7.5281C0.855987 7.51928 0.904736 7.48275 0.895872 7.40526C0.886376 7.32526 0.835728 7.2862 0.755325 7.28935C0.705944 7.29124 0.657196 7.29943 0.607815 7.3051C0.4698 7.32148 0.331786 7.33723 0.193771 7.35613C0.1159 7.36683 0.0912098 7.42983 0.098807 7.49157C0.105771 7.54826 0.139958 7.60307 0.202001 7.59929V7.59866ZM2.96166 2.30454C2.95723 2.29257 2.95596 2.268 2.94266 2.25351C2.80908 2.10926 2.68943 1.9524 2.54445 1.81885C2.49317 1.7716 2.43302 1.77916 2.38807 1.82704C2.34439 1.87302 2.314 1.9272 2.37351 1.9883C2.4077 2.02358 2.43682 2.0639 2.46974 2.09981C2.55901 2.19745 2.64764 2.29509 2.73881 2.39021C2.78186 2.43494 2.83757 2.45699 2.89835 2.42864C2.9452 2.40722 2.95913 2.3625 2.96166 2.30454ZM5.29271 0.301923C5.21547 0.301923 5.14646 0.374367 5.16419 0.447442C5.20661 0.623828 5.25219 0.799585 5.30094 0.974082C5.32183 1.04905 5.37565 1.08873 5.45605 1.06605C5.53392 1.04401 5.55228 0.980381 5.53645 0.911716C5.49467 0.73533 5.44655 0.560203 5.4016 0.384446C5.38704 0.327751 5.34906 0.304442 5.29334 0.301923H5.29271ZM1.19279 4.75379C1.2504 4.75379 1.29979 4.73805 1.31878 4.67946C1.33714 4.62339 1.31751 4.57048 1.2656 4.54465C1.0858 4.45457 0.900937 4.37708 0.706577 4.3248C0.628074 4.30401 0.597685 4.3733 0.575527 4.42811C0.553368 4.48354 0.574894 4.52638 0.638203 4.54969C0.748361 4.59001 0.854721 4.6404 0.964879 4.68135C1.03958 4.70907 1.10922 4.75379 1.19279 4.75442V4.75379ZM0.326721 5.82597C0.208965 5.82219 0.186174 5.84739 0.172246 5.96834C0.16085 6.06472 0.230491 6.0622 0.290634 6.07102C0.452706 6.09433 0.614779 6.11638 0.777484 6.13654C0.850289 6.14536 0.916131 6.13276 0.935757 6.04709C0.952851 5.97086 0.916131 5.91669 0.8218 5.89968C0.654663 5.87007 0.48626 5.84991 0.327354 5.8266L0.326721 5.82597ZM6.88304 0.453111C6.88304 0.545084 6.88051 0.637057 6.88368 0.72903C6.88621 0.807144 6.94319 0.872659 7.00396 0.86573C7.08437 0.85691 7.12172 0.802735 7.12298 0.72651C7.12488 0.545714 7.12298 0.364288 7.12488 0.183492C7.12552 0.0984482 7.07107 0.0934086 7.00713 0.0934086C6.94129 0.0934086 6.87988 0.0934086 6.88241 0.185382C6.88431 0.274205 6.88241 0.363028 6.88241 0.452481L6.88304 0.453111Z" fill="#F8D05C"/>
+<path d="M11.7339 1.82149C11.6415 1.95504 11.5199 2.06465 11.418 2.19064C11.3617 2.25931 11.3015 2.32545 11.2376 2.38782C11.1876 2.43695 11.1249 2.44136 11.0698 2.3979C11.0109 2.35191 11.0109 2.2845 11.054 2.23348C11.1983 2.06213 11.3484 1.89582 11.4984 1.72889C11.5161 1.70873 11.5434 1.69739 11.5662 1.68164C11.6225 1.72826 11.6782 1.77487 11.7346 1.82149H11.7339Z" fill="#F5BD3C"/>
+<path d="M12.2898 2.35093C12.2835 2.34463 12.2772 2.33833 12.2715 2.33203C12.2778 2.33833 12.2841 2.34463 12.2898 2.35093Z" fill="#747473"/>
+<path d="M12.2339 2.29464C12.2282 2.28834 12.2225 2.28204 12.2168 2.27637C12.2225 2.28267 12.2282 2.28897 12.2339 2.29464Z" fill="#747473"/>
+<path d="M3.6269 12.9585C3.66362 12.8331 3.74402 12.7292 3.79847 12.6127C3.85228 12.4986 3.90799 12.3846 3.97067 12.275C4.00486 12.2158 4.0536 12.1597 4.13654 12.2038C4.20681 12.241 4.22517 12.3097 4.18402 12.396C4.11755 12.5345 4.04791 12.6719 3.97763 12.8092C3.92382 12.9138 3.92952 12.9194 4.03525 12.9673C4.39104 13.1299 4.76394 13.2401 5.14253 13.3346C5.21786 13.3535 5.24572 13.3226 5.26091 13.2596C5.2932 13.1248 5.32549 12.99 5.35904 12.8558C5.36664 12.8262 5.37804 12.7972 5.3926 12.7701C5.41856 12.7223 5.46097 12.6977 5.51605 12.709C5.57176 12.721 5.59772 12.762 5.60025 12.8168C5.60405 12.8974 5.58443 12.9755 5.56607 13.0536C5.54517 13.1406 5.52618 13.2275 5.50149 13.3132C5.47997 13.3881 5.50845 13.424 5.58316 13.4322C5.81361 13.4581 6.04215 13.4977 6.27323 13.5166C6.43404 13.5299 6.59421 13.5337 6.75502 13.5349C6.83352 13.5355 6.86771 13.5072 6.86518 13.4266C6.86201 13.2974 6.86328 13.1676 6.86707 13.0385C6.86897 12.973 6.87974 12.9062 6.96267 12.8892C7.05637 12.8703 7.11335 12.9138 7.11905 13.0215C7.12601 13.1506 7.12221 13.2804 7.12348 13.4095C7.12474 13.5236 7.13677 13.5387 7.25326 13.533C7.58057 13.516 7.90725 13.4877 8.22759 13.4158C8.33332 13.3919 8.44158 13.3869 8.54604 13.3554C8.62328 13.3321 8.63404 13.293 8.61568 13.225C8.58403 13.1091 8.55554 12.9925 8.52768 12.876C8.51565 12.8243 8.50679 12.7708 8.54731 12.7267C8.61378 12.6549 8.71951 12.6813 8.7499 12.7827C8.78788 12.9094 8.82017 13.0385 8.84739 13.1676C8.86385 13.2458 8.90057 13.2621 8.97211 13.2388C9.37603 13.1091 9.76728 12.9509 10.1383 12.7443C10.1889 12.716 10.1826 12.6883 10.1611 12.6473C10.0997 12.5333 10.0395 12.4193 9.97937 12.3046C9.94455 12.2378 9.93695 12.173 10.0098 12.1257C10.0712 12.086 10.1471 12.1137 10.1946 12.1956C10.2503 12.2914 10.3029 12.3897 10.351 12.4892C10.3871 12.5635 10.4339 12.5799 10.508 12.5446C10.6264 12.4879 10.7207 12.3966 10.8321 12.3292C11.0518 12.1956 11.2437 12.0255 11.4374 11.858C11.5387 11.7704 11.5393 11.749 11.4488 11.6507C11.3817 11.5783 11.3146 11.5058 11.25 11.4315C11.1867 11.3597 11.1816 11.2797 11.2335 11.2331C11.2867 11.1858 11.3639 11.1953 11.4304 11.2627C11.5102 11.3446 11.5862 11.4296 11.6647 11.5121C11.7083 11.5588 11.7527 11.5613 11.8008 11.514C12.0477 11.2715 12.2674 11.005 12.4738 10.7285C12.501 10.6913 12.5238 10.651 12.5491 10.6126C12.6238 10.4992 12.6232 10.4916 12.5117 10.4198C12.4263 10.3644 12.3383 10.3127 12.2522 10.2585C12.1895 10.2188 12.1623 10.1628 12.1952 10.0929C12.23 10.0179 12.2984 10.0324 12.3566 10.0532C12.4744 10.0941 12.5713 10.1747 12.6776 10.2365C12.7397 10.2724 12.77 10.2799 12.8131 10.205C13.0024 9.87237 13.1676 9.52968 13.3031 9.17249C13.3322 9.09564 13.3107 9.06477 13.2423 9.04272C13.1366 9.00807 13.0302 8.97469 12.9264 8.93626C12.8561 8.9098 12.7954 8.86949 12.8226 8.77877C12.8447 8.70507 12.9062 8.68302 13.0062 8.70759C13.1081 8.73279 13.2012 8.78444 13.305 8.80712C13.3892 8.82602 13.4335 8.8046 13.4563 8.72208C13.5525 8.37182 13.6462 8.02157 13.6798 7.65872C13.6855 7.59572 13.6614 7.568 13.5988 7.56234C13.4753 7.55163 13.3525 7.53777 13.2297 7.52517C13.1372 7.51572 13.0885 7.47099 13.0936 7.3954C13.0999 7.3072 13.1607 7.28642 13.2366 7.28579C13.3664 7.28453 13.4949 7.31287 13.6254 7.30531C13.7247 7.29964 13.7412 7.27949 13.738 7.18184C13.7342 7.06845 13.7406 6.95506 13.7412 6.84104C13.7431 6.59788 13.7165 6.35598 13.6969 6.11408C13.6912 6.04541 13.645 6.04415 13.5975 6.04919C13.4899 6.06116 13.3829 6.0788 13.2759 6.09329C13.248 6.09707 13.2208 6.09959 13.193 6.10148C13.1163 6.10715 13.0511 6.08699 13.0467 5.99942C13.0423 5.92005 13.0936 5.87721 13.1714 5.86524C13.2936 5.84635 13.4158 5.82682 13.538 5.80792C13.6348 5.79343 13.6551 5.76949 13.6386 5.67248C13.5798 5.31971 13.493 4.97449 13.3816 4.63432C13.3588 4.56565 13.3177 4.5392 13.248 4.56565C13.1208 4.61416 12.9942 4.6633 12.8669 4.71117C12.77 4.74771 12.6966 4.73196 12.6757 4.66519C12.6491 4.58077 12.6972 4.52849 12.7688 4.49825C12.891 4.44596 13.0144 4.39683 13.1385 4.34958C13.1847 4.33194 13.2297 4.31493 13.2734 4.28973C13.3373 4.2532 13.4063 4.23745 13.4734 4.28784C13.4766 4.2954 13.4791 4.30296 13.4823 4.31052C13.488 4.3269 13.4937 4.34328 13.4987 4.35966C13.5025 4.3647 13.5032 4.36974 13.5019 4.37541C13.5076 4.3899 13.5133 4.40376 13.519 4.41824C13.5228 4.42076 13.5228 4.42328 13.5203 4.42643C13.5506 4.56691 13.5804 4.70676 13.6671 4.82708C13.6792 4.87496 13.6912 4.92284 13.7032 4.97071C13.7172 5.16726 13.8052 5.34616 13.8324 5.54019C13.8476 5.64791 13.8621 5.75752 13.9096 5.85894V5.86083C13.8995 6.00572 13.9185 6.14872 13.9362 6.29172C13.9837 6.6804 13.9647 7.06971 13.9495 7.45839C13.9419 7.65746 13.883 7.85211 13.89 8.05244L13.8932 8.05433C13.8349 8.11354 13.8539 8.19355 13.8381 8.2641C13.7874 8.48836 13.7077 8.70507 13.6678 8.93185C13.6709 8.9917 13.6361 9.04272 13.6266 9.10005C13.6216 9.11391 13.6165 9.1284 13.6114 9.14225L13.6102 9.15044C13.5146 9.26321 13.4854 9.4018 13.462 9.54165L13.4633 9.54038C13.3936 9.5618 13.4069 9.61913 13.4069 9.67078L13.4076 9.66953C13.3208 9.73189 13.3101 9.83709 13.2639 9.92151C13.2284 9.98765 13.1759 10.0494 13.1835 10.1332L13.1847 10.1319C13.117 10.159 13.1068 10.2157 13.1075 10.2787C13.1018 10.2856 13.0961 10.2919 13.0898 10.2988L13.091 10.297C13.0847 10.3096 13.0777 10.3228 13.0714 10.3354L13.0727 10.3341C13.0081 10.3788 12.9682 10.4387 12.9612 10.5181C12.953 10.5313 12.9448 10.5445 12.9372 10.5584C12.9327 10.5641 12.9283 10.5704 12.9233 10.576H12.9245C12.8631 10.5974 12.8568 10.6522 12.8479 10.7045L12.8485 10.7039C12.7105 10.7745 12.6631 10.9093 12.6067 11.0378V11.0372C12.5257 11.0636 12.4902 11.126 12.4763 11.2047L12.4769 11.2041C12.4358 11.2123 12.4206 11.24 12.4199 11.2784V11.2772C12.4136 11.2841 12.4066 11.2904 12.4003 11.2973L12.4022 11.2967C12.3592 11.3036 12.3313 11.3339 12.3054 11.3641C12.1895 11.4995 12.0724 11.6343 11.9445 11.7591C11.9198 11.7836 11.9027 11.812 11.897 11.8466L11.8938 11.8504C11.8894 11.8548 11.885 11.8592 11.8799 11.8636C11.8527 11.9046 11.8198 11.9392 11.7748 11.9613C11.7539 11.967 11.7381 11.9777 11.7311 11.9991L11.7318 11.9985C11.7254 12.0048 11.7191 12.0111 11.7121 12.0174L11.7128 12.0167C11.7064 12.023 11.7001 12.0293 11.6938 12.035C11.6533 12.035 11.6254 12.0583 11.5969 12.0829C11.4165 12.2359 11.2354 12.3878 11.0423 12.5257C10.9841 12.5673 10.9037 12.5862 10.8758 12.6643H10.8765C10.8334 12.6643 10.7954 12.6719 10.7834 12.721H10.784C10.7574 12.7223 10.7378 12.733 10.7277 12.7582H10.7283C10.715 12.7645 10.7024 12.7708 10.6891 12.7764C10.6068 12.8262 10.5245 12.876 10.4428 12.9257C10.4327 12.9308 10.4225 12.9358 10.4124 12.9409C10.4042 12.9547 10.3915 12.961 10.3757 12.9617C10.2965 12.9793 10.218 12.9982 10.1693 13.0719H10.1699C10.0357 13.0939 9.91859 13.15 9.81666 13.2395H9.81729C9.77994 13.2382 9.74639 13.2451 9.72359 13.2779L9.72549 13.2773C9.65206 13.2747 9.58621 13.2911 9.5381 13.3522L9.54 13.351C9.49631 13.3497 9.45516 13.3554 9.41338 13.3699C9.27663 13.4171 9.13608 13.453 9.00123 13.5053C8.87841 13.5532 8.7404 13.5544 8.62644 13.6281L8.62201 13.63L8.61695 13.6288C8.58149 13.6256 8.54667 13.6263 8.51565 13.6477L8.51818 13.647C8.47134 13.6426 8.42638 13.6502 8.38017 13.659C8.00981 13.7308 7.63565 13.7699 7.25959 13.79C6.82086 13.8133 6.38529 13.7604 5.94972 13.7107C5.76296 13.6892 5.58443 13.613 5.3926 13.6307C5.35651 13.6338 5.32296 13.6281 5.29447 13.6048C5.13746 13.5507 4.98299 13.4896 4.82281 13.4455C4.74114 13.4228 4.66074 13.3825 4.57148 13.3894C4.56641 13.3907 4.56198 13.3894 4.55881 13.3856C4.53792 13.3466 4.5012 13.3503 4.46512 13.3503L4.46701 13.3516C4.43473 13.3056 4.38788 13.2936 4.33533 13.2949L4.3366 13.2955C4.31571 13.2558 4.27899 13.2571 4.24227 13.2584L4.24353 13.259C4.22391 13.2187 4.18655 13.2206 4.14984 13.2206H4.1511C4.0688 13.15 3.97637 13.1002 3.86558 13.0902C3.78517 13.0467 3.69337 13.0246 3.625 12.9598L3.6269 12.9585Z" fill="#F5BD3C"/>
+<path d="M12.781 3.01712C12.7215 3.13681 12.586 3.16012 12.4942 3.24012C12.4112 3.31193 12.3112 3.36548 12.2181 3.4247C12.1897 3.44296 12.1593 3.45934 12.1276 3.46879C12.0757 3.48391 12.0282 3.46879 11.9959 3.42533C11.9643 3.38249 11.9744 3.33461 12.0048 3.29682C12.0377 3.2565 12.0751 3.21807 12.1175 3.18909C12.2517 3.09649 12.3891 3.00893 12.5258 2.91947C12.5727 2.88861 12.6227 2.8653 12.6809 2.86782L12.6797 2.86719C12.6841 2.87349 12.6885 2.87979 12.693 2.88609C12.6968 2.88798 12.698 2.8905 12.698 2.89428C12.7031 2.90246 12.7082 2.91065 12.7132 2.91884C12.736 2.9516 12.7588 2.98436 12.781 3.01712Z" fill="#F5BD3C"/>
+<path d="M5.39453 13.6296C5.58636 13.6119 5.76489 13.6882 5.95165 13.7096C6.38722 13.7593 6.82279 13.8123 7.26153 13.789C7.63758 13.7688 8.01174 13.7297 8.3821 13.6579C8.42769 13.6491 8.47327 13.6415 8.52012 13.646C8.34602 13.7146 8.16052 13.7272 7.97819 13.7543C7.44386 13.8337 6.90699 13.8375 6.37013 13.7908C6.04155 13.7625 5.71361 13.7209 5.39453 13.6296Z" fill="#F8D05C"/>
+<path d="M13.8873 8.05391C13.8803 7.85295 13.9392 7.6583 13.9468 7.45986C13.962 7.07118 13.981 6.68187 13.9335 6.29319C13.9158 6.15019 13.8968 6.00719 13.9069 5.8623C13.9664 6.14011 13.9816 6.42359 13.993 6.70581C14.0095 7.12851 13.9823 7.54932 13.9132 7.96697C13.9082 7.99658 13.9101 8.02934 13.8873 8.05391Z" fill="#F8D05C"/>
+<path d="M10.877 12.6645C10.9054 12.5864 10.9852 12.5675 11.0435 12.5259C11.2365 12.3879 11.417 12.2361 11.598 12.083C11.6265 12.0591 11.655 12.0352 11.6949 12.0352C11.5157 12.2216 11.3087 12.3734 11.0985 12.5215C11.027 12.5719 10.9694 12.6456 10.877 12.6638V12.6645Z" fill="#F8D05C"/>
+<path d="M11.8965 11.8478C11.9022 11.8132 11.9193 11.7842 11.944 11.7602C12.0719 11.6355 12.189 11.5007 12.3048 11.3653C12.3308 11.335 12.3586 11.3054 12.4017 11.2979C12.3998 11.3035 12.3992 11.3105 12.3954 11.3149C12.2377 11.5001 12.094 11.6991 11.8965 11.8478Z" fill="#F8D05C"/>
+<path d="M8.62695 13.627C8.74091 13.5533 8.87829 13.5514 9.00174 13.5041C9.13596 13.4518 9.27714 13.4159 9.41389 13.3687C9.45631 13.3542 9.49746 13.3485 9.54051 13.3498C9.24739 13.4789 8.94223 13.5684 8.62759 13.627H8.62695Z" fill="#F8D05C"/>
+<path d="M13.666 8.93319C13.7059 8.7064 13.785 8.4897 13.8363 8.26544C13.8521 8.19551 13.8332 8.11488 13.8914 8.05566C13.8686 8.34418 13.78 8.61821 13.7027 8.89476C13.697 8.91429 13.6844 8.92626 13.666 8.93319Z" fill="#F8D05C"/>
+<path d="M13.9076 5.85991C13.8601 5.75912 13.8455 5.64951 13.8303 5.54116C13.8031 5.34713 13.7151 5.16822 13.7012 4.97168C13.7638 5.05924 13.7708 5.16571 13.7955 5.26524C13.8449 5.46115 13.8962 5.65644 13.9076 5.85991Z" fill="#F8D05C"/>
+<path d="M4.57422 13.3886C4.66348 13.3811 4.74389 13.422 4.82556 13.4447C4.9851 13.4888 5.14021 13.5499 5.29721 13.6041C5.04714 13.5631 4.80846 13.4831 4.57422 13.3892V13.3886Z" fill="#F8D05C"/>
+<path d="M13.1824 10.1345C13.1748 10.0514 13.2273 9.98902 13.2628 9.92288C13.3084 9.83784 13.3198 9.73263 13.4065 9.6709C13.3533 9.83595 13.2767 9.98902 13.1824 10.1345Z" fill="#F8D05C"/>
+<path d="M12.6055 11.039C12.6618 10.9098 12.7093 10.775 12.8473 10.7051C12.7745 10.8222 12.7087 10.9438 12.6055 11.039Z" fill="#F8D05C"/>
+<path d="M13.4609 9.54257C13.4844 9.40272 13.5129 9.26413 13.6091 9.15137C13.5762 9.28807 13.5293 9.4191 13.4609 9.54257Z" fill="#F8D05C"/>
+<path d="M13.6645 4.82838C13.5777 4.70869 13.548 4.56821 13.5176 4.42773C13.5917 4.55183 13.6303 4.68916 13.6645 4.82838Z" fill="#F8D05C"/>
+<path d="M9.81836 13.2389C9.92029 13.1494 10.0374 13.0933 10.1716 13.0713C10.0602 13.1412 9.94245 13.1954 9.81836 13.2389Z" fill="#F8D05C"/>
+<path d="M3.86719 13.0889C3.97798 13.0989 4.06978 13.1487 4.15271 13.2193C4.04635 13.201 3.95835 13.1405 3.86719 13.0889Z" fill="#F8D05C"/>
+<path d="M12.959 10.5199C12.9666 10.4405 13.0058 10.3807 13.0704 10.3359C13.0464 10.4052 13.0084 10.4657 12.959 10.5199Z" fill="#F8D05C"/>
+<path d="M12.4766 11.2057C12.4905 11.1269 12.5259 11.0652 12.607 11.0381C12.5753 11.103 12.5329 11.1597 12.4766 11.2057Z" fill="#F8D05C"/>
+<path d="M10.1699 13.0712C10.2187 12.9975 10.2972 12.9779 10.3763 12.9609C10.3168 13.0151 10.2446 13.0454 10.1699 13.0712Z" fill="#F8D05C"/>
+<path d="M9.53906 13.3506C9.58718 13.2901 9.65302 13.2731 9.72646 13.2756C9.66948 13.3141 9.6068 13.3386 9.53906 13.3506Z" fill="#F8D05C"/>
+<path d="M13.1055 10.2796C13.1055 10.2172 13.1156 10.1599 13.1827 10.1328C13.1681 10.1876 13.1409 10.2355 13.1055 10.2796Z" fill="#F8D05C"/>
+<path d="M12.8457 10.7066C12.8546 10.6537 12.8603 10.5995 12.9223 10.5781C12.9058 10.6266 12.8856 10.672 12.8457 10.7066Z" fill="#F8D05C"/>
+<path d="M13.4053 9.67142C13.4053 9.61976 13.392 9.56243 13.4617 9.54102C13.4547 9.58952 13.4395 9.63488 13.4053 9.67142Z" fill="#F8D05C"/>
+<path d="M4.33789 13.2931C4.39044 13.2918 4.43729 13.3038 4.46957 13.3498C4.41956 13.3447 4.37651 13.3239 4.33789 13.2931Z" fill="#F8D05C"/>
+<path d="M10.7852 12.7218C10.7972 12.6726 10.8352 12.6644 10.8782 12.6651C10.8535 12.694 10.8231 12.7136 10.7852 12.7218Z" fill="#F8D05C"/>
+<path d="M12.4199 11.2794C12.4199 11.2404 12.4357 11.2133 12.4769 11.2051C12.468 11.2378 12.4484 11.2618 12.4199 11.2794Z" fill="#F8D05C"/>
+<path d="M4.24414 13.2572C4.28086 13.256 4.31821 13.2553 4.33847 13.2944C4.30239 13.2931 4.2701 13.2824 4.24414 13.2572Z" fill="#F8D05C"/>
+<path d="M4.15234 13.2188C4.18906 13.2188 4.22642 13.2169 4.24604 13.2572C4.20996 13.2553 4.17957 13.2408 4.15234 13.2188Z" fill="#F8D05C"/>
+<path d="M9.72461 13.276C9.7474 13.2432 9.78095 13.2357 9.81831 13.2376C9.79172 13.2621 9.76006 13.2735 9.72461 13.276Z" fill="#F8D05C"/>
+<path d="M4.4668 13.3497C4.50225 13.3497 4.5396 13.3459 4.5605 13.385C4.52631 13.3812 4.49402 13.373 4.4668 13.3497Z" fill="#F8D05C"/>
+<path d="M10.7285 12.7579C10.7386 12.7327 10.7589 12.722 10.7849 12.7207C10.7716 12.7421 10.7526 12.7541 10.7285 12.7579Z" fill="#F8D05C"/>
+<path d="M8.51758 13.6465C8.5486 13.6251 8.58342 13.6239 8.61887 13.6276C8.58849 13.6509 8.55366 13.6528 8.51758 13.6465Z" fill="#F8D05C"/>
+<path d="M11.7324 11.9997C11.7394 11.9783 11.7552 11.9676 11.7761 11.9619C11.7691 11.9833 11.7539 11.9947 11.7324 11.9997Z" fill="#F8D05C"/>
+<path d="M13.4969 4.36164C13.4912 4.34526 13.4855 4.32888 13.4805 4.3125C13.4963 4.32573 13.4982 4.34337 13.4969 4.36164Z" fill="#F8D05C"/>
+<path d="M13.0703 10.3373C13.0766 10.3247 13.0836 10.3114 13.0899 10.2988C13.0912 10.3152 13.0849 10.3284 13.0703 10.3373Z" fill="#F8D05C"/>
+<path d="M10.6914 12.7751C10.7047 12.7688 10.7174 12.7625 10.7307 12.7568C10.7218 12.772 10.7085 12.7776 10.6914 12.7751Z" fill="#F8D05C"/>
+<path d="M12.7125 2.9191C12.7074 2.91091 12.7023 2.90272 12.6973 2.89453C12.7087 2.89894 12.7137 2.90713 12.7125 2.9191Z" fill="#F8D05C"/>
+<path d="M13.6094 9.14377C13.6144 9.12991 13.6195 9.11542 13.6246 9.10156C13.6258 9.11794 13.622 9.13243 13.6094 9.14377Z" fill="#F8D05C"/>
+<path d="M11.6953 12.0358C11.7016 12.0295 11.708 12.0232 11.7143 12.0176C11.708 12.0239 11.7016 12.0302 11.6953 12.0358Z" fill="#F8D05C"/>
+<path d="M11.7129 12.0179C11.7192 12.0116 11.7256 12.0053 11.7325 11.999C11.7262 12.0053 11.7199 12.0116 11.7129 12.0179Z" fill="#F8D05C"/>
+<path d="M11.8809 11.8648C11.8853 11.8604 11.8897 11.856 11.8948 11.8516C11.8904 11.856 11.8859 11.8604 11.8809 11.8648Z" fill="#F8D05C"/>
+<path d="M2.76227 12.4589C2.75784 12.4557 2.75657 12.4513 2.7591 12.4463C2.76037 12.4501 2.76164 12.4545 2.76227 12.4589Z" fill="#888785"/>
+<path d="M12.9219 10.5772C12.9263 10.5715 12.9307 10.5652 12.9358 10.5596C12.9314 10.5652 12.9269 10.5715 12.9219 10.5772Z" fill="#F8D05C"/>
+<path d="M13.0879 10.2995C13.0936 10.2925 13.0993 10.2862 13.1056 10.2793C13.0999 10.2862 13.0942 10.2925 13.0879 10.2995Z" fill="#F8D05C"/>
+<path d="M2.76024 12.4258C2.76657 12.4264 2.771 12.4302 2.77227 12.4359C2.76847 12.4378 2.76404 12.439 2.76024 12.4384C2.75961 12.434 2.75961 12.4296 2.76024 12.4258Z" fill="#888785"/>
+<path d="M2.25586 11.9852C2.26409 11.9159 2.31284 11.8712 2.35399 11.8221C2.46225 11.6917 2.57177 11.5625 2.68067 11.4334C2.70029 11.4101 2.71802 11.3836 2.74208 11.3653C2.79779 11.3225 2.85603 11.3238 2.91174 11.3679C2.96682 11.4113 2.95669 11.4598 2.92947 11.5159C2.89022 11.5959 2.81868 11.6476 2.76487 11.7143C2.668 11.8334 2.56734 11.9499 2.46921 12.0677C2.44832 12.0929 2.42363 12.1087 2.39134 12.1125C2.38311 12.1043 2.37551 12.0967 2.36728 12.0885C2.36349 12.0841 2.35905 12.0803 2.35462 12.0772C2.35146 12.0759 2.34892 12.074 2.34766 12.0709C2.34386 12.0665 2.34006 12.0627 2.33563 12.0589C2.33246 12.0583 2.32993 12.0558 2.3293 12.0526C2.3255 12.0488 2.3217 12.0451 2.31664 12.0425C2.29638 12.0236 2.27675 12.0054 2.25649 11.9865L2.25586 11.9852Z" fill="#F5BD3C"/>
+<path d="M1.00586 10.4619C1.01156 10.4077 1.04701 10.3693 1.08943 10.346C1.2553 10.2547 1.39078 10.1211 1.55349 10.026C1.64149 9.97433 1.70986 9.97875 1.75101 10.0386C1.79533 10.1035 1.77507 10.1835 1.69023 10.2339C1.53069 10.329 1.38635 10.4449 1.2382 10.5552C1.19579 10.5866 1.15084 10.6137 1.09449 10.6131C1.05967 10.5659 1.01472 10.5243 1.00586 10.4619Z" fill="#F5BD3C"/>
+<path d="M0.367188 9.07377C0.367188 9.07377 0.372252 9.06873 0.372252 9.06621C0.379216 8.9018 0.493806 8.85203 0.630555 8.81612C0.735015 8.78903 0.835044 8.7462 0.938238 8.71407C0.976224 8.7021 1.01674 8.69517 1.05599 8.69265C1.11044 8.6895 1.15476 8.71407 1.17058 8.76762C1.18768 8.82494 1.16615 8.8829 1.11297 8.89991C0.901519 8.96857 0.702094 9.07314 0.481144 9.11157C0.443159 9.11787 0.407706 9.10338 0.372252 9.09267C0.370353 9.08637 0.369087 9.08007 0.367188 9.07377Z" fill="#F5BD3C"/>
+<path d="M2.57422 12.2773C2.63626 12.3082 2.68374 12.3567 2.73059 12.4052C2.63056 12.4203 2.60144 12.3504 2.57422 12.2773Z" fill="#888785"/>
+<path d="M2.49805 12.2217C2.5297 12.2305 2.55439 12.2481 2.57212 12.2765C2.53603 12.274 2.50944 12.2576 2.49805 12.2217Z" fill="#888785"/>
+<path d="M2.44336 12.1807C2.46742 12.187 2.48641 12.1996 2.49781 12.221C2.47248 12.2166 2.45286 12.2052 2.44336 12.1807Z" fill="#888785"/>
+<path d="M2.31641 12.041C2.32084 12.0435 2.32527 12.0473 2.32907 12.0511C2.32274 12.0498 2.31894 12.0467 2.31641 12.041Z" fill="#F8D05C"/>
+<path d="M2.33594 12.0576C2.34037 12.0614 2.34417 12.0652 2.34797 12.0696C2.34164 12.0677 2.33784 12.0639 2.33594 12.0576Z" fill="#F8D05C"/>
+<path d="M2.35547 12.0762C2.3599 12.08 2.36433 12.0837 2.36813 12.0875C2.3618 12.0863 2.35737 12.0825 2.35547 12.0762Z" fill="#F8D05C"/>
+<path d="M9.90167 1.58693C9.8067 1.58945 9.74529 1.4981 9.78644 1.41117C9.85925 1.25872 9.93965 1.10942 10.0175 0.959495C10.0302 0.934927 10.0454 0.911618 10.058 0.88705C10.11 0.786258 10.2125 0.773029 10.2904 0.856813C10.3208 0.88957 10.3182 0.922958 10.2992 0.958865C10.2062 1.13966 10.1144 1.32109 10.0194 1.50125C9.9941 1.54913 9.95421 1.58315 9.90103 1.58756L9.90167 1.58693Z" fill="#F5BD3C"/>
+<path d="M1.8863 3.49118C1.86668 3.48362 1.83439 3.47795 1.8097 3.46157C1.65839 3.36015 1.50835 3.25747 1.35894 3.15289C1.29563 3.1088 1.26777 3.04454 1.31399 2.97714C1.35957 2.91036 1.43174 2.91099 1.49568 2.9532C1.65079 3.05462 1.804 3.15856 1.95594 3.26377C2.00976 3.30093 2.02748 3.35574 2.00469 3.41873C1.98697 3.46724 1.94898 3.49055 1.8863 3.49118Z" fill="#F5BD3C"/>
+<path d="M8.36926 0.911915C8.40155 0.71285 8.46042 0.511895 8.5231 0.31346C8.55349 0.217078 8.64845 0.285743 8.71176 0.281333C8.76747 0.277553 8.76304 0.336769 8.75418 0.373306C8.70796 0.564181 8.66175 0.754427 8.60793 0.943413C8.58894 1.01082 8.54146 1.06625 8.45789 1.0505C8.38825 1.03728 8.36736 0.983729 8.36926 0.911285V0.911915Z" fill="#F5BD3C"/>
+<path d="M4.17871 1.5079C4.17681 1.5583 4.15212 1.59484 4.10021 1.60618C4.0388 1.6194 3.98119 1.61247 3.94763 1.55011C3.88496 1.43357 3.82481 1.31577 3.7634 1.19797C3.73808 1.14883 3.71022 1.10095 3.68806 1.04993C3.66211 0.990082 3.66907 0.932756 3.73048 0.898109C3.80835 0.854642 3.87862 0.871021 3.91408 0.939056C3.99385 1.0915 4.07235 1.24521 4.15149 1.39829C4.16921 1.43168 4.17428 1.46822 4.17871 1.50727V1.5079Z" fill="#F5BD3C"/>
+<path d="M0.202159 7.5982C0.140749 7.60261 0.105929 7.5478 0.0989647 7.49048C0.0913676 7.42874 0.116058 7.36575 0.193929 7.35504C0.331943 7.33614 0.469958 7.32039 0.607972 7.30401C0.657354 7.29834 0.706102 7.29015 0.755483 7.28826C0.835253 7.28511 0.886534 7.32417 0.89603 7.40417C0.904893 7.48166 0.856145 7.51819 0.787138 7.52701C0.59721 7.55158 0.406648 7.573 0.202159 7.59757V7.5982Z" fill="#F5BD3C"/>
+<path d="M2.96115 2.30462C2.95862 2.36258 2.94406 2.4073 2.89784 2.42872C2.83643 2.45707 2.78135 2.43565 2.7383 2.3903C2.6465 2.29517 2.55787 2.1969 2.46924 2.09989C2.43632 2.06335 2.4072 2.02303 2.37301 1.98839C2.3135 1.92728 2.34389 1.8731 2.38757 1.82712C2.43315 1.77924 2.49266 1.77168 2.54394 1.81893C2.68892 1.95248 2.80858 2.10934 2.94216 2.2536C2.95545 2.26808 2.95672 2.29265 2.96115 2.30462Z" fill="#F5BD3C"/>
+<path d="M5.29211 0.301758C5.34719 0.304278 5.38581 0.327586 5.40037 0.384282C5.44532 0.560038 5.49344 0.735165 5.53522 0.911551C5.55168 0.980216 5.53332 1.04384 5.45482 1.06589C5.37378 1.08857 5.3206 1.04951 5.29971 0.973917C5.25096 0.79942 5.20538 0.623663 5.16296 0.447277C5.14524 0.374832 5.21424 0.301758 5.29211 0.301758Z" fill="#F5BD3C"/>
+<path d="M1.19213 4.75393C1.10857 4.75393 1.03893 4.70857 0.96422 4.68085C0.854062 4.6399 0.747702 4.59014 0.637544 4.54919C0.574234 4.52588 0.552709 4.48368 0.574867 4.42761C0.597026 4.37217 0.627414 4.30288 0.705918 4.3243C0.900278 4.37658 1.08514 4.4547 1.26494 4.54415C1.31685 4.56998 1.33648 4.62289 1.31812 4.67896C1.29913 4.73755 1.24975 4.75392 1.19213 4.75329V4.75393Z" fill="#F5BD3C"/>
+<path d="M0.326139 5.82617C0.485046 5.84885 0.653449 5.86964 0.820586 5.89925C0.914917 5.91562 0.951636 5.97043 0.934542 6.04665C0.91555 6.13296 0.849708 6.14556 0.776269 6.13611C0.613564 6.11595 0.451492 6.0939 0.28942 6.07059C0.229909 6.06177 0.160269 6.06492 0.171031 5.96791C0.184959 5.84759 0.207118 5.82176 0.325506 5.82554L0.326139 5.82617Z" fill="#F5BD3C"/>
+<path d="M6.88314 0.452823C6.88314 0.363999 6.8844 0.274546 6.88314 0.185723C6.88124 0.09438 6.94265 0.09375 7.00786 0.09375C7.0718 0.09375 7.12625 0.0987896 7.12561 0.183833C7.12371 0.364629 7.12561 0.546056 7.12371 0.726852C7.12308 0.803076 7.0851 0.857882 7.00469 0.866071C6.94328 0.872371 6.88694 0.806856 6.8844 0.729372C6.88124 0.637399 6.88377 0.545426 6.88377 0.453453L6.88314 0.452823Z" fill="#F5BD3C"/>
+<path d="M6.8639 2.10387C6.85124 2.13915 6.87023 2.20026 6.80882 2.20026C6.76703 2.20026 6.74234 2.15616 6.74424 2.11395C6.74614 2.07175 6.7607 2.02009 6.80819 2.01505C6.8639 2.00938 6.85567 2.06482 6.8639 2.10324V2.10387Z" fill="#F8D05C"/>
+<path d="M2.97783 7.8547C2.97529 7.87108 2.97339 7.88683 2.97086 7.90321C2.93414 7.8736 2.91515 7.84022 2.94301 7.79297C2.97403 7.80494 2.9639 7.83644 2.97783 7.8547Z" fill="#F8D05C"/>
+<path d="M2.97016 7.92578C2.97016 7.94279 2.97016 7.95917 2.97016 7.97618C2.94484 7.9598 2.94484 7.94279 2.97016 7.92578Z" fill="#F8D05C"/>
+<path d="M3.83961 7.94792C3.82252 7.59514 4.14223 7.25938 4.53602 7.25686C4.91967 7.25371 5.23939 7.56365 5.24572 7.93973C5.25268 8.37817 4.91208 8.63015 4.56008 8.64905C4.2353 8.66606 3.80733 8.37817 3.83961 7.94855V7.94792Z" fill="#929190"/>
+<path d="M9.47908 8.63603C9.09795 8.63225 8.76178 8.36767 8.76368 7.96891C8.76558 7.58527 9.06693 7.26714 9.44679 7.25895C9.84184 7.25076 10.1628 7.55062 10.1691 7.93426C10.1755 8.32483 9.87666 8.63288 9.47971 8.63603H9.47908Z" fill="#929190"/>
+<path d="M8.45908 6.80306C8.46858 6.82448 8.47301 6.84653 8.46352 6.86984C8.46352 6.9826 8.46352 7.09536 8.46352 7.20812C8.47301 7.44687 8.34703 7.5527 8.16343 7.59365C7.98426 7.63397 7.73862 7.5168 7.71583 7.33663C7.68481 7.08969 7.61644 6.81881 7.82282 6.59959C7.99376 6.41753 8.3179 6.46667 8.42806 6.68967C8.44199 6.71739 8.45655 6.74448 8.44516 6.77723C8.45022 6.78605 8.45465 6.79424 8.45972 6.80306H8.45908Z" fill="#929190"/>
+<path d="M5.76038 7.56487C5.6192 7.49305 5.54829 7.37336 5.52993 7.22154C5.51537 7.09618 5.516 6.96956 5.53246 6.84483C5.56158 6.62561 5.74581 6.48261 5.96676 6.49269C6.08768 6.49773 6.1472 6.58655 6.2181 6.66215C6.33143 6.87948 6.29407 7.10878 6.26812 7.33619C6.26558 7.35887 6.24976 7.38155 6.23709 7.40234C6.13833 7.56361 6.00158 7.61022 5.75974 7.5655L5.76038 7.56487Z" fill="#929190"/>
+<path d="M7.49479 8.1173C7.51505 8.10344 7.53531 8.08958 7.5562 8.07572C7.65053 8.01273 7.7227 8.01147 7.79108 8.07068C7.86388 8.13368 7.87591 8.20486 7.83223 8.30503C7.80437 8.31951 7.78601 8.34156 7.77842 8.37243C7.77019 8.38062 7.76196 8.38881 7.75436 8.397C7.63913 8.45684 7.52328 8.51669 7.40806 8.57653C7.09784 8.69623 6.79206 8.66032 6.48817 8.54819C6.37738 8.50724 6.28431 8.43921 6.20138 8.3592C6.1368 8.29684 6.10895 8.21746 6.16466 8.13431C6.21657 8.05683 6.28748 8.01273 6.38624 8.04549C6.4065 8.05619 6.42676 8.0669 6.44702 8.07761C6.45778 8.08517 6.46791 8.09336 6.47867 8.10092C6.61036 8.20486 6.7566 8.26786 6.92817 8.26219C6.99718 8.26219 7.06618 8.26219 7.13519 8.26219C7.27131 8.25337 7.39159 8.20549 7.49542 8.1173H7.49479Z" fill="#929190"/>
+<path d="M5.75977 7.56448C6.00161 7.60921 6.13836 7.56322 6.23712 7.40133C6.24978 7.38054 6.26561 7.35849 6.26814 7.33518C6.2941 7.10777 6.33145 6.87847 6.21813 6.66113C6.27257 6.67562 6.28397 6.7235 6.29283 6.76759C6.32828 6.9465 6.33968 7.13171 6.29663 7.3062C6.23775 7.54559 6.05605 7.64449 5.81991 7.60228C5.79522 7.59787 5.77179 7.59031 5.75977 7.56448Z" fill="#888785"/>
+<path d="M6.92606 8.26283C6.75449 8.26913 6.60825 8.2055 6.47656 8.10156C6.62281 8.16582 6.76525 8.23889 6.92606 8.26283Z" fill="#888785"/>
+<path d="M7.495 8.11816C7.39117 8.20636 7.27088 8.25423 7.13477 8.26305C7.26265 8.23408 7.36584 8.14336 7.495 8.11816Z" fill="#888785"/>
+<path d="M7.4082 8.577C7.52343 8.51715 7.63928 8.45731 7.75451 8.39746C7.66017 8.49825 7.54432 8.55684 7.4082 8.577Z" fill="#888785"/>
+<path d="M8.46289 7.2084C8.46289 7.09564 8.46289 6.98288 8.46289 6.87012C8.49138 6.98288 8.48442 7.09564 8.46289 7.2084Z" fill="#888785"/>
+<path d="M7.77734 8.37307C7.78431 8.3422 7.80267 8.32015 7.83116 8.30566C7.83622 8.34598 7.8052 8.35858 7.77734 8.37307Z" fill="#888785"/>
+<path d="M6.44554 8.078C6.42528 8.06729 6.40502 8.05658 6.38477 8.04587C6.41452 8.03895 6.43351 8.05091 6.44554 8.078Z" fill="#888785"/>
+<path d="M6.97308 1.06836C3.72341 1.07214 1.1043 3.60581 1.08594 6.90172C1.09543 10.1535 3.71898 12.7464 7.05981 12.7181C10.2785 12.6904 12.9261 10.1649 12.8944 6.87274C12.8621 3.56675 10.274 1.06458 6.97308 1.06836Z" fill="#F5BD3C"/>
+<path d="M2.50687 8.59757C2.50687 8.59757 2.15424 7.34523 3.11084 5.26639C3.11084 5.26639 3.60275 4.13121 4.8854 3.85151C5.91735 3.62599 6.94929 3.62599 6.94929 3.62599C6.94929 3.62599 7.2766 3.67639 7.77991 3.30031C8.28322 2.92423 8.8625 2.64894 9.18918 2.87446C9.51585 3.09998 9.91913 4.35233 9.91913 4.35233C9.91913 4.35233 10.1205 4.65281 10.1958 4.72778C10.2711 4.80274 11.1018 6.15525 11.1524 7.33263C11.203 8.51001 11.0771 9.13555 10.2464 9.5614C9.41582 9.98725 7.4526 10.4881 4.23078 9.91228C4.23078 9.91228 2.79619 9.66156 2.50687 8.59757Z" fill="#FFDE76"/>
+<path d="M3.66857 6.14058C3.84077 5.58118 4.24468 5.11565 4.78598 4.88194C4.99237 4.79248 5.23168 4.72823 5.50201 4.71626C6.41746 4.67405 7.65769 4.52412 8.65798 4.81264C9.03847 4.92225 9.38098 5.13896 9.62978 5.44511C9.70892 5.54213 9.84313 5.80608 9.89378 5.956C10.021 6.33587 10.1958 7.70727 10.1958 7.85909C10.1958 8.10981 10.1559 9.00371 8.91185 9.26136C7.66782 9.51901 6.43835 9.62422 4.50995 9.199C4.50995 9.199 3.4128 8.96277 3.45015 7.80932C3.47548 7.03322 3.55081 6.8329 3.66794 6.14121L3.66857 6.14058Z" fill="#FCFDFB"/>
+<path d="M3.46357 7.64551C3.46357 7.64551 4.54236 7.74378 4.59617 9.22354C4.59617 9.22354 3.31226 9.02321 3.46357 7.64551Z" fill="#FFEDB8"/>
+<path d="M10.1835 7.7207C10.1835 7.7207 9.12809 7.79504 9.07617 9.22314C9.07617 9.22314 10.3348 8.94785 10.1835 7.7207Z" fill="#FFEDB8"/>
+<path d="M5.9915 6.76874C5.94022 6.76874 5.89844 6.73157 5.89844 6.68496V6.14824C5.89844 6.10225 5.94022 6.06445 5.9915 6.06445C6.04278 6.06445 6.08457 6.10162 6.08457 6.14824V6.68496C6.08457 6.73094 6.04278 6.76874 5.9915 6.76874Z" fill="#FFCB26"/>
+<path d="M7.53447 6.76874C7.48319 6.76874 7.44141 6.73157 7.44141 6.68496V6.14824C7.44141 6.10225 7.48319 6.06445 7.53447 6.06445C7.58575 6.06445 7.62754 6.10162 7.62754 6.14824V6.68496C7.62754 6.73094 7.58575 6.76874 7.53447 6.76874Z" fill="#FFCB26"/>
+<path d="M6.67843 7.48956C6.15866 7.48956 5.89466 7.19286 5.8839 7.18026C5.85034 7.14183 5.85477 7.08325 5.89339 7.04986C5.93201 7.01647 5.99026 7.02088 6.02444 7.05868C6.03394 7.06939 6.24856 7.30436 6.67906 7.30436C6.73034 7.30436 6.77213 7.34594 6.77213 7.39696C6.77213 7.44799 6.73034 7.48956 6.67906 7.48956H6.67843Z" fill="#FFCB26"/>
+</svg>

src/assets/svg/culture/submit.svg

+<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect opacity="0.3" x="11.1074" y="10.1885" width="13.0886" height="2.37974" rx="1.18987" fill="white"/>
+<rect opacity="0.3" x="11.1074" y="14.3545" width="9.51895" height="2.37974" rx="1.18987" fill="white"/>
+<path d="M20.3623 3.64453C24.7806 3.64453 28.3623 7.22625 28.3623 11.6445V25.3594C28.3621 27.0161 27.0191 28.3594 25.3623 28.3594H9.94336C8.2866 28.3594 6.94351 27.0161 6.94336 25.3594V6.64453C6.94336 4.98768 8.28651 3.64453 9.94336 3.64453H20.3623ZM20.6289 22.6836C19.9718 22.6836 19.4385 23.2169 19.4385 23.874C19.4386 24.5311 19.9718 25.0635 20.6289 25.0635H23.0088C23.6657 25.0633 24.1982 24.531 24.1982 23.874C24.1982 23.217 23.6658 22.6838 23.0088 22.6836H20.6289ZM12.2979 14.3545C11.641 14.3547 11.1086 14.8871 11.1084 15.5439C11.1084 16.201 11.6409 16.7342 12.2979 16.7344H19.4375C20.0946 16.7344 20.627 16.2011 20.627 15.5439C20.6268 14.887 20.0945 14.3545 19.4375 14.3545H12.2979ZM12.2979 10.1885C11.6409 10.1887 11.1084 10.7219 11.1084 11.3789C11.1086 12.0358 11.641 12.5681 12.2979 12.5684H23.0068C23.6639 12.5684 24.1971 12.0359 24.1973 11.3789C24.1973 10.7218 23.664 10.1885 23.0068 10.1885H12.2979Z" fill="white"/>
+<path opacity="0.3" d="M2 17.6494H11.0613V28.3582H6C3.79086 28.3582 2 26.5674 2 24.3582V17.6494Z" fill="white"/>
+</svg>

src/assets/svg/culture/topic_publish.svg

+<svg width="51" height="58" viewBox="0 0 51 58" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M33.3521 23.97C33.3521 27.7555 30.2841 30.8228 26.4993 30.8228C22.7145 30.8228 19.6465 27.7555 19.6465 23.97C19.6465 20.1859 22.7145 17.1172 26.4993 17.1172C30.2841 17.1172 33.3521 20.1859 33.3521 23.97Z" fill="url(#paint0_linear_4018_5817)"/>
+<g opacity="0.5" filter="url(#filter0_f_4018_5817)">
+<path d="M31.4809 24.9172C31.4809 28.0559 28.9372 30.5991 25.7991 30.5991C22.661 30.5991 20.1172 28.0559 20.1172 24.9172C20.1172 21.7797 22.661 19.2354 25.7991 19.2354C28.9372 19.2354 31.4809 21.7797 31.4809 24.9172Z" fill="#EB6F0A"/>
+</g>
+<foreignObject x="-23.0215" y="-5.49219" width="80.6074" height="79.2891"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(12px);clip-path:url(#bgblur_0_4018_5817_clip_path);height:100%;width:100%"></div></foreignObject><path data-figma-bg-blur-radius="24" d="M16.623 18.7578C8.12062 18.7578 1.22855 25.6515 1.22852 34.1523C1.22852 42.6563 8.12063 49.5469 16.623 49.5469C19.7388 49.5469 22.6379 48.6197 25.0615 47.0283L33.0342 48.7109C33.124 48.7299 33.217 48.6979 33.2764 48.6279C33.3356 48.558 33.3525 48.4614 33.3193 48.376L30.4355 40.9561C31.4479 38.9043 32.0176 36.5947 32.0176 34.1523C32.0175 25.6515 25.1254 18.7579 16.623 18.7578Z" fill="#FFCBB9" fill-opacity="0.35" stroke="url(#paint1_linear_4018_5817)" stroke-width="0.5" stroke-linecap="round" stroke-linejoin="round"/>
+<foreignObject x="-8.64648" y="8.83691" width="49.0586" height="48.5293"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(7.5px);clip-path:url(#bgblur_1_4018_5817_clip_path);height:100%;width:100%"></div></foreignObject><g filter="url(#filter3_d_4018_5817)" data-figma-bg-blur-radius="15">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M11.3615 35.7137L11.9795 30.9656H8.44534C7.80352 30.9656 7.28321 30.4342 7.28321 29.7786C7.28321 29.1231 7.80351 28.5916 8.44534 28.5916H12.2885L12.7732 24.8676C12.8578 24.2178 13.4421 23.761 14.0783 23.8474C14.7145 23.9338 15.1617 24.5306 15.0772 25.1805L14.6332 28.5916H18.6109L19.0757 25.0203C19.1603 24.3704 19.7446 23.9136 20.3809 24C21.0171 24.0864 21.4643 24.6833 21.3797 25.3331L20.9556 28.5916H24.2502C24.892 28.5916 25.4123 29.1231 25.4123 29.7786C25.4123 30.4342 24.892 30.9656 24.2502 30.9656H20.6466L20.0286 35.7137H23.3205C23.9623 35.7137 24.4826 36.2451 24.4826 36.9007C24.4826 37.5562 23.9623 38.0877 23.3205 38.0877H19.7196L19.2968 41.3356C19.2123 41.9855 18.6279 42.4422 17.9917 42.3558C17.3555 42.2694 16.9083 41.6726 16.9929 41.0228L17.3749 38.0877H13.3972L12.9943 41.183C12.9097 41.8328 12.3254 42.2896 11.6892 42.2032C11.0529 42.1168 10.6058 41.52 10.6903 40.8701L11.0525 38.0877H7.51564C6.87382 38.0877 6.35352 37.5562 6.35352 36.9007C6.35352 36.2451 6.87382 35.7137 7.51564 35.7137H11.3615ZM13.7062 35.7137H17.6839L18.3019 30.9656H14.3242L13.7062 35.7137Z" fill="url(#paint2_linear_4018_5817)"/>
+<path d="M14.0518 24.0459C14.5749 24.1171 14.9495 24.61 14.8789 25.1543L14.4346 28.5654L14.4053 28.792H18.7861L18.8096 28.6172L19.2744 25.0459C19.3453 24.5024 19.8312 24.1276 20.3535 24.1982C20.8769 24.2693 21.2525 24.7631 21.1816 25.3076L20.7568 28.5654L20.7275 28.792H24.25C24.7773 28.792 25.2117 29.2293 25.2119 29.7783C25.2119 30.3274 24.7774 30.7656 24.25 30.7656H20.4707L20.4482 30.9395L19.8301 35.6875L19.8008 35.9141H23.3203C23.8476 35.9141 24.2821 36.3514 24.2822 36.9004C24.2822 37.4495 23.8477 37.8877 23.3203 37.8877H19.5439L19.5215 38.0615L19.0986 41.3096C19.0279 41.8533 18.5411 42.2282 18.0186 42.1572C17.4953 42.0861 17.1207 41.5933 17.1914 41.0488L17.5732 38.1133L17.6025 37.8877H13.2217L13.1992 38.0615L12.7959 41.1572C12.7251 41.7009 12.2383 42.0758 11.7158 42.0049C11.1925 41.9337 10.8178 41.44 10.8887 40.8955L11.251 38.1133L11.2803 37.8877H7.51562C6.98824 37.8877 6.55371 37.4495 6.55371 36.9004C6.55386 36.3514 6.98833 35.9141 7.51562 35.9141H11.5371L11.5596 35.7393L12.1777 30.9912L12.207 30.7656H8.44531C7.91793 30.7656 7.4834 30.3274 7.4834 29.7783C7.48357 29.2294 7.91803 28.792 8.44531 28.792H12.4639L12.4863 28.6172L12.9717 24.8936C13.0425 24.3498 13.5292 23.9749 14.0518 24.0459ZM14.126 30.9395L13.5078 35.6875L13.4785 35.9141H17.8594L17.8818 35.7393L18.5 30.9912L18.5293 30.7656H14.1484L14.126 30.9395Z" stroke="url(#paint3_linear_4018_5817)" stroke-width="0.4"/>
+</g>
+<defs>
+<filter id="filter0_f_4018_5817" x="1.11719" y="0.235352" width="49.3633" height="49.3633" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="9.5" result="effect1_foregroundBlur_4018_5817"/>
+</filter>
+<clipPath id="bgblur_0_4018_5817_clip_path" transform="translate(23.0215 5.49219)"><path d="M16.623 18.7578C8.12062 18.7578 1.22855 25.6515 1.22852 34.1523C1.22852 42.6563 8.12063 49.5469 16.623 49.5469C19.7388 49.5469 22.6379 48.6197 25.0615 47.0283L33.0342 48.7109C33.124 48.7299 33.217 48.6979 33.2764 48.6279C33.3356 48.558 33.3525 48.4614 33.3193 48.376L30.4355 40.9561C31.4479 38.9043 32.0176 36.5947 32.0176 34.1523C32.0175 25.6515 25.1254 18.7579 16.623 18.7578Z"/>
+</clipPath><filter id="filter3_d_4018_5817" x="-8.64648" y="8.83691" width="49.0586" height="48.5293" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dx="5" dy="5"/>
+<feGaussianBlur stdDeviation="5"/>
+<feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 0.521569 0 0 0 0 0.133333 0 0 0 0.5 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_4018_5817"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_4018_5817" result="shape"/>
+</filter>
+<clipPath id="bgblur_1_4018_5817_clip_path" transform="translate(8.64648 -8.83691)"><path fill-rule="evenodd" clip-rule="evenodd" d="M11.3615 35.7137L11.9795 30.9656H8.44534C7.80352 30.9656 7.28321 30.4342 7.28321 29.7786C7.28321 29.1231 7.80351 28.5916 8.44534 28.5916H12.2885L12.7732 24.8676C12.8578 24.2178 13.4421 23.761 14.0783 23.8474C14.7145 23.9338 15.1617 24.5306 15.0772 25.1805L14.6332 28.5916H18.6109L19.0757 25.0203C19.1603 24.3704 19.7446 23.9136 20.3809 24C21.0171 24.0864 21.4643 24.6833 21.3797 25.3331L20.9556 28.5916H24.2502C24.892 28.5916 25.4123 29.1231 25.4123 29.7786C25.4123 30.4342 24.892 30.9656 24.2502 30.9656H20.6466L20.0286 35.7137H23.3205C23.9623 35.7137 24.4826 36.2451 24.4826 36.9007C24.4826 37.5562 23.9623 38.0877 23.3205 38.0877H19.7196L19.2968 41.3356C19.2123 41.9855 18.6279 42.4422 17.9917 42.3558C17.3555 42.2694 16.9083 41.6726 16.9929 41.0228L17.3749 38.0877H13.3972L12.9943 41.183C12.9097 41.8328 12.3254 42.2896 11.6892 42.2032C11.0529 42.1168 10.6058 41.52 10.6903 40.8701L11.0525 38.0877H7.51564C6.87382 38.0877 6.35352 37.5562 6.35352 36.9007C6.35352 36.2451 6.87382 35.7137 7.51564 35.7137H11.3615ZM13.7062 35.7137H17.6839L18.3019 30.9656H14.3242L13.7062 35.7137Z"/>
+</clipPath><linearGradient id="paint0_linear_4018_5817" x1="14.7508" y1="26.1493" x2="30.5186" y2="20.245" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFB37F"/>
+<stop offset="1" stop-color="#FF7B0D"/>
+</linearGradient>
+<linearGradient id="paint1_linear_4018_5817" x1="28.0545" y1="22.5365" x2="5.64413" y2="50.776" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+<linearGradient id="paint2_linear_4018_5817" x1="23.0005" y1="42" x2="19.4667" y2="23.2352" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.2"/>
+<stop offset="0.264434" stop-color="white" stop-opacity="0.723067"/>
+<stop offset="1" stop-color="white"/>
+</linearGradient>
+<linearGradient id="paint3_linear_4018_5817" x1="40.4635" y1="56.2229" x2="35.5559" y2="21.822" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.2"/>
+<stop offset="0.399023" stop-color="white" stop-opacity="0.723067"/>
+<stop offset="1" stop-color="white"/>
+</linearGradient>
+</defs>
+</svg>

src/assets/svg/culture/topic_release.svg

+<svg width="83" height="78" viewBox="0 0 83 78" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g filter="url(#filter0_f_4018_5046)">
+<path d="M50.877 11.4782C52.537 10.893 54.2187 10.7413 55.499 11.6191C56.1392 12.0634 56.7468 12.952 57.3001 13.9164C57.8534 14.9134 58.3851 16.0838 58.8516 17.1999C59.3182 18.3161 59.7088 19.3889 59.9909 20.18C60.1319 20.5701 60.2404 20.9061 60.3164 21.1336C60.3598 21.242 60.3815 21.3395 60.4032 21.3937C60.4032 21.3937 60.4032 21.4046 60.4032 21.4154C60.4032 21.4154 60.4032 21.4262 60.414 21.4371C60.4466 21.4913 60.5008 21.5671 60.5659 21.6646C60.6961 21.8489 60.8697 22.1089 61.065 22.3799C61.4665 22.9434 61.8788 23.5069 62.0849 23.7128C62.15 23.7778 62.226 23.8753 62.2911 23.9729C62.367 24.0704 62.4538 24.2113 62.5515 24.363C62.7468 24.6772 63.0071 25.0999 63.3001 25.6092C63.886 26.6387 64.6238 28.0366 65.3507 29.6513C66.8046 32.8806 68.2693 37.0636 68.4321 40.9864C68.5948 44.8118 68.4755 47.8352 67.6075 50.2518C66.7178 52.7225 65.0686 54.5214 62.2802 55.9519C56.9421 58.6935 44.7359 61.8253 24.9457 58.6068L23.0036 58.2709C23.0036 58.2709 22.9927 58.2709 22.9819 58.2709C22.9602 58.2709 22.9385 58.2709 22.8951 58.2492C22.8191 58.2384 22.7215 58.2167 22.5804 58.1842C22.3092 58.1192 21.9294 58.0325 21.4737 57.9025C20.5515 57.6315 19.3038 57.2089 17.9909 56.5479C15.4629 55.2908 12.6094 53.156 11.5244 49.6883L11.4267 49.3523C11.4267 49.3523 11.4267 49.3415 11.4267 49.3307C11.4267 49.309 11.4159 49.2873 11.405 49.2548C11.3833 49.1898 11.3616 49.0814 11.3399 48.9514C11.2857 48.6913 11.2206 48.3012 11.1555 47.8027C11.0361 46.7949 10.9385 45.3319 11.047 43.4355C11.2531 39.6535 12.2513 34.181 15.3761 27.3647C15.3761 27.3647 15.3761 27.3647 15.3761 27.3431C15.3761 27.3214 15.3978 27.2997 15.4086 27.278C15.4412 27.2239 15.4737 27.1372 15.528 27.0288C15.6365 26.8121 15.7992 26.5086 16.0162 26.1402C16.4611 25.3925 17.1338 24.3955 18.0777 23.3227C19.9656 21.1987 22.9276 18.8146 27.2242 17.8826C30.5985 17.1458 33.962 16.7773 36.4791 16.5931C37.7377 16.5064 38.7902 16.4522 39.528 16.4305C39.8969 16.4197 40.1898 16.4089 40.3851 16.4089C40.4828 16.4089 40.5587 16.4089 40.613 16.4089H40.7757C40.7757 16.4089 40.7974 16.4089 40.8191 16.4089C40.8625 16.4089 40.9493 16.4089 41.047 16.4089C41.264 16.4089 41.5894 16.3764 42.0234 16.268C42.8806 16.0621 44.1609 15.5636 45.7341 14.3932C47.3833 13.1579 49.1844 12.0634 50.8661 11.4673L50.877 11.4782Z" fill="url(#paint0_linear_4018_5046)" fill-opacity="0.2"/>
+<path d="M50.877 11.4782C52.537 10.893 54.2187 10.7413 55.499 11.6191C56.1392 12.0634 56.7468 12.952 57.3001 13.9164C57.8534 14.9134 58.3851 16.0838 58.8516 17.1999C59.3182 18.3161 59.7088 19.3889 59.9909 20.18C60.1319 20.5701 60.2404 20.9061 60.3164 21.1336C60.3598 21.242 60.3815 21.3395 60.4032 21.3937C60.4032 21.3937 60.4032 21.4046 60.4032 21.4154C60.4032 21.4154 60.4032 21.4262 60.414 21.4371C60.4466 21.4913 60.5008 21.5671 60.5659 21.6646C60.6961 21.8489 60.8697 22.1089 61.065 22.3799C61.4665 22.9434 61.8788 23.5069 62.0849 23.7128C62.15 23.7778 62.226 23.8753 62.2911 23.9729C62.367 24.0704 62.4538 24.2113 62.5515 24.363C62.7468 24.6772 63.0071 25.0999 63.3001 25.6092C63.886 26.6387 64.6238 28.0366 65.3507 29.6513C66.8046 32.8806 68.2693 37.0636 68.4321 40.9864C68.5948 44.8118 68.4755 47.8352 67.6075 50.2518C66.7178 52.7225 65.0686 54.5214 62.2802 55.9519C56.9421 58.6935 44.7359 61.8253 24.9457 58.6068L23.0036 58.2709C23.0036 58.2709 22.9927 58.2709 22.9819 58.2709C22.9602 58.2709 22.9385 58.2709 22.8951 58.2492C22.8191 58.2384 22.7215 58.2167 22.5804 58.1842C22.3092 58.1192 21.9294 58.0325 21.4737 57.9025C20.5515 57.6315 19.3038 57.2089 17.9909 56.5479C15.4629 55.2908 12.6094 53.156 11.5244 49.6883L11.4267 49.3523C11.4267 49.3523 11.4267 49.3415 11.4267 49.3307C11.4267 49.309 11.4159 49.2873 11.405 49.2548C11.3833 49.1898 11.3616 49.0814 11.3399 48.9514C11.2857 48.6913 11.2206 48.3012 11.1555 47.8027C11.0361 46.7949 10.9385 45.3319 11.047 43.4355C11.2531 39.6535 12.2513 34.181 15.3761 27.3647C15.3761 27.3647 15.3761 27.3647 15.3761 27.3431C15.3761 27.3214 15.3978 27.2997 15.4086 27.278C15.4412 27.2239 15.4737 27.1372 15.528 27.0288C15.6365 26.8121 15.7992 26.5086 16.0162 26.1402C16.4611 25.3925 17.1338 24.3955 18.0777 23.3227C19.9656 21.1987 22.9276 18.8146 27.2242 17.8826C30.5985 17.1458 33.962 16.7773 36.4791 16.5931C37.7377 16.5064 38.7902 16.4522 39.528 16.4305C39.8969 16.4197 40.1898 16.4089 40.3851 16.4089C40.4828 16.4089 40.5587 16.4089 40.613 16.4089H40.7757C40.7757 16.4089 40.7974 16.4089 40.8191 16.4089C40.8625 16.4089 40.9493 16.4089 41.047 16.4089C41.264 16.4089 41.5894 16.3764 42.0234 16.268C42.8806 16.0621 44.1609 15.5636 45.7341 14.3932C47.3833 13.1579 49.1844 12.0634 50.8661 11.4673L50.877 11.4782Z" stroke="url(#paint1_linear_4018_5046)"/>
+</g>
+<path d="M50.877 11.4782C52.537 10.893 54.2187 10.7413 55.499 11.6191C56.1392 12.0634 56.7468 12.952 57.3001 13.9164C57.8534 14.9134 58.3851 16.0838 58.8516 17.1999C59.3182 18.3161 59.7088 19.3889 59.9909 20.18C60.1319 20.5701 60.2404 20.9061 60.3164 21.1336C60.3598 21.242 60.3815 21.3395 60.4032 21.3937C60.4032 21.3937 60.4032 21.4046 60.4032 21.4154C60.4032 21.4154 60.4032 21.4262 60.414 21.4371C60.4466 21.4913 60.5008 21.5671 60.5659 21.6646C60.6961 21.8489 60.8697 22.1089 61.065 22.3799C61.4665 22.9434 61.8788 23.5069 62.0849 23.7128C62.15 23.7778 62.226 23.8753 62.291 23.9729C62.367 24.0704 62.4538 24.2113 62.5514 24.363C62.7467 24.6772 63.0071 25.0999 63.3001 25.6092C63.886 26.6387 64.6238 28.0366 65.3507 29.6513C66.8046 32.8806 68.2693 37.0636 68.4321 40.9864C68.5948 44.8118 68.4755 47.8352 67.6075 50.2518C66.7178 52.7225 65.0686 54.5214 62.2802 55.9519C56.9421 58.6935 44.7359 61.8253 24.9457 58.6068L23.0036 58.2709C23.0036 58.2709 22.9927 58.2709 22.9819 58.2709C22.9602 58.2709 22.9385 58.2709 22.8951 58.2492C22.8191 58.2384 22.7215 58.2167 22.5804 58.1842C22.3092 58.1192 21.9294 58.0325 21.4737 57.9025C20.5515 57.6315 19.3038 57.2089 17.9909 56.5479C15.4629 55.2908 12.6094 53.156 11.5244 49.6883L11.4267 49.3523C11.4267 49.3523 11.4267 49.3415 11.4267 49.3307C11.4267 49.309 11.4159 49.2873 11.405 49.2548C11.3833 49.1898 11.3616 49.0814 11.3399 48.9514C11.2857 48.6913 11.2206 48.3012 11.1555 47.8027C11.0361 46.7949 10.9385 45.3319 11.047 43.4355C11.2531 39.6535 12.2513 34.181 15.3761 27.3647C15.3761 27.3647 15.3761 27.3647 15.3761 27.3431C15.3761 27.3214 15.3978 27.2997 15.4086 27.278C15.4412 27.2239 15.4737 27.1372 15.528 27.0288C15.6365 26.8121 15.7992 26.5086 16.0162 26.1402C16.4611 25.3925 17.1338 24.3955 18.0777 23.3227C19.9656 21.1987 22.9276 18.8146 27.2242 17.8826C30.5985 17.1458 33.962 16.7773 36.4791 16.5931C37.7377 16.5064 38.7902 16.4522 39.528 16.4305C39.8969 16.4197 40.1898 16.4089 40.3851 16.4089C40.4828 16.4089 40.5587 16.4089 40.613 16.4089H40.7757C40.7757 16.4089 40.7974 16.4089 40.8191 16.4089C40.8625 16.4089 40.9493 16.4089 41.047 16.4089C41.264 16.4089 41.5894 16.3763 42.0234 16.268C42.8806 16.0621 44.1609 15.5636 45.7341 14.3932C47.3833 13.1579 49.1844 12.0634 50.8661 11.4673L50.877 11.4782Z" fill="url(#paint2_linear_4018_5046)" stroke="url(#paint3_linear_4018_5046)"/>
+<path d="M19.4652 33.2703C20.5827 29.64 23.1976 26.6166 26.7021 25.0995C28.0366 24.5251 29.5882 24.1025 31.335 24.0266C37.259 23.7557 45.288 22.7804 51.7545 24.6552C54.2174 25.3704 56.4308 26.7683 58.0475 28.7623C58.5574 29.3908 59.4254 31.103 59.7509 32.0783C60.5755 34.5491 61.7039 43.446 61.7039 44.4321C61.7039 46.0576 61.4435 51.866 53.3928 53.5349C45.3422 55.2146 37.3892 55.8973 24.9119 53.1231C24.9119 53.1231 17.816 51.5951 18.0547 44.0962C18.2175 39.0571 18.7057 37.7567 19.4652 33.2703Z" fill="url(#paint4_linear_4018_5046)"/>
+<path d="M18.1306 43.0459C18.1306 43.0459 25.107 43.6853 25.4651 53.2866C25.4651 53.2866 17.1541 51.9861 18.1306 43.0459Z" fill="#C8A9FD"/>
+<path d="M61.6171 43.5322C61.6171 43.5322 54.7925 44.009 54.4453 53.2852C54.4453 53.2852 62.5936 51.4972 61.6171 43.5322Z" fill="#C8A9FD"/>
+<path d="M33.8594 38.8477C33.3082 38.8477 32.8594 38.4291 32.8594 37.9201V34.7753C32.8594 34.2639 33.3106 33.8477 33.8594 33.8477C34.4106 33.8477 34.8594 34.2662 34.8594 34.7753V37.9201C34.8594 38.4291 34.4082 38.8477 33.8594 38.8477Z" fill="#8B45FF"/>
+<path d="M37.8602 39.8865C38.7951 40.1985 40.334 40.5232 41.9182 40.0561C42.4134 39.9095 42.8962 40.276 42.8572 40.7766C42.8366 41.0404 42.6702 41.2792 42.4195 41.3881C40.3464 42.2866 38.226 41.6541 37.3014 41.2855C37.0137 41.1703 36.837 40.8897 36.8617 40.5839L36.8658 40.5252C36.9048 40.0498 37.4 39.7336 37.8602 39.8865Z" fill="#8B45FF"/>
+<path d="M46.8594 34.8477L44.8594 36.469L46.7834 37.8477" stroke="#9B5FFF" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+<foreignObject x="22.1406" y="20.1436" width="74.1191" height="72.9844"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(12px);clip-path:url(#bgblur_0_4018_5046_clip_path);height:100%;width:100%"></div></foreignObject><path data-figma-bg-blur-radius="24" d="M71.5941 53.4311C73.3429 59.9577 69.3998 66.6789 62.7982 68.4478C56.1944 70.217 49.4221 66.367 47.6733 59.8406C47.1049 57.7195 47.1374 55.5766 47.6676 53.59C47.7944 53.1152 47.7631 52.6176 47.548 52.1966L46.6422 50.4233C45.8301 48.8331 47.1054 46.976 48.8813 47.1624L50.7591 47.3598C51.2428 47.4106 51.7309 47.251 52.1332 46.9452C53.3882 45.9908 54.8483 45.2583 56.4683 44.8241C63.0699 43.0552 69.8453 46.9044 71.5941 53.4311Z" fill="#BA90FF" fill-opacity="0.35" stroke="url(#paint5_linear_4018_5046)" stroke-width="0.5" stroke-linecap="round" stroke-linejoin="round"/>
+<foreignObject x="37.1465" y="33" width="45.4414" height="44.7061"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(7.5px);clip-path:url(#bgblur_1_4018_5046_clip_path);height:100%;width:100%"></div></foreignObject><g filter="url(#filter2_d_4018_5046)" data-figma-bg-blur-radius="15">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M56.2039 57.426L56.7046 53.6577H53.8412C53.3213 53.6577 52.8997 53.2359 52.8997 52.7157C52.8997 52.1954 53.3213 51.7736 53.8412 51.7736H56.9549L57.3476 48.818C57.4161 48.3023 57.8895 47.9398 58.405 48.0083C58.9205 48.0769 59.2828 48.5506 59.2143 49.0663L58.8545 51.7736H62.0772L62.4538 48.9392C62.5224 48.4234 62.9958 48.0609 63.5112 48.1295C64.0267 48.198 64.389 48.6717 64.3205 49.1875L63.9769 51.7736H66.6461C67.1661 51.7736 67.5877 52.1954 67.5877 52.7157C67.5877 53.2359 67.1661 53.6577 66.6461 53.6577H63.7265L63.2258 57.426H65.8929C66.4129 57.426 66.8344 57.8478 66.8344 58.3681C66.8344 58.8884 66.4129 59.3101 65.8929 59.3101H62.9755L62.633 61.8879C62.5645 62.4036 62.091 62.7661 61.5756 62.6976C61.0601 62.629 60.6978 62.1553 60.7663 61.6396L61.0758 59.3101H57.8532L57.5268 61.7667C57.4582 62.2825 56.9848 62.645 56.4694 62.5764C55.9539 62.5079 55.5916 62.0342 55.6601 61.5184L55.9535 59.3101H53.088C52.568 59.3101 52.1465 58.8884 52.1465 58.3681C52.1465 57.8478 52.568 57.426 53.088 57.426H56.2039ZM58.1035 57.426H61.3262L61.8269 53.6577H58.6042L58.1035 57.426Z" fill="url(#paint6_linear_4018_5046)"/>
+<path d="M58.3789 48.207C58.7846 48.2612 59.0696 48.6338 59.0156 49.04L58.6562 51.7471L58.626 51.9736H62.252L62.2754 51.7998L62.6523 48.9658C62.7063 48.5596 63.0787 48.2744 63.4844 48.3281C63.8903 48.3821 64.1761 48.7548 64.1221 49.1611L63.7783 51.7471L63.748 51.9736H66.6465C67.0558 51.9738 67.3877 52.306 67.3877 52.7158C67.3876 53.1256 67.0557 53.4578 66.6465 53.458H63.5518L63.5283 53.6318L63.0273 57.3994L62.9971 57.626H65.8926C66.302 57.626 66.6348 57.9582 66.6348 58.3682C66.6347 58.7781 66.302 59.1104 65.8926 59.1104H62.8008L62.7773 59.2842L62.4346 61.8613C62.3806 62.2677 62.0074 62.553 61.6016 62.499C61.1959 62.4448 60.9109 62.0722 60.9648 61.666L61.2744 59.3369L61.3037 59.1104H57.6777L57.6553 59.2842L57.3281 61.7402C57.2741 62.1465 56.9018 62.4317 56.4961 62.3779C56.0903 62.3239 55.8045 61.9512 55.8584 61.5449L56.1514 59.3369L56.1816 59.1104H53.0879C52.6786 59.1103 52.3467 58.778 52.3467 58.3682C52.3467 57.9583 52.6785 57.626 53.0879 57.626H56.3789L56.4023 57.4521L56.9023 53.6836L56.9326 53.458H53.8408C53.4316 53.4578 53.0997 53.1255 53.0996 52.7158C53.0996 52.306 53.4316 51.9739 53.8408 51.9736H57.1299L57.1533 51.7998L57.5459 48.8447C57.5999 48.4384 57.9731 48.153 58.3789 48.207ZM58.4062 53.6318L57.9053 57.3994L57.875 57.626H61.501L61.5244 57.4521L62.0254 53.6836L62.0557 53.458H58.4287L58.4062 53.6318Z" stroke="url(#paint7_linear_4018_5046)" stroke-width="0.4"/>
+</g>
+<defs>
+<filter id="filter0_f_4018_5046" x="0.5" y="0.5" width="78.4941" height="69.9707" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="5" result="effect1_foregroundBlur_4018_5046"/>
+</filter>
+<clipPath id="bgblur_0_4018_5046_clip_path" transform="translate(-22.1406 -20.1436)"><path d="M71.5941 53.4311C73.3429 59.9577 69.3998 66.6789 62.7982 68.4478C56.1944 70.217 49.4221 66.367 47.6733 59.8406C47.1049 57.7195 47.1374 55.5766 47.6676 53.59C47.7944 53.1152 47.7631 52.6176 47.548 52.1966L46.6422 50.4233C45.8301 48.8331 47.1054 46.976 48.8813 47.1624L50.7591 47.3598C51.2428 47.4106 51.7309 47.251 52.1332 46.9452C53.3882 45.9908 54.8483 45.2583 56.4683 44.8241C63.0699 43.0552 69.8453 46.9044 71.5941 53.4311Z"/>
+</clipPath><filter id="filter2_d_4018_5046" x="37.1465" y="33" width="45.4414" height="44.7061" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dx="5" dy="5"/>
+<feGaussianBlur stdDeviation="5"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0.577356 0 0 0 0 0.359375 0 0 0 0 0.9375 0 0 0 0.5 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_4018_5046"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_4018_5046" result="shape"/>
+</filter>
+<clipPath id="bgblur_1_4018_5046_clip_path" transform="translate(-37.1465 -33)"><path fill-rule="evenodd" clip-rule="evenodd" d="M56.2039 57.426L56.7046 53.6577H53.8412C53.3213 53.6577 52.8997 53.2359 52.8997 52.7157C52.8997 52.1954 53.3213 51.7736 53.8412 51.7736H56.9549L57.3476 48.818C57.4161 48.3023 57.8895 47.9398 58.405 48.0083C58.9205 48.0769 59.2828 48.5506 59.2143 49.0663L58.8545 51.7736H62.0772L62.4538 48.9392C62.5224 48.4234 62.9958 48.0609 63.5112 48.1295C64.0267 48.198 64.389 48.6717 64.3205 49.1875L63.9769 51.7736H66.6461C67.1661 51.7736 67.5877 52.1954 67.5877 52.7157C67.5877 53.2359 67.1661 53.6577 66.6461 53.6577H63.7265L63.2258 57.426H65.8929C66.4129 57.426 66.8344 57.8478 66.8344 58.3681C66.8344 58.8884 66.4129 59.3101 65.8929 59.3101H62.9755L62.633 61.8879C62.5645 62.4036 62.091 62.7661 61.5756 62.6976C61.0601 62.629 60.6978 62.1553 60.7663 61.6396L61.0758 59.3101H57.8532L57.5268 61.7667C57.4582 62.2825 56.9848 62.645 56.4694 62.5764C55.9539 62.5079 55.5916 62.0342 55.6601 61.5184L55.9535 59.3101H53.088C52.568 59.3101 52.1465 58.8884 52.1465 58.3681C52.1465 57.8478 52.568 57.426 53.088 57.426H56.2039ZM58.1035 57.426H61.3262L61.8269 53.6577H58.6042L58.1035 57.426Z"/>
+</clipPath><linearGradient id="paint0_linear_4018_5046" x1="39.745" y1="11.5432" x2="39.745" y2="59.4413" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFEBCB"/>
+<stop offset="0.0001" stop-color="#DA96FF"/>
+<stop offset="1" stop-color="#CB4BFD"/>
+</linearGradient>
+<linearGradient id="paint1_linear_4018_5046" x1="21.1699" y1="16.8423" x2="58.2678" y2="60.0929" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0.1"/>
+</linearGradient>
+<linearGradient id="paint2_linear_4018_5046" x1="39.745" y1="11.5432" x2="39.745" y2="59.4413" gradientUnits="userSpaceOnUse">
+<stop offset="0.04" stop-color="#E7D7FF"/>
+<stop offset="0.32" stop-color="#C19DFB"/>
+<stop offset="1" stop-color="#AC7AFF"/>
+</linearGradient>
+<linearGradient id="paint3_linear_4018_5046" x1="21.1699" y1="16.8423" x2="58.2678" y2="60.0929" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0.1"/>
+</linearGradient>
+<linearGradient id="paint4_linear_4018_5046" x1="39.8739" y1="23.5282" x2="39.8739" y2="54.987" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FDF4FF"/>
+<stop offset="1" stop-color="#E9D8FF"/>
+</linearGradient>
+<linearGradient id="paint5_linear_4018_5046" x1="66.2819" y1="45.4936" x2="45.7065" y2="72.0017" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+<linearGradient id="paint6_linear_4018_5046" x1="66.4929" y1="50.6556" x2="49.2948" y2="51.2444" gradientUnits="userSpaceOnUse">
+<stop stop-color="white"/>
+<stop offset="1" stop-color="white" stop-opacity="0.2"/>
+</linearGradient>
+<linearGradient id="paint7_linear_4018_5046" x1="54.6045" y1="49.7133" x2="63.8788" y2="61.7741" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+</defs>
+</svg>

src/assets/svg/culture/valid_comments.svg

+<svg width="60" height="58" viewBox="0 0 60 58" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="13" y="14" width="36" height="36" fill="#FFF0E5"/>
+<g opacity="0.5" filter="url(#filter0_f_4018_5780)">
+<path d="M35.9844 22.5748L29.1543 20.2148C26.6768 19.3588 24.5982 20.2096 23.5081 22.5215L19.8161 30.3518C18.7082 32.7016 19.5287 34.519 22.0062 35.375L28.8363 37.735C31.3536 38.6048 33.3772 37.7702 34.4852 35.4203L38.1772 27.5901C39.2673 25.2782 38.5017 23.4446 35.9844 22.5748Z" fill="#EB6F0A"/>
+</g>
+<path d="M16 22C16 19.7909 17.7909 18 20 18H42V35C42 37.2091 40.2091 39 38 39H16V22Z" fill="url(#paint0_linear_4018_5780)"/>
+<foreignObject x="-4.5" y="-2.5" width="75" height="72"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(12px);clip-path:url(#bgblur_0_4018_5780_clip_path);height:100%;width:100%"></div></foreignObject><path data-figma-bg-blur-radius="24" d="M46 21.75C46.1381 21.75 46.25 21.8619 46.25 22V41C46.25 43.3472 44.3472 45.25 42 45.25H20C19.8619 45.25 19.75 45.1381 19.75 45V26C19.75 23.6528 21.6528 21.75 24 21.75H46Z" fill="#FFCBB9" fill-opacity="0.35" stroke="url(#paint1_linear_4018_5780)" stroke-width="0.5" stroke-linecap="round" stroke-linejoin="round"/>
+<foreignObject x="18" y="15" width="41.4297" height="38.6406"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(7.5px);clip-path:url(#bgblur_1_4018_5780_clip_path);height:100%;width:100%"></div></foreignObject><g filter="url(#filter2_d_4018_5780)" data-figma-bg-blur-radius="15">
+<path d="M44.256 31.741C44.1619 31.8998 44.0425 32.0291 43.9484 32.1251C43.3875 32.7013 42.823 33.2775 42.2584 33.8537L41.674 34.4503C41.3248 34.8067 40.9756 35.165 40.6264 35.5214C39.7579 36.4135 38.8604 37.335 37.9629 38.2307C37.7458 38.4468 37.4563 38.6407 37.1161 38.6407C36.8484 38.6407 36.5462 38.5207 36.2241 38.1975C35.7229 37.6952 35.2217 37.1799 34.7368 36.6794C34.5142 36.4485 34.2881 36.2177 34.0637 35.9868C33.9841 35.9037 33.9027 35.8225 33.8213 35.7412C33.6729 35.5916 33.5209 35.4402 33.3725 35.2832C32.9546 34.8344 32.8858 34.3228 33.1789 33.8408C33.4539 33.3902 33.8991 33.3071 34.2103 33.2831L34.2917 33.2757L34.3677 33.3089C34.3804 33.3163 34.3984 33.3219 34.4184 33.3274C34.5124 33.3588 34.6554 33.4087 34.7748 33.5158C35.1873 33.8962 35.589 34.2933 35.9256 34.6331C36.3074 35.0154 36.6928 35.4106 37.0981 35.8335C38.7681 34.1215 40.4943 32.3578 42.2277 30.5922L42.2566 30.5645C42.4611 30.3558 42.7144 30.0954 43.0962 30.0234C43.5702 29.9329 43.9773 30.1065 44.2397 30.5147C44.4876 30.9007 44.493 31.3365 44.2542 31.741H44.256Z" fill="url(#paint2_linear_4018_5780)"/>
+<path d="M43.1338 30.2197C43.5277 30.1446 43.8532 30.2837 44.0713 30.623C44.2771 30.9437 44.2835 31.2985 44.082 31.6396L44.0703 31.6582C43.9907 31.7869 43.8925 31.8967 43.8057 31.9854H43.8047C43.2441 32.5613 42.6798 33.1376 42.1152 33.7139L41.5312 34.3105C41.3566 34.4888 41.1814 34.6671 41.0068 34.8457L40.4834 35.3818C39.6147 36.274 38.7176 37.1943 37.8213 38.0889C37.6196 38.2895 37.3787 38.4404 37.1162 38.4404C36.9145 38.4404 36.6608 38.3521 36.3662 38.0566H36.3652C35.8651 37.5554 35.3647 37.0404 34.8799 36.54L34.207 35.8477C34.1259 35.763 34.0428 35.6803 33.9619 35.5996C33.8127 35.4492 33.6635 35.2999 33.5176 35.1455C33.3315 34.9452 33.2332 34.7424 33.207 34.5479C33.1811 34.3544 33.223 34.151 33.3486 33.9443L33.3496 33.9453C33.5723 33.5804 33.9309 33.5052 34.2256 33.4824H34.2285L34.2578 33.4795L34.2871 33.4922V33.4893C34.3138 33.5022 34.3393 33.512 34.3555 33.5166V33.5176C34.4252 33.5409 34.5028 33.5685 34.5732 33.6133L34.6416 33.665C35.05 34.0418 35.4484 34.4354 35.7832 34.7734L35.7842 34.7744C36.1648 35.1555 36.5496 35.5496 36.9541 35.9717L37.0967 36.1211L37.2412 35.9736C38.9098 34.2631 40.6343 32.5004 42.3662 30.7363L42.3945 30.709L42.3994 30.7041C42.609 30.4902 42.8216 30.2786 43.1328 30.2197H43.1338Z" stroke="url(#paint3_linear_4018_5780)" stroke-width="0.4"/>
+</g>
+<foreignObject x="9" y="5" width="47" height="33"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(7.5px);clip-path:url(#bgblur_2_4018_5780_clip_path);height:100%;width:100%"></div></foreignObject><g filter="url(#filter3_d_4018_5780)" data-figma-bg-blur-radius="15">
+<path d="M39.5325 23H25.4675C24.657 23 24 22.3284 24 21.5C24 20.6716 24.657 20 25.4675 20H39.5325C40.343 20 41 20.6716 41 21.5C41 22.3284 40.343 23 39.5325 23Z" fill="url(#paint4_linear_4018_5780)"/>
+<path d="M25.4678 20.2002H39.5322C40.2281 20.2002 40.7998 20.7779 40.7998 21.5C40.7998 22.2221 40.2281 22.7998 39.5322 22.7998H25.4678C24.7719 22.7998 24.2002 22.2221 24.2002 21.5C24.2002 20.7779 24.7719 20.2002 25.4678 20.2002Z" stroke="url(#paint5_linear_4018_5780)" stroke-width="0.4"/>
+</g>
+<foreignObject x="7" y="15" width="37.3848" height="31.9326"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(7.5px);clip-path:url(#bgblur_3_4018_5780_clip_path);height:100%;width:100%"></div></foreignObject><path opacity="0.7" data-figma-bg-blur-radius="15" d="M21.9994 30.9665C21.9994 31.5062 22.424 31.9329 22.9931 31.9329L28.3898 31.9329C28.9589 31.9329 29.3848 31.5062 29.3848 30.9665C29.3848 30.4142 28.9589 30 28.3898 30L22.9931 30C22.424 30 21.9994 30.4142 21.9994 30.9665Z" fill="url(#paint6_linear_4018_5780)" fill-opacity="0.5"/>
+<foreignObject x="7" y="21" width="40.3848" height="31.9326"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(7.5px);clip-path:url(#bgblur_4_4018_5780_clip_path);height:100%;width:100%"></div></foreignObject><path opacity="0.7" data-figma-bg-blur-radius="15" d="M21.9994 36.9665C21.9994 37.5062 22.424 37.9329 22.9931 37.9329L31.3898 37.9329C31.9589 37.9329 32.3848 37.5062 32.3848 36.9665C32.3848 36.4142 31.9589 36 31.3898 36L22.9931 36C22.424 36 21.9994 36.4142 21.9994 36.9665Z" fill="url(#paint7_linear_4018_5780)" fill-opacity="0.5"/>
+<defs>
+<filter id="filter0_f_4018_5780" x="0.332031" y="0.888672" width="57.3281" height="56.1826" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="9.5" result="effect1_foregroundBlur_4018_5780"/>
+</filter>
+<clipPath id="bgblur_0_4018_5780_clip_path" transform="translate(4.5 2.5)"><path d="M46 21.75C46.1381 21.75 46.25 21.8619 46.25 22V41C46.25 43.3472 44.3472 45.25 42 45.25H20C19.8619 45.25 19.75 45.1381 19.75 45V26C19.75 23.6528 21.6528 21.75 24 21.75H46Z"/>
+</clipPath><filter id="filter2_d_4018_5780" x="18" y="15" width="41.4297" height="38.6406" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dx="5" dy="5"/>
+<feGaussianBlur stdDeviation="5"/>
+<feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 0.537255 0 0 0 0 0.160784 0 0 0 0.2 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_4018_5780"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_4018_5780" result="shape"/>
+</filter>
+<clipPath id="bgblur_1_4018_5780_clip_path" transform="translate(-18 -15)"><path d="M44.256 31.741C44.1619 31.8998 44.0425 32.0291 43.9484 32.1251C43.3875 32.7013 42.823 33.2775 42.2584 33.8537L41.674 34.4503C41.3248 34.8067 40.9756 35.165 40.6264 35.5214C39.7579 36.4135 38.8604 37.335 37.9629 38.2307C37.7458 38.4468 37.4563 38.6407 37.1161 38.6407C36.8484 38.6407 36.5462 38.5207 36.2241 38.1975C35.7229 37.6952 35.2217 37.1799 34.7368 36.6794C34.5142 36.4485 34.2881 36.2177 34.0637 35.9868C33.9841 35.9037 33.9027 35.8225 33.8213 35.7412C33.6729 35.5916 33.5209 35.4402 33.3725 35.2832C32.9546 34.8344 32.8858 34.3228 33.1789 33.8408C33.4539 33.3902 33.8991 33.3071 34.2103 33.2831L34.2917 33.2757L34.3677 33.3089C34.3804 33.3163 34.3984 33.3219 34.4184 33.3274C34.5124 33.3588 34.6554 33.4087 34.7748 33.5158C35.1873 33.8962 35.589 34.2933 35.9256 34.6331C36.3074 35.0154 36.6928 35.4106 37.0981 35.8335C38.7681 34.1215 40.4943 32.3578 42.2277 30.5922L42.2566 30.5645C42.4611 30.3558 42.7144 30.0954 43.0962 30.0234C43.5702 29.9329 43.9773 30.1065 44.2397 30.5147C44.4876 30.9007 44.493 31.3365 44.2542 31.741H44.256Z"/>
+</clipPath><filter id="filter3_d_4018_5780" x="9" y="5" width="47" height="33" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dx="5" dy="5"/>
+<feGaussianBlur stdDeviation="5"/>
+<feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 0.521569 0 0 0 0 0.133333 0 0 0 0.5 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_4018_5780"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_4018_5780" result="shape"/>
+</filter>
+<clipPath id="bgblur_2_4018_5780_clip_path" transform="translate(-9 -5)"><path d="M39.5325 23H25.4675C24.657 23 24 22.3284 24 21.5C24 20.6716 24.657 20 25.4675 20H39.5325C40.343 20 41 20.6716 41 21.5C41 22.3284 40.343 23 39.5325 23Z"/>
+</clipPath><clipPath id="bgblur_3_4018_5780_clip_path" transform="translate(-7 -15)"><path d="M21.9994 30.9665C21.9994 31.5062 22.424 31.9329 22.9931 31.9329L28.3898 31.9329C28.9589 31.9329 29.3848 31.5062 29.3848 30.9665C29.3848 30.4142 28.9589 30 28.3898 30L22.9931 30C22.424 30 21.9994 30.4142 21.9994 30.9665Z"/>
+</clipPath><clipPath id="bgblur_4_4018_5780_clip_path" transform="translate(-7 -21)"><path d="M21.9994 36.9665C21.9994 37.5062 22.424 37.9329 22.9931 37.9329L31.3898 37.9329C31.9589 37.9329 32.3848 37.5062 32.3848 36.9665C32.3848 36.4142 31.9589 36 31.3898 36L22.9931 36C22.424 36 21.9994 36.4142 21.9994 36.9665Z"/>
+</clipPath><linearGradient id="paint0_linear_4018_5780" x1="53.3045" y1="36.2368" x2="14.8705" y2="37.4058" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFB37F"/>
+<stop offset="1" stop-color="#FF7B0D"/>
+</linearGradient>
+<linearGradient id="paint1_linear_4018_5780" x1="24.1388" y1="24.6795" x2="40.7996" y2="47.4224" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+<linearGradient id="paint2_linear_4018_5780" x1="43.9066" y1="31.3096" x2="17.7011" y2="20.7417" gradientUnits="userSpaceOnUse">
+<stop offset="0.0257719" stop-color="white"/>
+<stop offset="1" stop-color="white" stop-opacity="0.2"/>
+</linearGradient>
+<linearGradient id="paint3_linear_4018_5780" x1="38.5535" y1="31.3065" x2="42.2623" y2="36.8999" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+<linearGradient id="paint4_linear_4018_5780" x1="39.7947" y1="20.5417" x2="21.4639" y2="23.9285" gradientUnits="userSpaceOnUse">
+<stop stop-color="white"/>
+<stop offset="1" stop-color="white" stop-opacity="0.2"/>
+</linearGradient>
+<linearGradient id="paint5_linear_4018_5780" x1="26.7061" y1="20.3495" x2="27.2529" y2="24.1869" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+<linearGradient id="paint6_linear_4018_5780" x1="27.5015" y1="30.9392" x2="26.7911" y2="28.679" gradientUnits="userSpaceOnUse">
+<stop stop-color="white"/>
+<stop offset="1" stop-color="white" stop-opacity="0.2"/>
+</linearGradient>
+<linearGradient id="paint7_linear_4018_5780" x1="27.5015" y1="36.9392" x2="26.7911" y2="34.679" gradientUnits="userSpaceOnUse">
+<stop stop-color="white"/>
+<stop offset="1" stop-color="white" stop-opacity="0.2"/>
+</linearGradient>
+</defs>
+</svg>

src/assets/svg/culture/video_publish.svg

+<svg width="34" height="35" viewBox="0 0 34 35" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g filter="url(#filter0_f_4018_5793)">
+<path d="M22.6699 9.77812C23.1007 9.55489 23.6061 9.57823 24.0173 9.84204C24.4285 10.1059 24.6738 10.5614 24.6738 11.0607V18.7336C24.6738 19.2328 24.4285 19.6884 24.0173 19.9512C23.7926 20.0943 23.5414 20.1673 23.2882 20.1673C23.0772 20.1673 22.8662 20.1176 22.669 20.0141L11.4219 14.9885L22.6699 9.77812Z" fill="#FC5D00"/>
+</g>
+<path d="M3 9C3 6.79086 4.79086 5 7 5H17C19.2091 5 21 6.79086 21 9V21C21 23.2091 19.2091 25 17 25H7C4.79086 25 3 23.2091 3 21V9Z" fill="url(#paint0_linear_4018_5793)"/>
+<path d="M26.9967 6.55256C27.6625 6.20177 28.4435 6.23845 29.079 6.65301C29.7144 7.06758 30.0936 7.7835 30.0936 8.56798V20.6254C30.0936 21.4099 29.7144 22.1258 29.079 22.5388C28.7317 22.7636 28.3434 22.8784 27.9521 22.8784C27.6261 22.8784 27.3 22.8003 26.9951 22.6377L9.61328 14.7403L26.9967 6.55256Z" fill="url(#paint1_linear_4018_5793)"/>
+<foreignObject x="-23.9219" y="-21.5" width="70.3848" height="71.8896"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(12px);clip-path:url(#bgblur_0_4018_5793_clip_path);height:100%;width:100%"></div></foreignObject><path data-figma-bg-blur-radius="24" d="M15.6875 2.75C17.5935 2.75 19.2275 3.40798 20.3857 4.55176C21.5442 5.69587 22.2119 7.31161 22.2119 9.19727V19.6924C22.2119 21.5773 21.5442 23.1926 20.3857 24.3369C19.2275 25.481 17.5936 26.1396 15.6875 26.1396H6.85254C4.94642 26.1396 3.31255 25.481 2.1543 24.3369C0.995874 23.1926 0.328125 21.5772 0.328125 19.6924V9.19727L0.335938 8.84668C0.413479 7.11124 1.06817 5.62439 2.1543 4.55176C3.31256 3.40796 4.94654 2.75 6.85254 2.75H15.6875Z" fill="url(#paint2_linear_4018_5793)" fill-opacity="0.3" stroke="url(#paint3_linear_4018_5793)" stroke-width="0.5" stroke-linecap="round" stroke-linejoin="round"/>
+<foreignObject x="-6.75977" y="-5.13281" width="36.9512" height="39.1562"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(7.5px);clip-path:url(#bgblur_1_4018_5793_clip_path);height:100%;width:100%"></div></foreignObject><g filter="url(#filter2_d_4018_5793)" data-figma-bg-blur-radius="15">
+<path d="M8.24023 18.0215V10.8685C8.24023 10.0698 9.13038 9.59343 9.79494 10.0365L14.747 13.3379C15.3149 13.7165 15.345 14.5402 14.8063 14.9593L9.85418 18.8109C9.19732 19.3218 8.24023 18.8537 8.24023 18.0215Z" fill="url(#paint4_linear_4018_5793)"/>
+<path d="M8.44043 10.8682C8.44069 10.2295 9.15207 9.84895 9.68359 10.2031L14.6357 13.5039C15.0901 13.8068 15.1146 14.4665 14.6836 14.8018L9.73145 18.6533C9.20596 19.0619 8.44043 18.6872 8.44043 18.0215V10.8682Z" stroke="url(#paint5_linear_4018_5793)" stroke-width="0.4"/>
+</g>
+<foreignObject x="-21.5" y="3.5" width="65" height="51"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(12px);clip-path:url(#bgblur_2_4018_5793_clip_path);height:100%;width:100%"></div></foreignObject><rect data-figma-bg-blur-radius="24" x="2.75" y="27.75" width="16.5" height="2.5" rx="1.25" fill="url(#paint6_linear_4018_5793)" stroke="url(#paint7_linear_4018_5793)" stroke-width="0.5" stroke-linecap="round" stroke-linejoin="round"/>
+<defs>
+<filter id="filter0_f_4018_5793" x="2.42188" y="0.625977" width="31.252" height="28.541" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="4.5" result="effect1_foregroundBlur_4018_5793"/>
+</filter>
+<clipPath id="bgblur_0_4018_5793_clip_path" transform="translate(23.9219 21.5)"><path d="M15.6875 2.75C17.5935 2.75 19.2275 3.40798 20.3857 4.55176C21.5442 5.69587 22.2119 7.31161 22.2119 9.19727V19.6924C22.2119 21.5773 21.5442 23.1926 20.3857 24.3369C19.2275 25.481 17.5936 26.1396 15.6875 26.1396H6.85254C4.94642 26.1396 3.31255 25.481 2.1543 24.3369C0.995874 23.1926 0.328125 21.5772 0.328125 19.6924V9.19727L0.335938 8.84668C0.413479 7.11124 1.06817 5.62439 2.1543 4.55176C3.31256 3.40796 4.94654 2.75 6.85254 2.75H15.6875Z"/>
+</clipPath><filter id="filter2_d_4018_5793" x="-6.75977" y="-5.13281" width="36.9512" height="39.1562" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dx="5" dy="5"/>
+<feGaussianBlur stdDeviation="5"/>
+<feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 0.521569 0 0 0 0 0.133333 0 0 0 0.5 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_4018_5793"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_4018_5793" result="shape"/>
+</filter>
+<clipPath id="bgblur_1_4018_5793_clip_path" transform="translate(6.75977 5.13281)"><path d="M8.24023 18.0215V10.8685C8.24023 10.0698 9.13038 9.59343 9.79494 10.0365L14.747 13.3379C15.3149 13.7165 15.345 14.5402 14.8063 14.9593L9.85418 18.8109C9.19732 19.3218 8.24023 18.8537 8.24023 18.0215Z"/>
+</clipPath><clipPath id="bgblur_2_4018_5793_clip_path" transform="translate(21.5 -3.5)"><rect x="2.75" y="27.75" width="16.5" height="2.5" rx="1.25"/>
+</clipPath><linearGradient id="paint0_linear_4018_5793" x1="28.8262" y1="22.3684" x2="2.20647" y2="22.957" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FF7B0D"/>
+<stop offset="1" stop-color="#FFF3EB"/>
+</linearGradient>
+<linearGradient id="paint1_linear_4018_5793" x1="21.0401" y1="6.31348" x2="21.0401" y2="22.8784" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFB37F"/>
+<stop offset="1" stop-color="#FF7B0D"/>
+</linearGradient>
+<linearGradient id="paint2_linear_4018_5793" x1="19.4732" y1="24.6853" x2="11.6333" y2="2.78791" gradientUnits="userSpaceOnUse">
+<stop offset="0.00365973" stop-color="#FFF0E8"/>
+<stop offset="1" stop-color="#FFE1B9"/>
+</linearGradient>
+<linearGradient id="paint3_linear_4018_5793" x1="2.88823" y1="6.48513" x2="27.9004" y2="24.0759" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+<linearGradient id="paint4_linear_4018_5793" x1="22.7827" y1="28.946" x2="18.1147" y2="8.05024" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.2"/>
+<stop offset="0.399023" stop-color="white" stop-opacity="0.723067"/>
+<stop offset="1" stop-color="white"/>
+</linearGradient>
+<linearGradient id="paint5_linear_4018_5793" x1="21.9516" y1="28.3416" x2="17.6995" y2="8.27977" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.2"/>
+<stop offset="0.399023" stop-color="white" stop-opacity="0.723067"/>
+<stop offset="1" stop-color="white"/>
+</linearGradient>
+<linearGradient id="paint6_linear_4018_5793" x1="17.1378" y1="29.8948" x2="17.0477" y2="27.74" gradientUnits="userSpaceOnUse">
+<stop offset="0.00365973" stop-color="#FFDCC0"/>
+<stop offset="1" stop-color="#FFC697"/>
+</linearGradient>
+<linearGradient id="paint7_linear_4018_5793" x1="4.72849" y1="28.3045" x2="5.47898" y2="32.8244" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+</defs>
+</svg>

src/assets/svg/culture/video_release.svg

+<svg width="80" height="71" viewBox="0 0 80 71" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g opacity="0.2" filter="url(#filter0_f_4018_5078)">
+<path d="M51.1875 11.3571C52.8475 10.7719 54.5293 10.6202 55.8096 11.498C56.4497 11.9423 57.0573 12.8309 57.6106 13.7953C58.164 14.7923 58.6956 15.9627 59.1622 17.0788C59.6287 18.195 60.0193 19.2679 60.3014 20.0589C60.4425 20.449 60.551 20.785 60.6269 21.0126C60.6703 21.1209 60.692 21.2185 60.7137 21.2726C60.7137 21.2726 60.7137 21.2835 60.7137 21.2943C60.7137 21.2943 60.7137 21.3051 60.7246 21.316C60.7571 21.3702 60.8114 21.446 60.8765 21.5436C61.0067 21.7278 61.1803 21.9879 61.3756 22.2588C61.777 22.8223 62.1893 23.3858 62.3955 23.5917C62.4606 23.6567 62.5365 23.7542 62.6016 23.8518C62.6776 23.9493 62.7644 24.0902 62.862 24.2419C63.0573 24.5561 63.3177 24.9788 63.6106 25.4881C64.1965 26.5176 64.9343 27.9155 65.6613 29.5302C67.1152 32.7595 68.5799 36.9425 68.7426 40.8653C68.9054 44.6907 68.786 47.7141 67.9181 50.1307C67.0284 52.6014 65.3792 54.4003 62.5908 55.8308C57.2526 58.5724 45.0465 61.7042 25.2562 58.4858L23.3141 58.1498C23.3141 58.1498 23.3033 58.1498 23.2924 58.1498C23.2707 58.1498 23.249 58.1498 23.2056 58.1281C23.1297 58.1173 23.032 58.0956 22.891 58.0631C22.6197 57.9981 22.24 57.9114 21.7843 57.7814C20.862 57.5105 19.6143 57.0878 18.3015 56.4268C15.7734 55.1697 12.9199 53.0349 11.8349 49.5672L11.7373 49.2312C11.7373 49.2312 11.7373 49.2204 11.7373 49.2096C11.7373 49.1879 11.7264 49.1662 11.7156 49.1337C11.6939 49.0687 11.6722 48.9603 11.6505 48.8303C11.5962 48.5702 11.5311 48.1801 11.466 47.6816C11.3467 46.6738 11.249 45.2108 11.3575 43.3144C11.5637 39.5324 12.5619 34.0599 15.6866 27.2436C15.6866 27.2436 15.6866 27.2436 15.6866 27.222C15.6866 27.2003 15.7083 27.1786 15.7192 27.1569C15.7517 27.1028 15.7843 27.0161 15.8385 26.9077C15.947 26.691 16.1098 26.3875 16.3268 26.0191C16.7716 25.2714 17.4443 24.2744 18.3883 23.2016C20.2761 21.0776 23.2382 18.6935 27.5347 17.7616C30.909 17.0247 34.2725 16.6562 36.7897 16.472C38.0483 16.3853 39.1007 16.3311 39.8385 16.3094C40.2074 16.2986 40.5004 16.2878 40.6957 16.2878C40.7933 16.2878 40.8693 16.2878 40.9235 16.2878H41.0863C41.0863 16.2878 41.108 16.2878 41.1297 16.2878C41.1731 16.2878 41.2599 16.2878 41.3575 16.2878C41.5745 16.2878 41.9 16.2553 42.334 16.1469C43.1911 15.941 44.4714 15.4425 46.0447 14.2721C47.6938 13.0368 49.4949 11.9423 51.1767 11.3462L51.1875 11.3571Z" fill="url(#paint0_linear_4018_5078)"/>
+<path d="M51.1875 11.3571C52.8475 10.7719 54.5293 10.6202 55.8096 11.498C56.4497 11.9423 57.0573 12.8309 57.6106 13.7953C58.164 14.7923 58.6956 15.9627 59.1622 17.0788C59.6287 18.195 60.0193 19.2679 60.3014 20.0589C60.4425 20.449 60.551 20.785 60.6269 21.0126C60.6703 21.1209 60.692 21.2185 60.7137 21.2726C60.7137 21.2726 60.7137 21.2835 60.7137 21.2943C60.7137 21.2943 60.7137 21.3051 60.7246 21.316C60.7571 21.3702 60.8114 21.446 60.8765 21.5436C61.0067 21.7278 61.1803 21.9879 61.3756 22.2588C61.777 22.8223 62.1893 23.3858 62.3955 23.5917C62.4606 23.6567 62.5365 23.7542 62.6016 23.8518C62.6776 23.9493 62.7644 24.0902 62.862 24.2419C63.0573 24.5561 63.3177 24.9788 63.6106 25.4881C64.1965 26.5176 64.9343 27.9155 65.6613 29.5302C67.1152 32.7595 68.5799 36.9425 68.7426 40.8653C68.9054 44.6907 68.786 47.7141 67.9181 50.1307C67.0284 52.6014 65.3792 54.4003 62.5908 55.8308C57.2526 58.5724 45.0465 61.7042 25.2562 58.4858L23.3141 58.1498C23.3141 58.1498 23.3033 58.1498 23.2924 58.1498C23.2707 58.1498 23.249 58.1498 23.2056 58.1281C23.1297 58.1173 23.032 58.0956 22.891 58.0631C22.6197 57.9981 22.24 57.9114 21.7843 57.7814C20.862 57.5105 19.6143 57.0878 18.3015 56.4268C15.7734 55.1697 12.9199 53.0349 11.8349 49.5672L11.7373 49.2312C11.7373 49.2312 11.7373 49.2204 11.7373 49.2096C11.7373 49.1879 11.7264 49.1662 11.7156 49.1337C11.6939 49.0687 11.6722 48.9603 11.6505 48.8303C11.5962 48.5702 11.5311 48.1801 11.466 47.6816C11.3467 46.6738 11.249 45.2108 11.3575 43.3144C11.5637 39.5324 12.5619 34.0599 15.6866 27.2436C15.6866 27.2436 15.6866 27.2436 15.6866 27.222C15.6866 27.2003 15.7083 27.1786 15.7192 27.1569C15.7517 27.1028 15.7843 27.0161 15.8385 26.9077C15.947 26.691 16.1098 26.3875 16.3268 26.0191C16.7716 25.2714 17.4443 24.2744 18.3883 23.2016C20.2761 21.0776 23.2382 18.6935 27.5347 17.7616C30.909 17.0247 34.2725 16.6562 36.7897 16.472C38.0483 16.3853 39.1007 16.3311 39.8385 16.3094C40.2074 16.2986 40.5004 16.2878 40.6957 16.2878C40.7933 16.2878 40.8693 16.2878 40.9235 16.2878H41.0863C41.0863 16.2878 41.108 16.2878 41.1297 16.2878C41.1731 16.2878 41.2599 16.2878 41.3575 16.2878C41.5745 16.2878 41.9 16.2553 42.334 16.1469C43.1911 15.941 44.4714 15.4425 46.0447 14.2721C47.6938 13.0368 49.4949 11.9423 51.1767 11.3462L51.1875 11.3571Z" stroke="url(#paint1_linear_4018_5078)"/>
+</g>
+<path d="M51.1875 11.3571C52.8475 10.7719 54.5293 10.6202 55.8096 11.498C56.4497 11.9423 57.0573 12.8309 57.6106 13.7953C58.164 14.7923 58.6956 15.9627 59.1622 17.0788C59.6287 18.195 60.0193 19.2679 60.3014 20.0589C60.4425 20.449 60.551 20.785 60.6269 21.0126C60.6703 21.1209 60.692 21.2185 60.7137 21.2726C60.7137 21.2726 60.7137 21.2835 60.7137 21.2943C60.7137 21.2943 60.7137 21.3051 60.7246 21.316C60.7571 21.3702 60.8114 21.446 60.8765 21.5436C61.0067 21.7278 61.1803 21.9879 61.3756 22.2588C61.777 22.8223 62.1893 23.3858 62.3955 23.5917C62.4606 23.6567 62.5365 23.7542 62.6016 23.8518C62.6776 23.9493 62.7644 24.0902 62.862 24.2419C63.0573 24.5561 63.3177 24.9788 63.6106 25.4881C64.1965 26.5176 64.9343 27.9155 65.6613 29.5302C67.1152 32.7595 68.5799 36.9425 68.7426 40.8653C68.9054 44.6907 68.786 47.7141 67.9181 50.1307C67.0284 52.6014 65.3792 54.4003 62.5908 55.8308C57.2526 58.5724 45.0465 61.7042 25.2562 58.4858L23.3141 58.1498C23.3141 58.1498 23.3033 58.1498 23.2924 58.1498C23.2707 58.1498 23.249 58.1498 23.2056 58.1281C23.1297 58.1173 23.032 58.0956 22.891 58.0631C22.6197 57.9981 22.24 57.9114 21.7843 57.7814C20.862 57.5105 19.6143 57.0878 18.3015 56.4268C15.7734 55.1697 12.9199 53.0349 11.8349 49.5672L11.7373 49.2312C11.7373 49.2312 11.7373 49.2204 11.7373 49.2096C11.7373 49.1879 11.7264 49.1662 11.7156 49.1337C11.6939 49.0687 11.6722 48.9603 11.6505 48.8303C11.5962 48.5702 11.5311 48.1801 11.466 47.6816C11.3467 46.6738 11.249 45.2108 11.3575 43.3144C11.5637 39.5324 12.5619 34.0599 15.6866 27.2436C15.6866 27.2436 15.6866 27.2436 15.6866 27.222C15.6866 27.2003 15.7083 27.1786 15.7192 27.1569C15.7517 27.1028 15.7843 27.0161 15.8385 26.9077C15.947 26.691 16.1098 26.3875 16.3268 26.0191C16.7716 25.2714 17.4443 24.2744 18.3883 23.2016C20.2761 21.0776 23.2382 18.6935 27.5347 17.7616C30.909 17.0247 34.2725 16.6562 36.7897 16.472C38.0483 16.3853 39.1007 16.3311 39.8385 16.3094C40.2074 16.2986 40.5004 16.2878 40.6957 16.2878C40.7933 16.2878 40.8693 16.2878 40.9235 16.2878H41.0863C41.0863 16.2878 41.108 16.2878 41.1297 16.2878C41.1731 16.2878 41.2599 16.2878 41.3575 16.2878C41.5745 16.2878 41.9 16.2553 42.334 16.1469C43.1911 15.941 44.4714 15.4425 46.0447 14.2721C47.6938 13.0368 49.4949 11.9423 51.1767 11.3462L51.1875 11.3571Z" fill="url(#paint2_linear_4018_5078)" stroke="url(#paint3_linear_4018_5078)"/>
+<path d="M19.7777 33.1492C20.8952 29.5189 23.5101 26.4955 27.0146 24.9784C28.3491 24.404 29.9007 23.9814 31.6475 23.9056C37.5715 23.6346 45.6005 22.6593 52.067 24.5341C54.5299 25.2493 56.7433 26.6472 58.36 28.6412C58.8699 29.2697 59.7379 30.9819 60.0634 31.9572C60.888 34.428 62.0164 43.3249 62.0164 44.311C62.0164 45.9365 61.756 51.745 53.7053 53.4138C45.6547 55.0935 37.7017 55.7762 25.2244 53.002C25.2244 53.002 18.1285 51.474 18.3672 43.9751C18.53 38.936 19.0182 37.6356 19.7777 33.1492Z" fill="url(#paint4_linear_4018_5078)"/>
+<path d="M18.4431 42.9248C18.4431 42.9248 25.4195 43.5642 25.7776 53.1655C25.7776 53.1655 17.4666 51.8651 18.4431 42.9248Z" fill="url(#paint5_radial_4018_5078)"/>
+<path d="M61.9296 43.4111C61.9296 43.4111 55.105 43.8879 54.7578 53.1641C54.7578 53.1641 62.9061 51.3761 61.9296 43.4111Z" fill="url(#paint6_radial_4018_5078)"/>
+<foreignObject x="23.5" y="21.5" width="72" height="69"><div xmlns="http://www.w3.org/1999/xhtml" style="backdrop-filter:blur(12px);clip-path:url(#bgblur_0_4018_5078_clip_path);height:100%;width:100%"></div></foreignObject><path data-figma-bg-blur-radius="24" d="M71.25 59.9023C71.25 63.4079 68.4079 66.25 64.9023 66.25L53.1631 66.25C50.1702 66.2498 47.75 63.7932 47.75 60.7695L47.75 51.498C47.75 48.3353 50.2845 45.7503 53.416 45.75L65.8135 45.75C68.8061 45.75 71.2498 48.2173 71.25 51.2529L71.25 59.9023Z" fill="url(#paint7_linear_4018_5078)" fill-opacity="0.3" stroke="url(#paint8_linear_4018_5078)" stroke-width="0.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M55.5 51.7119C55.5002 50.5641 56.7375 49.8422 57.7373 50.4062L63.8184 53.8359C64.7959 54.3875 64.8436 55.7782 63.9062 56.3955L57.8242 60.3975C56.8268 61.0537 55.5 60.3385 55.5 59.1445V51.7119Z" fill="url(#paint9_linear_4018_5078)" stroke="url(#paint10_linear_4018_5078)"/>
+<path d="M46.0006 38C46.5508 38 47 37.5821 47 37.0715V33.9285C47 33.4179 46.5496 33 46.0006 33C45.4504 33 45 33.4179 45 33.9285V37.0715C45 37.5821 45.4504 38 46.0006 38Z" fill="#DC692B"/>
+<path d="M33.9856 38.122C34.5275 38.122 34.97 37.6939 34.97 37.1709V33.9511C34.97 33.4281 34.5264 33 33.9856 33C33.4436 33 33 33.4281 33 33.9511V37.1709C33 37.6939 33.4436 38.122 33.9856 38.122Z" fill="#DC692B"/>
+<path d="M34.8712 40.1877C35.7685 40.7948 37.2947 41.5875 39.0746 41.5301C39.6316 41.5122 40.0406 42.0496 39.8673 42.5848C39.7764 42.867 39.5386 43.0817 39.2479 43.1289C36.8424 43.5191 34.7888 42.225 33.9189 41.5594C33.6483 41.3503 33.5374 40.9916 33.6431 40.6655L33.6631 40.6037C33.828 40.0933 34.4294 39.8886 34.8712 40.1877Z" fill="#DC692B"/>
+<defs>
+<filter id="filter0_f_4018_5078" x="0.810547" y="0.378906" width="78.4941" height="69.9707" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="5" result="effect1_foregroundBlur_4018_5078"/>
+</filter>
+<clipPath id="bgblur_0_4018_5078_clip_path" transform="translate(-23.5 -21.5)"><path d="M71.25 59.9023C71.25 63.4079 68.4079 66.25 64.9023 66.25L53.1631 66.25C50.1702 66.2498 47.75 63.7932 47.75 60.7695L47.75 51.498C47.75 48.3353 50.2845 45.7503 53.416 45.75L65.8135 45.75C68.8061 45.75 71.2498 48.2173 71.25 51.2529L71.25 59.9023Z"/>
+</clipPath><linearGradient id="paint0_linear_4018_5078" x1="40.0555" y1="11.4221" x2="40.0555" y2="59.3202" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFEBCB"/>
+<stop offset="0.0001" stop-color="#FFB996"/>
+<stop offset="1" stop-color="#FD8A4B"/>
+</linearGradient>
+<linearGradient id="paint1_linear_4018_5078" x1="21.4805" y1="16.7212" x2="58.5784" y2="59.9718" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0.1"/>
+</linearGradient>
+<linearGradient id="paint2_linear_4018_5078" x1="40.0555" y1="11.4221" x2="40.0555" y2="59.3202" gradientUnits="userSpaceOnUse">
+<stop offset="0.04" stop-color="#FFEBCB"/>
+<stop offset="0.32" stop-color="#FFE2A9"/>
+<stop offset="1" stop-color="#FD8A4B"/>
+</linearGradient>
+<linearGradient id="paint3_linear_4018_5078" x1="21.4805" y1="16.7212" x2="58.5784" y2="59.9718" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0.1"/>
+</linearGradient>
+<linearGradient id="paint4_linear_4018_5078" x1="40.1864" y1="23.4071" x2="40.1864" y2="54.8659" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFFDE8"/>
+<stop offset="1" stop-color="#FFEBB5"/>
+</linearGradient>
+<radialGradient id="paint5_radial_4018_5078" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(21.3815 64.9066) rotate(90) scale(5.12574 3.69982)">
+<stop stop-color="#FFCE95"/>
+<stop offset="1" stop-color="#FFC671"/>
+</radialGradient>
+<radialGradient id="paint6_radial_4018_5078" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(58.3786 46.1799) rotate(90) scale(4.8765 3.62387)">
+<stop stop-color="#FFCE95"/>
+<stop offset="1" stop-color="#FFC671"/>
+</radialGradient>
+<linearGradient id="paint7_linear_4018_5078" x1="45.7" y1="64.6364" x2="71.4816" y2="59.6016" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFBF8E"/>
+<stop offset="1" stop-color="#FFA759"/>
+</linearGradient>
+<linearGradient id="paint8_linear_4018_5078" x1="68.3205" y1="49.1837" x2="37.7359" y2="74.7718" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+<linearGradient id="paint9_linear_4018_5078" x1="63.9412" y1="55.2609" x2="52.6288" y2="38.9315" gradientUnits="userSpaceOnUse">
+<stop stop-color="white"/>
+<stop offset="1" stop-color="white" stop-opacity="0.7"/>
+</linearGradient>
+<linearGradient id="paint10_linear_4018_5078" x1="57.4327" y1="51.2815" x2="64.61" y2="58.5546" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+</defs>
+</svg>

src/assets/svg/culture/ya_culture.svg

+<svg width="65" height="59" viewBox="0 0 65 59" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g filter="url(#filter0_f_4018_4927)">
+<path d="M40.6401 11.2678C41.8852 10.8289 43.1465 10.7151 44.1067 11.3735C44.5868 11.7067 45.0425 12.3732 45.4575 13.0965C45.8725 13.8442 46.2712 14.722 46.6211 15.5591C46.9711 16.3963 47.264 17.2009 47.4756 17.7942C47.5814 18.0868 47.6627 18.3387 47.7197 18.5094C47.7523 18.5907 47.7685 18.6638 47.7848 18.7045C47.7848 18.7045 47.7848 18.7126 47.7848 18.7207C47.7848 18.7207 47.7848 18.7289 47.7929 18.737C47.8173 18.7776 47.858 18.8345 47.9069 18.9077C48.0045 19.0458 48.1347 19.2409 48.2812 19.4441C48.5823 19.8667 48.8915 20.2893 49.0461 20.4438C49.0949 20.4925 49.1519 20.5657 49.2007 20.6388C49.2577 20.712 49.3228 20.8176 49.396 20.9314C49.5425 21.1671 49.7378 21.4841 49.9575 21.8661C50.3969 22.6382 50.9503 23.6866 51.4955 24.8976C52.5859 27.3196 53.6844 30.4568 53.8065 33.399C53.9286 36.268 53.839 38.5356 53.188 40.348C52.5208 42.2011 51.2839 43.5502 49.1926 44.6231C45.189 46.6793 36.0344 49.0282 21.1917 46.6143L19.7351 46.3624C19.7351 46.3624 19.727 46.3624 19.7188 46.3624C19.7025 46.3624 19.6863 46.3624 19.6537 46.3461C19.5968 46.338 19.5235 46.3217 19.4177 46.2973C19.2143 46.2486 18.9295 46.1836 18.5877 46.086C17.896 45.8828 16.9602 45.5659 15.9756 45.0701C14.0796 44.1273 11.9394 42.5262 11.1257 39.9254L11.0525 39.6734C11.0525 39.6734 11.0525 39.6653 11.0525 39.6572C11.0525 39.6409 11.0443 39.6247 11.0362 39.6003C11.0199 39.5515 11.0036 39.4702 10.9874 39.3727C10.9467 39.1777 10.8979 38.8851 10.849 38.5112C10.7595 37.7553 10.6863 36.6581 10.7677 35.2358C10.9223 32.3993 11.6709 28.2949 14.0145 23.1827C14.0145 23.1827 14.0145 23.1827 14.0145 23.1665C14.0145 23.1502 14.0308 23.134 14.0389 23.1177C14.0633 23.0771 14.0877 23.0121 14.1284 22.9308C14.2098 22.7682 14.3318 22.5407 14.4946 22.2643C14.8282 21.7035 15.3328 20.9558 16.0407 20.1512C17.4566 18.5582 19.6781 16.7701 22.9006 16.0712C25.4313 15.5185 27.9539 15.2422 29.8418 15.104C30.7857 15.039 31.5751 14.9983 32.1284 14.9821C32.4051 14.974 32.6248 14.9658 32.7713 14.9658C32.8445 14.9658 32.9015 14.9658 32.9421 14.9658H33.0642C33.0642 14.9658 33.0805 14.9658 33.0968 14.9658C33.1293 14.9658 33.1944 14.9658 33.2676 14.9658C33.4304 14.9658 33.6745 14.9414 34 14.8602C34.6429 14.7057 35.6031 14.3319 36.783 13.4541C38.0199 12.5276 39.3707 11.7067 40.632 11.2597L40.6401 11.2678Z" fill="url(#paint0_linear_4018_4927)"/>
+<path d="M40.6401 11.2678C41.8852 10.8289 43.1465 10.7151 44.1067 11.3735C44.5868 11.7067 45.0425 12.3732 45.4575 13.0965C45.8725 13.8442 46.2712 14.722 46.6211 15.5591C46.9711 16.3963 47.264 17.2009 47.4756 17.7942C47.5814 18.0868 47.6627 18.3387 47.7197 18.5094C47.7523 18.5907 47.7685 18.6638 47.7848 18.7045C47.7848 18.7045 47.7848 18.7126 47.7848 18.7207C47.7848 18.7207 47.7848 18.7289 47.7929 18.737C47.8173 18.7776 47.858 18.8345 47.9069 18.9077C48.0045 19.0458 48.1347 19.2409 48.2812 19.4441C48.5823 19.8667 48.8915 20.2893 49.0461 20.4438C49.0949 20.4925 49.1519 20.5657 49.2007 20.6388C49.2577 20.712 49.3228 20.8176 49.396 20.9314C49.5425 21.1671 49.7378 21.4841 49.9575 21.8661C50.3969 22.6382 50.9503 23.6866 51.4955 24.8976C52.5859 27.3196 53.6844 30.4568 53.8065 33.399C53.9286 36.268 53.839 38.5356 53.188 40.348C52.5208 42.2011 51.2839 43.5502 49.1926 44.6231C45.189 46.6793 36.0344 49.0282 21.1917 46.6143L19.7351 46.3624C19.7351 46.3624 19.727 46.3624 19.7188 46.3624C19.7025 46.3624 19.6863 46.3624 19.6537 46.3461C19.5968 46.338 19.5235 46.3217 19.4177 46.2973C19.2143 46.2486 18.9295 46.1836 18.5877 46.086C17.896 45.8828 16.9602 45.5659 15.9756 45.0701C14.0796 44.1273 11.9394 42.5262 11.1257 39.9254L11.0525 39.6734C11.0525 39.6734 11.0525 39.6653 11.0525 39.6572C11.0525 39.6409 11.0443 39.6247 11.0362 39.6003C11.0199 39.5515 11.0036 39.4702 10.9874 39.3727C10.9467 39.1777 10.8979 38.8851 10.849 38.5112C10.7595 37.7553 10.6863 36.6581 10.7677 35.2358C10.9223 32.3993 11.6709 28.2949 14.0145 23.1827C14.0145 23.1827 14.0145 23.1827 14.0145 23.1665C14.0145 23.1502 14.0308 23.134 14.0389 23.1177C14.0633 23.0771 14.0877 23.0121 14.1284 22.9308C14.2098 22.7682 14.3318 22.5407 14.4946 22.2643C14.8282 21.7035 15.3328 20.9558 16.0407 20.1512C17.4566 18.5582 19.6781 16.7701 22.9006 16.0712C25.4313 15.5185 27.9539 15.2422 29.8418 15.104C30.7857 15.039 31.5751 14.9983 32.1284 14.9821C32.4051 14.974 32.6248 14.9658 32.7713 14.9658C32.8445 14.9658 32.9015 14.9658 32.9421 14.9658H33.0642C33.0642 14.9658 33.0805 14.9658 33.0968 14.9658C33.1293 14.9658 33.1944 14.9658 33.2676 14.9658C33.4304 14.9658 33.6745 14.9414 34 14.8602C34.6429 14.7057 35.6031 14.3319 36.783 13.4541C38.0199 12.5276 39.3707 11.7067 40.632 11.2597L40.6401 11.2678Z" stroke="url(#paint1_linear_4018_4927)"/>
+</g>
+<path d="M40.6401 11.2678C41.8852 10.8289 43.1465 10.7151 44.1067 11.3735C44.5868 11.7067 45.0425 12.3732 45.4575 13.0965C45.8725 13.8442 46.2712 14.722 46.6211 15.5591C46.9711 16.3963 47.264 17.2009 47.4756 17.7942C47.5814 18.0868 47.6627 18.3387 47.7197 18.5094C47.7523 18.5907 47.7685 18.6638 47.7848 18.7045C47.7848 18.7045 47.7848 18.7126 47.7848 18.7207C47.7848 18.7207 47.7848 18.7289 47.7929 18.737C47.8173 18.7776 47.858 18.8345 47.9069 18.9077C48.0045 19.0458 48.1347 19.2409 48.2812 19.4441C48.5823 19.8667 48.8915 20.2893 49.0461 20.4438C49.0949 20.4925 49.1519 20.5657 49.2007 20.6388C49.2577 20.712 49.3228 20.8176 49.396 20.9314C49.5425 21.1671 49.7378 21.4841 49.9575 21.8661C50.3969 22.6382 50.9503 23.6866 51.4955 24.8976C52.5859 27.3196 53.6844 30.4568 53.8065 33.399C53.9286 36.268 53.839 38.5356 53.188 40.348C52.5208 42.2011 51.2839 43.5502 49.1926 44.6231C45.189 46.6793 36.0344 49.0282 21.1917 46.6143L19.7351 46.3624C19.7351 46.3624 19.727 46.3624 19.7188 46.3624C19.7025 46.3624 19.6863 46.3624 19.6537 46.3461C19.5968 46.338 19.5235 46.3217 19.4177 46.2973C19.2143 46.2486 18.9295 46.1836 18.5877 46.086C17.896 45.8828 16.9602 45.5659 15.9756 45.0701C14.0796 44.1273 11.9394 42.5262 11.1257 39.9254L11.0525 39.6734C11.0525 39.6734 11.0525 39.6653 11.0525 39.6572C11.0525 39.6409 11.0443 39.6247 11.0362 39.6003C11.0199 39.5515 11.0036 39.4702 10.9874 39.3727C10.9467 39.1777 10.8979 38.8851 10.849 38.5112C10.7595 37.7553 10.6863 36.6581 10.7677 35.2358C10.9223 32.3993 11.6709 28.2949 14.0145 23.1827C14.0145 23.1827 14.0145 23.1827 14.0145 23.1665C14.0145 23.1502 14.0308 23.134 14.0389 23.1177C14.0633 23.0771 14.0877 23.0121 14.1284 22.9308C14.2098 22.7682 14.3318 22.5407 14.4946 22.2643C14.8282 21.7035 15.3328 20.9558 16.0407 20.1512C17.4566 18.5582 19.6781 16.7701 22.9006 16.0712C25.4313 15.5185 27.9539 15.2422 29.8418 15.104C30.7857 15.039 31.5751 14.9983 32.1284 14.9821C32.4051 14.974 32.6248 14.9658 32.7713 14.9658C32.8445 14.9658 32.9015 14.9658 32.9421 14.9658H33.0642C33.0642 14.9658 33.0805 14.9658 33.0968 14.9658C33.1293 14.9658 33.1944 14.9658 33.2676 14.9658C33.4304 14.9658 33.6745 14.9414 34 14.8602C34.6429 14.7057 35.6031 14.3319 36.783 13.4541C38.0199 12.5276 39.3707 11.7067 40.632 11.2597L40.6401 11.2678Z" fill="url(#paint2_linear_4018_4927)" stroke="url(#paint3_linear_4018_4927)"/>
+<path d="M17.0818 27.6119C17.92 24.8892 19.8811 22.6216 22.5095 21.4838C23.5104 21.053 24.674 20.7361 25.9842 20.6792C30.4272 20.476 36.4489 19.7445 41.2988 21.1506C43.146 21.687 44.806 22.7354 46.0185 24.2309C46.401 24.7023 47.0519 25.9864 47.2961 26.7179C47.9145 28.571 48.7608 35.2436 48.7608 35.9833C48.7608 37.2024 48.5655 41.5587 42.5275 42.8104C36.4896 44.0701 30.5248 44.5821 21.1668 42.5015C21.1668 42.5015 15.8449 41.3555 16.0239 35.7313C16.146 31.952 16.5122 30.9767 17.0818 27.6119Z" fill="url(#paint4_linear_4018_4927)"/>
+<path d="M16.0813 34.9434C16.0813 34.9434 21.3137 35.4229 21.5822 42.6238C21.5822 42.6238 15.3489 41.6485 16.0813 34.9434Z" fill="url(#paint5_radial_4018_4927)"/>
+<path d="M48.6952 35.3086C48.6952 35.3086 43.5768 35.6662 43.3164 42.6233C43.3164 42.6233 49.4276 41.2823 48.6952 35.3086Z" fill="url(#paint6_radial_4018_4927)"/>
+<path d="M27.1977 31.286C27.0756 31.286 26.9455 31.2372 26.8559 31.1397C26.6688 30.9528 26.6688 30.6439 26.8559 30.4489L28.4427 28.864L26.742 27.3848C26.5386 27.206 26.5223 26.8971 26.6932 26.694C26.8722 26.4908 27.1814 26.4745 27.3849 26.6452L29.4762 28.4739C29.5738 28.5633 29.6389 28.6933 29.6389 28.8234C29.6389 28.9615 29.5901 29.0916 29.4925 29.181L27.5313 31.1316C27.4337 31.2291 27.3116 31.2779 27.1896 31.2779L27.1977 31.286Z" fill="url(#paint7_linear_4018_4927)"/>
+<path d="M37.0841 31.2861C36.9621 31.2861 36.8319 31.2373 36.7424 31.1398L34.7812 29.1892C34.6836 29.0916 34.6348 28.9616 34.6348 28.8315C34.6348 28.6934 34.6999 28.5715 34.7975 28.4821L36.8888 26.6534C37.0923 26.4746 37.4015 26.499 37.5805 26.7021C37.7595 26.9053 37.7351 27.2142 37.5317 27.393L35.831 28.8722L37.4178 30.457C37.6049 30.644 37.6049 30.9528 37.4178 31.1479C37.3201 31.2454 37.1981 31.2942 37.076 31.2942L37.0841 31.2861Z" fill="url(#paint8_linear_4018_4927)"/>
+<path d="M32.3311 33.6023C32.3311 33.6023 33.6331 33.0903 34.7642 33.7161C35.0652 32.8302 34.9025 31.8955 34.9025 31.8955H29.6539C29.6539 31.8955 29.4423 33.0171 29.9224 33.968C30.2642 33.6998 31.0942 33.2203 32.3473 33.6023H32.3311Z" fill="#FFE6AF"/>
+<path d="M32.3311 33.6023C32.3311 33.6023 33.6331 33.0903 34.7642 33.7161C35.0652 32.8302 34.9025 31.8955 34.9025 31.8955H29.6539C29.6539 31.8955 29.4423 33.0171 29.9224 33.968C30.2642 33.6998 31.0942 33.2203 32.3473 33.6023H32.3311Z" fill="url(#paint9_linear_4018_4927)"/>
+<path d="M32.2664 35.2605C33.8125 35.2931 34.4798 34.5291 34.7565 33.7163C33.6335 33.0905 32.3234 33.6025 32.3234 33.6025C31.0702 33.2205 30.2483 33.7001 29.8984 33.9683C30.2321 34.6429 30.9156 35.228 32.2583 35.2605H32.2664Z" fill="url(#paint10_linear_4018_4927)"/>
+<path d="M32.2664 35.2605C33.8207 35.2931 34.4798 34.5291 34.7565 33.7163C33.6335 33.0905 32.3234 33.6025 32.3234 33.6025C31.0702 33.2205 30.2483 33.7001 29.8984 33.9683C30.2321 34.6429 30.9156 35.228 32.2583 35.2605H32.2664Z" fill="url(#paint11_linear_4018_4927)"/>
+<mask id="mask0_4018_4927" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="35" y="33" width="22" height="21">
+<path d="M56.1588 33.4541H35.4902V53.0905H56.1588V33.4541Z" fill="white"/>
+</mask>
+<g mask="url(#mask0_4018_4927)">
+<path d="M47.7343 34.6285L49.2769 37.72C49.5895 38.3393 50.1893 38.7723 50.88 38.873L54.3331 39.3664C56.0774 39.6182 56.7781 41.7379 55.5128 42.9563L53.0124 45.3631C52.5133 45.8464 52.2814 46.5412 52.4024 47.226L52.9922 50.6246C53.2896 52.3415 51.4647 53.6556 49.907 52.845L46.8168 51.2389C46.1968 50.9166 45.4557 50.9166 44.8357 51.2389L41.7455 52.845C40.1827 53.6556 38.3579 52.3465 38.6603 50.6246L39.2501 47.226C39.3661 46.5463 39.1392 45.8464 38.6402 45.3631L36.1398 42.9563C34.8744 41.7379 35.5752 39.6182 37.3194 39.3664L40.7725 38.873C41.4682 38.7723 42.0681 38.3443 42.3756 37.72L43.9182 34.6285C44.6996 33.0626 46.953 33.0626 47.7343 34.6285Z" fill="url(#paint12_linear_4018_4927)"/>
+</g>
+<defs>
+<filter id="filter0_f_4018_4927" x="0.232422" y="0.40918" width="64.1211" height="57.7285" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+<feGaussianBlur stdDeviation="5" result="effect1_foregroundBlur_4018_4927"/>
+</filter>
+<linearGradient id="paint0_linear_4018_4927" x1="32.2911" y1="11.3166" x2="32.2911" y2="47.2401" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFEBCB"/>
+<stop offset="0.0001" stop-color="#FFB996"/>
+<stop offset="1" stop-color="#FD8A4B"/>
+</linearGradient>
+<linearGradient id="paint1_linear_4018_4927" x1="18.3599" y1="15.2909" x2="46.1833" y2="47.7288" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0.1"/>
+</linearGradient>
+<linearGradient id="paint2_linear_4018_4927" x1="32.2911" y1="11.3166" x2="32.2911" y2="47.2401" gradientUnits="userSpaceOnUse">
+<stop offset="0.04" stop-color="#FFEBCB"/>
+<stop offset="0.32" stop-color="#FFE2A9"/>
+<stop offset="1" stop-color="#FD8A4B"/>
+</linearGradient>
+<linearGradient id="paint3_linear_4018_4927" x1="18.3599" y1="15.2909" x2="46.1833" y2="47.7288" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.25"/>
+<stop offset="1" stop-color="white" stop-opacity="0.1"/>
+</linearGradient>
+<linearGradient id="paint4_linear_4018_4927" x1="32.3883" y1="20.3053" x2="32.3883" y2="43.8994" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFFDE8"/>
+<stop offset="1" stop-color="#FFEBB5"/>
+</linearGradient>
+<radialGradient id="paint5_radial_4018_4927" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(18.2852 51.4297) rotate(90) scale(3.84431 2.77486)">
+<stop stop-color="#FFCE95"/>
+<stop offset="1" stop-color="#FFC671"/>
+</radialGradient>
+<radialGradient id="paint6_radial_4018_4927" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(46.032 37.3852) rotate(90) scale(3.65738 2.7179)">
+<stop stop-color="#FFCE95"/>
+<stop offset="1" stop-color="#FFC671"/>
+</radialGradient>
+<linearGradient id="paint7_linear_4018_4927" x1="28.1091" y1="26.5314" x2="28.1091" y2="31.286" gradientUnits="userSpaceOnUse">
+<stop stop-color="#DA6529"/>
+<stop offset="1" stop-color="#FF9D52"/>
+</linearGradient>
+<linearGradient id="paint8_linear_4018_4927" x1="36.1727" y1="26.5315" x2="35.9536" y2="37.3248" gradientUnits="userSpaceOnUse">
+<stop stop-color="#DA6529"/>
+<stop offset="1" stop-color="#FFC852"/>
+</linearGradient>
+<linearGradient id="paint9_linear_4018_4927" x1="32.2578" y1="31.8955" x2="32.2822" y2="33.8542" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFAB71"/>
+<stop offset="1" stop-color="#FF5F19"/>
+</linearGradient>
+<linearGradient id="paint10_linear_4018_4927" x1="32.3153" y1="31.8958" x2="32.3315" y2="33.8545" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFAB71"/>
+<stop offset="1" stop-color="#FF5F19"/>
+</linearGradient>
+<linearGradient id="paint11_linear_4018_4927" x1="32.3315" y1="33.3993" x2="32.3315" y2="35.2605" gradientUnits="userSpaceOnUse">
+<stop stop-color="white"/>
+<stop offset="1" stop-color="#FFE4B9"/>
+</linearGradient>
+<linearGradient id="paint12_linear_4018_4927" x1="45.8237" y1="33.4554" x2="45.8237" y2="53.0917" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FFA46F"/>
+<stop offset="1" stop-color="#FF6034"/>
+</linearGradient>
+</defs>
+</svg>

src/assets/svg/dashboard_nav_activity.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1667557434795" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5366" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M627.4 262.5c28.5-10.6 58.7-16.2 89.8-16.2 31.9 0 63 5.8 92.1 17 0.6-6.1 1-12.4 1-18.7C810.3 144.9 729 64 628.7 64c-53.1 0-100.8 22.7-134 58.8 28.1 15.5 54.1 35.6 77.1 60 22.6 23.8 41.2 50.7 55.6 79.7z" p-id="5367"></path><path d="M367.1 777.5h56.4L401 713.9c134-25.3 235.8-149.4 235.8-298.7 0-167.5-128.2-303.4-286.4-303.4C192.2 111.9 64 247.7 64 415.2c0 147.9 99.9 271.1 232.1 297.9l-18.8 64.4h48.9l-8.1 27.6c-5.2 17.5 0 35.8 13.8 49.1 5.9 5.7 7 14 2.8 20.8l-37.3 59c-5.3 8.4-2 19.1 7.5 23.8 3.1 1.5 6.4 2.2 9.6 2.2 6.8 0 13.5-3.2 17.2-8.9l37.3-58.9c12.7-20 9.4-44.8-8.1-61.6-4.6-4.5-6.4-10.7-4.6-16.6l10.8-36.5z m-43.6-543.1c-0.4 0.1-44.1 10.6-82.3 42.2-51.7 42.9-69.8 101.7-53.8 174.7 2.8 12.9-5.3 25.8-18.3 28.6-1.8 0.4-3.5 0.6-5.2 0.6-11 0-20.9-7.6-23.4-18.8-25.2-114.6 24.2-183.9 70-221.9 46-38.1 96.4-50.7 102-52 12.9-3.1 25.8 5 28.8 17.9s-4.9 25.7-17.8 28.7z" p-id="5368"></path><path d="M960 530.2c0-142.3-108.7-257.7-242.8-257.7-27.7 0-54.3 4.9-79 14 16.2 40.2 24.7 83.8 24.7 128.8 0 87.8-32.3 170.3-91 232.5-14.4 15.2-29.9 28.7-46.3 40.5 35 47.7 85.5 82.1 143.4 94.5l-9.2 40.5h25.3v0.1l-2.1 7.2c-4.1 13.9 0 28.5 11 39.2 2.4 2.2 2.8 5.7 1.1 8.3l-26.2 41.1c-5.3 8.4-2 19.1 7.5 23.8 3.1 1.5 6.4 2.2 9.6 2.2 6.8 0 13.5-3.2 17.2-8.9l26.1-41.2c10.1-16 7.5-35.7-6.4-49.1-1.8-1.7-2.7-4.3-2-6.7l4.7-16H750l-10-36.5c123.4-12.3 220-122.5 220-256.6z m-183.5 174c-3.1 1.3-6.3 1.9-9.4 1.9-9.3 0-18.2-5.5-22.1-14.6-5.2-12.2 0.5-26.3 12.7-31.5 43.7-18.6 75.5-54.4 85.2-95.8 3-12.9 16-21.1 28.8-18 12.9 3 21 15.9 18 28.8-13.1 56.4-55.4 104.7-113.2 129.2z" p-id="5369"></path></svg>
\ No newline at end of file

src/assets/svg/dashboard_nav_article.svg

+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1676867023098"
+	class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5592"
+	xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200">
+	<path
+		d="M97 153.472C97 109.03 133.063 73 177.548 73h648.986c44.486 0 80.548 36.029 80.548 80.472v558.71c0 44.443-36.062 80.472-80.548 80.472H211.712c-30.82 0-54.876 22.177-54.876 48.283 0 25.845 23.577 47.84 53.953 48.277l0.923 0.006h695.37c16.523 0 29.918 13.383 29.918 29.89 0 16.272-13.015 29.507-29.212 29.882l-0.706 0.008h-695.37C148.872 949 97 901.179 97 840.937c0-2.001 0.057-3.989 0.17-5.961a31.452 31.452 0 0 1-0.162-2.53L97 831.74V153.472z m669.699 326.489H237.384l-0.707 0.008c-16.197 0.375-29.211 13.61-29.211 29.881 0 16.343 13.128 29.622 29.423 29.886l0.495 0.004h529.315l0.706-0.008c16.197-0.375 29.211-13.61 29.211-29.882 0-16.507-13.394-29.89-29.917-29.89z m0-170.142H237.384l-0.707 0.008c-16.197 0.375-29.211 13.61-29.211 29.882 0 16.342 13.128 29.621 29.423 29.885l0.495 0.004h529.315l0.706-0.008c16.197-0.375 29.211-13.61 29.211-29.881 0-16.508-13.394-29.89-29.917-29.89z"
+		p-id="5593"></path>
+</svg>

src/assets/svg/dashboard_nav_post.svg

+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1667556573285"
+	class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3250"
+	xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200">
+	<path
+		d="M893.7 534.5c-4.5-16.5-10.9-31.7-19.2-45.7-8.3-14-18.3-26.8-29.9-38.3-3.1-3-6.3-6.1-9.7-9.1-2 64.9-21.9 127-57.7 180.2-18.2 27.1-40.2 51.3-65.2 71.7-18.3 14.9-37.9 27.7-58.7 38.2l50 168.8h103.3l-40.5-134.9c39.3-10.8 71.6-32.9 96.7-66.3 25.1-33.4 37.7-71.5 37.7-114.2v-0.1c-0.1-17-2.3-33.9-6.8-50.3zM329.7 693.7c-25.1-20.5-47-44.6-65.3-71.8-35.9-53.3-55.8-115.6-57.8-180.6-3.4 3-6.6 6-9.7 9.1-11.6 11.5-21.5 24.3-29.8 38.3-8.3 14-14.7 29.2-19.2 45.7-4.5 16.5-6.7 33.3-6.7 50.5v0.1c0 42.7 12.5 80.8 37.6 114.2 25.1 33.4 57.2 55.5 96.5 66.3l-40.4 134.9H338l50.5-168.6c-20.9-10.4-40.5-23.2-58.8-38.1z"
+		p-id="3251"></path>
+	<path
+		d="M812.1 429.5c0-3.3-0.1-6.5-0.2-9.8-4.9-164.4-133.4-296.1-291.2-296.1-157.8 0-286.2 131.7-291.1 296.1-0.1 3.2-0.2 6.5-0.2 9.8 0 130.2 77.5 241.4 186.6 285.5l-54.9 185.4h319.2L626 714.7c109-44.3 186.1-155.3 186.1-285.2zM520.8 611.8c-36.8 0-68.2-13.7-94.2-41s-39-60.4-39-99.3h40.1c0 8.9 1.2 17.6 3.5 26.2 2.3 8.6 5.5 16.5 9.5 23.6 4 7.1 8.8 13.7 14.4 19.6 5.6 5.9 11.8 11 18.6 15.1 6.8 4.2 14.2 7.5 22.1 10 8 2.5 16.2 3.7 24.6 3.7 25.8 0 47.8-9.6 66.1-28.8 18.3-19.2 27.4-42.3 27.4-69.4H654c0 38.9-13 72-39 99.3-26 27.4-57.4 41-94.2 41z"
+		p-id="3252"></path>
+</svg>

src/assets/svg/dashboard_nav_vote.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1667893758496" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7001" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M975.36 801.28c0-10.24-10.24-20.48-20.48-20.48h-386.56l320-320c15.36-15.36 15.36-43.52 0-58.88l-284.16-281.6c-15.36-15.36-43.52-15.36-58.88 0l-376.32 376.32c-15.36 15.36-15.36 43.52 0 58.88l225.28 222.72h-322.56c-10.24 0-20.48 10.24-20.48 20.48l-40.96 79.36c0 10.24 10.24 20.48 20.48 20.48h965.12c10.24 0 20.48-10.24 20.48-20.48l-40.96-76.8z m-540.16-335.36l66.56 71.68 135.68-138.24 20.48 23.04-156.16 158.72-89.6-92.16 23.04-23.04z m-145.92 396.8l20.48-33.28h407.04l20.48 33.28h-448z" fill="" p-id="7002"></path></svg>
\ No newline at end of file

src/assets/svg/good.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1662515864211" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3701" width="200" height="200" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M213.57056 399.95392c-48.8448 0-88.58112 39.72096-88.58112 88.54528l0 334.75584c0 48.8192 39.73632 88.54528 88.58112 88.54528l56.08448 0 0-511.8464L213.57056 399.95392z" p-id="3702"></path><path d="M821.43232 381.09184l-189.33248 0c10.34752-28.83072 17.17248-60.16512 19.61472-90.48064 3.77856-47.14496-3.47136-89.02144-20.96128-121.09312-21.5296-39.45984-58.17344-64.07168-105.99424-71.17824-21.6576-3.22048-40.28928 0.95232-55.3728 12.37504-30.49472 23.10656-36.09088 67.06688-42.5728 117.96992-5.18144 40.69376-11.05408 86.81472-30.79168 119.87456-9.86112 16.52736-26.72128 37.11488-64.06144 46.41792l0 516.82304 415.96416 0c24.33024 0 48.22016-8.32512 67.2768-23.42912 19.06688-15.10912 32.60416-36.46976 38.144-60.14976l73.51808-314.27072c7.57248-32.34816 0.06656-65.83296-20.58752-91.86816C885.61152 396.032 854.69184 381.09184 821.43232 381.09184z" p-id="3703"></path></svg>
\ No newline at end of file

src/assets/svg/icon_dept.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1666076308974" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11970" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M970.666667 170.666667H468.62l-35.673333-59.46a53.593333 53.593333 0 0 0-45.733334-25.873334H96a53.393333 53.393333 0 0 0-53.333333 53.333334v704a53.393333 53.393333 0 0 0 53.333333 53.333333h874.666667a53.393333 53.393333 0 0 0 53.333333-53.333333V224a53.393333 53.393333 0 0 0-53.333333-53.333333z m0 42.666666a10.666667 10.666667 0 0 1 10.666666 10.666667v75.74a53.546667 53.546667 0 0 0-10.666666-1.073333H551.453333a10.72 10.72 0 0 1-9.146666-5.18L494.213333 213.333333z" p-id="11971"></path></svg>

src/assets/svg/icon_face.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1653463274928" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="23443" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M514.286299 2.505864h3.565417V895.785974h-3.565417z" fill="#EDA639" p-id="23444"></path><path d="M69.430967 447.365225h893.276081v3.55736H69.430967z" fill="#EDA639" p-id="23445"></path><path d="M517.811429 452.578389m-430.932074 0a430.932074 430.932074 0 1 0 861.864148 0 430.932074 430.932074 0 1 0-861.864148 0Z" fill="#FFE770" p-id="23446"></path><path d="M520.027225 493.522274v160.145663" fill="#FFE770" p-id="23447"></path><path d="M520.027225 675.024184a21.352218 21.352218 0 0 1-21.352218-21.356247v-160.145663a21.352218 21.352218 0 0 1 42.708465 0v160.145663a21.352218 21.352218 0 0 1-21.356247 21.356247z" fill="#6E6E96" p-id="23448"></path><path d="M300.917211 313.051716l62.279988-62.279988 62.279988 62.279988" fill="#FFE770" p-id="23449"></path><path d="M425.477187 334.403934a21.299845 21.299845 0 0 1-15.099644-6.252574L363.197199 280.971016 316.016855 328.15136a21.352218 21.352218 0 1 1-30.199288-30.199288l62.279988-62.279988a21.352218 21.352218 0 0 1 30.199288 0l62.279988 62.279988a21.352218 21.352218 0 0 1-15.099644 36.451862z" fill="#6E6E96" p-id="23450"></path><path d="M610.536457 313.051716l62.284017-62.279988 62.279988 62.279988" fill="#FFE770" p-id="23451"></path><path d="M735.100462 334.403934a21.299845 21.299845 0 0 1-15.099644-6.252574l-47.180344-47.180344-47.184373 47.180344a21.356247 21.356247 0 0 1-30.195259-30.199288l62.279988-62.279988a21.352218 21.352218 0 0 1 30.195259 0l62.279989 62.279988a21.352218 21.352218 0 0 1-15.095616 36.451862z" fill="#6E6E96" p-id="23452"></path><path d="M519.624353 45.947556c-3.831313 0-7.65054 0.068488-11.449623 0.173235 203.095851 5.785242 365.960901 172.231825 365.960901 376.72967 0 208.159953-168.746981 376.898877-376.906934 376.898877-208.155924 0-376.902905-168.738924-376.902906-376.898877a377.615989 377.615989 0 0 1 12.061989-94.924709 406.368966 406.368966 0 0 0-19.523179 124.777527c0 224.645477 182.114276 406.755723 406.759752 406.755724s406.755723-182.110247 406.755724-406.755724c0-224.645477-182.110247-406.755723-406.755724-406.755723z" fill="#FF9900" opacity=".24" p-id="23453"></path><path d="M517.811429 901.305321c-103.779837 0-204.98935-36.262512-284.979593-102.095831-78.906517-64.947001-133.733373-155.508606-154.380564-255.005914a451.740415 451.740415 0 0 1-9.366775-91.629216C69.084497 205.14647 270.383539 3.847428 517.811429 3.847428c247.42789 0 448.726932 201.299042 448.726932 448.726932 0 247.42789-201.299042 448.730961-448.726932 448.730961z m0-861.864149c-227.803993 0-413.137216 185.333223-413.137216 413.137217 0 28.43068 2.900679 56.821072 8.621461 84.397663 19.003474 91.576843 69.487369 174.951211 142.153398 234.757565 73.636951 60.604041 166.813196 93.981989 262.366386 93.981988 227.808022 0 413.137216-185.333223 413.137216-413.137216S745.619451 39.441172 517.811429 39.441172z" fill="#6E6E96" p-id="23454"></path><path d="M809.635818 752.069432m-135.542268 0a135.542268 135.542268 0 1 0 271.084536 0 135.542268 135.542268 0 1 0-271.084536 0Z" fill="#FFE770" p-id="23455"></path><path d="M809.635818 905.406558c-84.546726 0-153.337126-68.786372-153.337126-153.341154 0-84.546726 68.786372-153.337126 153.337126-153.337126s153.341155 68.786372 153.341155 153.337126c-0.004029 84.554783-68.7904 153.341155-153.341155 153.341154z m0-271.084536c-64.926857 0-117.74741 52.816524-117.74741 117.74741s52.816524 117.751439 117.74741 117.751439 117.751439-52.816524 117.751439-117.751439c-0.004029-64.930886-52.820553-117.74741-117.751439-117.74741z" fill="#6E6E96" p-id="23456"></path><path d="M218.864263 752.069432m-135.542268 0a135.542268 135.542268 0 1 0 271.084536 0 135.542268 135.542268 0 1 0-271.084536 0Z" fill="#FFE770" p-id="23457"></path><path d="M218.864263 905.406558c-84.550754 0-153.337126-68.786372-153.337126-153.341154 0-84.546726 68.786372-153.337126 153.337126-153.337126s153.337126 68.786372 153.337126 153.337126c0 84.554783-68.786372 153.341155-153.337126 153.341154z m0-271.084536c-64.926857 0-117.74741 52.816524-117.74741 117.74741s52.820553 117.751439 117.74741 117.751439 117.751439-52.816524 117.751439-117.751439c-0.004029-64.930886-52.824581-117.74741-117.751439-117.74741z" fill="#6E6E96" p-id="23458"></path><path d="M305.248085 455.213172a61.824743 28.845638 0 1 0 123.649486 0 61.824743 28.845638 0 1 0-123.649486 0Z" fill="#FF0000" opacity=".18" p-id="23459"></path><path d="M615.403151 455.213172a61.820714 28.845638 0 1 0 123.641429 0 61.820714 28.845638 0 1 0-123.641429 0Z" fill="#FF0000" opacity=".18" p-id="23460"></path><path d="M410.079418 993.43007h193.378577a16.114881 16.114881 0 0 0 0-32.229763h-193.378577a16.114881 16.114881 0 0 0 0 32.229763z" fill="#6E6E96" opacity=".29" p-id="23461"></path><path d="M675.435114 993.43007h56.402085a16.114881 16.114881 0 0 0 0-32.229763h-56.402085a16.114881 16.114881 0 0 0 0 32.229763z" fill="#6E6E96" opacity=".17" p-id="23462"></path><path d="M332.993882 961.200307h-44.315924a16.114881 16.114881 0 0 0 0 32.229763h44.315924a16.114881 16.114881 0 0 0 0-32.229763z" fill="#6E6E96" opacity=".17" p-id="23463"></path></svg>
\ No newline at end of file

src/assets/svg/icon_feedback.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1666686169316" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6769" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M781.443 514.238c0-73.113-29.837-138.777-77.608-186.546-46.25-47.75-111.914-77.605-183.548-77.605-73.112 0-137.299 29.855-185.046 77.605-47.772 47.77-76.109 113.433-76.109 186.546 0 71.632 28.337 137.297 76.109 185.064 47.747 49.249 111.934 77.588 185.046 77.588 71.634 0 137.297-28.34 183.548-77.588 47.77-47.767 77.608-113.432 77.608-185.064M520.286 750.03c-64.166 0-123.878-26.864-165.657-70.14-41.777-41.777-68.658-101.468-68.658-165.653 0-65.665 26.88-125.356 68.658-167.135 41.779-43.275 101.492-70.135 165.657-70.135 64.164 0 122.378 26.86 164.157 70.135 41.778 41.779 68.66 101.47 68.66 167.135 0 64.185-26.882 123.876-68.66 165.653-41.779 43.277-99.992 70.14-164.157 70.14" p-id="6770"></path><path d="M574.007 642.588c-17.892 7.47-38.784 10.443-58.195 10.443-19.41-1.497-38.803-5.972-56.716-14.918-44.753-22.385-77.584-68.66-77.584-135.821h-28.378c0 79.107 40.302 134.323 92.545 161.183 22.385 10.448 46.25 16.415 70.134 17.913 22.39 0 46.254-4.471 68.639-13.44 52.242-23.864 92.544-76.107 98.496-164.159l-28.34-1.497c-4.493 76.13-38.823 120.886-80.601 140.296" p-id="6771"></path><path d="M876.657 430.921c-16.622-83.027-61.21-154.217-123.554-203.2-65.665-53.742-147.741-83.578-232.817-85.076-43.278 0-83.556 5.969-120.883 17.914-73.109 23.864-132.822 71.632-174.6 132.82-28.34 40.282-49.227 88.054-59.692 137.303-137.3 11.918-135.803 189.516 13.438 211.906l26.86-8.946c-14.935-41.8-20.887-85.076-20.887-126.854 1.497-73.134 23.882-141.772 62.666-196.992 38.804-56.715 94.02-99.99 161.183-122.378C442.68 175.476 480.007 171 520.287 171c79.103 1.498 155.21 29.837 214.923 77.605 58.174 46.254 99.972 111.918 114.89 189.523 0 0 64.51 276.212-220.066 387.886-6.074-7.226-14.857-11.801-24.672-11.801-19.415 0-34.331 14.918-34.331 34.307 0 17.914 14.916 32.833 34.33 32.833 16.252 0 29.897-12.328 32.325-27.995 132.762-51.554 196.18-136.102 224.883-216.076C988.47 605.97 990.696 455.72 876.657 430.921" p-id="6772"></path></svg>
\ No newline at end of file

src/assets/svg/icon_file.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1655706388873" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25626" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M663.466667 526.933333L541.866667 405.333333c-17.066667-17.066667-42.666667-17.066667-59.733334 0l-121.6 121.6c-17.066667 17.066667-17.066667 42.666667 0 59.733334 8.533333 8.533333 19.2 12.8 29.866667 12.8s21.333333-4.266667 29.866667-12.8l46.933333-46.933334V853.333333c0 23.466667 19.2 42.666667 42.666667 42.666667s42.666667-19.2 42.666666-42.666667V539.733333l46.933334 46.933334c17.066667 17.066667 42.666667 17.066667 59.733333 0s21.333333-42.666667 4.266667-59.733334z" fill="#80B8F8" p-id="25627"></path><path d="M808.533333 388.266667C789.333333 241.066667 663.466667 128 512 128c-151.466667 0-277.333333 113.066667-296.533333 260.266667-102.4 19.2-179.2 113.066667-172.8 221.866666 6.4 113.066667 106.666667 200.533333 219.733333 200.533334H405.333333c12.8 0 21.333333-8.533333 21.333334-21.333334v-128c0-12.8-10.666667-23.466667-23.466667-21.333333-42.666667 6.4-87.466667-19.2-93.866667-72.533333-4.266667-27.733333 8.533333-57.6 27.733334-76.8l113.066666-113.066667c14.933333-14.933333 32-23.466667 51.2-25.6 27.733333-4.266667 53.333333 6.4 70.4 23.466667l117.333334 117.333333c32 32 36.266667 85.333333 6.4 119.466667-19.2 23.466667-49.066667 32-76.8 27.733333-10.666667 0-21.333333 10.666667-21.333334 21.333333v128c0 12.8 8.533333 21.333333 21.333334 21.333334h142.933333c115.2 0 213.333333-87.466667 219.733333-200.533334 6.4-108.8-70.4-202.666667-172.8-221.866666z" fill="#80B8F8" p-id="25628"></path></svg>
\ No newline at end of file

src/assets/svg/icon_file2.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1666334784291" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="31824" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M815.104 69.632q27.648 25.6 44.032 42.496t25.088 28.672 10.752 19.968 2.048 14.336l0 16.384-151.552 0q-10.24 0-17.92-7.68t-12.8-17.92-7.68-20.992-2.56-16.896l0-126.976 3.072 0q8.192 0 16.896 2.56t19.968 9.728 28.16 20.48 42.496 35.84zM640 129.024q0 20.48 6.144 42.496t19.456 40.96 33.792 31.232 48.128 12.288l149.504 0 0 577.536q0 29.696-11.776 53.248t-31.232 39.936-43.008 25.6-46.08 9.216l-503.808 0q-19.456 0-42.496-11.264t-43.008-29.696-33.28-41.984-13.312-49.152l0-696.32q0-21.504 9.728-44.544t26.624-42.496 38.4-32.256 45.056-12.8l391.168 0 0 128zM704.512 768q26.624 0 45.056-18.944t18.432-45.568-18.432-45.056-45.056-18.432l-384 0q-26.624 0-45.056 18.432t-18.432 45.056 18.432 45.568 45.056 18.944l384 0zM768 448.512q0-26.624-18.432-45.568t-45.056-18.944l-384 0q-26.624 0-45.056 18.944t-18.432 45.568 18.432 45.056 45.056 18.432l384 0q26.624 0 45.056-18.432t18.432-45.056z" p-id="31825"></path></svg>
\ No newline at end of file

src/assets/svg/icon_message.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1666679824484" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5815" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M490.684916 156.359281C256.165269 156.359281 64.383234 309.755867 64.383234 501.634326 64.383234 610.634973 126.868113 710.691594 230.678884 775.40424 227.606262 773.488857 225.494778 770.415816 224.753999 767.352292 223.887537 768.541972 221.953407 773.256131 218.857033 779.006383 217.065752 782.332956 214.951892 785.897204 212.584292 789.613841 209.515541 794.431134 206.194743 799.237633 202.873358 803.77396 200.894915 806.476107 199.385181 808.450099 198.588038 809.457524 172.393538 846.514453 195.912543 878.240014 237.91885 864.281028 238.904007 863.944749 240.468491 863.41216 242.667337 862.668117 246.342793 861.42442 250.469427 860.037674 254.950478 858.543831 267.750292 854.276769 280.813441 850.010352 293.359528 846.033927 295.896051 845.229988 298.389767 844.444875 300.83653 843.680116 316.56621 838.763658 329.922562 834.822101 340.069379 832.152296 345.53275 830.714787 349.931698 829.683229 353.049854 829.104939 354.354436 828.862994 355.312446 828.724123 355.799045 828.684232 354.825653 828.76403 353.666503 828.729983 351.271205 828.060274 395.73304 840.491494 442.681213 846.909372 490.684916 846.909372 515.054363 846.909372 539.17115 845.255803 562.858125 841.990612L553.743714 841.264542C587.27542 851.488506 622.974605 856.786459 659.544225 856.786459 693.181558 856.786459 726.090816 852.304522 757.271021 843.619314 754.092157 844.504782 753.608504 844.478091 752.940486 844.368364 754.491872 844.623192 756.826954 845.133168 759.766796 845.870344 765.488513 847.305086 773.068547 849.485235 781.988654 852.233024 783.660815 852.748123 785.371243 853.28047 787.11584 853.828542 794.321124 856.09211 801.796248 858.523923 809.096177 860.956383 813.473523 862.414988 816.808901 863.546001 818.665128 864.183881 860.663463 877.971145 884.367548 846.417249 859.473647 810.157106L858.061678 808.322293C856.808278 806.864525 854.629739 804.067756 852.506478 800.829267 851.198804 798.834746 850.132845 796.983268 849.402965 795.433479 848.88826 798.914448 846.566215 803.916137 841.990053 806.75813 915.30587 761.225855 959.616766 690.536117 959.616766 613.308352 959.616766 565.930919 942.964529 520.637339 912.303541 481.843704L916.899107 494.563385C912.222016 305.709617 721.984814 156.359281 490.684916 156.359281ZM874.458588 502.750536 878.87761 508.341678C903.736413 539.794134 916.986598 575.834235 916.986598 613.308352 916.986598 674.834711 880.94872 732.326397 819.523603 770.474036 802.737889 780.898687 803.163281 797.33264 810.846353 813.646472 812.511881 817.182966 814.544511 820.713465 816.871626 824.262883 820.163834 829.284301 823.400763 833.439809 825.757675 836.181018L824.345705 834.346205C826.245123 837.112873 827.218499 839.100202 827.393889 839.834262 826.869427 837.639217 827.310775 834.026062 830.096989 830.317167 832.870293 826.625461 836.179448 825.20914 838.39741 825.099927 837.62165 825.138126 835.424001 824.758139 832.221342 823.706931 830.525993 823.122175 827.066992 821.949243 822.554587 820.445634 815.038264 817.941067 807.337514 815.435854 799.875177 813.091531 798.056786 812.520277 796.271017 811.964481 794.521489 811.425549 765.181772 802.387618 755.193882 799.883117 745.847847 802.486444 718.393861 810.133719 689.327665 814.092267 659.544225 814.092267 627.172439 814.092267 595.657587 809.415292 566.15969 800.421253L561.682084 799.056011 557.04528 799.695183C535.285067 802.694774 513.110434 804.215178 490.684916 804.215178 446.549157 804.215178 403.457662 798.324515 362.734113 786.938494 351.832032 783.890348 334.145392 788.544012 288.136195 802.924618 285.63427 803.706617 283.086605 804.508715 280.497094 805.329449 267.729439 809.3761 254.472422 813.705833 241.486537 818.034925 236.942593 819.549735 232.755682 820.956737 229.021658 822.220252 226.774814 822.980535 225.182894 823.522465 224.313674 823.819927 221.208111 824.851035 218.947329 825.258295 218.14354 825.226502 220.466916 825.3184 223.929592 826.769872 226.819244 830.667817 229.71253 834.570666 230.098527 838.322463 229.508371 840.593362 229.704432 839.838924 230.732379 837.824526 232.699225 835.037893 233.109594 834.570863 234.938024 832.180175 237.251504 829.020436 241.083328 823.786956 244.915738 818.239954 248.523314 812.576814 251.420355 808.029067 254.057357 803.582735 256.378759 799.271676 270.621662 772.821292 274.586859 752.486106 253.20607 739.157937 161.261462 681.842314 107.013402 594.975258 107.013402 501.634326 107.013402 335.711853 277.868719 199.053473 490.684916 199.053473 700.625512 199.053473 870.235026 332.209541 874.282045 495.621998L874.458588 502.750536ZM874.35643 501.634326 916.986598 501.634326C916.986598 499.274725 916.957412 496.917663 916.899107 494.563385L874.282045 495.621998C874.331614 497.623493 874.35643 499.627657 874.35643 501.634326ZM557.04528 799.695183 559.951702 820.842898 566.15969 800.421253C467.508194 770.341978 402.101853 695.9473 402.101853 613.308352 402.101853 503.628141 516.430046 412.524437 659.544225 412.524437 750.184557 412.524437 832.352401 449.475927 878.87761 508.341678L912.303541 481.843704C857.398565 412.375501 762.792042 369.830244 659.544225 369.830244 494.751422 369.830244 359.471685 477.629422 359.471685 613.308352 359.471685 716.357726 438.355709 806.082232 553.743714 841.264542L558.221321 842.629784 562.858125 841.990612C564.566072 841.755176 566.271624 841.511382 567.974711 841.259249L561.740762 799.024014C560.177951 799.255379 558.612768 799.479109 557.04528 799.695183Z" p-id="5816"></path></svg>
\ No newline at end of file

src/assets/svg/icon_official.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1666247966200" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18300" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M395.765333 586.570667h-171.733333c-22.421333 0-37.888-22.442667-29.909333-43.381334L364.768 95.274667A32 32 0 0 1 394.666667 74.666667h287.957333c22.72 0 38.208 23.018667 29.632 44.064l-99.36 243.882666h187.050667c27.509333 0 42.186667 32.426667 24.042666 53.098667l-458.602666 522.56c-22.293333 25.408-63.626667 3.392-54.976-29.28l85.354666-322.421333z" p-id="18301"></path></svg>
\ No newline at end of file

src/assets/svg/icon_sign.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1665305204396" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2647" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M704 170.666667H320v53.333333a21.333333 21.333333 0 0 1-42.666667 0V170.666667h-42.666666a106.666667 106.666667 0 0 0-106.666667 106.666666v85.333334h768v-85.333334a106.666667 106.666667 0 0 0-106.666667-106.666666h-42.666666v53.333333a21.333333 21.333333 0 0 1-42.666667 0V170.666667z m42.666667-42.666667h42.666666a149.333333 149.333333 0 0 1 149.333334 149.333333v512a149.333333 149.333333 0 0 1-149.333334 149.333334H234.666667a149.333333 149.333333 0 0 1-149.333334-149.333334V277.333333a149.333333 149.333333 0 0 1 149.333334-149.333333h42.666666V96a21.333333 21.333333 0 0 1 42.666667 0V128h384V96a21.333333 21.333333 0 0 1 42.666667 0V128z m149.333333 277.333333H128v384a106.666667 106.666667 0 0 0 106.666667 106.666667h554.666666a106.666667 106.666667 0 0 0 106.666667-106.666667V405.333333zM327.210667 642.304a21.333333 21.333333 0 0 1 28.245333-32l98.048 86.549333a21.333333 21.333333 0 0 0 29.866667-1.642666l179.882666-197.568a21.333333 21.333333 0 0 1 31.552 28.714666l-179.861333 197.568a64 64 0 0 1-89.664 4.906667l-98.069333-86.528z" p-id="2648"></path></svg>
\ No newline at end of file

src/assets/svg/icon_top.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1665994642562" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8290" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M778.94 659.1c-1.3-13.86-4.78-33.96-13.12-61.31-16.49-54.08-63.83-89.67-74.29-97a3.825 3.825 0 0 1-1.56-3.87c3.04-15.68 17.79-104.94-12.94-225.32C646.65 152.62 541 97.64 519.31 87.48c-2.48-1.16-7-2.55-9.45-1.44-10.39 4.73-128.49 58.66-160.88 185.58-30.73 120.37-15.98 209.63-12.94 225.31 0.29 1.48-0.32 3-1.56 3.87-10.47 7.34-57.81 42.92-74.29 97-8.15 26.74-11.66 46.56-13.03 60.38-1.36 13.68 9.38 25.55 23.14 25.55h123.48c0.99 0 1.94 0.38 2.66 1.07l0.19 0.18c0.74 0.71 1.16 1.7 1.17 2.73 0.86 62.99 52.2 113.79 115.39 113.79 63.26 0 114.63-50.9 115.39-113.97 0.01-0.92 0.34-1.81 0.96-2.5 0.73-0.83 1.78-1.3 2.88-1.3h124.03c13.27-0.01 23.73-11.41 22.49-24.63z m-265.9-224.97c-36.52 0-66.12-29.6-66.12-66.12s29.6-66.12 66.12-66.12 66.12 29.6 66.12 66.12-29.6 66.12-66.12 66.12z" p-id="8291" ></path><path d="M513.04 368.01m-44.14 0a44.14 44.14 0 1 0 88.28 0 44.14 44.14 0 1 0-88.28 0Z" p-id="8292"></path><path d="M353.12 830.01c-13.29 0-24.16-10.87-24.16-24.16v-84.77c0-13.29 10.87-24.16 24.16-24.16 13.29 0 24.16 10.87 24.16 24.16v84.77c0 13.29-10.87 24.16-24.16 24.16zM675.68 830.86c-13.29 0-24.16-10.87-24.16-24.16v-84.77c0-13.29 10.87-24.16 24.16-24.16 13.29 0 24.16 10.87 24.16 24.16v84.77c0 13.29-10.88 24.16-24.16 24.16zM513.04 948.69c-13.29 0-24.16-10.87-24.16-24.16v-84.77c0-13.29 10.87-24.16 24.16-24.16 13.29 0 24.16 10.87 24.16 24.16v84.77c0 13.29-10.87 24.16-24.16 24.16z" p-id="8293"></path></svg>

src/assets/svg/icon_user.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1666079646119" class="icon" viewBox="0 0 1107 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="13858" xmlns:xlink="http://www.w3.org/1999/xlink" width="216.2109375" height="200"><path d="M563.323289 661.336738a330.663562 330.663562 0 1 0-330.531877-330.663562 331.190306 331.190306 0 0 0 330.531877 330.663562z" p-id="13859"></path><path d="M1106.528066 975.53955c-16.724123-134.319727-137.611877-293.001365-273.38015-373.066457a381.889419 381.889419 0 0 1-539.912627-0.65843C157.335331 679.246035 18.274908 834.635523 0.365611 975.53955a42.797952 42.797952 0 0 0 37.26714 48.065392h1031.628175A43.061324 43.061324 0 0 0 1106.528066 975.53955z" p-id="13860"></path></svg>

src/assets/svg/img_gui.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1687685273856" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="10463" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M359.68 50.7648c140.7488 0 254.848 114.1248 254.848 254.8736 0 5.5552-0.1792 11.1104-0.5376 16.6656-10.7776 164.3008-0.5888 283.5712 30.5408 357.8112 46.2848 110.336 165.6576 185.088 358.144 224.256-118.7328 60.3136-254.464 80.9984-407.1936 62.08-229.12-28.3904-371.1232 85.9648-520.704-177.0496C11.6992 678.4768-11.4688 539.2128 5.248 371.584A356.1728 356.1728 0 0 1 359.68 50.7648z" fill="#FFFFFF" p-id="10464"></path><path d="M359.68 50.7648c140.7488 0 254.848 114.1248 254.848 254.8736 0 5.5552-0.1792 11.1104-0.5376 16.6656-10.7776 164.3008-0.5888 283.5712 30.5408 357.8112 46.2848 110.336 165.6576 185.088 358.144 224.256-115.2512 58.5216-246.5024 79.744-393.7536 63.6416l-13.44-1.5616c-229.12-28.3904-371.1232 85.9648-520.704-177.0496C11.6992 678.4768-11.4688 539.2128 5.248 371.584A356.1728 356.1728 0 0 1 359.68 50.7648z m0 21.3504a334.848 334.848 0 0 0-333.184 301.568c-16.3328 163.5328 6.144 298.4192 66.816 405.1712a591.36 591.36 0 0 0 34.4064 53.9648c73.2928 101.4784 126.3616 118.8096 278.912 111.36l36.4288-1.9712c63.1296-3.2512 101.888-3.072 148.0448 2.2272l6.9888 0.8448c121.6512 15.0784 231.7568 4.3776 330.6496-31.9232l7.168-2.7136-9.8048-2.6624c-153.8048-42.88-253.824-113.664-298.4704-213.2224l-2.7648-6.4c-32.7168-77.952-43.136-200.1152-32.1792-367.4368a233.5232 233.5232 0 0 0-233.0368-248.8064z" fill="#000000" p-id="10465"></path><path d="M128 426.6752m0-42.6752a42.6752 42.6752 0 1 0 0 85.3504 42.6752 42.6752 0 1 0 0-85.3504Z" fill="#FFDDDD" p-id="10466"></path><path d="M469.3248 426.6752m0-42.6752a42.6752 42.6752 0 1 0 0 85.3504 42.6752 42.6752 0 1 0 0-85.3504Z" fill="#FFDDDD" p-id="10467"></path><path d="M181.3248 309.3248m-32 0a32 32 0 1 0 64 0 32 32 0 1 0-64 0Z" fill="#000000" p-id="10468"></path><path d="M412.288 288.3328c14.4128-2.56 29.184 3.9424 44.3648 18.176a10.6752 10.6752 0 1 1-14.592 15.5648c-10.752-10.0864-19.456-13.9008-26.0608-12.7488-6.6048 1.1776-13.4912 7.7312-20.1472 20.8896a10.6752 10.6752 0 1 1-19.0208-9.6512c9.3952-18.56 21.0688-29.696 35.456-32.256z" fill="#000000" p-id="10469"></path><path d="M249.2928 433.5616c-11.52 61.184 3.712 91.776 45.696 91.776s58.8032-30.592 50.432-91.776" fill="#FFA7A7" p-id="10470"></path><path d="M294.9888 451.1232c22.5024 0 44.9536-4.9152 67.2512-14.6944a10.6752 10.6752 0 1 0-8.5504-19.5328c-19.6608 8.6272-39.2192 12.9024-58.7008 12.9024-19.4816 0-39.0144-4.2752-58.7008-12.9024a10.6752 10.6752 0 0 0-8.5504 19.5328c22.3232 9.7792 44.7488 14.6944 67.2512 14.6944zM490.6752 575.9488a42.6752 42.6752 0 0 0-73.728-42.8288l-1.6128 2.7648-25.0368 47.104a10.6752 10.6752 0 0 0 17.792 11.6224l1.024-1.6128 25.0624-47.104a21.3248 21.3248 0 0 1 38.7072 17.7664l-1.024 2.2784-25.0624 47.104a10.6752 10.6752 0 0 0 17.792 11.5968l1.0496-1.6128 25.0368-47.104zM106.6496 575.9488a42.6752 42.6752 0 0 1 73.728-42.8288l1.6128 2.7648 25.0368 47.104a10.6752 10.6752 0 0 1-17.7664 11.6224l-1.0496-1.6128-25.0368-47.104a21.3248 21.3248 0 0 0-38.7328 17.7664l1.024 2.2784 25.0624 47.104a10.6752 10.6752 0 0 1-17.792 11.5968l-1.024-1.6128-25.0624-47.104z" fill="#000000" p-id="10471"></path></svg>
\ No newline at end of file

src/assets/svg/lettter.svg

+<svg width="44" height="44" viewBox="0 0 44 44" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<rect width="44" height="44" fill="url(#pattern0_3339_802)"/>
+<defs>
+<pattern id="pattern0_3339_802" patternContentUnits="objectBoundingBox" width="1" height="1">
+<use xlink:href="#image0_3339_802" transform="scale(0.005)"/>
+</pattern>
+<image id="image0_3339_802" width="200" height="200" preserveAspectRatio="none" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACtWK6eAAAAAXNSR0IArs4c6QAAEV5JREFUeF7tnXtsHMUdx3+z9/A5zsMkJPjyAEeBhARKbUNCGwgEaBEBFVVUlSr6RxugVVUeimynlQgVFFCL5AdURUJIqKAKoT5EKQ8V1KpAmlJE2sSGQqAUEiOaOATZceLEr/PdlEl8wbnc3e7Mzszt7X5XivKHf/Ob+X1/8/FvZ3a8ywgXFIACJRVg0AYKQIHSCgAQzA4oUEYBAILpAQUACOYAFFBTABVETTe0iogCACQiiUaYagoAEDXd0CoiCgCQiCQaYaopAEDUdEOriCgAQCKSaISppgAAUdMNrSKiAACJSKIRppoCAERNN7SKiAIAJCKJRphqCgAQNd3QKiIKAJCIJBphqikAQNR0Q6uIKABAIpJohKmmAABR081Iq5b2/VuI6OjOzoaHjHQAp9IKABBpyfQ3aGrdu5Yx1kHE1h73zv5CfHJzT/fiN/X3Bo8yCgAQGbUM2Da37b+PiN9VzDVn7M7ezoafG+gWLj0qAEA8CqXbrKV9/5WceAdxainnmxP9PcZY+47Ohjd0jwH+3BUAIO4aabdobtvXScTaJB3f29OVvluyDcx9KgBAfAoo07yptf9axqiDiFbJtPvclu/gjLX3dqZfVWuPVrIKABBZxRTs19+zJzU0nOpkRLcqND+lCSPq2NmV/pEOX/BRXgEAYniGtLTtu4ET6ySipZq7euezLeHNPV3pFzX7hbtpCgAQQ9OhadPBeuaMdhJjNxvq4rhbTg8PZxraP/glGzfaT0SdAxADiW9q338j41xUjbQB96e45ES7Hea07+w84xkb/UWpDwCiMdsXbupL81iqgxP/tka3Eq7YYzw7urn3oaVDEo1gWkaBqgRk/OGYmACJIGU2y2PxSUokOLGKasqI8zhlMjGWnQySPmIsNbdl64I2JrfxVDSZboMr9fMpQOaotke7iiiQqbktm6xIzz46BSA+xENTKQUAiJRcPoxRQXyIV7mmAMSW9gDEltJa+wEgWuUs4wyA2FJaaz8ARKucAMSWnLb6ASC2lEYFsaW01n4AiFY5UUFsyWmrHwCiQ+nJ7dfdQMTKn3odHryMi+dhuKpHAUaczZr3SrkB54ieTK554fEgBRW45yBTgDwdJJEwFjsK5IhuAiAuWgMQO5MxiL0AEA9ZASAeRAqpCQDxkFgA4kGkkJoAEA+JBSAeRAqpCQDxkFgA4kGkkJoAEA+JBSAeRAqpCQDxkFgA4kGkkJoAECLae3TyZoexr5bKcWy8f3F87MNLQjoHEFYZBTKpxu25msV7Spk4E86dZ9Sz3TZFtP6g8BggxB6zGST6CocCTsZZBkDCkUtEYUABAGJAVLgMjwIAJDy5RCQGFAAgBkSFy/AoAEDCk0tEYkABAGJAVLgMjwIAJDy5RCQGFAAgBkSFy/AoAEDCk0tEYkABAGJAVLgMjwIAJDy5RCQGFAAgBkSFy/AoAEACkMtsjtPWvgnaM5Clw+OcZiStn+e0qsLYJKf6FKNz5sVp7VnB/joBALE6NYp39sgbI9R3MHDfnrGiTPPCBH3rglorfal0AkBUVNPY5l97M/T7f49q9Fh9rm7/ch0tnhML5MAjAcjre8Z/3Lgg/kAQM/Dcu2P02kcTQRyatTF94/xaWrM4UF+3OxH7M9uOXvbDa2ZvsyYGEVm9wW5q7b91w+ra7juunxXIm91n3x2jf0QckBvOS9HFSwKZHrrlwcGRfYOT7T3d6UdsQWIFkJZN+1Zyh3USo2uvbknRpq/PthWfVD8AhCjIgNz04ADtP5glTvRCjPjmHV0L35NKsIKxcUCa2/rbiEh8M/zYBUAUsmSxSTUAMiVHjjjf3NO9sNukPMYA+WLrgWaHZQUYV04PAICYTKd/31UESD7Yv3In1t7bsaDXf/SnejACSEv7/i2ffZ7g/mIDBiAm0qjPZxUCcix4TmxLb1fDz/QpcdyTVkCaWveuZYx1ELG1pQYKQHSnUK+/agXkOCXsNXImN/d0Ln5dlyraAGlu238fEb/LbWBBBgTbvERB3ubNL9Ld5hgRv7+na+FP3O3cLXwD0tK+/0pOvIM4tbh3F+xF+s59GfrtW9F+UHjH2jpaNDuYDwq9AyKqCd/pEGvf0Z0u+1UrtznrC5Dmtn2dREzsUnm+glxBRBCPbh+h3YPRPGpy0aIEffMLwT1qIgXI1IxkjDp3dqY3e56gBYZKgDS19l/LGHUQ0SrZjoMOiIjnb+Kw4uDk8cOKCSWJZGWpmP34JKc5KUbLT0/Q6oA+Qc+LowLIVNtdnNPm3u70n2SFVsr+7c8PZfd8kHH2/k/+N201ACIrIuztKKAKyKoVSWpZmeRt62Y5siNVAqTtpcOZGOPxyRzR++9NkAwoAEQ2RbBXrSDLlyXp0uYamlXjUCbL+fdW19kC5FAmxujEZ5gPDefovXcn6PBQzjWbAMRVIhiUUMBrBVm4ME5XX1xLc2Z8zkNFARHxTOaIDwxkWd+eTFlQAAjmv6oCboDMrndowyUzqKH+1F24igOSD1rcdg0MZOmtnvGiOgAQ1emBdqUASaYYbbislhrnlz6mHxhA3EABIJjoqgoUA+SyS2vp/MUJSsTKL6etAtL64qFc3PF2TKWwogAQ1emBdtMBWbYiQWcuSdDK0+OucAjlJrKcvr+6TnpTSrqB6Kz1pUO5OPMGyPSKIna8zlsQD+zfg2AKBlsBAUisjtHyc5MUn1p/nzM3JIDkpc9yossbk7Q6oH+1FuwpEt3RfTyUpSd7RihV8OA2dIDkU1yXYLRhRYqWFNlxiO40QOSFCggwXvzPGB3N8KLihBYQEa0IuWGmQ+saa7SCcnA0Rzv2Zkj8j8u8AqfVOnThogSJ/3VdAoxtfeP0yZHyOQw1IHkx86Dc2DRDi74PbD0COLQo6d2JroOOXsHIjywSgOgG5dHtR2n3YNZ7dmHpWwEdgDzVO+JaMQoHGilAdIEibq0+HMzSEG6xfE98rw6+cnaNV9NT7MTL+j4aypLLo4zorUHcFBW3Xi2LkrR+aTDf0+Q2fvy8vAL//HiCtn00Ife8oMBlJCtIoawClHVnYWs4LMCJdcYfdo1STsMeCgCZNiuwNVzdiLht2apEB0AKVDO1NaySHLTxpoDszpQ3r8etAEgJtXRvDcskBbbeFDAJRn4EAMQlFwDF22S1baWyZasyRgDiUTWA4lEow2YCjH3DOaUtW5WhARBJ1QQoK+Yn6LoV6vvykl3CnIh0bNmqCAlAVFSbOueFrWFF8SSa6dyylej2hCkAUVFtWpvRDKcjE5zEMXtc+hQQT71nJhnVVvi9YQBEQ04FHAIU8Q+g+BNUgCGgEHAE4QIgGrOQB0VUFFxyCgQNDGzzyuVPylrgMa/WoetXpaTaRdX4uV1jNBjQg5+oIAZnJbaGy4tre8tWJdUAREU1yTbYGj5ZsEpt2Uqm7Zg5AFFRTbFN1E8NV3rLViVtAERFNZ9tonZqWIDxx12j4vWxVXcBkAqlTFSTubUOXbVM7wslKhRO0W5tHCY0HS8AMa2wi/8wLuTDAAa2eSsMRmH3YQHF1ilbW+lDBbGltMd+qhWUatiy9ZiCk8wAiIpqFtrkONGiOTFaszjYL5R4/9MMvXNgkpxgnAzRnhkAol1SvQ7F8ZVDYzmaCNhruMTREPFxzqTKu3T0SmTUGwAxKq8+50E5NRyUU7b6lC3vCYDYUlpDP6Ka5HLixDAjZvmWhnMiRpxq4pY71qCbHxcAxI96FWprcyEfpi1blXQBEBXVAtLGNChh27JVSRsAUVEtYG10gxLWLVuVtAEQFdUC2sbvqeFqOmVrKwUAxJbSFvuRPTUs1hm/e3uEPH431WIkle8KgFQ+B8ZGIE4Nr1uapJULin/fu5pP2RoTrcAxALGldIX6EdVkZsH3GqO+MyWTCgAio1YV2wpQlsyJUSbLpb+yVMVh+x46APEtYXU4EB+6Hxzlx17ZGaTX6gRdPQAS9AxpGJ94DVHhq4jEe6eC8u4pDSEacwFAjElbecfiaMrgSK7ky+yicuDQTyYAiB/1Aty2WNUoNVxUk9KJBCABnuQqQ1M9Ho9qUlxtAKIyCwPaRqZqFAsBC/hTVQEgAZ3sMsNSrRql+hCgzJ3hWPtIjUystm0BiG3FNffnt2qUgwTbwXizoubpas+d7qqBaoI1iL3Za7gnU1UD1QRrEMNT16x7W1UD1eRzBbAGMTuntXkXL204NF75D/NEbacLgGibwmYcVbpqlIoqGROv/Qn/ThcAMTOvtXjNHzDU4syAkyhUEwBiYOL4dRnUqlEqrvx2cBjfIQdA/M5mze2DXjWittMFQDRPcD/ubG/f+hlrqbZhO/gIQEzMEkmfomocGgvPN9bDdPARgEhOZt3mYagaYa4mAET3jPfoz+2PmTy6CbxZtVcTAFKBKRbmqlFMzmreDgYgFgGptu1b3dJU4zF6AKJ7FpTwF7WqEZbtYABiGJCoV41yoFTDH2UBEIOAoGqUF7ca1iYAxAAgqBpyogZ5bQJA5HLpah2UY+muAw2YQVCrCQDRNFFQNfQIGbRj9ABEQ16r9YChhtCNuAhSNQEgPlKMquFDPA9Ng3CMHoB4SFQxE1QNReEkm1W6mgAQyYSJqiEW4oVvS5d0A3NJBSp1jB6ASCQKVUNCLAOmlTj4CEA8JhIP/TwKZcHMZjUBIC4JjcqxdAvzWmsXtqoJACmTNlQNrXNauzMbC3gAUiRtqBra57JRhyaPqgCQgtShahidy8acm6omAGQqZXjoZ2zuWnWsu5oAEKJjzzTwXMPqPDbamc5qEmlAUDWMztOKO9dRTQIJyO3PD2Vrk8wxqTCqhkl1g+PbbzVZNT/hKZgjEzx325fqYp6Mpxkx2QbC/gdPD03Mnsm8jUyyA1QNScFCYq5yjD4RYyQqiJdr78HJiS1Xza7xYjvdRgmQjU8NjM6fF0/JduZmjz9mclMo3D+XrSYzkg41zvFWFHYfyAzfe82c2bIKKgHytV98OrDy3ORc2c5K2aNq6FIyHH68HqOfX+fQ/BneAHl55+h/f33LvOWyCikBcsV9n/Q3X5RqiGtYheCAoWzKomHvpZrILNAf+c3hV3u60lfIqqcESHNb/56zz002Lj3T2/1fsUGhasimKpr2pQ4+ylSPrW+OUe/b41YBeYWI1l+6PkW1SfkygqoRzcmuGnVhNZFZnA+P5ehXTw8TI3piZ1d6o+wYlCpIU2v/3YzRPbPrHbp4jdxaHdu3simCfV6BfDURC3OxQHe7xC/iJ54dptFRTpzTPb3d6Z+6tSn8uRog7f3rGSdRRUhAckFT0rWShO0bG7JCw96/Aqk4o1Xz41SfcofjyESOnn95hA4MZI91zDlt7O1OPyE7CjVANvU3shjtyXcmIGlcmqAz5hffUUDVkE0L7AsVqK91qKXB26O3vk8z9OyfR05ywbO0tPehdJ+ssn4AeVysQ6Z3KEBZ0BCnuac5lKwhSiYcGhzJkViQ44ICsgqkZ8WovobRabUOiepR6jo6kaPhEU4HR3LU+9b4iaoxzV5pgS7aKwEiGjYVVBHZ4GEPBWwpwBld0duZflWlP2VARGctbf2Pc6LvqnSMNlDAhgKqi/P82HwBMlVFxGK90Uaw6AMKSCrQ19OVXirZ5iRzX4Dkb7XIoe+IbV8/A0FbKKBTAb+VQ0sFmR5Q/tmIziDhCwooKNDHGW1UXXMU9ue7gpwEyab+47daDq13GF3OceulkF80kVWAczq+AHdoqy4wtFcQ2aBgDwWqQQGtFaQaAsYYoYCMAgBERi3YRk4BABK5lCNgGQUAiIxasI2cAgAkcilHwDIKABAZtWAbOQUASORSjoBlFAAgMmrBNnIKAJDIpRwByygAQGTUgm3kFAAgkUs5ApZRAIDIqAXbyCkAQCKXcgQsowAAkVELtpFTAIBELuUIWEYBACKjFmwjpwAAiVzKEbCMAgBERi3YRk6B/wPA8GVBLAoiTAAAAABJRU5ErkJggg=="/>
+</defs>
+</svg>

src/assets/svg/nav_activity.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1669102612503" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2710" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M736.8704 399.36c-3.2768-5.8368-3.2768-12.9024 0-18.7392l110.1824-197.12c7.168-12.8-2.048-28.4672-16.6912-28.4672H242.8928c-10.8544 0-19.7632 8.8064-19.7632 19.7632v653.312h-28.3648c-8.2944 0-15.9744 5.0176-18.8416 12.8-5.3248 14.5408 5.3248 28.16 19.0464 28.16h97.4848c8.2944 0 15.9744-5.0176 18.8416-12.8 5.3248-14.5408-5.3248-28.16-19.0464-28.16h-28.16V625.0496h566.1696c14.6432 0 23.8592-15.7696 16.6912-28.4672L736.8704 399.36zM264.0896 584.0896v-388.096h528.9984l-92.0576 164.7616c-10.1376 18.1248-10.1376 40.5504 0 58.6752l92.0576 164.7616H264.0896z" p-id="2711"></path><path d="M648.9088 344.9856l-86.1184-12.4928c-2.4576-0.3072-4.5056-1.8432-5.632-4.096l-38.5024-78.0288c-1.3312-2.7648-3.9936-4.096-6.656-4.096s-5.3248 1.3312-6.656 4.096l-38.5024 78.0288c-1.1264 2.1504-3.1744 3.6864-5.632 4.096l-86.1184 12.4928c-6.0416 0.9216-8.4992 8.3968-4.096 12.6976l62.3616 60.7232c1.7408 1.7408 2.56 4.1984 2.1504 6.5536l-14.7456 85.8112c-0.8192 4.8128 2.9696 8.704 7.2704 8.704 1.1264 0 2.3552-0.3072 3.4816-0.8192l77.0048-40.5504c1.1264-0.6144 2.2528-0.8192 3.4816-0.8192s2.3552 0.3072 3.4816 0.8192l77.0048 40.5504c1.1264 0.6144 2.3552 0.8192 3.4816 0.8192 4.3008 0 8.0896-3.8912 7.2704-8.704L588.5952 424.96c-0.4096-2.4576 0.4096-4.9152 2.1504-6.5536l62.3616-60.7232c4.3008-4.4032 1.9456-11.8784-4.1984-12.6976z m-81.1008 49.9712c-9.5232 9.216-13.824 22.528-11.5712 35.5328l6.0416 35.2256-31.6416-16.5888c-5.7344-2.9696-12.1856-4.608-18.7392-4.608s-13.0048 1.6384-18.7392 4.608l-31.6416 16.5888 6.0416-35.2256c2.2528-13.0048-2.048-26.3168-11.5712-35.5328l-25.6-24.8832 35.328-5.12c13.1072-1.9456 24.3712-10.1376 30.3104-22.016l15.7696-32.0512 15.7696 32.0512c5.8368 11.8784 17.2032 20.0704 30.3104 22.016l35.328 5.12-25.3952 24.8832z" p-id="2712"></path></svg>
\ No newline at end of file

src/assets/svg/nav_article.svg

+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1676965920045"
+	class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5625"
+	xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200">
+	<path
+		d="M859.136 51.712h-253.952c-38.4 0-72.704 19.456-93.184 48.64-20.48-29.184-54.784-48.64-93.184-48.64H164.864C102.4 51.712 51.2 102.912 51.2 165.376v627.2c0 62.976 51.2 113.664 113.664 113.664h211.456c32.256 41.472 81.92 65.536 135.168 65.536 52.736 0 102.4-24.576 135.168-65.536h211.456c62.976 0 113.664-51.2 113.664-113.664V165.376c1.024-62.464-50.176-113.664-112.64-113.664zM931.84 792.576c0 39.936-32.768 72.704-72.704 72.704h-222.208c-6.656 0-13.312 3.584-16.896 8.704-24.576 35.328-64.512 56.832-107.52 56.832s-83.456-20.992-107.52-56.832c-3.584-5.632-10.24-8.704-16.896-8.704H165.888c-39.936 0-72.704-32.768-72.704-72.704V165.376c0-39.936 32.768-72.704 72.704-72.704H419.84c39.936 0 72.704 32.768 72.704 72.704V629.76c0 11.264 9.216 20.48 20.48 20.48s20.48-9.216 20.48-20.48V165.376c0-39.936 32.768-72.704 72.704-72.704H860.16c39.936 0 72.704 32.768 72.704 72.704v627.2z"
+		p-id="5626"></path>
+	<path
+		d="M367.104 241.152H215.04c-11.264 0-20.48 9.216-20.48 20.48s9.216 20.48 20.48 20.48h151.552c11.264 0 20.48-9.216 20.48-20.48s-8.704-20.48-19.968-20.48zM367.104 457.216H215.04c-11.264 0-20.48 9.216-20.48 20.48s9.216 20.48 20.48 20.48h151.552c11.264 0 20.48-9.216 20.48-20.48s-8.704-20.48-19.968-20.48zM367.104 672.768H215.04c-11.264 0-20.48 9.216-20.48 20.48s9.216 20.48 20.48 20.48h151.552c11.264 0 20.48-9.216 20.48-20.48 0.512-11.264-8.704-20.48-19.968-20.48zM807.936 241.152h-151.552c-11.264 0-20.48 9.216-20.48 20.48s9.216 20.48 20.48 20.48h151.552c11.264 0 20.48-9.216 20.48-20.48s-9.216-20.48-20.48-20.48zM807.936 457.216h-151.552c-11.264 0-20.48 9.216-20.48 20.48s9.216 20.48 20.48 20.48h151.552c11.264 0 20.48-9.216 20.48-20.48s-9.216-20.48-20.48-20.48zM807.936 672.768h-151.552c-11.264 0-20.48 9.216-20.48 20.48s9.216 20.48 20.48 20.48h151.552c11.264 0 20.48-9.216 20.48-20.48s-9.216-20.48-20.48-20.48z"
+		p-id="5627"></path>
+</svg>

src/assets/svg/nav_audit.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1663229457209" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8615" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M97.878 483.853c0-117.062-0.108-160.999-0.108-278.062 0-101.472 56.328-108.082 110.483-108.082h441.933c85.128 0 111.453 28.968 111.453 110.481v55.241c0 43.562-55.419 38.57-55.419 0V208.19c0-40.918-13.309-55.24-56.035-55.24H208.252c-45.746 0-55.241 6.203-55.241 55.24v552.407c0 30.278 16.572 55.241 55.241 55.241 67.004 0 43.482 0.026 110.484 0 33.77 0 36.252 55.241 0 55.241s-63.711 0.44-131.306 0.17c-39.867-0.163-72.883-23.774-84.643-60.322-3.292-10.223-4.694-21.525-4.694-32.34-0.323-116.658-0.215-178.076-0.215-294.734" p-id="8616"></path><path d="M649.644 926.291c-152.344-0.027-275.666-123.537-275.666-276.122 0-152.586 123.915-276.259 276.529-276.042 152.616 0.215 275.884 124.022 275.722 276.878-0.16 152.236-123.807 275.314-276.585 275.286m0.756-496.868c-121.109-0.271-220.641 98.828-220.91 220.045-0.27 121.541 98.345 220.934 219.561 221.287 121.704 0.324 221.505-98.208 221.775-219.047 0.324-122.594-98.236-221.99-220.426-222.285M594.945 263.061c44.02 0.027 37.978 55.979 0 55.979h-331.45c-41.431 0-39.704-55.979 0-55.979 108.756-0.027 289.155-0.027 331.45 0zM318.736 428.782c44.021 0.028 37.979 55.98 0 55.98h-55.242c-41.431 0-39.704-55.98 0-55.98 108.757-0.027 12.948-0.027 55.242 0z" p-id="8617"></path><path d="M785.502 547.22c-12.496-12.498-32.758-12.498-45.254 0L602.151 685.316l-42.191-42.191c-12.498-12.496-32.758-12.496-45.256 0-12.496 12.497-12.496 32.759 0 45.256l64.818 64.818c6.249 6.248 14.438 9.372 22.628 9.372s16.379-3.124 22.628-9.372a32.424 32.424 0 0 0 2.402-2.695 32.304 32.304 0 0 0 2.689-2.397l155.633-155.633c12.497-12.496 12.497-32.758 0-45.254z" p-id="8618"></path></svg>

src/assets/svg/nav_ban.svg

+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1712731651220"
+	class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5138"
+	xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200">
+	<path
+		d="M624.500364 925.184a204.8 204.8 0 0 0 233.192727-333.312l-233.192727 333.265455z m-45.149091-32.954182l232.029091-331.543273a204.8 204.8 0 0 0-231.982546 331.543273zM426.356364 571.485091c-181.434182 37.469091-280.994909 152.389818-302.638546 350.533818a27.927273 27.927273 0 0 1-55.528727-6.050909c21.504-196.654545 115.898182-325.026909 280.389818-381.207273a283.927273 283.927273 0 1 1 419.374546-109.149091 27.927273 27.927273 0 0 1-50.269091-24.203636 228.072727 228.072727 0 1 0-282.670546 115.898182 27.927273 27.927273 0 0 1-8.657454 54.178909zM721.454545 1005.381818a260.654545 260.654545 0 1 1 0-521.309091 260.654545 260.654545 0 0 1 0 521.309091z"
+		p-id="5139"></path>
+</svg>

src/assets/svg/nav_collection.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1664505330165" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6482" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M335.008 916.629333c-35.914667 22.314667-82.88 10.773333-104.693333-25.557333a77.333333 77.333333 0 0 1-8.96-57.429333l46.485333-198.24a13.141333 13.141333 0 0 0-4.021333-12.864l-152.16-132.586667c-31.605333-27.52-35.253333-75.648-8.234667-107.733333a75.68 75.68 0 0 1 51.733333-26.752L354.848 339.2c4.352-0.362667 8.245333-3.232 10.026667-7.594667l76.938666-188.170666c16.032-39.2 60.618667-57.92 99.52-41.461334a76.309333 76.309333 0 0 1 40.832 41.461334l76.938667 188.16c1.781333 4.373333 5.674667 7.253333 10.026667 7.605333l199.712 16.277333c41.877333 3.413333 72.885333 40.458667 69.568 82.517334a76.938667 76.938667 0 0 1-26.08 51.978666l-152.16 132.586667c-3.541333 3.082667-5.141333 8.074667-4.021334 12.853333l46.485334 198.24c9.621333 41.013333-15.36 82.336-56.138667 92.224a75.285333 75.285333 0 0 1-57.525333-9.237333l-170.976-106.24a11.296 11.296 0 0 0-12.010667 0l-170.986667 106.24zM551.786667 756.032l170.976 106.24c2.624 1.621333 5.717333 2.122667 8.650666 1.408 6.410667-1.557333 10.56-8.426667 8.928-15.424l-46.485333-198.24a77.141333 77.141333 0 0 1 24.277333-75.733333L870.293333 441.706667c2.485333-2.165333 4.053333-5.312 4.330667-8.746667 0.565333-7.136-4.490667-13.173333-10.976-13.696l-199.712-16.288a75.989333 75.989333 0 0 1-64.064-47.168l-76.938667-188.16a12.309333 12.309333 0 0 0-6.538666-6.741333c-5.898667-2.496-12.725333 0.373333-15.328 6.741333l-76.949334 188.16a75.989333 75.989333 0 0 1-64.064 47.168l-199.701333 16.288a11.68 11.68 0 0 0-7.978667 4.181333 13.226667 13.226667 0 0 0 1.333334 18.261334l152.16 132.586666a77.141333 77.141333 0 0 1 24.277333 75.733334l-46.485333 198.229333a13.333333 13.333333 0 0 0 1.514666 9.877333c3.488 5.792 10.581333 7.530667 16.064 4.128l170.986667-106.229333a75.296 75.296 0 0 1 79.562667 0z" p-id="6483"></path></svg>
\ No newline at end of file

src/assets/svg/nav_comment.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1663229053818" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5225" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M157.568 751.296c-11.008-18.688-18.218667-31.221333-21.802667-37.909333A424.885333 424.885333 0 0 1 85.333333 512C85.333333 276.362667 276.362667 85.333333 512 85.333333s426.666667 191.029333 426.666667 426.666667-191.029333 426.666667-426.666667 426.666667a424.778667 424.778667 0 0 1-219.125333-60.501334 2786.56 2786.56 0 0 0-20.053334-11.765333l-104.405333 28.48c-23.893333 6.506667-45.802667-15.413333-39.285333-39.296l28.437333-104.288z m65.301333 3.786667l-17.258666 63.306666 63.306666-17.258666a32 32 0 0 1 24.522667 3.210666 4515.84 4515.84 0 0 1 32.352 18.944A360.789333 360.789333 0 0 0 512 874.666667c200.298667 0 362.666667-162.368 362.666667-362.666667S712.298667 149.333333 512 149.333333 149.333333 311.701333 149.333333 512c0 60.586667 14.848 118.954667 42.826667 171.136 3.712 6.912 12.928 22.826667 27.370667 47.232a32 32 0 0 1 3.338666 24.714667z m145.994667-70.773334a32 32 0 1 1 40.917333-49.205333A159.189333 159.189333 0 0 0 512 672c37.888 0 73.674667-13.173333 102.186667-36.885333a32 32 0 0 1 40.917333 49.216A223.178667 223.178667 0 0 1 512 736a223.178667 223.178667 0 0 1-143.136-51.690667z" p-id="5226"></path></svg>
\ No newline at end of file

src/assets/svg/nav_fans.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1663228828485" class="icon" viewBox="0 0 1170 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3851" xmlns:xlink="http://www.w3.org/1999/xlink" width="228.515625" height="200"><path d="M914.284661 155.062773a260.388619 260.388619 0 0 0-182.856732-69.119899h-2.925996a258.559621 258.559621 0 0 1 36.570946 46.810932 235.885654 235.885654 0 0 1 11.336984 21.211968 193.828716 193.828716 0 0 1 153.599775 228.204666 195.656713 195.656713 0 0 1-193.096717 155.062773h-9.873986c7.679989 4.022994 15.359978 8.776987 23.405966 13.53198s22.673967 14.262979 33.279951 21.942968a274.650598 274.650598 0 0 1 23.770965 18.284973 262.582615 262.582615 0 0 0 54.49192-22.307967 255.999625 255.999625 0 0 0 52.296924-413.622394z" p-id="3852"></path><path d="M1170.284286 980.478564a33.645951 33.645951 0 0 1-36.571947 29.988956 34.37695 34.37695 0 0 1-30.353955-29.988956 365.713464 365.713464 0 0 0-252.70863-347.062492 497.736271 497.736271 0 0 0-46.079933-42.422938 197.119711 197.119711 0 0 0-24.501964-18.650972c-10.971984-8.045988-22.674967-16.091976-34.377949-23.039967a445.805347 445.805347 0 0 1 118.125827 19.382972 433.370365 433.370365 0 0 1 306.468551 411.793397z" p-id="3853"></path><path d="M779.335858 627.199081c-7.313989-5.850991-14.627979-11.702983-22.307967-17.188975a484.93629 484.93629 0 0 0-83.382878-48.273929 345.599494 345.599494 0 0 0-57.051916-21.576968 219.428679 219.428679 0 0 0 24.868963-15.725977 285.988581 285.988581 0 0 0 85.942874-378.147446 275.016597 275.016597 0 0 0-48.639928-61.80591 292.570571 292.570571 0 0 0-498.102271 201.873705 288.548577 288.548577 0 0 0 151.039779 255.999625A469.576312 469.576312 0 0 0 0 987.428554a36.570946 36.570946 0 0 0 73.142893 0 399.359415 399.359415 0 0 1 402.285411-396.43442A399.359415 399.359415 0 0 1 877.712714 987.428554a36.570946 36.570946 0 0 0 73.142893 0A466.650316 466.650316 0 0 0 779.335858 627.199081zM475.429304 505.05026A219.428679 219.428679 0 0 1 255.999625 288.549577a219.428679 219.428679 0 0 1 345.233494-176.639741 193.462717 193.462717 0 0 1 51.199925 49.370928 213.576687 213.576687 0 0 1 42.422938 127.268813A216.136683 216.136683 0 0 1 581.119149 478.353299a211.016691 211.016691 0 0 1-69.119899 23.039967 174.810744 174.810744 0 0 1-36.570946 3.656994z" p-id="3854"></path></svg>
\ No newline at end of file

src/assets/svg/nav_feedback.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1666753207589" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6926" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M512 816.64c-138.24 0-250.88-112.64-250.88-250.88s112.64-250.88 250.88-250.88 250.88 112.64 250.88 250.88-112.64 250.88-250.88 250.88z m0-448c-110.08 0-199.68 89.6-199.68 199.68S401.92 768 512 768s199.68-89.6 199.68-199.68c0-112.64-89.6-199.68-199.68-199.68z" p-id="6927"></path><path d="M583.68 652.8c-2.56 0-5.12 0-7.68 2.56-17.92 17.92-40.96 28.16-64 28.16-23.04 0-46.08-10.24-64-25.6-2.56-2.56-5.12-2.56-7.68-2.56s-5.12 0-7.68 2.56c-5.12 5.12-5.12 12.8 0 17.92 20.48 20.48 51.2 33.28 79.36 33.28 30.72 0 58.88-12.8 81.92-35.84 5.12-5.12 5.12-12.8 0-17.92-2.56 0-7.68-2.56-10.24-2.56z" p-id="6928"></path><path d="M847.36 517.12C819.2 355.84 678.4 232.96 512 232.96S204.8 355.84 176.64 517.12c-35.84 5.12-61.44 38.4-61.44 74.24 0 38.4 30.72 71.68 69.12 74.24h7.68c10.24 0 20.48-2.56 30.72-7.68-7.68-25.6-10.24-53.76-10.24-84.48 0-20.48 2.56-38.4 5.12-56.32 25.6-140.8 148.48-248.32 296.96-248.32s271.36 107.52 296.96 248.32c2.56 17.92 5.12 38.4 5.12 56.32 0 28.16-5.12 56.32-12.8 84.48 10.24 5.12 20.48 7.68 30.72 7.68h7.68c38.4-2.56 69.12-35.84 69.12-74.24-2.56-35.84-30.72-66.56-64-74.24z" p-id="6929"></path><path d="M512 1024C230.4 1024 0 793.6 0 512S230.4 0 512 0s512 230.4 512 512c0 15.36-10.24 25.6-25.6 25.6s-25.6-10.24-25.6-25.6c0-253.44-207.36-460.8-460.8-460.8S51.2 258.56 51.2 512s207.36 460.8 460.8 460.8c81.92 0 163.84-23.04 232.96-64 12.8-7.68 28.16-2.56 35.84 10.24 7.68 12.8 2.56 28.16-10.24 35.84C693.76 998.4 604.16 1024 512 1024z" p-id="6930"></path></svg>
\ No newline at end of file

src/assets/svg/nav_hide.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1750820360472" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="12414" id="mx_n_1750820360475" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32"><path d="M479.36 799.445333a33.706667 33.706667 0 1 1 0 67.370667H163.925333A78.592 78.592 0 0 1 85.333333 788.224V249.258667C85.333333 205.866667 120.533333 170.666667 163.925333 170.666667H792.746667c43.392 0 78.592 35.2 78.592 78.592v184.149333a33.706667 33.706667 0 0 1-67.370667 0V249.258667a11.221333 11.221333 0 0 0-11.221333-11.221334H163.925333a11.221333 11.221333 0 0 0-11.221333 11.221334v538.965333c0 6.186667 5.034667 11.221333 11.221333 11.221333h315.434667z m135.594667-178.133333a138.282667 138.282667 0 0 0 187.477333 187.477333l-187.477333-187.477333z m42.581333-47.658667l192.512 192.512a138.282667 138.282667 0 0 0-192.512-192.512z m79.018667 315.605334a202.112 202.112 0 1 1 0-404.224 202.112 202.112 0 0 1 0 404.224zM253.738667 350.336h291.925333a33.706667 33.706667 0 1 1 0 67.328H253.738667a33.706667 33.706667 0 1 1 0-67.328z m0 134.698667h157.226666a33.706667 33.706667 0 1 1 0 67.413333H253.738667a33.706667 33.706667 0 1 1 0-67.413333z m0 134.741333h157.226666a33.706667 33.706667 0 0 1 0 67.413333H253.738667a33.706667 33.706667 0 0 1 0-67.413333z" p-id="12415"></path></svg>
\ No newline at end of file

src/assets/svg/nav_message.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1663228853418" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4284" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M553.472 938.666667c-70.656 0-128.341333-57.514667-128.341333-128.341334h68.266666c0 33.109333 26.965333 60.074667 60.074667 60.074667s60.074667-26.965333 60.074667-60.074667h68.266666c-0.170667 70.826667-57.685333 128.341333-128.341333 128.341334zM553.472 160.256c-18.773333 0-34.133333-15.36-34.133333-34.133333V87.210667c0-18.773333 15.36-34.133333 34.133333-34.133334s34.133333 15.36 34.133333 34.133334V126.293333c0 18.773333-15.36 33.962667-34.133333 33.962667z" p-id="4285"></path><path d="M819.882667 783.36H287.061333c-62.293333 0-112.810667-50.688-112.810666-112.810667 0-55.466667 40.277333-101.717333 93.184-111.104v-160.768c0-157.696 128.341333-286.037333 286.037333-286.037333 157.696 0 286.037333 128.341333 286.037333 286.037333v160.768c52.906667 9.386667 93.184 55.637333 93.184 111.104 0 62.122667-50.688 112.810667-112.810666 112.810667z m-532.821334-157.354667c-24.576 0-44.544 19.968-44.544 44.544s19.968 44.544 44.544 44.544h532.821334c24.576 0 44.544-19.968 44.544-44.544s-19.968-44.544-44.544-44.544h-48.64V398.677333c0-120.149333-97.621333-217.770667-217.770667-217.770666s-217.770667 97.621333-217.770667 217.770666v227.328h-48.64z" p-id="4286"></path></svg>
\ No newline at end of file

src/assets/svg/nav_post.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1663228786101" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3062" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M708.9 393.2H329.1c-19.9 0-36.1 16.3-36.1 36.1 0 19.9 16.3 36.1 36.1 36.1h379.7c19.9 0 36.1-16.3 36.1-36.1 0.1-19.8-16.2-36.1-36-36.1zM323.1 627.1h379.7c19.9 0 36.1-16.3 36.1-36.1 0-19.9-16.3-36.1-36.1-36.1H323.1c-19.9 0-36.1 16.3-36.1 36.1s16.3 36.1 36.1 36.1zM702.9 716.4H323.1c-19.9 0-36.1 16.3-36.1 36.1 0 19.9 16.3 36.1 36.1 36.1h379.7c19.9 0 36.1-16.3 36.1-36.1 0.1-19.8-16.2-36.1-36-36.1z" p-id="3063"></path><path d="M789.7 64.2H426.8v0.5c-11.8-1.8-23.8 1.7-32.9 10L173.4 277.3c-9.6 8.8-13.8 21.4-11.9 33.7h-0.5v572.6c0 42 33.8 76.2 75.3 76.2h553.4c41.5 0 75.3-34.2 75.3-76.2V140.4c0-42-33.8-76.2-75.3-76.2zM194.8 307.3c-0.6-1.4-1.1-4 1.4-6.3L416.8 98.3c1.3-1.2 2.7-1.6 3.9-1.6 1 0 1.9 0.3 2.5 0.5 1.3 0.6 3.6 2 3.6 5.3V305c0 3.2-2.7 5.9-6 5.9H200.3c-3.5 0.1-4.9-2.2-5.5-3.6z m627 576.3c0 17.9-14.4 32.5-32.1 32.5H236.3c-17.7 0-32.1-14.6-32.1-32.5V362.3c0-10.4 8.4-18.8 18.8-18.8h197.8c21.7 0 39.4-17.2 39.4-38.4V126.7c0-10.4 8.4-18.8 18.8-18.8h310.7c17.7 0 32.1 14.6 32.1 32.5v743.2z" p-id="3064"></path></svg>
\ No newline at end of file

src/assets/svg/nav_praise.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1664440986020" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5556" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M939.358251 423.424662c-23.01825-37.252439-62.924121-60.779272-107.019409-63.209624-2.755764-0.38681-5.510504-0.579191-8.347109-0.579191l-152.202471-0.121773c6.649444-28.975938 10.015098-58.653865 10.015098-88.657202 0-28.223808-3.213181-57.139372-9.556657-85.952604-0.447185-2.043542-1.098008-4.006244-1.932002-5.866614-15.820314-57.302077-67.37755-96.841605-127.282918-96.841605-72.827679 0-132.081201 59.254545-132.081201 132.081201 0 3.334955 0.132006 6.66991 0.406253 10.015098-2.196015 57.211003-32.108279 109.947088-80.269162 141.363611-14.447037 9.42465-18.524912 28.773324-9.099239 43.220361 9.414417 14.437827 28.752858 18.535145 43.220361 9.099239 65.811892-42.925648 106.429984-115.325585 108.656699-193.684234 0.030699-1.332345-0.010233-2.663666-0.14224-3.996011-0.203638-2.012843-0.304945-4.016477-0.304945-6.019087 0-38.381146 31.233352-69.614497 69.614497-69.614497 32.57593 0 60.474326 22.204721 67.824735 53.997821 0.356111 1.534959 0.823761 3.019777 1.402953 4.453429 4.696975 22.814612 7.076162 45.579081 7.076162 67.743894 0 37.485753-6.222725 74.352405-18.494213 109.592001-3.324722 9.546424-1.819438 20.111037 4.02671 28.345582 5.856381 8.245801 15.332197 13.146415 25.448602 13.156648l193.226816 0.101307c1.423419 0.264013 2.857071 0.426719 4.300956 0.477884 24.116257 0.9967 45.935192 13.614066 58.603723 34.090423 7.838525 12.31242 11.438517 26.800389 10.431583 41.939181-0.080841 0.945535-0.121773 1.911536-0.11154 2.877537 0 0.854461 0.040932 1.697665 0.11154 2.53166 0.010233 0.335644-0.030699 0.661056-0.11154 0.976234-0.101307 0.376577-0.193405 0.772596-0.284479 1.159406l-74.972529 330.391802c-0.914836 1.281179-1.738597 2.6432-2.449795 4.046153-5.937223 11.762905-14.660908 21.48329-25.346271 28.172643-10.746762 6.812149-23.059182 10.614755-35.757388 11.06194-0.854461-0.061398-513.766226-0.224104-513.766226-0.224104-0.467651-0.020466-0.935302-0.030699-1.402953-0.030699 0 0-111.01542 0.172939-112.718201 0.457418-1.932002 0-3.446495-1.50426-3.446495-3.415796l0.299829-416.334173c0-1.901303 1.545192-3.446495 3.01466-3.456728l1.245364 0.121773c1.174756 0.132006 2.653433 0.284479 3.52836 0.193405l83.82822-0.222057 0 339.367221c0 17.253966 13.979386 31.233352 31.233352 31.233352s31.233352-13.979386 31.233352-31.233352L281.009092 435.350273c0-1.778506 0-8.631588 0-10.411117 0-17.253966-13.979386-30.928407-31.233352-30.928407-1.50426 0-117.547183 0.304945-119.402437 0.304945-36.34272 0-65.913199 29.566386-65.913199 65.893756l-0.299829 416.334173c0 36.337603 29.571503 65.902966 65.913199 65.902966 2.541893 0 111.406323-0.457418 111.406323-0.457418 0.457418 0.020466 0.925069 0.030699 1.382487 0.030699 0 0 511.458671 0.274246 512.505513 0.274246 25.469068 0 50.296523-7.197936 71.647807-20.73116 19.612687-12.281721 35.777855-29.881564 46.839795-50.967812 3.660366-5.622044 6.435573-11.875468 8.256034-18.615986 0.11154-0.416486 0.213871-0.823761 0.304945-1.240247l74.881454-330.340637c1.596358-6.212492 2.257413-12.586666 2.00261-18.992563C960.892707 473.366098 953.948551 446.331371 939.358251 423.424662z" p-id="5557"></path><path d="M450.027553 518.650467c-17.253966 0-31.233352 13.979386-31.233352 31.233352l0 30.470989c0 17.253966 13.979386 31.233352 31.233352 31.233352 17.253966 0 31.233352-13.979386 31.233352-31.233352l0-30.470989C481.260905 532.629853 467.281519 518.650467 450.027553 518.650467z" p-id="5558"></path><path d="M693.805696 518.650467c-17.253966 0-31.233352 13.979386-31.233352 31.233352l0 30.470989c0 17.253966 13.979386 31.233352 31.233352 31.233352 17.253966 0 31.233352-13.979386 31.233352-31.233352l0-30.470989C725.039048 532.629853 711.058638 518.650467 693.805696 518.650467z" p-id="5559"></path><path d="M648.940882 660.09492c-14.304797-9.393951-33.592073-5.398964-43.159986 8.763594-0.132006 0.193405-13.614066 19.754926-34.171264 19.754926-19.98824 0-32.423457-18.09717-33.266661-19.368116-9.17087-14.427594-28.254507-18.809391-42.834574-9.770528-14.650675 9.109472-19.155269 28.366048-10.055007 43.016723 11.214413 18.047028 41.96988 48.588625 86.156242 48.588625 43.962258 0 75.104535-30.318516 86.572728-48.222281C667.404396 688.461991 663.216004 669.500127 648.940882 660.09492z" p-id="5560"></path></svg>
\ No newline at end of file

src/assets/svg/nav_report.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1663229552653" class="icon" viewBox="0 0 1127 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11864" xmlns:xlink="http://www.w3.org/1999/xlink" width="220.1171875" height="200"><path d="M1108.468296 824.890547C1159.055032 910.219597 1097.227863 1024 990.429373 1024L130.432879 1024C29.258031 1024-32.574625 910.219597 18.012112 824.890547L450.825613 68.266574C473.306472 22.754136 518.276424 0 563.240888 0 608.209469 0 653.173934 22.754136 675.660283 68.266574L1108.468296 824.890547 1108.468296 824.890547 1108.468296 824.890547 1108.468296 824.890547ZM1020.384123 877.110641 1019.583053 875.735153 586.77504 119.111177 583.854223 113.62523C580.333998 106.500274 573.244216 102.4 563.240888 102.4 553.240806 102.4 546.151071 106.500212 542.636068 113.61633L539.710577 119.111663 106.096287 877.110641C95.301134 895.319767 109.937021 921.6 130.432879 921.6L990.429373 921.6C1016.30634 921.6 1031.298263 895.520476 1020.384123 877.110641L1020.384123 877.110641 1020.384123 877.110641 1020.384123 877.110641ZM558.08319 307.2C532.482248 307.2 512 322.819385 512 342.344809L512 579.251379C512 598.776801 532.482248 614.4 558.08319 614.4L568.321812 614.4C593.922749 614.4 614.4 598.776801 614.4 579.251379L614.4 342.344809C614.4 322.819385 593.922749 307.2 568.321812 307.2L558.08319 307.2 558.08319 307.2 558.08319 307.2 558.08319 307.2ZM512 766.885176C512 780.001705 517.522432 793.032632 526.999818 802.305669 536.477199 811.577487 549.797038 816.975247 563.200625 816.975247 576.602962 816.975247 589.927798 811.577487 599.405184 802.305669 608.882565 793.032632 614.4 780.001705 614.4 766.885176 614.4 753.772319 608.882565 740.741391 599.405184 731.469573 589.927798 722.19776 576.602962 716.8 563.200625 716.8 549.797038 716.8 536.477199 722.19776 526.999818 731.469573 517.522432 740.741391 512 753.772319 512 766.885176L512 766.885176 512 766.885176 512 766.885176Z" p-id="11865"></path></svg>
\ No newline at end of file

src/assets/svg/nav_stick.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1663229503356" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="10315" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M450 230c37.16-33.787 94.508-31.666 129 5l319 344c8.957 9.352 14 22.087 14 35 0 29.03-23.404 52.012-52 52H733a8 8 0 0 0-8 8v150c0 70.692-57.308 128-128 128H427c-70.692 0-128-57.308-128-128V674a8 8 0 0 0-8-8H164c-13.106 0.012-25.431-4.704-35-13v-1c-21.566-19.037-22.505-51.627-3-73l318-343c1.757-1.842 3.36-3.467 5-5z m78.351 57.65c-9.674-9.061-24.861-8.565-33.923 1.109L213.618 588.53A8 8 0 0 0 219.455 602H311c28.418 0 51.483 22.81 52 51v171c0 35.346 28.654 64 64 64h170c35.346 0 64-28.654 64-64V654c0.01-28.709 23.253-51.982 52-52h89.625a8 8 0 0 0 5.856-13.45l-278.97-299.735a24 24 0 0 0-1.16-1.164zM838 81c17.673 0 32 14.327 32 32 0 17.673-14.327 32-32 32H182c-17.673 0-32-14.327-32-32 0-17.673 14.327-32 32-32h656z" p-id="10316"></path></svg>

src/assets/svg/nav_vote.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1669105719941" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3704" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M942.592 1011.2H86.528c-37.888 0-68.608-30.72-68.608-68.608v-297.984c0-37.888 30.72-68.608 68.608-68.608H317.44v51.2H86.528c-9.216 0-17.408 8.192-17.408 17.408v297.984c0 9.216 8.192 17.408 17.408 17.408h856.064c9.216 0 17.408-8.192 17.408-17.408v-297.984c0-9.216-8.192-17.408-17.408-17.408H645.12v-51.2h297.472c37.888 0 68.608 30.72 68.608 68.608v297.984c0 37.888-30.72 68.608-68.608 68.608z" p-id="3705"></path><path d="M480.256 788.48c-7.68 0-15.872-3.072-21.504-8.704L155.648 476.16c-11.776-11.776-11.776-31.232 0-43.52L547.328 40.96c5.632-5.632 13.312-9.216 21.504-9.216s15.872 3.072 21.504 9.216l303.104 303.104c11.776 11.776 11.776 31.232 0 43.52L501.76 779.264c-5.632 6.144-13.824 9.216-21.504 9.216zM206.336 454.656l273.92 273.92 362.496-362.496L568.832 92.16 206.336 454.656z" p-id="3706"></path><path d="M494.08 536.576c-13.312 0-26.624-5.12-36.864-14.848l-0.512-0.512L373.76 437.248c-9.728-10.24-9.728-26.112 0-36.352 10.24-9.728 26.112-9.728 36.352 0l82.944 83.456c1.024 0.512 1.536 0.512 2.048 0.512l122.88-122.88c10.24-10.24 26.112-10.24 36.352 0s10.24 26.112 0 36.352l-122.88 122.88c-10.24 10.24-23.552 15.36-37.376 15.36z" p-id="3707"></path><path d="M770.56 801.28h-512c-14.336 0-25.6-11.264-25.6-25.6s11.264-25.6 25.6-25.6h512c14.336 0 25.6 11.264 25.6 25.6s-11.264 25.6-25.6 25.6z" p-id="3708"></path></svg>
\ No newline at end of file

src/assets/svg/nogood.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1738921348209" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4284" xmlns:xlink="http://www.w3.org/1999/xlink" width="24" height="24"><path d="M522.837333 960a114.090667 114.090667 0 0 1-52.949333-13.397333 55.765333 55.765333 0 0 1-32.810667-53.802667c0.384-13.653333 0.64-27.306667 0.896-40.576 0.426667-21.333333 0.853333-43.776 1.792-65.664a57.216 57.216 0 0 0-7.808-32.597333c-9.173333-15.744-17.493333-30.293333-25.6-44.373334a2923.818667 2923.818667 0 0 0-50.048-85.333333 246.997333 246.997333 0 0 0-24.405333-28.032l-0.256-0.256-3.626667-3.84a81.066667 81.066667 0 0 1-31.018666-59.093333c0-41.642667-0.256-256.512-0.682667-396.8A71.936 71.936 0 0 1 368.298667 64h390.186666a213.333333 213.333333 0 0 1 66.005334 8.533333 101.504 101.504 0 0 1 73.088 91.989334 115.2 115.2 0 0 1-5.589334 50.304 11.093333 11.093333 0 0 0 2.304 8.533333 112.170667 112.170667 0 0 1 25.216 76.117333 123.733333 123.733333 0 0 1-6.442666 29.056 11.776 11.776 0 0 0 1.92 12.8 104.490667 104.490667 0 0 1 25.088 69.205334 114.005333 114.005333 0 0 1-4.266667 23.893333c-1.066667 4.266667-2.133333 8.533333-2.944 12.8a12.202667 12.202667 0 0 0 0.597333 9.002667 109.866667 109.866667 0 0 1 25.6 53.717333 5.589333 5.589333 0 0 0 0.938667 2.048V541.354667a338.261333 338.261333 0 0 0-2.645333 8.533333 73.642667 73.642667 0 0 1-46.933334 55.68 130.773333 130.773333 0 0 1-40.746666 6.613333h-1.024c-27.904 0.213333-58.154667 0.341333-95.104 0.341334h-130.816c-5.077333 0-7.381333 0-8.533334 1.450666s-0.768 3.968 0 8.533334c1.621333 9.429333 3.114667 18.858667 4.650667 28.288 2.858667 17.834667 5.802667 36.181333 9.344 54.101333a208.341333 208.341333 0 0 1-4.266667 109.696c-8.533333 24.32-17.749333 48.768-26.794666 72.533333l-9.045334 23.765334a64 64 0 0 1-36.48 38.912 126.08 126.08 0 0 1-48.768 10.197333z m-338.816-384H136.021333A72.064 72.064 0 0 1 64 503.978667V136.021333A72.064 72.064 0 0 1 136.021333 64h48A72.064 72.064 0 0 1 256 136.021333v368A72.064 72.064 0 0 1 184.021333 576z"  p-id="4285"></path></svg>
\ No newline at end of file

src/assets/svg/question_address.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1668417566727" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="13181" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M821.653333 633.813333L576.533333 917.333333a85.333333 85.333333 0 0 1-129.066666 0.064L198.634667 629.952c-1.152-1.322667-2.133333-2.773333-2.88-4.266667A361.088 361.088 0 0 1 149.333333 448c0-200.298667 162.368-362.666667 362.666667-362.666667s362.666667 162.368 362.666667 362.666667c0 63.744-16.490667 125.162667-47.381334 179.370667a21.269333 21.269333 0 0 1-5.632 6.421333zM792.32 602.453333A318.442667 318.442667 0 0 0 832 448c0-176.725333-143.274667-320-320-320-176.725333 0-320 143.274667-320 320 0 55.317333 14.037333 108.522667 40.384 155.733333l247.317333 285.738667a42.666667 42.666667 0 0 0 64.554667-0.021333L792.32 602.453333zM512 597.333333a149.333333 149.333333 0 1 1 0-298.666666 149.333333 149.333333 0 0 1 0 298.666666z m0-42.666666a106.666667 106.666667 0 1 0 0-213.333334 106.666667 106.666667 0 0 0 0 213.333334z" p-id="13182"></path></svg>
\ No newline at end of file

src/assets/svg/question_calendar.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1668417598936" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="14138" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M639.488 863.232H198.144c-8.704 0-15.36-6.656-15.36-15.36V362.496c0-111.104 90.624-201.728 201.728-201.728h441.344c8.704 0 15.36 6.656 15.36 15.36v485.888c-0.512 111.104-91.136 201.216-201.728 201.216z m-425.984-30.72h425.472c93.696 0 170.496-76.288 171.008-170.496V191.488H384.512c-94.208 0-171.008 76.288-171.008 171.008v470.016z" p-id="14139"></path><path d="M414.72 260.608c-8.704 0-15.36-6.656-15.36-15.36V118.784c0-8.704 6.656-15.36 15.36-15.36s15.36 6.656 15.36 15.36v126.464c0 8.192-6.656 15.36-15.36 15.36zM609.28 260.608c-8.704 0-15.36-6.656-15.36-15.36V118.784c0-8.704 6.656-15.36 15.36-15.36s15.36 6.656 15.36 15.36v126.464c0 8.192-6.656 15.36-15.36 15.36zM821.76 397.312h-619.52c-8.704 0-15.36-6.656-15.36-15.36s6.656-15.36 15.36-15.36h619.52c8.704 0 15.36 6.656 15.36 15.36s-6.656 15.36-15.36 15.36z" p-id="14140"></path><path d="M441.344 689.152v-135.68c-12.8 12.288-30.72 23.552-53.248 33.28v-23.04c29.184-13.824 49.152-30.208 59.392-50.176h19.456v175.616h-25.6zM568.832 513.024c40.96 0.512 61.44 30.72 61.952 90.112 0 59.904-20.48 89.6-61.952 89.088-41.472-0.512-62.464-30.208-62.976-89.088 1.536-58.88 22.016-88.576 62.976-90.112z m0 160.256c23.04 0.512 34.816-22.528 34.816-69.632 0.512-48.128-11.264-71.68-34.816-70.656-23.04-0.512-34.816 23.04-34.816 70.656 0 47.104 11.776 70.144 34.816 69.632z" p-id="14141"></path></svg>
\ No newline at end of file

src/assets/svg/question_checkbox.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1668417369535" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3705" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M727.984 393.184a31.968 31.968 0 0 0-45.248 0.256L449.44 629.248l-103.28-106.112a32 32 0 1 0-45.888 44.608l126.032 129.504c0.048 0.096 0.192 0.096 0.256 0.192 0.064 0.064 0.096 0.192 0.16 0.256 2.016 1.984 4.512 3.2 6.88 4.544 1.248 0.672 2.24 1.792 3.52 2.304a31.728 31.728 0 0 0 24.064 0.064c1.232-0.512 2.208-1.536 3.392-2.176 2.4-1.344 4.896-2.528 6.944-4.544 0.064-0.064 0.096-0.192 0.192-0.256 0.064-0.096 0.16-0.128 0.256-0.192l256.224-259.008a32 32 0 0 0-0.224-45.248zM832.992 928h-640c-52.928 0-96-43.072-96-96V192c0-52.928 43.072-96 96-96h640c52.928 0 96 43.072 96 96v640c0 52.928-43.056 96-96 96z m-640-768c-17.632 0-32 14.368-32 32v640c0 17.664 14.368 32 32 32h640a32 32 0 0 0 32-32V192c0-17.632-14.336-32-32-32h-640z" fill="#000000" p-id="3706"></path></svg>
\ No newline at end of file

src/assets/svg/question_img_checkbox.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1668417443198" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5608" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M778.24 947.2H143.36c-53.248 0-96.256-43.008-96.256-96.256V275.456c0-53.248 43.008-96.256 96.256-96.256h634.88c53.248 0 96.256 43.008 96.256 96.256v575.488c0 53.248-43.008 96.256-96.256 96.256z m-634.88-706.56c-19.456 0-34.816 15.36-34.816 34.816v575.488c0 19.456 15.36 34.816 34.816 34.816h634.88c19.456 0 34.816-15.36 34.816-34.816V275.456c0-19.456-15.36-34.816-34.816-34.816H143.36z" p-id="5609"></path><path d="M946.176 844.8c-17.408 0-30.72-13.312-30.72-30.72V244.736c0-58.368-48.128-106.496-106.496-106.496H180.224c-17.408 0-30.72-13.312-30.72-30.72s13.312-30.72 30.72-30.72H808.96c93.184 0 167.936 75.776 167.936 167.936v569.344c0 17.408-13.312 30.72-30.72 30.72z" p-id="5610"></path><path d="M77.824 834.56c-11.264 0-21.504-6.144-26.624-16.384-8.192-15.36-2.048-33.792 12.288-41.984l512-276.48c12.288-7.168 27.648-4.096 36.864 6.144L739.328 645.12c11.264 12.288 10.24 31.744-2.048 43.008s-31.744 10.24-43.008-2.048L583.68 565.248 92.16 830.464c-4.096 3.072-9.216 4.096-14.336 4.096zM287.744 547.84c-53.248 0-97.28-44.032-97.28-97.28s44.032-97.28 97.28-97.28 97.28 44.032 97.28 97.28-44.032 97.28-97.28 97.28z m0-133.12c-19.456 0-35.84 16.384-35.84 35.84s16.384 35.84 35.84 35.84 35.84-16.384 35.84-35.84-16.384-35.84-35.84-35.84z" p-id="5611"></path></svg>
\ No newline at end of file

src/assets/svg/question_img_radio.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1668417408205" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4667" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M853.161077 892.549156 362.595248 892.549156l-209.432916-0.413416c-0.605797-0.001023-1.210571-0.031722-1.813299-0.092098-24.848944-2.484587-47.825238-14.060227-64.696488-32.594349-16.990976-18.665105-26.349111-42.85504-26.349111-68.112284L60.303434 264.62596c0-55.80805 45.403073-101.211123 101.211123-101.211123l691.645496 0c55.80805 0 101.2101 45.403073 101.2101 101.211123l0 225.51315c0 0.275269-0.00614 0.551562-0.01842 0.825808-0.021489 0.494257-1.971911 51.723012 15.481599 85.46244 4.716418 9.118682 1.14815 20.335141-7.970532 25.052582-9.116635 4.714372-20.335141 1.149173-25.052582-7.970532-21.300119-41.176818-19.844977-97.642854-19.618826-103.738689L917.191392 264.62596c0-35.307134-28.724205-64.031339-64.031339-64.031339L161.51558 200.594621c-35.307134 0-64.031339 28.724205-64.031339 64.031339l0 526.71105c0 32.755008 24.320918 59.957557 56.717769 63.61997l208.4311 0.412392 490.528989 0c35.307134 0 64.031339-28.725228 64.031339-64.032362l-0.382717-93.676519c-0.104377-1.749854-1.587148-19.548218-19.549242-42.499953-0.050142-0.063445-0.098237-0.125867-0.147356-0.190335L875.401614 626.481358 758.174726 471.362464c-0.415462-0.550539-38.995129-50.852178-86.271876-45.534056-38.335097 4.314259-75.954903 45.163619-108.789729 118.131491-17.615193 39.141462-34.650171 68.26885-52.082192 89.046059-17.607006 20.985964-35.679617 33.519418-55.251372 38.316677-43.422975 10.638291-81.049944-18.99461-120.886231-50.372248l-5.057179-3.980661c-46.555315-36.57808-68.750827-28.223808-158.330028 59.60247-7.330966 7.187703-19.101033 7.071046-26.288736-0.25992-7.187703-7.330966-7.071046-19.101033 0.25992-26.287713 46.658669-45.74588 77.544097-72.726372 107.085924-84.282568 33.357735-13.048177 64.274886-6.266727 100.242052 21.99392l5.092995 4.00829c33.9226 26.719548 63.219857 49.795103 89.028663 43.466977 25.618471-6.279007 53.30095-42.114167 82.279958-106.508779 39.139415-86.97591 85.837994-134.027529 138.79716-139.849118 68.454068-7.515161 117.823476 57.404408 119.891578 60.171428l117.122511 154.980747 21.599947 28.343535c26.276457 33.630958 27.333532 61.638849 27.367301 64.72514 0.001023 0.042979 0.001023 0.084934 0.001023 0.127913l0.38374 94.059236C954.371176 847.146083 908.969127 892.549156 853.161077 892.549156z" p-id="4668"></path><path d="M312.328401 446.967868c-42.324968 0-76.759221-34.434254-76.759221-76.759221s34.434254-76.759221 76.759221-76.759221 76.759221 34.434254 76.759221 76.759221S354.654392 446.967868 312.328401 446.967868zM312.328401 330.628186c-21.824051 0-39.579437 17.755386-39.579437 39.579437s17.755386 39.579437 39.579437 39.579437 39.579437-17.755386 39.579437-39.579437S334.153476 330.628186 312.328401 330.628186z" p-id="4669"></path></svg>
\ No newline at end of file

src/assets/svg/question_open.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1668417487685" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8511" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M785.088 128H238.912C177.728 128 128 184.448 128 253.76v516.48C128 839.552 177.728 896 238.912 896h546.176c61.184 0 110.912-56.448 110.912-125.76v-516.48C896 184.448 846.272 128 785.088 128zM832 770.048c0 34.176-23.936 61.952-53.376 61.952H245.376c-29.44 0-53.376-27.776-53.376-61.952V253.952C192 219.776 215.936 192 245.376 192h533.248c29.44 0 53.376 27.776 53.376 61.952v516.096z" fill="#888888" p-id="8512"></path><path d="M671.104 320H349.312C333.12 320 320 335.36 320 351.616c0 16.192 13.12 31.616 29.312 31.616h131.776l-0.32 291.072a29.312 29.312 0 0 0 58.688 0l0.256-291.072h131.392c16.192 0 29.312-15.424 29.312-31.616S687.296 320 671.104 320z" fill="#888888" p-id="8513"></path></svg>
\ No newline at end of file

src/assets/svg/question_radio.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1668417023337" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2004" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M512 0a512 512 0 1 0 512 512 512 512 0 0 0-512-512z m0 972.8A460.8 460.8 0 1 1 972.8 512 460.8 460.8 0 0 1 512 972.8z" p-id="2005"></path><path d="M230.4 512A281.6 281.6 0 1 0 512 230.4 281.6 281.6 0 0 0 230.326857 512z" p-id="2006"></path></svg>
\ No newline at end of file

src/assets/svg/question_score.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1668417547985" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="12223" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M896 224H128c-35.2 0-64 28.8-64 64v448c0 35.2 28.8 64 64 64h768c35.2 0 64-28.8 64-64V288c0-35.2-28.8-64-64-64z m0 480c0 19.2-12.8 32-32 32H160c-19.2 0-32-12.8-32-32V320c0-19.2 12.8-32 32-32h704c19.2 0 32 12.8 32 32v384z" fill="#333333" p-id="12224"></path><path d="M291.2 412.8c-12.8 6.4-22.4 12.8-35.2 16v41.6c22.4-6.4 41.6-16 54.4-28.8V640h38.4V393.6H320c-6.4 3.2-19.2 12.8-28.8 19.2zM489.6 560c22.4-16 41.6-28.8 48-38.4 16-16 22.4-38.4 22.4-57.6 0-22.4-6.4-38.4-22.4-54.4-16-12.8-35.2-19.2-57.6-19.2-25.6 0-48 9.6-60.8 25.6-16 16-22.4 38.4-22.4 67.2h38.4c0-19.2 3.2-35.2 12.8-44.8 6.4-9.6 19.2-16 32-16s25.6 3.2 32 9.6c6.4 6.4 9.6 16 9.6 28.8s-6.4 25.6-16 38.4c-6.4 6.4-16 16-32 28.8-28.8 19.2-44.8 35.2-54.4 44.8-16 19.2-22.4 41.6-22.4 64h166.4v-35.2H444.8c6.4-12.8 22.4-25.6 44.8-41.6z m233.6-54.4c25.6-9.6 38.4-25.6 38.4-54.4 0-22.4-6.4-38.4-22.4-51.2-16-12.8-35.2-19.2-57.6-19.2S640 387.2 624 400c-16 12.8-25.6 32-25.6 57.6h38.4c0-16 6.4-25.6 12.8-32 6.4-6.4 19.2-9.6 32-9.6s25.6 3.2 32 9.6c6.4 6.4 9.6 16 9.6 28.8s-3.2 22.4-9.6 28.8c-6.4 6.4-19.2 9.6-32 9.6h-16v28.8h16c16 0 25.6 3.2 35.2 9.6 9.6 6.4 12.8 16 12.8 32 0 12.8-3.2 22.4-12.8 28.8-9.6 9.6-19.2 12.8-35.2 12.8-12.8 0-25.6-3.2-32-12.8-9.6-9.6-12.8-22.4-16-38.4h-38.4c3.2 28.8 12.8 48 28.8 64 16 12.8 35.2 19.2 60.8 19.2 25.6 0 48-6.4 64-22.4 16-16 22.4-32 22.4-54.4 0-16-3.2-25.6-12.8-35.2-9.6-6.4-22.4-16-35.2-19.2z" fill="#333333" p-id="12225"></path></svg>
\ No newline at end of file

src/assets/svg/report.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1662518502493" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8360" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M960.288 787.488c-98.88-154.08-287.36-469.568-385.76-622.912-21.44-27.968-71.872-44-102.88 0L61.504 803.872c-23.36 33.888-23.008 79.872 49.376 82.432h824.64c48.416-2.784 48.416-62.496 24.768-98.816z m-437.44-27.776a47.296 47.296 0 1 1 0-94.592 47.296 47.296 0 0 1 0 94.592z m35.456-165.536c0.448 11.52-10.944 23.68-23.648 23.68h-23.648c-12.672 0-23.2-12.16-23.616-23.68l-23.68-224.64c0-19.552 15.904-35.456 35.488-35.456h47.296c19.584 0 35.456 15.904 35.456 35.488l-23.648 224.64z" p-id="8361"></path></svg>
\ No newline at end of file

src/assets/svg/share.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1668656239139" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4264" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M640 682.666667v213.333333l384-429.312L640 42.666667v213.333333C39.722667 329.002667-185.514667 900.565333 187.477333 980.522667 25.173333 855.253333 326.186667 663.04 640 682.666667z" p-id="4265"></path></svg>
\ No newline at end of file

src/assets/svg/tabbar_chat.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1663831448520" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="15360" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M715.648 410.1696C715.648 376.4416 688.288 349.0816 654.56 349.0816 620.832 349.0816 593.472 376.4416 593.472 410.1696 593.472 443.8976 620.832 471.2576 654.56 471.2576 688.288 471.2576 715.648 443.8976 715.648 410.1696M693.984 593.4336 330.048 593.4336C315.136 593.4336 304.64 607.5776 309.632 620.8896 339.2 699.8336 418.624 756.3456 512 756.3456 605.408 756.3456 684.832 699.8336 714.4 620.8896 719.392 607.5776 708.896 593.4336 693.984 593.4336M308.384 410.1696C308.384 443.8976 335.744 471.2576 369.472 471.2576 403.2 471.2576 430.56 443.8976 430.56 410.1696 430.56 376.4416 403.2 349.0816 369.472 349.0816 335.744 349.0816 308.384 376.4416 308.384 410.1696M960 511.9936C960 759.4176 759.424 959.9936 512 959.9936 428.64 959.9936 350.848 936.8256 284.032 897.1456L99.232 949.9136C83.872 954.2976 69.664 940.1216 74.08 924.7616L126.848 739.9936C87.2 673.1456 64 595.3536 64 511.9936 64 264.5696 264.608 63.9936 512 63.9936 759.424 63.9936 960 264.5696 960 511.9936" p-id="15361"></path></svg>
\ No newline at end of file

src/assets/svg/tabbar_home.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1663811407330" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6931" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M683.2023 875.392581H226.184997v-0.136525h115.431853v-157.003703c0-1.0922 0.341312-2.047874 0.341313-3.071812A170.178362 170.178362 0 0 1 512.409575 548.89314a170.178362 170.178362 0 0 1 170.519675 166.287401c0 1.023937 0.27305 2.047874 0.27305 3.071812v157.140228z m321.448017-565.008546L896.727337 240.346731V104.709183c0-23.345768-19.113494-42.322738-42.732313-42.322737a42.459262 42.459262 0 0 0-42.66405 42.322737V185.054122L535.823605 6.206425A42.11795 42.11795 0 0 0 511.658688 0.062801a41.913163 41.913163 0 0 0-23.482293 6.143624L19.349683 310.452298a42.049688 42.049688 0 0 0-12.287247 58.569207 43.005362 43.005362 0 0 0 59.047045 12.218984l19.318282-12.560296v519.272685c0 39.728763 36.247377 72.085179 80.822776 72.085178h692.318071c44.575399 0 80.822776-32.356415 80.822777-72.085178V369.15803l18.499132 12.014197a43.005362 43.005362 0 0 0 59.115307-12.287247 41.981425 41.981425 0 0 0-12.355509-58.500945z" p-id="6932"></path></svg>

src/assets/svg/tabbar_mine.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1663811801887" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="10311" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M521.798086 543.293888c149.770748 0 271.746924-121.976177 271.746925-271.746925S671.568834 0 521.798086 0 250.051162 121.976177 250.051162 271.746924s121.976177 271.546963 271.746924 271.546964zM942.115993 775.248584c-19.396212-41.591877-46.990822-79.184534-81.983988-111.778168-70.386253-65.387229-164.567858-102.979887-258.14958-102.979887h-160.168717c-93.781683 0-187.763327 37.592658-258.14958 102.979887-34.993165 32.593634-62.587776 70.186292-81.983987 111.778168-20.396016 43.791447-30.793986 89.782464-30.793986 137.173209 0 61.587971 49.990236 111.578207 111.578207 111.578207h678.867409c61.587971 0 111.578207-49.990236 111.578208-111.578207-0.199961-47.390744-10.397969-93.581722-30.793986-137.173209z" fill="" p-id="10312"></path></svg>
\ No newline at end of file

src/assets/svg/tabbar_write.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1663817726496" class="icon" viewBox="0 0 1037 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="13271" xmlns:xlink="http://www.w3.org/1999/xlink" width="202.5390625" height="200"><path d="M604.502 574.026l-262.01 261.862-198.912 35.137a15.608 15.608 0 0 1-17.827-17.975l35.137-198.912 457.89-458.111 181.897 181.898-39.87 39.871m184.235-366.17a128.638 128.638 0 0 1 0 181.92l-90.912 90.912L672.26 142.589l90.964-90.964a128.638 128.638 0 0 1 181.824 0z" p-id="13272"></path><path d="M818.948 294.558l33.658 33.584 90.912-90.912a128.12 128.12 0 0 0 36.986-104.228z m-559.6 559.601l81.665-14.424 262.01-262.01 156.23-156.23 39.945-39.871-33.658-33.658L259.347 854.16z" p-id="13273"></path><path d="M705.77 174.131l-33.583-33.583L763.1 49.562a128.416 128.416 0 0 1 104.227-36.987z m-559.6 559.601l14.424-81.665 262.01-262.01 156.23-156.23 39.945-39.945 33.584 33.657-506.194 506.193z" p-id="13274"></path><path d="M705.327 473.275l-40.685 40.685" p-id="13275"></path><path d="M664.642 528.755a14.794 14.794 0 0 1-10.43-25.299l40.685-40.685a14.794 14.794 0 0 1 20.86 20.935l-40.685 40.684a14.794 14.794 0 0 1-10.43 4.365z" p-id="13276"></path><path d="M140.03 887.077a30.18 30.18 0 0 1-21.452-8.95 30.477 30.477 0 0 1-8.507-26.779l35.95-203.498 3.33-3.328 468.614-468.616L821.094 378.74l-50.671 50.3a14.794 14.794 0 1 1-20.935-20.86l29.59-29.588-161.113-160.816L173.54 662.2l-34.323 194.252a0.814 0.814 0 0 0 0 0.74 0.666 0.666 0 0 0 0.74 0l194.325-34.25L593.185 564.04a14.794 14.794 0 0 1 20.786 21.304L348.854 850.683l-203.498 35.876a25.964 25.964 0 0 1-5.326 0.518z m713.242-540.886L650.439 143.432 751.856 42.016A143.432 143.432 0 0 1 954.688 244.85zM692.308 143.432l160.964 160.964 80.482-80.482A113.844 113.844 0 1 0 772.79 62.951z" p-id="13277"></path><path d="M102.896 1009.206H47.49a32.696 32.696 0 0 1-32.696-32.77v-6.806a32.696 32.696 0 0 1 32.696-32.696h942.483a32.622 32.622 0 0 1 32.622 32.696v6.806a32.622 32.622 0 0 1-32.622 32.696H206.457" p-id="13278"></path><path d="M989.973 1024H206.457a14.794 14.794 0 1 1 0-29.589h783.516a17.901 17.901 0 0 0 17.827-17.901v-6.806a17.901 17.901 0 0 0-17.827-17.901H47.49a17.901 17.901 0 0 0-17.901 17.901v6.732a17.901 17.901 0 0 0 17.901 17.901h55.406a14.794 14.794 0 0 1 0 29.589H47.49A47.564 47.564 0 0 1 0 976.436v-6.806a47.564 47.564 0 0 1 47.49-47.49h942.483a47.564 47.564 0 0 1 47.416 47.49v6.806A47.564 47.564 0 0 1 989.973 1024z" p-id="13279"></path></svg>
\ No newline at end of file

src/assets/svg/top.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1609145432521" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1951" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M989.9222626666667 444.3410103333334L580.1490096666668 34.909091333333336H119.41107066666666l870.511192 870.596525V444.3410103333334z" fill="#2aa515" p-id="1952"></path><path d="M621.3675956666667 219.39846433333332l-43.832889-43.770828-126.663111 126.841535-32.826182-32.780929 126.663112-126.841535-43.734627-43.673859 26.739071-26.775273 120.396283 120.224324-26.741657 26.776565zM582.6055756666667 284.67587833333334c24.030384-24.065293 50.614303-36.636444 79.751758-37.71604 29.134869-1.07701 55.240404 9.903838 78.31402 32.945131 21.950061 21.91903 32.323232 46.86998 31.120808 74.851556s-13.257697 53.441939-36.167111 76.383677c-23.901091 23.934707-50.254869 36.406303-79.057455 37.41608-28.806465 1.012364-54.481455-9.739636-77.024969-32.252121-22.016-21.98497-32.689131-47.067798-32.014223-75.244606 0.672323-28.179394 12.365576-53.638465 35.077172-76.383677z m36.196849 32.57794c-14.921697 14.943677-23.517091 30.756202-25.783596 47.438869-2.269091 16.68396 2.880646 31.297939 15.441454 43.841939 12.825859 12.807758 27.34804 18.234182 43.566546 16.271515 16.217212-1.960081 31.985778-10.608485 47.303111-25.947798 15.976727-15.998707 25.133253-32.109899 27.46699-48.332283 2.333737-16.221091-2.813414-30.637253-15.441455-43.247192-12.827152-12.809051-27.67903-18.133333-44.558222-15.972848-16.879192 2.157899-32.877899 10.808889-47.994828 25.947798zM780.1276766666667 524.3048083333333l-53.476848 53.553131-32.726627-32.681374 153.400889-153.616808 52.858829 52.783839c38.213818 38.159515 41.146182 73.44097 8.79709 105.83402-15.71297 15.737535-34.076444 22.586182-55.086545 20.552404-21.012687-2.032485-39.97996-11.897535-56.905697-29.591273l-16.861091-16.833939z m74.572283-74.67701l-49.516606 49.586424 14.182141 14.161454c19.240081 19.211636 37.209212 20.455434 53.913859 3.728809 16.305131-16.329697 14.941091-34.002747-4.101172-53.016566L854.6999596666667 449.6277983333334z" fill="#ffffff" p-id="1953" data-spm-anchor-id="a313x.7781069.0.i11" class="selected"></path></svg>
\ No newline at end of file

src/assets/svg/user-forbid-fill.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1750649647518" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11953" xmlns:xlink="http://www.w3.org/1999/xlink" width="32" height="32"><path d="M774.6 284.7l82.4-82.4c9.8-9.8 9.8-25.6 0-35.4-9.8-9.8-25.6-9.8-35.4 0l-88.2 88.2C672.9 216.1 599.3 189 512 189 220 189 65 530.6 65 530.6s65.8 119.8 184 209.1l-82 82c-9.8 9.8-9.8 25.6 0 35.4 4.9 4.9 11.3 7.3 17.7 7.3s12.8-2.4 17.7-7.3l88.6-88.6c62.3 38.7 136.5 66.5 221 66.5 279.8 0 447-304.4 447-304.4s-58.2-144.9-184.4-245.9zM375 512c0-76.3 61.8-138 138-138 28.8 0 55.6 8.8 77.7 23.9L399 589.7c-15.2-22.1-24-48.9-24-77.7z m138 138c-29.3 0-56.5-9.2-78.9-24.8l192.1-192.1c15.6 22.4 24.8 49.6 24.8 78.9 0 76.2-61.8 138-138 138z" p-id="11954"></path></svg>
\ No newline at end of file

src/components/HelloWorld.vue

-<script setup lang="ts">
-defineProps<{
-  msg: string
-}>()
-</script>
-
-<template>
-  <div class="greetings">
-    <h1 class="green">{{ msg }}</h1>
-    <h3>
-      You’ve successfully created a project with
-      <a href="https://vite.dev/" target="_blank" rel="noopener">Vite</a> +
-      <a href="https://vuejs.org/" target="_blank" rel="noopener">Vue 3</a>. What's next?
-    </h3>
-  </div>
-</template>
-
-<style scoped>
-h1 {
-  font-weight: 500;
-  font-size: 2.6rem;
-  position: relative;
-  top: -10px;
-}
-
-h3 {
-  font-size: 1.2rem;
-}
-
-.greetings h1,
-.greetings h3 {
-  text-align: center;
-}
-
-@media (min-width: 1024px) {
-  .greetings h1,
-  .greetings h3 {
-    text-align: left;
-  }
-}
-</style>

src/components/TheWelcome.vue

-<script setup lang="ts">
-import WelcomeItem from './WelcomeItem.vue'
-import DocumentationIcon from './icons/IconDocumentation.vue'
-import ToolingIcon from './icons/IconTooling.vue'
-import EcosystemIcon from './icons/IconEcosystem.vue'
-import CommunityIcon from './icons/IconCommunity.vue'
-import SupportIcon from './icons/IconSupport.vue'
-
-const openReadmeInEditor = () => fetch('/__open-in-editor?file=README.md')
-</script>
-
-<template>
-  <WelcomeItem>
-    <template #icon>
-      <DocumentationIcon />
-    </template>
-    <template #heading>Documentation</template>
-
-    Vue’s
-    <a href="https://vuejs.org/" target="_blank" rel="noopener">official documentation</a>
-    provides you with all information you need to get started.
-  </WelcomeItem>
-
-  <WelcomeItem>
-    <template #icon>
-      <ToolingIcon />
-    </template>
-    <template #heading>Tooling</template>
-
-    This project is served and bundled with
-    <a href="https://vite.dev/guide/features.html" target="_blank" rel="noopener">Vite</a>. The
-    recommended IDE setup is
-    <a href="https://code.visualstudio.com/" target="_blank" rel="noopener">VSCode</a>
-    +
-    <a href="https://github.com/vuejs/language-tools" target="_blank" rel="noopener"
-      >Vue - Official</a
-    >. If you need to test your components and web pages, check out
-    <a href="https://vitest.dev/" target="_blank" rel="noopener">Vitest</a>
-    and
-    <a href="https://www.cypress.io/" target="_blank" rel="noopener">Cypress</a>
-    /
-    <a href="https://playwright.dev/" target="_blank" rel="noopener">Playwright</a>.
-
-    <br />
-
-    More instructions are available in
-    <a href="javascript:void(0)" @click="openReadmeInEditor"><code>README.md</code></a
-    >.
-  </WelcomeItem>
-
-  <WelcomeItem>
-    <template #icon>
-      <EcosystemIcon />
-    </template>
-    <template #heading>Ecosystem</template>
-
-    Get official tools and libraries for your project:
-    <a href="https://pinia.vuejs.org/" target="_blank" rel="noopener">Pinia</a>,
-    <a href="https://router.vuejs.org/" target="_blank" rel="noopener">Vue Router</a>,
-    <a href="https://test-utils.vuejs.org/" target="_blank" rel="noopener">Vue Test Utils</a>, and
-    <a href="https://github.com/vuejs/devtools" target="_blank" rel="noopener">Vue Dev Tools</a>. If
-    you need more resources, we suggest paying
-    <a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">Awesome Vue</a>
-    a visit.
-  </WelcomeItem>
-
-  <WelcomeItem>
-    <template #icon>
-      <CommunityIcon />
-    </template>
-    <template #heading>Community</template>
-
-    Got stuck? Ask your question on
-    <a href="https://chat.vuejs.org" target="_blank" rel="noopener">Vue Land</a>
-    (our official Discord server), or
-    <a href="https://stackoverflow.com/questions/tagged/vue.js" target="_blank" rel="noopener"
-      >StackOverflow</a
-    >. You should also follow the official
-    <a href="https://bsky.app/profile/vuejs.org" target="_blank" rel="noopener">@vuejs.org</a>
-    Bluesky account or the
-    <a href="https://x.com/vuejs" target="_blank" rel="noopener">@vuejs</a>
-    X account for latest news in the Vue world.
-  </WelcomeItem>
-
-  <WelcomeItem>
-    <template #icon>
-      <SupportIcon />
-    </template>
-    <template #heading>Support Vue</template>
-
-    As an independent project, Vue relies on community backing for its sustainability. You can help
-    us by
-    <a href="https://vuejs.org/sponsor/" target="_blank" rel="noopener">becoming a sponsor</a>.
-  </WelcomeItem>
-</template>

src/components/WelcomeItem.vue

-<template>
-  <div class="item">
-    <i>
-      <slot name="icon"></slot>
-    </i>
-    <div class="details">
-      <h3>
-        <slot name="heading"></slot>
-      </h3>
-      <slot></slot>
-    </div>
-  </div>
-</template>
-
-<style scoped>
-.item {
-  margin-top: 2rem;
-  display: flex;
-  position: relative;
-}
-
-.details {
-  flex: 1;
-  margin-left: 1rem;
-}
-
-i {
-  display: flex;
-  place-items: center;
-  place-content: center;
-  width: 32px;
-  height: 32px;
-
-  color: var(--color-text);
-}
-
-h3 {
-  font-size: 1.2rem;
-  font-weight: 500;
-  margin-bottom: 0.4rem;
-  color: var(--color-heading);
-}
-
-@media (min-width: 1024px) {
-  .item {
-    margin-top: 0;
-    padding: 0.4rem 0 1rem calc(var(--section-gap) / 2);
-  }
-
-  i {
-    top: calc(50% - 25px);
-    left: -26px;
-    position: absolute;
-    border: 1px solid var(--color-border);
-    background: var(--color-background);
-    border-radius: 8px;
-    width: 50px;
-    height: 50px;
-  }
-
-  .item:before {
-    content: ' ';
-    border-left: 1px solid var(--color-border);
-    position: absolute;
-    left: 0;
-    bottom: calc(50% + 25px);
-    height: calc(50% - 25px);
-  }
-
-  .item:after {
-    content: ' ';
-    border-left: 1px solid var(--color-border);
-    position: absolute;
-    left: 0;
-    top: calc(50% + 25px);
-    height: calc(50% - 25px);
-  }
-
-  .item:first-of-type:before {
-    display: none;
-  }
-
-  .item:last-of-type:after {
-    display: none;
-  }
-}
-</style>

src/components/common/ElComponents/ElButton/BaseButton.vue

+<template>
+  <button class="btn" v-bind="attrs">测试111</button>
+</template>
+<script setup lang="ts">
+// 二次封装el-button 除去el-button的默认样式 然后保留其他功能
+import type { ButtonProps } from 'element-plus'
+// const props = defineProps<ButtonProps>()
+const attrs = useAttrs()
+</script>
+<style scoped>
+.el-button {
+  /* 会作用到根元素 */
+  all: unset !important;
+}
+</style>

src/components/common/SelectTags/index.vue

+<template>
+  <div class="tag-selector">
+    <!-- 已选标签区域 -->
+    <div class="selected-tags">
+      <!-- 添加标签按钮 -->
+
+      <el-popover placement="top" :width="300" trigger="click">
+        <template #reference>
+          <el-button class="button-new-tag" size="small"> + 添加标签 </el-button>
+        </template>
+        <!-- 暂时不加搜索输入框 -->
+        <!-- <div class="search-section mb-4">
+          <el-input
+            v-model="searchKeyword"
+            placeholder="Enter键添加标签"
+            class="search-input"
+            clearable
+            @keyup.enter="addTagFromSearch"
+          >
+            <template #suffix>
+              <span class="text-gray-400 text-sm"
+                >{{ searchKeyword.length }} / {{ maxTagLength }}</span
+              >
+            </template>
+          </el-input>
+        </div> -->
+
+        <!-- 推荐标签区域 -->
+        <div class="recommended-section">
+          <div class="section-title mb-3 text-gray-600 text-sm">官方标签列表</div>
+
+          <div class="tags-grid">
+            <el-tag
+              v-for="tag in filteredRecommendedTags"
+              :key="tag.value"
+              :type="arryrOfModelValue.includes(tag.value) ? 'primary' : 'info'"
+              :effect="arryrOfModelValue.includes(tag.value) ? 'dark' : 'plain'"
+              class="tag-item cursor-pointer mr-2 mb-2"
+              @click="toggleTag(tag.value)"
+            >
+              {{ tag.label }}
+            </el-tag>
+          </div>
+        </div>
+      </el-popover>
+      <div class="flex flex-wrap gap-2">
+        <el-tag
+          v-for="tag in selectedTags"
+          :key="tag.value"
+          closable
+          type="primary"
+          @close="removeTag(tag.value)"
+        >
+          {{ tag.label }}
+        </el-tag>
+      </div>
+    </div>
+  </div>
+</template>
+
+// 选中的可能是 可能是 多选 [id1,id2] 或者 'id1,id2' 或者 （单选 number这种不考虑处理了
+可以在父组件自己处理)
+<script setup lang="ts" generic="T extends string | number[] | number">
+import { useTagsStore } from '@/stores/tags'
+import { storeToRefs } from 'pinia'
+
+import type { SelectTagProps } from './types'
+
+const { maxSelectedTags = 1, filterTagsFn } = defineProps<SelectTagProps>()
+const emit = defineEmits<{
+  selected: [tag?: { value: number; label: string }]
+}>()
+
+const tagsStore = useTagsStore()
+const { tagList } = storeToRefs(tagsStore)
+
+const filterTags = computed(() => {
+  if (filterTagsFn) {
+    return filterTagsFn(tagList.value)
+  }
+
+  return tagList.value
+})
+
+const modelValue = defineModel<T>({ required: true })
+
+const isArrayOfModelValue = Array.isArray(modelValue.value)
+
+// 把v-model转成一个 array类型的 方便后续操作的操作
+const arryrOfModelValue = computed({
+  get() {
+    if (isArrayOfModelValue) {
+      return (modelValue.value as number[]).filter((tagId) => {
+        return filterTags.value.some((tag) => tag.value === tagId)
+      })
+    }
+    return (modelValue.value as string)
+      .split(',')
+      .filter(Boolean)
+      .map(Number)
+      .filter((tagId) => filterTags.value.some((tag) => tag.value === tagId))
+  },
+  set(value) {
+    if (isArrayOfModelValue) {
+      modelValue.value = value as T
+    } else {
+      modelValue.value = value.join(',') as T
+    }
+  },
+})
+// 选中的标签
+const selectedTags = computed(() => {
+  const selectedTags: { value: number; label: string }[] = []
+  arryrOfModelValue.value.forEach((tagId) => {
+    const tag = filterTags.value.find((tag) => tag.value === tagId)
+    if (tag) {
+      selectedTags.push({
+        value: tag.value,
+        label: tag.label,
+      })
+    }
+  })
+  return selectedTags
+})
+
+const searchKeyword = ref('')
+
+const filteredRecommendedTags = computed(() => {
+  if (!searchKeyword.value) {
+    return filterTags.value
+  }
+  return filterTags.value.filter((tag) =>
+    tag.label.toLowerCase().includes(searchKeyword.value.toLowerCase()),
+  )
+})
+
+const addTag = (tagId: number) => {
+  if (arryrOfModelValue.value.length >= maxSelectedTags)
+    return ElMessage.warning(`最多只能选择 ${maxSelectedTags} 个标签`)
+  // 不能直接push 触发不了computed 的 set
+  arryrOfModelValue.value = [...arryrOfModelValue.value, tagId]
+  ElMessage.success('标签添加成功')
+  emit('selected', {
+    label: filterTags.value.find((tag) => tag.value === tagId)!.label,
+    value: tagId,
+  })
+}
+
+const removeTag = (tagId: number) => {
+  const index = arryrOfModelValue.value.indexOf(tagId)
+  if (index > -1) {
+    // 不能直接splice 触发不了computed 的 set
+    arryrOfModelValue.value = [...arryrOfModelValue.value.filter((_, i) => i !== index)]
+  }
+  emit('selected', undefined)
+}
+
+const toggleTag = (tagId: number) => {
+  if (arryrOfModelValue.value.includes(tagId)) {
+    removeTag(tagId)
+  } else {
+    addTag(tagId)
+  }
+}
+
+onMounted(() => {
+  if (tagList.value.length === 0) {
+    tagsStore.fetchTagList()
+  }
+})
+</script>

src/components/common/SelectTags/types.ts

+export type SelectTagProps = {
+  maxSelectedTags?: number
+  filterTagsFn?: (tags: { value: number; label: string }[]) => { value: number; label: string }[]
+}

src/components/common/SvgIcon/svgIcon.vue

+<template>
+  <svg :class="svgClass" aria-hidden="true" :style="{ width: size, height: size }">
+    <use :xlink:href="iconName" />
+  </svg>
+</template>
+
+<script setup lang="ts">
+interface IProp {
+  name: string
+  size?: string
+  className?: string
+}
+const props = withDefaults(defineProps<IProp>(), {
+  size: '1em',
+  color: '',
+  className: '',
+})
+
+const iconName = computed(() => {
+  return `#icon-${props.name}`
+})
+const svgClass = computed(() => {
+  if (props.className) {
+    return `svg-icon ${props.className}`
+  }
+  return 'svg-icon'
+})
+</script>
+
+<style lang="scss" scoped>
+.svg-icon {
+  vertical-align: -0.1em;
+  fill: currentColor;
+  overflow: hidden;
+}
+</style>

src/components/common/Tabs/index.tsx

+import type { SetupContext } from 'vue'
+
+type TypeOfValue = string | number
+type TabsProps = {
+  tabs: {
+    label: string
+    value: TypeOfValue
+  }[]
+  modelValue: TypeOfValue
+}
+
+type TabsEmits = {
+  'update:modelValue': [TypeOfValue]
+  change: [TypeOfValue]
+  setA: [string]
+}
+
+const BASE_TAB_CALASSES =
+  'tab-item cursor-pointer bg-white rounded-lg flex items-center justify-center px-4 py-2 min-w-20 h-8 transition-all duration-300 hover:shadow-md hover:bg-#D9EFFD/20 hover:text-#000/80 hover:-translate-y-0.5 active:scale-95 font-medium text-14px text-#000/55 shadow-sm'
+const ACTIVE_TAB_CLASSES = ' !bg-#D9EFFD shadow-lg transform -translate-y-1 !text-#000'
+//       <div class="left flex gap-3"> 未设置排列方式 需要给父组件设置 flex布局
+export default function Tabs({ tabs, modelValue }: TabsProps, { emit }: SetupContext<TabsEmits>) {
+  return tabs.map((tab) => (
+    <div
+      key={tab.value}
+      class={[
+        BASE_TAB_CALASSES,
+        {
+          [ACTIVE_TAB_CLASSES]: modelValue === tab.value,
+        },
+      ]}
+      onClick={() => {
+        emit('update:modelValue', tab.value)
+        emit('change', tab.value)
+      }}
+    >
+      {tab.label}
+    </div>
+  ))
+}

src/components/common/UploadFile/index.vue

+<template>
+  <el-upload
+    v-model:file-list="fileList"
+    action="#"
+    ref="uploadRef"
+    :auto-upload="false"
+    list-type="picture-card"
+    :on-preview="handlePictureCardPreview"
+    :on-remove="handleRemove"
+    :on-change="handleChange"
+    :before-remove="handleBeforeRemove"
+    :multiple="multiple"
+  >
+    <el-icon><Plus /></el-icon>
+  </el-upload>
+
+  <el-dialog v-model="dialogVisible">
+    <img w-full :src="dialogImageUrl" alt="Preview Image" />
+  </el-dialog>
+</template>
+
+<script lang="ts" setup generic="T extends string | string[]">
+import { Plus } from '@element-plus/icons-vue'
+import { uploadFile as uploadFileApi } from '@/api'
+import type { UploadProps, UploadUserFile } from 'element-plus'
+import type { UploadFileProps } from './types'
+
+const { limit = 2, multiple = true } = defineProps<UploadFileProps>()
+
+// 用户双向绑定的图片值
+const modelValue = defineModel<T>({
+  required: true,
+})
+
+const fileList = ref<UploadUserFile[]>([])
+
+// 传的是否是数组
+const isArrayOfModelValue = Array.isArray(modelValue.value)
+
+// 初始化回显fileList
+const initFileList = () => {
+  let urlArray: string[] = []
+  if (isArrayOfModelValue) {
+    urlArray = modelValue.value as string[]
+  } else {
+    urlArray = (modelValue.value as string).split(',').filter(Boolean)
+  }
+  fileList.value = urlArray.map((url, index) => {
+    const name = url.split('/').pop()?.split('.').shift() as string
+    return {
+      url,
+      name,
+      uid: index,
+    }
+  })
+}
+initFileList()
+
+watch(fileList, (newVal) => {
+  if (isArrayOfModelValue) {
+    modelValue.value = newVal.map((item) => item.url!) as T
+  } else {
+    modelValue.value = newVal.map((item) => item.url!).join(',') as T
+  }
+})
+
+// 是否达到上传限制了
+const hasReachedLimit = computed(() => {
+  return fileList.value.length >= limit
+})
+
+const uploadRef = useTemplateRef('uploadRef')
+
+const dialogImageUrl = ref('')
+const dialogVisible = ref(false)
+
+const handleRemove: UploadProps['onRemove'] = (uploadFile, uploadFiles) => {
+  console.log(uploadFile, uploadFiles)
+  console.log(uploadFile.url, 'onRemove')
+}
+
+const handlePictureCardPreview: UploadProps['onPreview'] = (uploadFile) => {
+  dialogImageUrl.value = uploadFile.url!
+  dialogVisible.value = true
+  console.log(uploadFile, 'onPreview')
+}
+
+// 在这里处理上传逻辑
+const handleChange = async (uploadFile: UploadUserFile, uploadFiles: UploadUserFile[]) => {
+  await nextTick()
+  if (hasReachedLimit.value) {
+    ElMessage.error(`最多上传${limit}个文件`)
+    uploadFiles.pop()
+    return false
+  }
+
+  console.log(uploadFile, uploadFiles, 'onChange')
+  const { data } = await uploadFileApi(uploadFile.raw as File)
+
+  const index = fileList.value.findIndex((file) => file.uid === uploadFile.uid)
+  if (index !== -1) {
+    fileList.value[index] = {
+      ...fileList.value[index],
+      url: data.fileUrl,
+      name: data.fileName,
+      status: 'success',
+    }
+  }
+}
+
+const handleBeforeRemove = (uploadFile: UploadUserFile, uploadFiles: UploadUserFile[]) => {
+  return true
+}
+</script>

src/components/common/UploadFile/types.ts

+export interface UploadFileProps {
+  multiple?: boolean
+  limit?: number
+}

src/components/common/UploadVideo/index.vue

+<template>
+  <div class="video-upload-container">
+    <!-- 上传区域 -->
+    <el-upload
+      ref="uploadRef"
+      action="#"
+      :before-upload="beforeUpload"
+      :on-change="handleFileChange"
+      :show-file-list="false"
+      :auto-upload="false"
+      drag
+      accept="video/*"
+      class="upload-area"
+    >
+      <div v-if="!uploading && !videoInfo" class="upload-placeholder">
+        <el-icon class="upload-icon"><VideoCamera /></el-icon>
+        <div class="upload-text">
+          <p>拖拽视频文件到此处，或点击选择文件</p>
+          <p class="upload-hint">支持 MP4、AVI、MOV 格式，文件大小不超过 500MB</p>
+        </div>
+      </div>
+
+      <!-- 上传进度 -->
+      <div v-if="uploading" class="upload-progress">
+        <div class="progress-info">
+          <el-icon class="progress-icon"><VideoPlay /></el-icon>
+          <div class="progress-details">
+            <p class="file-name">{{ currentFile?.name }}</p>
+            <p class="progress-text">正在上传...</p>
+          </div>
+        </div>
+        <el-progress :percentage="uploadProgress" :stroke-width="8" class="progress-bar" />
+        <el-button type="danger" size="small" @click="cancelUpload" class="cancel-btn">
+          取消上传
+        </el-button>
+      </div>
+
+      <!-- 上传完成 -->
+      <div v-if="videoInfo && !uploading" class="upload-success">
+        <div class="video-preview">
+          <video
+            :src="videoInfo.url"
+            poster="http://soundasia.oss-cn-shenzhen.aliyuncs.com/colleagueBar/jpg/2024/01/08/1704677467931.jpg"
+            class="video-thumbnail"
+            muted
+          ></video>
+          <div class="video-overlay">
+            <el-button type="primary" size="small" @click="replaceVideo"> 重新选择 </el-button>
+          </div>
+        </div>
+        <div class="video-details">
+          <p class="video-name">{{ videoInfo.name }}</p>
+          <p class="video-meta">
+            {{ formatFileSize(videoInfo.size) }} · {{ videoInfo.duration }} ·
+            {{ videoInfo.resolution }}
+          </p>
+        </div>
+      </div>
+    </el-upload>
+
+    <!-- 错误提示 -->
+    <div v-if="uploadError" class="upload-error">
+      <el-icon class="error-icon"><Warning /></el-icon>
+      <span>{{ uploadError }}</span>
+      <el-button type="text" @click="retryUpload">重试</el-button>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { uploadFile as uploadFileApi } from '@/api/common'
+import type { UploadFile } from 'element-plus'
+import type { UploadVideoProps } from './types'
+
+interface VideoInfo {
+  url: string
+  name: string
+  size: number
+  duration: string
+  resolution: string
+  poster?: string
+  fileId?: string
+}
+
+const { maxSize = 500, acceptFormats = ['mp4', 'avi', 'mov', 'wmv', 'flv'] } =
+  defineProps<UploadVideoProps>()
+
+const modelValue = defineModel<string>('modelValue', { required: true })
+const videoInfo = defineModel<VideoInfo | null>('videoInfo', { required: false, default: null })
+
+// 响应式数据
+const uploadRef = ref()
+const uploading = ref(false)
+const uploadProgress = ref(0)
+const uploadError = ref('')
+const currentFile = ref<File | null>(null)
+
+// 文件大小格式化
+const formatFileSize = (bytes: number): string => {
+  if (bytes === 0) return '0 B'
+  const k = 1024
+  const sizes = ['B', 'KB', 'MB', 'GB']
+  const i = Math.floor(Math.log(bytes) / Math.log(k))
+  return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i]
+}
+
+// 获取视频时长和分辨率
+const getVideoMetadata = (file: File): Promise<{ duration: string; resolution: string }> => {
+  return new Promise((resolve) => {
+    const video = document.createElement('video')
+    video.preload = 'metadata'
+
+    video.onloadedmetadata = () => {
+      const duration = formatDuration(video.duration)
+      const resolution = `${video.videoWidth}x${video.videoHeight}`
+      URL.revokeObjectURL(video.src)
+      resolve({ duration, resolution })
+    }
+
+    video.src = URL.createObjectURL(file)
+  })
+}
+
+// 格式化时长
+const formatDuration = (seconds: number): string => {
+  const mins = Math.floor(seconds / 60)
+  const secs = Math.floor(seconds % 60)
+  return `${mins}:${secs.toString().padStart(2, '0')}`
+}
+
+// 上传前验证
+const beforeUpload = (file: File): boolean => {
+  uploadError.value = ''
+  uploadProgress.value = 0
+
+  // 文件类型验证
+  const fileExtension = file.name.split('.').pop()?.toLowerCase()
+  if (!fileExtension || !acceptFormats.includes(fileExtension)) {
+    uploadError.value = `不支持的文件格式，请上传 ${acceptFormats.join('、')} 格式的视频`
+    return false
+  }
+
+  // 文件大小验证
+  const fileSizeMB = file.size / 1024 / 1024
+  if (fileSizeMB > maxSize) {
+    uploadError.value = `文件大小不能超过 ${maxSize}MB`
+    return false
+  }
+
+  return true
+}
+
+// 文件选择处理 - 选择后自动上传
+const handleFileChange = async (file: UploadFile) => {
+  if (!file.raw) return
+
+  currentFile.value = file.raw
+
+  await startUpload()
+}
+
+// 开始上传
+const startUpload = async () => {
+  if (!currentFile.value) return
+
+  try {
+    uploading.value = true
+    uploadError.value = ''
+    uploadProgress.value = 0
+
+    // 调用你的上传方法
+    const { data } = await uploadFileApi(currentFile.value, (progress) => {
+      uploadProgress.value = progress
+    })
+    console.log(data)
+
+    // 获取视频元数据
+    const metadata = await getVideoMetadata(currentFile.value)
+
+    // 根据你的 API 返回结构调整
+    const videoData: VideoInfo = {
+      //   url: data.fileUrl,
+      url: 'https://soundasia.oss-cn-shenzhen.aliyuncs.com/OA/readName/mp4/2025/11/12/Common/1762918987602.mp4',
+      name: currentFile.value.name,
+      size: currentFile.value.size,
+      duration: metadata.duration,
+      resolution: metadata.resolution,
+      poster: data.fileUrl,
+      fileId: data.fileId,
+    }
+
+    videoInfo.value = videoData
+    uploading.value = false
+
+    // 设置url
+    modelValue.value = videoData.url
+    ElMessage.success('视频上传成功！')
+  } catch (error) {
+    uploading.value = false
+    uploadError.value = error instanceof Error ? error.message : '上传失败，请重试'
+    ElMessage.error(uploadError.value)
+  }
+}
+
+// 取消上传
+const cancelUpload = () => {
+  uploading.value = false
+  uploadProgress.value = 0
+  ElMessage.info('已取消上传')
+}
+
+// 重新选择视频
+const replaceVideo = () => {
+  videoInfo.value = null
+  uploadError.value = ''
+  uploadProgress.value = 0
+  currentFile.value = null
+}
+
+// 重试上传
+const retryUpload = () => {
+  uploadError.value = ''
+  startUpload()
+}
+</script>
+
+<style scoped>
+.video-upload-container {
+  width: 100%;
+}
+
+.upload-area {
+  width: 100%;
+}
+
+.upload-area :deep(.el-upload) {
+  width: 100%;
+}
+
+.upload-area :deep(.el-upload-dragger) {
+  width: 100%;
+  height: 200px;
+  border: 2px dashed #d1d5db;
+  border-radius: 12px;
+  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
+  transition: all 0.3s ease;
+}
+
+.upload-area :deep(.el-upload-dragger:hover) {
+  border-color: #6366f1;
+  background: linear-gradient(135deg, #eef2ff 0%, #e0e7ff 100%);
+}
+
+.upload-placeholder {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+  padding: 20px;
+}
+
+.upload-icon {
+  font-size: 48px;
+  color: #6366f1;
+  margin-bottom: 16px;
+}
+
+.upload-text p {
+  margin: 0;
+  color: #374151;
+  font-size: 16px;
+}
+
+.upload-hint {
+  font-size: 14px !important;
+  color: #6b7280 !important;
+  margin-top: 8px !important;
+}
+
+.upload-progress {
+  padding: 24px;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+}
+
+.progress-info {
+  display: flex;
+  align-items: center;
+  margin-bottom: 16px;
+}
+
+.progress-icon {
+  font-size: 24px;
+  color: #6366f1;
+  margin-right: 12px;
+}
+
+.progress-details {
+  flex: 1;
+}
+
+.file-name {
+  margin: 0 0 4px 0;
+  font-weight: 600;
+  color: #111827;
+  font-size: 14px;
+}
+
+.progress-text {
+  margin: 0;
+  color: #6b7280;
+  font-size: 12px;
+}
+
+.progress-bar {
+  margin-bottom: 12px;
+}
+
+.progress-bar :deep(.el-progress-bar__outer) {
+  background-color: #e5e7eb;
+  border-radius: 8px;
+}
+
+.progress-bar :deep(.el-progress-bar__inner) {
+  background: linear-gradient(90deg, #6366f1 0%, #8b5cf6 100%);
+  border-radius: 8px;
+}
+
+.cancel-btn {
+  align-self: center;
+}
+
+.upload-success {
+  padding: 20px;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  gap: 16px;
+}
+
+.video-preview {
+  position: relative;
+  width: 120px;
+  height: 80px;
+  border-radius: 8px;
+  overflow: hidden;
+  background: #000;
+}
+
+.video-thumbnail {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+
+.video-overlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.5);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  opacity: 0;
+  transition: opacity 0.3s ease;
+}
+
+.video-preview:hover .video-overlay {
+  opacity: 1;
+}
+
+.video-details {
+  flex: 1;
+}
+
+.video-name {
+  margin: 0 0 8px 0;
+  font-weight: 600;
+  color: #111827;
+  font-size: 14px;
+}
+
+.video-meta {
+  margin: 0;
+  color: #6b7280;
+  font-size: 12px;
+}
+
+.upload-error {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 12px;
+  background: #fef2f2;
+  border: 1px solid #fecaca;
+  border-radius: 8px;
+  margin-top: 12px;
+  color: #dc2626;
+  font-size: 14px;
+}
+
+.error-icon {
+  color: #dc2626;
+}
+
+@media (max-width: 640px) {
+  .upload-area :deep(.el-upload-dragger) {
+    height: 160px;
+  }
+
+  .upload-placeholder {
+    padding: 16px;
+  }
+
+  .upload-icon {
+    font-size: 36px;
+    margin-bottom: 12px;
+  }
+
+  .upload-text p {
+    font-size: 14px;
+  }
+
+  .upload-hint {
+    font-size: 12px !important;
+  }
+
+  .upload-success {
+    flex-direction: column;
+    text-align: center;
+  }
+
+  .video-preview {
+    width: 160px;
+    height: 90px;
+  }
+}
+</style>

src/components/common/UploadVideo/types.ts

+export interface UploadVideoProps {
+  maxSize?: number // MB
+  acceptFormats?: string[]
+}

src/config.ts

+interface IConfig {
+  /** 网络请求url */
+  baseUrl: string
+  /** 用户登录 type */
+  loginType: number
+  /** 微信登录跳转路径 */
+  wxRedirect: string
+}
+
+export const app_config: { [key: string]: IConfig } = {
+  // 正式环境
+  production: {
+    baseUrl: 'http://oa.yswg.com.cn:8082',
+    loginType: 3,
+    wxRedirect: 'oa3.yswg.com.cn',
+  },
+
+  // 测试环境
+  test: {
+    baseUrl: 'http://47.119.149.50:8082',
+    loginType: 1,
+    wxRedirect: 'oatest.yswg.com.cn:3457',
+  },
+
+  // 开发环境
+  development: {
+    // baseUrl: 'http://oa.yswg.com.cn:8082', // 正式环境
+    baseUrl: '/api1', // 线上测试机
+    // baseUrl: 'http://192.168.2.110:8082', // 线上测试机
+    // baseUrl: 'http://192.168.2.85:8080', // 洋倍
+    // baseUrl: 'http://192.168.2.12:8084', // 立鹏
+    // baseUrl: 'http://192.168.2.55:8089', // 首拥
+    loginType: 1,
+    wxRedirect: 'oatest.yswg.com.cn:3457',
+  },
+}

src/constants/enums.ts

+// 文章类型枚举
+export enum ArticleTypeEnum {
+  VIDEO = 'video', // 视频
+  POST = 'post', // 帖子
+  QUESTION = 'question', // 问题
+  COLUMN = 'column', // 专栏
+  PRACTICE = 'practice', // 实践
+  INTERVIEW = 'interview', // 专访
+}
+
+// 发布状态枚举
+export enum ReleaseStatusEnum {
+  DRAFT = 1, // 草稿
+  PUBLISH = 2, // 发布
+}
+
+// 任务类型枚举
+export enum TaskTypeEnum {
+  // 常规任务
+  REGULAR_TASK = 1,
+  // 特殊任务
+  SPECIAL_TASK = 2,
+}
+
+// 商品类型枚举
+export enum ShopGoodsTypeEnum {
+  // 实物
+  REAL_GOODS = 1,
+  // 虚拟
+  VIRTUAL_GOODS = 2,
+}
+
+// 布尔值枚举
+export enum BooleanFlag {
+  NO = 0, // 否
+  YES = 1, // 是
+}
+
+// 发送类型枚举
+export enum SendTypeEnum {
+  // 立即发送
+  IMMEDIATE = 1,
+  // 定时发送
+  SCHEDULED = 2,
+}

src/constants/index.ts

+export * from './options'
+export * from './enums'

src/constants/options.ts

+// 地区列表
+export const regionListOptions = [
+  {
+    label: '深圳',
+    value: '深圳',
+  },
+  {
+    label: '合肥',
+    value: '合肥',
+  },
+  {
+    label: '武汉',
+    value: '武汉',
+  },
+  {
+    label: '长沙',
+    value: '长沙',
+  },
+  {
+    label: '广州',
+    value: '广州',
+  },
+  {
+    label: '香港',
+    value: '香港',
+  },
+  {
+    label: '仓库',
+    value: '仓库',
+  },
+]

src/hooks/index.ts

+export * from './useResetData'
+export * from './usePageSearch'

src/hooks/usePageSearch.ts

+import { useResetData } from '@/hooks'
+import type { BackendServicePageResult, BackendServiceResult } from '@/utils/request/types'
+
+/**
+ * 分页搜索参数基础类型
+ */
+export type PageSearchParamValue = string | number | string[] | number[] | undefined | null
+
+/**
+ * 分页搜索参数
+ */
+export interface PageSearchParams {
+  current?: number
+  size?: number
+  [key: string]: PageSearchParamValue
+}
+
+/**
+ * 分页搜索配置
+ */
+export interface PageSearchConfig<T extends PageSearchParams = PageSearchParams> {
+  /** 是否立即执行搜索 */
+  immediate?: boolean
+  /** 默认页码 */
+  defaultCurrent?: number
+  /** 默认页大小 */
+  defaultSize?: number
+  /** 初始搜索参数 */
+  defaultParams?: Omit<T, 'current' | 'size'>
+  /** 页码字段名（用于适配不同后端接口） */
+  pageField?: keyof T
+  /** 页大小字段名 */
+  pageSizeField?: keyof T
+}
+
+/**
+ * 分页搜索 Hook - 自动类型推断版本
+ */
+export function usePageSearch<
+  TSearchApi extends (params: any) => Promise<BackendServiceResult<BackendServicePageResult<any>>>,
+>(searchApi: TSearchApi, config: PageSearchConfig = {}) {
+  // 从 searchApi 推断参数类型和返回数据类型
+  type TParams = Parameters<TSearchApi>[0]
+  type TData = TSearchApi extends (
+    params: any,
+  ) => Promise<BackendServiceResult<BackendServicePageResult<infer U>>>
+    ? U
+    : never
+
+  const {
+    immediate = true,
+    defaultCurrent = 1,
+    defaultSize = 10,
+    defaultParams = {} as Omit<TParams, 'current' | 'size'>,
+    pageField = 'current' as keyof TParams,
+    pageSizeField = 'size' as keyof TParams,
+  } = config
+
+  const loading = shallowRef(false)
+  const list = ref<TData[]>([])
+  const total = ref(0)
+
+  // 构建初始搜索参数
+  const initialParams = {
+    [pageField]: defaultCurrent,
+    [pageSizeField]: defaultSize,
+    ...defaultParams,
+  } as TParams
+
+  const [searchParams, resetSearchParams] = useResetData(initialParams)
+
+  const search = async (params?: Partial<TParams>) => {
+    loading.value = true
+    try {
+      const searchData = params ? { ...searchParams.value, ...params } : searchParams.value
+      const { data } = await searchApi(searchData as TParams)
+
+      list.value = data.list || []
+      total.value = data.total || 0
+    } catch (error) {
+      console.error('分页搜索失败:', error)
+      list.value = []
+      total.value = 0
+    } finally {
+      loading.value = false
+    }
+  }
+
+  const reset = async () => {
+    resetSearchParams()
+    await search()
+  }
+
+  const goToPage = async (page: number) => {
+    searchParams.value[pageField] = page
+    await search()
+  }
+
+  const changePageSize = async (size: number) => {
+    searchParams.value[pageField] = 1
+    searchParams.value[pageSizeField] = size
+    await search()
+  }
+
+  const refresh = () => search()
+
+  if (immediate) {
+    onMounted(search)
+  }
+
+  return {
+    list: readonly(list),
+    total: readonly(total),
+    loading: readonly(loading),
+    searchParams,
+    search,
+    reset,
+    goToPage,
+    changePageSize,
+    refresh,
+  }
+}

src/hooks/useResetData.ts

+export function useResetData<T>(initialValue: T) {
+  const state = ref(structuredClone(initialValue))
+  const reset = () => {
+    state.value = structuredClone(initialValue)
+  }
+  return [state, reset] as [Ref<T>, () => void]
+}

src/layoutCulture/components/mainContainer.vue

+<template>
+  <div class="main-container">
+    <div class="banner mb-3">
+      <el-carousel height="410px" class="shadow-lg rounded-lg">
+        <el-carousel-item v-for="(item, index) in carouselList" :key="index">
+          <el-image :src="item.assetUrl" class="w-full h-full object-cover" />
+          <!-- 背景遮罩 -->
+          <!-- <div
+            class="absolute inset-0 bg-gradient-to-r from-black/20 via-transparent to-white/80"
+          ></div>
+
+          <div class="relative h-full flex items-center">
+            <div class="w-1/2 h-full flex items-center justify-center p-8">
+              <img
+                :src="item.assetUrl"
+                :alt="item.title"
+                class="max-w-full max-h-full object-contain drop-shadow-2xl"
+              />
+            </div>
+
+            <div class="w-1/2 pr-12 py-8">
+              <div class="mb-6">
+                <div class="flex items-center gap-2 mb-3">
+                  <span class="text-orange-500 text-lg">🚀</span>
+                  <span class="text-purple-600 text-lg">🎯</span>
+                  <span class="text-sm font-medium text-gray-700">{{ item.type }}</span>
+                </div>
+
+                <h2 class="text-2xl font-bold text-gray-900 mb-4 leading-tight">
+                  {{ item.url }}
+                </h2>
+              </div>
+
+              <div class="mb-8">
+                <div class="flex items-start gap-2 mb-3">
+                  <span class="text-green-500 text-sm mt-1">🌿</span>
+                  <p class="text-gray-700 leading-relaxed text-sm">
+                    {{ item.url }}
+                  </p>
+                </div>
+
+                <div class="text-xs text-gray-500 leading-relaxed pl-5">
+                  {{ item.url }}
+                </div>
+              </div>
+
+              <div class="flex items-center justify-between">
+                <el-button
+                  type="success"
+                  size="large"
+                  round
+                  class="px-8 py-3 shadow-lg hover:shadow-xl transition-all"
+                >
+                  <i class="mr-2">👀</i>
+                  {{ item.url }}
+                </el-button>
+              </div>
+            </div>
+          </div> -->
+        </el-carousel-item>
+      </el-carousel>
+    </div>
+
+    <div class="flex gap-3">
+      <div class="left flex-1 basis-full xl:basis-3/4 transition-all duration-500">
+        <div class="tabs-container h-70px flex relative md:h-60px rounded-lg mb-3">
+          <div
+            v-for="tab in tabs"
+            :key="tab.path"
+            class="flex-1 flex items-center justify-center cursor-pointer relative transition-all duration-300 hover:bg-white/10 gap-2 group"
+            @click="toggleTab(tab)"
+          >
+            <svg-icon :name="tab.svg" class="h-60px w-auto md:h-50px sm:h-40px" size="40" />
+            <div class="text-18px font-500 text-gray-800 md:text-16px sm:text-14px">
+              {{ tab.name }}
+            </div>
+            <!-- 下划线 -->
+            <div
+              class="absolute bottom-0 left-0 right-0 h-4px bg-[linear-gradient(to_right,#60a5fa_0%,#c084fc_100%)] transform scale-x-0 transition-transform duration-300 origin-center"
+              :class="{ 'scale-x-50': activeTab === tab.name }"
+            ></div>
+          </div>
+        </div>
+
+        <div
+          class="content-container w-100% rounded-lg bg-#F5F8FD border-1px border-solid border-#EAEAEF shadow-[0_1px_4px_0_rgba(33,33,52,0.1)]"
+        >
+          <div class="content-wrapper p-6">
+            <router-view v-slot="{ Component, route }">
+              <transition name="fade" mode="out-in">
+                <keep-alive>
+                  <component :is="Component" :key="getThirdLevelKey(route)" />
+                </keep-alive>
+              </transition>
+            </router-view>
+          </div>
+        </div>
+      </div>
+      <!-- 屏幕变小直接隐藏 -->
+      <div class="right flex-col gap-3 xl:flex xl:basis-1/4 hidden">
+        <!-- 等级等相关信息 -->
+        <div
+          class="level-container common-box flex flex-col justify-center items-center gap-4 rounded-lg bg-#E4F5FE"
+        >
+          <div class="top flex items-center w-full justify-center">
+            <div class="relative">
+              <img class="h-8 sm:h-10" src="@/assets/img/culture/letter.png" alt="" />
+              <!-- 添加小的等级徽章 -->
+              <div
+                class="absolute -top-1 -right-1 bg-blue-500 text-white text-xs rounded-full w-4 h-4 flex items-center justify-center font-bold"
+              >
+                1
+              </div>
+            </div>
+            <div class="ml-2 sm:ml-4 text-sm sm:text-base">
+              <div class="font-semibold">等级：LV1</div>
+              <div class="text-amber-600 font-medium">YA币：8888</div>
+            </div>
+          </div>
+          <div class="flex flex-col sm:flex-row gap-2 w-full">
+            <el-button
+              class="bg-[linear-gradient(to_right,#FFD06A_0%,#FFB143_100%)] shadow-[0px_1px_8px_0_rgba(255,173,91,0.25)] border-none hover:-translate-y-1 hover:shadow-[0px_4px_10px_0_rgba(255,173,91,0.4)] hover:scale-105 active:scale-95 active:translate-y-0 transition-all duration-200 flex-1 text-xs sm:text-sm"
+              type="primary"
+              @click="onDailySign"
+            >
+              <svg-icon name="culture-sign_in" size="35" />
+              <span class="text-black text-xs sm:text-sm">立即签到</span>
+            </el-button>
+
+            <el-button
+              class="bg-[linear-gradient(to_right,#ABB0FF_0%,#7495FF_100%)] shadow-[0_1px_8px_0_rgba(0,36,237,0.25)] border-none hover:-translate-y-1 transition-all duration-200 flex-1 text-xs sm:text-sm"
+              type="primary"
+              @click="router.push('/pointsStore')"
+            >
+              <svg-icon name="culture-points_store" size="30" />
+              <span class="text-black text-xs sm:text-sm">积分商城</span>
+            </el-button>
+          </div>
+        </div>
+
+        <!-- 案例库 -->
+        <div class="case-container common-box rounded-lg bg-#E2FDF5">
+          <div class="flex items-center gap-2 mb-2">
+            <div class="w-1 h-4 bg-gradient-to-b from-blue-500 to-purple-500 rounded-full"></div>
+            <h1 class="text-sm sm:text-base font-bold">YAYA案例库</h1>
+          </div>
+          <p class="text-xs sm:text-sm mb-4 line-clamp-3 leading-relaxed text-gray-600">
+            案例库案例库案例库案例库案例库案例库案例库案例库案例库案例库案例库案例库案例库案例库案例库
+          </p>
+          <div class="flex justify-center items-center">
+            <el-button
+              class="bg-[linear-gradient(to_right,#A3EADC_0%,#7BE0BD_100%)] shadow-[0_1px_4px_0_rgba(168,225,210,1)] border-none hover:-translate-y-1 transition-all duration-200 text-xs sm:text-sm"
+              type="primary"
+            >
+              <svg-icon name="culture-submit" size="30" class="mr-2" />
+              <span class="text-black text-xs sm:text-sm">去投稿</span>
+            </el-button>
+          </div>
+        </div>
+
+        <!-- 投稿中心-->
+        <div class="submit-container common-box rounded-lg bg-#EDEAFE">
+          <div class="grid grid-cols-3 gap-2 sm:gap-4 mb-4">
+            <div
+              class="flex flex-col items-center justify-center text-center cursor-pointer hover:-translate-y-1 transition-transform duration-200 p-2 rounded-lg hover:bg-white/10"
+            >
+              <svg-icon name="culture-topic_release" size="80" />
+              <div class="text-xs sm:text-sm">话题发布</div>
+            </div>
+            <div
+              class="flex flex-col items-center justify-center text-center cursor-pointer hover:-translate-y-1 transition-transform duration-200 p-2 rounded-lg hover:bg-white/10"
+            >
+              <svg-icon name="culture-answer" size="80" />
+              <div class="text-xs sm:text-sm">回答问题</div>
+            </div>
+            <div
+              @click="router.push('/publishVideo')"
+              class="flex flex-col items-center justify-center text-center cursor-pointer hover:-translate-y-1 transition-transform duration-200 p-2 rounded-lg hover:bg-white/10"
+            >
+              <svg-icon name="culture-video_release" size="80" />
+              <div class="text-xs sm:text-sm">视频发布</div>
+            </div>
+          </div>
+          <div class="flex justify-center items-center">
+            <el-button
+              class="bg-[linear-gradient(to_right,#D6C9FF_0%,#C5B1FF_100%)] shadow-[0_1px_4px_0_rgba(95,0,237,0.25)] border-none hover:-translate-y-1 transition-all duration-200 text-xs sm:text-sm"
+              type="primary"
+            >
+              <span class="text-black text-xs sm:text-sm">投稿中心</span>
+            </el-button>
+          </div>
+        </div>
+
+        <!-- 任务中心 -->
+        <div class="task-container common-box rounded-lg bg-#FFF0E5">
+          <div class="flex items-center justify-between mb-2">
+            <div>
+              <div class="flex items-center gap-2">
+                <div class="w-1 h-4 bg-gradient-to-b from-pink-500 to-rose-500 rounded-full"></div>
+                <h1 class="text-sm sm:text-base font-bold">任务中心</h1>
+              </div>
+              <h2 class="text-xs sm:text-sm mb-1 text-gray-600 ml-3">常规任务 | 特殊任务</h2>
+            </div>
+          </div>
+
+          <div class="flex flex-col gap-2 sm:gap-3">
+            <div v-for="item in regularTaskList" :key="item.id">
+              <div
+                class="flex items-center justify-between hover:bg-white/10 rounded-lg transition-colors duration-200 group"
+              >
+                <div class="flex items-center min-w-0 flex-1">
+                  <svg-icon name="culture-daily_sign" size="70" />
+                  <div class="flex flex-col items-start justify-center ml-2 sm:ml-3 min-w-0 flex-1">
+                    <div class="text-xs sm:text-sm truncate w-full font-medium">
+                      {{ item.title }}
+                    </div>
+                    <div class="color-#757575 text-xs w-full flex items-start flex-nowrap">
+                      <svg-icon name="culture-small_coin" size="16" class="mr-1" />
+                      <el-tooltip :content="item.description" placement="top">
+                        <div class="truncate w-130px cursor-pointer">{{ item.description }}</div>
+                      </el-tooltip>
+                    </div>
+                  </div>
+                </div>
+                <el-button
+                  class="bg-[linear-gradient(to_right,#FFC5A1_0%,#FFB77F_100%)] shadow-[0_1px_8px_0_rgba(255,141,54,0.25)] border-none hover:-translate-y-1 transition-all duration-200 text-xs sm:text-sm rounded-full"
+                  type="primary"
+                >
+                  <span class="text-black text-xs sm:text-sm">去签到</span>
+                </el-button>
+              </div>
+              <!-- 分割线 -->
+              <el-divider style="margin: 0" />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script setup lang="ts">
+import { ref, onMounted } from 'vue'
+import { useRouter, useRoute } from 'vue-router'
+import front from '@/assets/img/culture/front_page.png'
+import ya from '@/assets/img/culture/ya_culture.png'
+import ask from '@/assets/img/culture/ask.png'
+import type { RouteLocationNormalizedLoadedGeneric } from 'vue-router'
+import { getTaskList, dailySign, getCarouselList } from '@/api'
+import { usePageSearch } from '@/hooks'
+import { TaskTypeEnum } from '@/constants'
+import type { CarouselItemDto } from '@/api'
+
+const route = useRoute()
+const router = useRouter()
+
+const carouselList = ref<CarouselItemDto[]>([])
+
+const tabs = [
+  { name: '首页', path: 'deshboard', img: front, svg: 'culture-home' },
+  { name: 'YA文化', path: 'ya', img: ya, svg: 'culture-ya_culture' },
+  { name: '问吧', path: 'ask', img: ask, svg: 'culture-ask' },
+]
+
+const activeTab = ref(
+  tabs.find((item) => item.path === route.path.split('/').at(-1))?.name || '首页',
+)
+
+const toggleTab = (tab: { name: string; path: string }) => {
+  activeTab.value = tab.name
+  router.push(`/mainContainer/${tab.path}`)
+}
+
+const getThirdLevelKey = (route: RouteLocationNormalizedLoadedGeneric) => {
+  // console.log(route, '三级路由')
+  return route.fullPath
+}
+
+const { list, total } = usePageSearch(getTaskList)
+
+const regularTaskList = computed(() =>
+  list.value.filter((item) => item.taskType === TaskTypeEnum.REGULAR_TASK),
+)
+const specialTaskList = computed(() =>
+  list.value.filter((item) => item.taskType === TaskTypeEnum.SPECIAL_TASK),
+)
+
+const onDailySign = async () => {
+  await dailySign()
+}
+
+onMounted(async () => {
+  const { data } = await getCarouselList()
+  carouselList.value = data
+})
+</script>
+<style lang="scss" scoped>
+.main-container {
+  padding-bottom: 100px;
+  .tabs-container {
+    background: linear-gradient(to right, #d1f3ff 0%, #bebeff 100%);
+  }
+  .right {
+    .common-box {
+      padding: 15px;
+      border: 1px solid #eaeaef;
+      box-shadow: 0 1px 4px 0 rgba(33, 33, 52, 0.1);
+    }
+    .common-btn {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      background: linear-gradient(to right, #efe7dc 0%, #efe7dc 100%);
+      border: 1px solid #767676;
+      color: #000;
+      cursor: pointer;
+      transition: all 0.3s;
+    }
+  }
+}
+
+.fade-enter-from,
+.fade-leave-to {
+  opacity: 0;
+  transform: translateY(10px);
+}
+.fade-enter-to,
+.fade-leave-from {
+  opacity: 1;
+  transform: translateY(0);
+}
+.fade-enter-active,
+.fade-leave-active {
+  transition: all 0.3s ease;
+}
+</style>

src/layoutCulture/components/onlineTime.vue

+<template>
+  <Draggable
+    :initial-value="{ x: x, y: y }"
+    storage-key="vueuse-draggable"
+    storage-type="session"
+    class="fixed"
+  >
+    <div class="cursor-pointer online-time flex flex-col items-center z-50">
+      <!-- 图片容器 -->
+      <div
+        class="relative mb-2 hover:scale-105 transition-transform duration-300 ease-out transform-gpu backface-hidden"
+      >
+        <img
+          draggable="false"
+          src="@/assets/img/culture/online_time.png"
+          alt="在线时长"
+          class="w-16 h-16 md:w-20 md:h-20"
+        />
+      </div>
+
+      <!-- 时长显示卡片 -->
+      <div
+        class="w-24 md:w-28 lg:w-32 h-16 md:h-18 lg:h-20 rounded-2xl bg-gradient-to-br from-white via-blue-50 to-purple-50 shadow-lg hover:shadow-xl border border-white/50 flex flex-col justify-center items-center transition-all duration-300 ease-out hover:scale-105 hover:-translate-y-1 backdrop-blur-sm relative overflow-hidden group transform-gpu backface-hidden will-change-transform"
+      >
+        <!-- 其他内容保持不变 -->
+        <div
+          class="absolute inset-0 bg-gradient-to-r from-blue-400/5 via-purple-400/5 to-pink-400/5 opacity-0 group-hover:opacity-100 transition-opacity duration-500"
+        ></div>
+
+        <div
+          class="absolute top-0 left-0 right-0 h-2 bg-gradient-to-r from-blue-400 via-purple-400 to-pink-400 opacity-80"
+        ></div>
+        <div
+          class="absolute top-1 left-0 right-0 h-1 bg-gradient-to-r from-blue-300 via-purple-300 to-pink-300 opacity-60"
+        ></div>
+
+        <div class="text-center px-3 relative z-10">
+          <div class="text-xs md:text-sm text-gray-700 font-medium mb-1 tracking-wide">
+            今日在线时长
+          </div>
+          <div
+            class="text-lg md:text-xl lg:text-2xl font-bold text-gray-800 font-mono tracking-wider"
+          >
+            00:00
+          </div>
+        </div>
+
+        <div class="absolute bottom-2 left-3 right-3 h-1 bg-gray-200 rounded-full overflow-hidden">
+          <div
+            class="h-full bg-gradient-to-r from-blue-400 to-purple-400 rounded-full w-3/5 animate-pulse"
+          ></div>
+        </div>
+
+        <div class="absolute top-3 right-3 w-2 h-2 bg-green-400 rounded-full animate-pulse"></div>
+        <div
+          class="absolute bottom-3 left-3 w-1.5 h-1.5 bg-blue-400 rounded-full animate-pulse"
+          style="animation-delay: 0.8s"
+        ></div>
+
+        <div
+          class="absolute left-0 top-4 bottom-4 w-0.5 bg-gradient-to-b from-transparent via-purple-300 to-transparent opacity-50"
+        ></div>
+        <div
+          class="absolute right-0 top-4 bottom-4 w-0.5 bg-gradient-to-b from-transparent via-blue-300 to-transparent opacity-50"
+        ></div>
+      </div>
+    </div>
+  </Draggable>
+</template>
+<script setup lang="ts">
+import { UseDraggable as Draggable } from '@vueuse/components'
+import { useWindowSize } from '@vueuse/core'
+
+const { width, height } = useWindowSize()
+const CONTAINER_WIDTH = 130,
+  CONTAINER_HEIGHT = 170,
+  GAP = 30
+
+const x = width.value - CONTAINER_WIDTH - GAP
+const y = height.value - CONTAINER_HEIGHT - GAP
+</script>

src/layoutCulture/components/postForm.tsx

+import { ArticleTypeEnum, ReleaseStatusEnum } from '@/constants'
+import UploadFile from '@/components/common/UploadFile/index.vue'
+import { useResetData } from '@/hooks'
+
+export default defineComponent((_, { expose }) => {
+  const [form] = useResetData({
+    title: '',
+    content: '',
+    faceUrl: '',
+    releaseStatus: ReleaseStatusEnum.PUBLISH,
+    type: ArticleTypeEnum.POST,
+  })
+  const formRef = ref<InstanceType<typeof ElForm>>()
+  const rules = {
+    title: [{ required: true, message: '请输入帖子标题', trigger: 'blur' }],
+    content: [{ required: true, message: '请输入帖子内容', trigger: 'blur' }],
+    faceUrl: [{ required: true, message: '请上传贴图', trigger: 'change' }],
+    releaseStatus: [{ required: true, message: '请选择发布时间', trigger: 'blur' }],
+  }
+
+  const validate = async () => {
+    try {
+      await formRef.value?.validate()
+      return form.value
+    } catch (error) {
+      console.log(error)
+      ElMessage.warning('请检查输入内容')
+      return null
+    }
+  }
+  expose({
+    validate,
+  })
+  return () => (
+    <div>
+      <el-form
+        ref={formRef}
+        model={form.value}
+        label-width="100px"
+        label-position="top"
+        rules={rules}
+      >
+        <el-form-item label="标题" prop="title">
+          <el-input
+            v-model={form.value.title}
+            placeholder="请输入帖子标题"
+            maxlength={30}
+            show-word-limit
+          />
+        </el-form-item>
+        <el-form-item label="内容" prop="content">
+          <el-input
+            v-model={form.value.content}
+            type="textarea"
+            placeholder="良言良语，快乐无限；恶语恶言，伤心伤肝。请简述发帖内容，或点击长文章编辑格式"
+            rows={6}
+            maxlength={255}
+            show-word-limit
+            class="content-input"
+          />
+        </el-form-item>
+        <el-form-item label="图片" prop="faceUrl">
+          {/* @ts-ignore */}
+          <UploadFile v-model={form.value.faceUrl} />
+        </el-form-item>
+        <el-form-item label="发布时间" prop="releaseStatus">
+          <el-radio-group v-model={form.value.releaseStatus} class="radio-group">
+            <el-radio value={ReleaseStatusEnum.PUBLISH} class="radio-item immediate">
+              立即发布
+            </el-radio>
+            <el-radio value={ReleaseStatusEnum.DRAFT} class="radio-item scheduled">
+              定时发布
+            </el-radio>
+          </el-radio-group>
+        </el-form-item>
+      </el-form>
+    </div>
+  )
+})

src/layoutCulture/components/practiceForm.tsx

+import { ArticleTypeEnum, ReleaseStatusEnum } from '@/constants'
+
+import UploadFile from '@/components/common/UploadFile/index.vue'
+import SelectTags from '@/components/common/SelectTags/index.vue'
+
+import { useResetData } from '@/hooks'
+
+export default defineComponent((_, { expose }) => {
+  const [form] = useResetData({
+    title: '',
+    content: '',
+    faceUrl: '',
+    releaseStatus: ReleaseStatusEnum.PUBLISH,
+    type: ArticleTypeEnum.PRACTICE,
+    mainTagId: '',
+    tagList: [],
+  })
+  const formRef = ref<InstanceType<typeof ElForm>>()
+  const rules = {
+    title: [{ required: true, message: '请输入帖子标题', trigger: 'blur' }],
+    content: [{ required: true, message: '请输入帖子内容', trigger: 'blur' }],
+    faceUrl: [{ required: true, message: '请上传贴图', trigger: 'change' }],
+    releaseStatus: [{ required: true, message: '请选择发布时间', trigger: 'blur' }],
+    mainTagId: [{ required: true, message: '请选择主标签', trigger: 'blur' }],
+  }
+
+  const transformForm = () => {
+    return {
+      ...form.value,
+      tagList: [form.value.mainTagId, ...form.value.tagList].map((tag, index) => {
+        return {
+          sort: index,
+          tagId: Number(tag),
+        }
+      }),
+    }
+  }
+
+  const validate = async () => {
+    try {
+      await formRef.value?.validate()
+      console.log(transformForm())
+      return transformForm()
+    } catch (error) {
+      console.log(error)
+      ElMessage.warning('请检查输入内容')
+      return null
+    }
+  }
+
+  const filterTagsFn = (allTags: { value: number; label: string }[]) => {
+    // 引用了form.value.mainTagId
+    return allTags.filter((tag) => tag.value !== Number(form.value.mainTagId))
+  }
+
+  expose({
+    validate,
+  })
+  return () => (
+    <div>
+      <el-form
+        ref={formRef}
+        model={form.value}
+        label-width="100px"
+        label-position="top"
+        rules={rules}
+      >
+        <el-form-item label="标题" prop="title">
+          <el-input
+            v-model={form.value.title}
+            placeholder="请输入实践标题"
+            maxlength={200}
+            show-word-limit
+          />
+        </el-form-item>
+        <el-form-item label="内容" prop="content">
+          <el-input
+            v-model={form.value.content}
+            type="textarea"
+            placeholder="分享你的企业文化实践实例"
+            rows={6}
+            maxlength={1000}
+            show-word-limit
+            class="content-input"
+          />
+        </el-form-item>
+        <el-form-item label="图片" prop="faceUrl">
+          {/* @ts-ignore */}
+          <UploadFile v-model={form.value.faceUrl} />
+        </el-form-item>
+        <el-form-item label="主标签" prop="mainTagId">
+          {/* @ts-ignore */}
+          <SelectTags v-model={form.value.mainTagId} />
+        </el-form-item>
+        <el-form-item label="副标签">
+          {/* @ts-ignore */}
+          <SelectTags
+            v-model={form.value.tagList}
+            maxSelectedTags={2}
+            filterTagsFn={filterTagsFn}
+          />
+        </el-form-item>
+        <el-form-item label="发布时间" prop="releaseStatus">
+          <el-radio-group v-model={form.value.releaseStatus} class="radio-group">
+            <el-radio value={ReleaseStatusEnum.PUBLISH} class="radio-item immediate">
+              立即发布
+            </el-radio>
+            <el-radio value={ReleaseStatusEnum.DRAFT} class="radio-item scheduled">
+              定时发布
+            </el-radio>
+          </el-radio-group>
+        </el-form-item>
+      </el-form>
+    </div>
+  )
+})

src/layoutCulture/components/publishDialog.vue

+<template>
+  <el-dialog
+    v-model="dialogVisible"
+    :title="dialogTitle"
+    :close-on-click-modal="false"
+    width="600px"
+    height="600px"
+    :show-close="false"
+    class="post-dialog"
+    align-center
+  >
+    <div class="bg-white/95 rounded-16px p-24px backdrop-blur-10px">
+      <keep-alive>
+        <component :is="currentFormComp" ref="formComponentRef" />
+      </keep-alive>
+
+      <!-- 底部按钮 -->
+      <div class="flex justify-end gap-12px mt-24px pt-20px border-t border-blue-100">
+        <button
+          @click.prevent="handleCancel"
+          class="bg-white/80 border-2 border-gray-200 text-gray-600 rounded-10px px-20px py-10px font-500 transition-all-300 hover:bg-white/90 hover:border-gray-300"
+        >
+          取消
+        </button>
+        <button
+          @click.prevent="handlePreview"
+          class="bg-white/80 border-2 border-blue-300 text-blue-500 rounded-10px px-20px py-10px font-500 transition-all-300 hover:bg-blue-50 hover:border-blue-500"
+        >
+          预览
+        </button>
+        <button
+          @click.prevent="handleSubmit"
+          class="cursor-pointer bg-gradient-to-r from-blue-400 to-cyan-400 border-none rounded-10px px-24px py-10px font-500 text-white transition-all-300 hover:transform hover:translate-y--2px hover:shadow-lg hover:shadow-blue-300"
+        >
+          发布
+        </button>
+      </div>
+    </div>
+  </el-dialog>
+</template>
+
+<script setup lang="ts">
+import type { Component } from 'vue'
+
+// 如果 你已经按需引入了 那么写 这个就会有css bug 所以 这里不写 就是你如果写这个的话 那么 他不会引入css
+// import { ElDialog } from 'element-plus'
+// import { Plus } from '@element-plus/icons-vue'
+import { addOrUpdateArticle } from '@/api'
+import { ArticleTypeEnum } from '@/constants'
+import PostForm from './postForm.tsx'
+import PracticeForm from './practiceForm.tsx'
+
+const typeMap: Record<ArticleTypeEnum, { title: string; component: Component }> = {
+  [ArticleTypeEnum.VIDEO]: {
+    title: '视频',
+    component: PostForm,
+  },
+  [ArticleTypeEnum.QUESTION]: {
+    title: '问题',
+    component: PostForm,
+  },
+  [ArticleTypeEnum.POST]: {
+    title: '帖子',
+    component: PostForm,
+  },
+  [ArticleTypeEnum.PRACTICE]: {
+    title: '实践',
+    component: PracticeForm,
+  },
+  [ArticleTypeEnum.COLUMN]: {
+    title: '专栏',
+    component: PostForm,
+  },
+  [ArticleTypeEnum.INTERVIEW]: {
+    title: '专访',
+    component: PostForm,
+  },
+}
+
+const dialogTitle = computed(() => '发布' + typeMap[articleType.value].title)
+
+const formComponentRef =
+  useTemplateRef<InstanceType<typeof PostForm | typeof PracticeForm>>('formComponentRef')
+
+const currentFormComp = computed(() => {
+  return typeMap[articleType.value].component
+})
+
+const dialogVisible = ref(false)
+
+const articleType = ref<ArticleTypeEnum>(ArticleTypeEnum.PRACTICE)
+
+// 打开弹窗
+const open = (type: ArticleTypeEnum) => {
+  articleType.value = type
+  dialogVisible.value = true
+}
+
+// 关闭弹窗
+const close = () => {
+  dialogVisible.value = false
+}
+
+// 事件处理
+const handleCancel = () => {
+  close()
+}
+
+const handlePreview = async () => {}
+
+const handleSubmit = async () => {
+  const formData = await formComponentRef.value?.validate()
+  if (!formData) return
+  console.log(formData)
+  await addOrUpdateArticle({
+    ...formData,
+  })
+  ElMessage.success('发布成功')
+  // 这里可以添加发布逻辑
+  close()
+}
+
+// 暴露方法给父组件
+defineExpose({
+  open,
+  close,
+})
+</script>

src/layoutCulture/index.vue

+<template>
+  <div class="layout-culture pb-11 h-full bg-[linear-gradient(to_bottom,#F0FBFD_0%,#ECEFFF_100%)]">
+    <div
+      class="header flex px-40 items-center justify-between bg-white mb-1 shadow-sm fixed top-0 left-0 right-0 z-10"
+    >
+      <!-- Logo区域 -->
+      <div @click="router.push('/')" class="flex items-center flex-shrink-0 min-w-0 cursor-pointer">
+        <img
+          class="h-10 mr-3 object-contain flex-shrink-0 sm:h-10 sm:mr-4"
+          src="http://soundasia.oss-cn-shenzhen.aliyuncs.com/OA/2022/10/13/1665643779583.png"
+          alt=""
+        />
+      </div>
+
+      <div class="flex items-center">
+        <!-- 搜索框 -->
+        <div class="flex-1 max-w-sm mx-4 hidden md:block lg:max-w-md lg:mx-6">
+          <el-input v-model="search" class="h-8" placeholder="搜索">
+            <template #prefix>
+              <el-icon class="text-gray-400">
+                <Search />
+              </el-icon>
+            </template>
+          </el-input>
+        </div>
+        <!-- 右侧菜单 -->
+        <div class="flex items-center gap-1 flex-shrink-0 sm:gap-2 lg:gap-4">
+          <div
+            class="flex items-center cursor-pointer px-2 py-1 rounded transition-colors sm:px-3 sm:py-2 hover:shadow-lg duration-200"
+            @click="router.push('/userPage')"
+          >
+            <img
+              class="w-8 h-8 object-contain flex-shrink-0"
+              src="@/assets/img/culture/avatar_girl.png"
+              alt="个人中心"
+            />
+            <span class="ml-2 text-sm text-gray-700 whitespace-nowrap hidden lg:inline"
+              >个人中心</span
+            >
+          </div>
+          <div
+            class="flex items-center cursor-pointer px-2 py-1 rounded sm:px-3 sm:py-2 hover:shadow-lg duration-200"
+          >
+            <img
+              class="w-8 h-8 object-contain flex-shrink-0"
+              src="@/assets/img/culture/feedback.png"
+              alt=""
+            />
+            <span class="ml-2 text-sm text-gray-700 whitespace-nowrap hidden lg:inline"
+              >意见反馈</span
+            >
+          </div>
+          <el-dropdown placement="top-start" @command="handlePost">
+            <button
+              class="cursor-pointer w-24 h-9 text-black hover:text-black bg-[linear-gradient(to_right,#B3B8FD_0%,#7083FF_100%)] border-none hover:shadow-[0_1px_8px_0_rgba(95,0,237,0.25)] duration-200 flex-1 text-xs sm:text-sm rounded-xl group"
+            >
+              <img
+                class="h-7 w-7 transition-transform duration-300 ease-in-out group-hover:rotate-90"
+                src="@/assets/img/culture/post.png"
+                alt=""
+              />
+              去发帖
+            </button>
+            <template #dropdown>
+              <el-dropdown-menu>
+                <el-dropdown-item :command="ArticleTypeEnum.POST" class="group"
+                  >帖子</el-dropdown-item
+                >
+                <el-dropdown-item :command="ArticleTypeEnum.PRACTICE" class="group"
+                  >实践</el-dropdown-item
+                >
+                <el-dropdown-item :command="ArticleTypeEnum.COLUMN" class="group"
+                  >专栏</el-dropdown-item
+                >
+                <el-dropdown-item :command="ArticleTypeEnum.INTERVIEW" class="group"
+                  >专访</el-dropdown-item
+                >
+              </el-dropdown-menu>
+            </template>
+          </el-dropdown>
+        </div>
+      </div>
+    </div>
+    <div class="flex-1 w-full flex items-center justify-center">
+      <div class="container max-h-none px-20 lg:px-20 2xl:px-30 transition-all duration-300">
+        <router-view v-slot="{ Component, route }">
+          <transition name="fade" mode="out-in">
+            <!-- 注释不能放到keep-alive下面 route是最终的路由信息 Component是当前n级路由的组件 二级路由 MainContainer videoDetail -->
+            <keep-alive>
+              <component :is="Component" :key="getSecondLevelKey(route)" />
+            </keep-alive>
+          </transition>
+        </router-view>
+      </div>
+    </div>
+  </div>
+  <OnlineTime />
+  <PublishDialog ref="PublishDialogRef" />
+  <!-- <el-dialog v-model="show" title="11">
+    <div>1111111111111111</div>
+  </el-dialog> -->
+</template>
+
+<script setup lang="tsx" name="CultureLayout">
+import { Search } from '@element-plus/icons-vue'
+import OnlineTime from './components/onlineTime.vue'
+import type { RouteLocationNormalizedLoadedGeneric } from 'vue-router'
+import PublishDialog from './components/publishDialog.vue'
+import { ArticleTypeEnum } from '@/constants'
+
+const router = useRouter()
+const search = ref('')
+const PublishDialogRef = useTemplateRef<InstanceType<typeof PublishDialog>>('PublishDialogRef')
+
+// 获取二级路由的 key
+const getSecondLevelKey = (route: RouteLocationNormalizedLoadedGeneric) => {
+  // 取第一级作为key mainContainer
+  const pathSegments = route.path.split('/').filter(Boolean)
+  // console.log(route)
+  // console.log(pathSegments)
+  // 如果有params 则取params的id
+  const key = Object.keys(route.params).length
+    ? pathSegments.slice(0, 2).join('/')
+    : pathSegments.slice(0, 1).join('/')
+  return key
+}
+
+const handlePost = async (type: string) => {
+  // router.push(command)
+  PublishDialogRef.value?.open(type)
+}
+</script>
+<style lang="scss" scoped>
+.layout-culture {
+  padding-top: 52px;
+  .header {
+    min-height: 52px;
+    color: #212121;
+    background-color: #fff;
+    background-image: url('@/assets/img/culture/header_bg.png');
+    background-size: 100% 100%;
+    background-repeat: no-repeat;
+  }
+  .container {
+    .main-container {
+      .tabs-container {
+        background: linear-gradient(90deg, #16cdea 0%, #d680ff 100%);
+      }
+      .right {
+        .common-box {
+          padding: 15px;
+          background-color: #f8f8fa;
+          border-radius: 10px;
+          border: 1px solid #efe7dc;
+        }
+        .common-btn {
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          background: linear-gradient(to right, #efe7dc 0%, #efe7dc 100%);
+          border: 1px solid #767676;
+          color: #000;
+          border-radius: 10px;
+          cursor: pointer;
+          transition: all 0.3s;
+        }
+      }
+    }
+  }
+}
+
+.fade-enter-from,
+.fade-leave-to {
+  opacity: 0;
+  transform: translateY(10px);
+}
+.fade-enter-active,
+.fade-leave-active {
+  transition: all 0.3s ease;
+}
+</style>

src/main.ts

-import './assets/main.css'
-
 import { createApp } from 'vue'
 import { createPinia } from 'pinia'
 
 import App from './App.vue'
 import router from './router'
 
-const app = createApp(App)
+import './style/index.css'
+
+import 'virtual:uno.css'
 
+// 注册svg
+import 'virtual:svg-icons-register'
+import SvgIcon from '@/components/common/SvgIcon/svgIcon.vue'
+import * as ElementPlusIconsVue from '@element-plus/icons-vue'
+const app = createApp(App)
 app.use(createPinia())
 app.use(router)
-
+for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
+  app.component(key, component)
+}
+// 全局组件挂载
+app.component('SvgIcon', SvgIcon)
 app.mount('#app')

src/router/index.ts

 import { createRouter, createWebHistory } from 'vue-router'
-import HomeView from '../views/HomeView.vue'
+import layoutCulture from '@/layoutCulture/index.vue'
+const routes = [
+  {
+    path: '/',
+    name: 'Layout',
+    component: layoutCulture,
+    redirect: '/mainContainer/deshboard',
+    meta: {
+      title: '企业文化首页',
+    },
+    children: [
+      {
+        path: 'mainContainer',
+        name: 'CultureMainContainer',
+        component: () => import('@/layoutCulture/components/mainContainer.vue'),
+        children: [
+          {
+            path: 'deshboard',
+            name: 'CultureHome',
+            component: () => import('@/views/home/index.vue'),
+          },
+          {
+            path: 'ya',
+            name: 'CultureYa',
+            component: () => import('@/views/ya/index.vue'),
+          },
+          {
+            path: 'ask',
+            name: 'CultureAsk',
+            component: () => import('@/views/ask/index.vue'),
+          },
+        ],
+      },
+      {
+        path: 'videoDetail/:',
+        name: 'CultureVideoDetail',
+        component: () => import('@/views/videoDetail/index.vue'),
+      },
+      {
+        path: 'pointsStore',
+        name: 'CulturePointsStore',
+        component: () => import('@/views/pointsStore/index.vue'),
+      },
+      {
+        path: 'postDetail/:articleId',
+        name: 'CulturePostDetail',
+        component: () => import('@/views/postDetail/index.vue'),
+      },
+      // 发布视频
+      {
+        path: 'publishVideo',
+        name: 'CulturePublishVideo',
+        component: () => import('@/views/publishVideo/index.vue'),
+      },
+      // 发布文章
+      {
+        path: 'postArticle',
+        name: 'CulturePostArticle',
+        component: () => import('@/views/postArticle/index.vue'),
+      },
+      // 个人中心
+      {
+        path: 'userPage',
+        name: 'CultureUserPage',
+        component: () => import('@/views/userPage/index.vue'),
+      },
+      // 发布文章
+      // {
+      // {
+      //   path: 'deshboard',
+      //   name: 'CultureHome',
+      //   component: () => import('@/views/home/index.vue')
+      // },
+      // {
+      //   path: 'ya',
+      //   name: 'CultureYa',
+      //   component: () => import('@/views/ya/index.vue')
+      // },
+      // {
+      //   path: 'ask',
+      //   name: 'CultureAsk',
+      //   component: () => import('@/views/ask/index.vue')
+      // }
+    ],
+  },
+]
+
+const scrollPositionMap = new Map<string, number>()
 
 const router = createRouter({
   history: createWebHistory(import.meta.env.BASE_URL),
-  routes: [
-    {
-      path: '/',
-      name: 'home',
-      component: HomeView,
-    },
-    {
-      path: '/about',
-      name: 'about',
-      // route level code-splitting
-      // this generates a separate chunk (About.[hash].js) for this route
-      // which is lazy-loaded when the route is visited.
-      component: () => import('../views/AboutView.vue'),
-    },
-  ],
+  routes,
+  scrollBehavior(to, from, savedPosition) {
+    return new Promise((resolve) => {
+      // console.log(to, from, savedPosition)
+      // 如果有浏览器保存的位置（前进/后退），优先使用
+      if (savedPosition) {
+        resolve(savedPosition)
+        return
+      }
+
+      // 如果有锚点，滚动到锚点
+      if (to.hash) {
+        resolve({ el: to.hash })
+        return
+      }
+
+      // 检查是否有保存的滚动位置
+      const savedScrollY = scrollPositionMap.get(to.fullPath)
+      if (savedScrollY !== undefined) {
+        resolve({ top: savedScrollY })
+        return
+      }
+
+      // 默认滚动到顶部
+      resolve({ top: 0 })
+    })
+  },
+})
+// 在路由离开前保存当前滚动位置
+router.beforeEach((to, from, next) => {
+  // 保存当前页面的滚动位置
+  if (from.fullPath) {
+    scrollPositionMap.set(from.fullPath, window.scrollY)
+  }
+  next()
 })
 
 export default router

src/store/index.ts

+import { createPinia } from 'pinia'
+import type { App } from 'vue'
+
+const store = createPinia()
+export default store
+
+export function setupStore(app: App) {
+  app.use(store)
+}
+
+export * from './modules/user'
+export * from './modules/device'
+export * from './modules/app'
+export * from './modules/post'
+export * from './modules/emoji'

src/store/modules/app.ts

+import { localCache } from '@/utils/storage'
+import { defineStore } from 'pinia'
+import type { RouteLocationNormalized } from 'vue-router'
+
+type ICallbackType = (...args: any[]) => any
+
+export const useAppStore = defineStore('app', {
+  id: 'app',
+  state: () => {
+    return {
+      // 上一级路由
+      lastRoute: {} as RouteLocationNormalized,
+
+      // 移动端下拉刷新 0不显示  1下拉中 2准备刷新  3 刷新中 4 刷新完成
+      refreshStatus: 0,
+
+      // 移动端是否弹出键盘
+      isShowKeyBoard: false,
+
+      // 记忆页面滚动位置,key:页面地址 value:Y轴滚动
+      cacheScrollPage: {} as { [key: string]: number },
+
+      // 应用内是否存在全局覆盖层，如果存在，返回上一级改成退出全局覆盖层
+      // 如：图片预览，评论弹窗
+      fullScreenInstance: {
+        state: 0,
+        instance: null, // 打开的示例
+        close: undefined as ICallbackType | undefined, // 关闭方法
+        curUrl: '', // 页面Url
+      },
+
+      // 上一次公告弹出时间
+      announcementTime: 0,
+    }
+  },
+  actions: {
+    updateLastRoute(route: RouteLocationNormalized) {
+      this.lastRoute = route
+    },
+
+    updateRefreshStatus(status: number) {
+      this.refreshStatus = status
+    },
+
+    //软键盘收起的事件处理
+    handleShowKeyBoard(device = '') {
+      // ios处理
+      if (device === 'ios') {
+        document.body.addEventListener('focusin', () => {
+          this.isShowKeyBoard = true
+        })
+        document.body.addEventListener('focusout', () => {
+          this.isShowKeyBoard = false
+        })
+      } else if (device === 'android') {
+        const originalHeight = document.documentElement.clientHeight || document.body.clientHeight
+        window.onresize = () => {
+          //键盘弹起与隐藏都会引起窗口的高度发生变化
+          const resizeHeight = document.documentElement.clientHeight || document.body.clientHeight
+          if (resizeHeight - 0 < originalHeight - 0) {
+            this.isShowKeyBoard = true
+          } else {
+            this.isShowKeyBoard = false
+          }
+        }
+      }
+    },
+
+    /**
+     * 页面滚动位置
+     */
+    setScrollPage(url: string, top: number) {
+      this.cacheScrollPage[url] = top
+    },
+    getScrollPage(url: string) {
+      return this.cacheScrollPage[url]
+    },
+
+    /**
+     * 全局覆盖层
+     * @returns 返回false，说明 不要返回上一页，而是关闭全局覆盖层
+     */
+    closeFullScreen() {
+      if (this.fullScreenInstance.state) {
+        this.fullScreenInstance.close && this.fullScreenInstance.close()
+
+        this.clearFullScreenInstance()
+        return false
+      }
+      return true
+    },
+    // 清除全屏模态框实例
+    clearFullScreenInstance() {
+      this.fullScreenInstance = {
+        state: 0,
+        curUrl: '',
+        instance: null,
+        close: undefined,
+      }
+    },
+    // 插入全屏模态框示例
+    updateFullScreenInstance(curUrl: string, instance: any, closeCallback: any) {
+      this.fullScreenInstance = {
+        state: 1,
+        instance,
+        curUrl,
+        close: closeCallback,
+      }
+    },
+
+    /**
+     * 公告时间
+     */
+    showAnnouncement() {
+      localCache.setCache('announcementTime', Date.now())
+    },
+    getAnnouncement() {
+      this.announcementTime = localCache.getCache<number>('announcementTime') || 0
+      return this.announcementTime
+    },
+  },
+})

src/store/modules/device.ts

+import { checkUserAgent } from '@/utils/app'
+import { defineStore } from 'pinia'
+
+export const useDeviceStore = defineStore({
+  id: 'device',
+  state: () => {
+    return {
+      device: '',
+      isPc: false,
+
+      AndroidOrIphone: ''
+    }
+  },
+  actions: {
+    updateDevice(device: string) {
+      this.device = device
+      console.log(['sm', 'md'].indexOf(device) === -1)
+      // this.updateDeviceType(['sm','md'].indexOf(device) === -1)
+    },
+    updateDeviceType(isPc: boolean) {
+      this.isPc = isPc
+    },
+
+    // 判断设备
+    handleUserAgent() {
+      this.AndroidOrIphone = checkUserAgent()
+    }
+  }
+})

src/store/modules/emoji.ts

+/**
+ * 表情相关的 缓存
+ */
+import { defineStore } from 'pinia'
+
+export interface IEmoji {
+  url: string
+  name: string
+  group: string
+  className: string
+}
+interface IEmojiObj {
+  [name: string]: IEmoji
+}
+interface IGroupEmojy {
+  [groupName: string]: IEmojiObj
+}
+export const useEmojiStore = defineStore({
+  id: 'emoji',
+  state: () => {
+    return {
+      emoji: {} as IGroupEmojy
+    }
+  },
+  actions: {
+    /**
+     * 获取emojy标签
+     */
+    async getEmojiUrl(name: string, group: string) {
+      if (this.emoji[group]) {
+        return this.emoji[group][name]
+      }
+      const data = await this.generateEmojiGroup(group)
+      if (!data) {
+        return
+      }
+      this.emoji[group] = data
+
+      return this.emoji[group][name]
+    },
+
+    async generateEmojiGroup(group: string): Promise<IEmojiObj | null> {
+      let jsonData
+
+      // 这里必须这样写，否则vite打包，会导致这个找不到文件
+      if (group === 'face') {
+        jsonData = (await import(`../../utils/emoji/face.json`)) as { default: IEmoji[] }
+      }
+
+      if (!jsonData) return null
+      const obj: IEmojiObj = {}
+      jsonData.default.forEach(v => {
+        obj[v.name] = v
+      })
+      return obj
+    }
+  }
+})

src/store/modules/post.ts

+/**
+ * 帖子相关的 缓存
+ */
+import {
+  type IOfficialTagList,
+  type IPostType,
+  type IShieldType,
+  getColleagueTagList,
+  getPostType,
+  getShieldTypeList,
+} from '@/api'
+import { localCache } from '@/utils/storage'
+import { defineStore } from 'pinia'
+
+interface ICachePostTime {
+  [id: string]: number
+}
+export const usePostStore = defineStore({
+  id: 'post',
+  state: () => {
+    return {
+      // 缓存上一次查看帖子的时间
+      cachePostTime: {} as { [id: string]: number },
+
+      // 分类数据
+      typeData: [] as IPostType[],
+      // 已屏蔽的分类
+      shieldTypeData: [] as IShieldType[],
+
+      // 官方标签
+      tagData: [] as IOfficialTagList[],
+    }
+  },
+  actions: {
+    /**
+     * 页面滚动位置
+     */
+    setPostTime(id: string, number: number) {
+      this.cachePostTime[id] = number
+      localCache.setCache('post_time', this.cachePostTime, 1000 * 60 * 60 * 48)
+    },
+    getPostTime(id: string) {
+      if (this.cachePostTime[id]) {
+        return this.cachePostTime[id]
+      }
+      const time = localCache.getCache<ICachePostTime>('post_time')
+      if (time) {
+        return time[id]
+      }
+      return undefined
+    },
+
+    /**
+     * 分类获取
+     */
+    async queryPostType() {
+      if (this.typeData.length > 0) {
+        return this.typeData
+      }
+      const res = await getPostType()
+      this.typeData = res.data
+      return this.typeData
+    },
+    /**
+     * 获取屏蔽帖子分类列表
+     * @param isFresh 是否强制刷新
+     */
+    async queryShieType(isFresh = false) {
+      if (!isFresh && this.shieldTypeData.length > 0) {
+        return this.shieldTypeData
+      }
+      const res = await getShieldTypeList()
+      this.shieldTypeData = res.data
+      return this.shieldTypeData
+    },
+
+    /**
+     * 标签获取
+     */
+    async queryOfficialTag() {
+      if (this.tagData.length > 0) {
+        return this.tagData
+      }
+      const res = await getColleagueTagList()
+      this.tagData = res.data
+      return this.tagData
+    },
+  },
+})

src/store/modules/user.ts

+import { defineStore } from 'pinia'
+import { localCache } from '@/utils/storage'
+import {
+  getChatPeople,
+  getPendingReviewCount,
+  getUserByCode,
+  type IPendingCountMap,
+  type IUserInfo,
+} from '@/api'
+
+export const useUserStore = defineStore({
+  id: 'user',
+  state: () => {
+    return {
+      id: '',
+      name: '',
+      isManager: false,
+      isOfficial: false, // 是否官方
+      userInfo: {} as IUserInfo,
+      expireTime: 0, // 过期时间
+
+      // 私信：消息维度
+      unReadNotice: 0,
+
+      // 管理员未处理数量
+      unDoneNum: {} as IPendingCountMap,
+
+      // 是否已被封禁
+      isBanned: false,
+
+      // 没有权限名单
+      // noAuthList: ['yuxueqin']
+      noAuthList: [] as string[],
+    }
+  },
+  getters: {
+    getUserInfo(state) {
+      if (state.userInfo && Object.keys(state.userInfo).length) return state.userInfo
+      const userInfo = localCache.getCache<IUserInfo>('userInfo')
+      if (userInfo) {
+        state.userInfo = userInfo
+        state.id = userInfo.userId
+        state.name = userInfo.username
+        state.isManager = userInfo.hasManagerBtn
+        state.isBanned = !!userInfo.isBan
+        state.isOfficial = !!userInfo.isOfficialAccount
+      }
+      return userInfo
+    },
+    getExpireTime(state) {
+      if (state.expireTime) return state.expireTime
+      const expireTime = localCache.getCache<number>('expireTime')
+      if (expireTime) {
+        state.expireTime = expireTime
+      }
+      return expireTime
+    },
+
+    isNoAuth(state) {
+      return state.noAuthList.includes(state.userInfo.account)
+    },
+
+    manageArea(state) {
+      return (state.userInfo.manageArea || '').split(',') || []
+    },
+  },
+  actions: {
+    // 判断是否拥有管理权限，传入地区，不传则不判断地区
+    hasManagerPermission(area?: string) {
+      if (!this.isManager) return false
+      if (area) {
+        return this.manageArea.includes(area)
+      }
+      return true
+    },
+
+    setUserInfo(userInfo: IUserInfo) {
+      const expireTime = Date.now() + 3600 * 1000 * 24 * 4 // 4个小时
+      this.id = userInfo.userId
+      this.name = userInfo.username
+      this.isManager = userInfo.hasManagerBtn
+      this.isOfficial = !!userInfo.isOfficialAccount
+      this.isBanned = !!userInfo.isBan
+      this.userInfo = userInfo
+      this.expireTime = expireTime
+      localCache.setCache('userInfo', userInfo)
+      localCache.setCache('expireTime', expireTime)
+    },
+
+    /**
+     * 通过code获取用户数据
+     * @param isCodeLogin code来自系统生成还是企业微信 0 来自企业微信，1来自系统生成,默认来自企业微信
+     */
+    async getUserInfoByCode(code: string, isCodeLogin: number = 0, cutEmail?: string) {
+      try {
+        const res = await getUserByCode(code, isCodeLogin, cutEmail)
+        this.setUserInfo(res.data)
+      } catch (error) {
+        return Promise.reject(error)
+      }
+    },
+
+    // 获取未读消息
+    async refreshNoticeStatus() {
+      const res = await getChatPeople()
+      this.unReadNotice = res.data.dialogList.reduce((pre, cur) => {
+        return cur.un_read_count + pre
+      }, 0)
+    },
+
+    // 获取管理员未处理数量
+    async getPendingReviewCount() {
+      if (!this.isManager) return
+      const res = await getPendingReviewCount()
+      const obj: IPendingCountMap = {}
+      res.data.forEach((v) => {
+        if (v.type === 1) {
+          obj.auditCount = v
+        } else if (v.type === 2) {
+          obj.topCount = v
+        } else if (v.type === 3) {
+          obj.reportCount = v
+        } else if (v.type === 4) {
+          obj.unbanCount = v
+        }
+      })
+      this.unDoneNum = obj
+    },
+  },
+})

src/stores/tags.ts

+import { defineStore } from 'pinia'
+
+import { getTagList } from '@/api'
+
+/**
+ * 关于标签的store
+ */
+export const useTagsStore = defineStore('tags', () => {
+  const tagList = ref<{ label: string; value: number }[]>([])
+
+  const fetchTagList = async () => {
+    const { data } = await getTagList()
+    tagList.value = data.map((item) => ({
+      label: item.title,
+      value: item.id,
+    }))
+  }
+
+  return { tagList, fetchTagList }
+})

src/stores/user.ts

+import { defineStore } from 'pinia'
+import { loginByEmail } from '@/api/login'
+import type { LoginResponseDto } from '@/api/login/types'
+/**
+ * 关于用户的store
+ */
+export const useUserStore = defineStore('user', () => {
+  const userInfo = ref({} as LoginResponseDto)
+  const token = ref('')
+  // 获取用户信息
+  const fetchUserInfo = async () => {
+    const { data } = await loginByEmail({
+      email: 'lijiabin@yswg.com.cn',
+      password: 'Lijiabin123.',
+    })
+    setUserInfo(data)
+  }
+  const setUserInfo = (info: LoginResponseDto) => {
+    userInfo.value = info
+  }
+  const setToken = (str: string) => {
+    token.value = str
+  }
+
+  return { userInfo, token, fetchUserInfo, setUserInfo, setToken }
+})

src/style/index.css

+@import './reset.css';

src/style/reset.css

+/* reset.css — 现代通用重置样式
+   主要目标：统一浏览器差异、消除默认间距、设置可访问性 & 基础布局 */
+
+/* 1. 全局 box-sizing 统一为 border-box（更直观的盒模型） */
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+}
+
+/* 2. 清除默认 margin/padding，并设置常用字体行为 */
+html,
+body,
+div,
+span,
+applet,
+object,
+iframe,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+blockquote,
+pre,
+a,
+abbr,
+acronym,
+address,
+big,
+cite,
+code,
+del,
+dfn,
+em,
+img,
+ins,
+kbd,
+q,
+s,
+samp,
+small,
+strike,
+strong,
+sub,
+sup,
+tt,
+var,
+b,
+u,
+i,
+center,
+dl,
+dt,
+dd,
+ol,
+ul,
+li,
+fieldset,
+form,
+label,
+legend,
+table,
+caption,
+tbody,
+tfoot,
+thead,
+tr,
+th,
+td,
+article,
+aside,
+canvas,
+details,
+embed,
+figure,
+figcaption,
+footer,
+header,
+hgroup,
+menu,
+nav,
+output,
+ruby,
+section,
+summary,
+time,
+mark,
+audio,
+video {
+  margin: 0;
+  padding: 0;
+  border: 0;
+  vertical-align: baseline;
+  background: transparent;
+  font: inherit;
+  color: inherit;
+}
+
+/* 3. 基础 html / body */
+html {
+  /* 便于使用 rem，默认 16px 可按需改 */
+  font-size: 16px;
+  -webkit-text-size-adjust: 100%; /* 防止移动端字体被放大 */
+  -webkit-tap-highlight-color: transparent;
+}
+
+body {
+  line-height: 1.5;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  background-color: #fff;
+  color: #111;
+  min-width: 320px;
+}
+
+/* 4. 语义块级元素默认 display（HTML5 元素兼容老浏览器） */
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+menu,
+nav,
+section {
+  display: block;
+}
+
+/* 5. 列表与文本 */
+ol,
+ul {
+  list-style: none;
+}
+
+blockquote,
+q {
+  quotes: none;
+}
+blockquote::before,
+blockquote::after,
+q::before,
+q::after {
+  content: '';
+  content: none;
+}
+
+/* 6. 表格 */
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+
+/* 7. 图片和媒体：响应式并避免默认边距 */
+img,
+picture,
+video,
+canvas,
+svg {
+  display: inline-block;
+  max-width: 100%;
+  height: auto;
+  vertical-align: middle;
+}
+
+/* 8. 链接与按钮去除默认样式（保留键盘可聚焦） */
+a {
+  color: inherit;
+  text-decoration: none;
+  cursor: pointer;
+}
+button,
+input,
+select,
+textarea {
+  font: inherit;
+  color: inherit;
+  background: none;
+  border: none;
+  padding: 0;
+  margin: 0;
+  outline: none;
+}
+
+/* 9. 可访问性：聚焦时的明显样式（保留默认可视焦点） */
+
+/* 10. 表单元素修复（带平台差异） */
+button {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+  background-color: transparent;
+}
+input::-ms-clear,
+input::-ms-reveal {
+  display: none;
+}
+input[type='number']::-webkit-outer-spin-button,
+input[type='number']::-webkit-inner-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+}
+
+/* 11. placeholder 样式轻微淡化 */
+::placeholder {
+  color: #9aa0a6;
+  opacity: 1;
+}
+
+/* 12. 禁用选择/拖动（按需开启） */
+/* user-select: none; */
+/* img, svg { user-drag: none; } */
+
+/* 13. 视觉辅助：隐藏但对屏幕阅读器可见（sr-only） */
+.sr-only {
+  position: absolute !important;
+  width: 1px !important;
+  height: 1px !important;
+  padding: 0 !important;
+  margin: -1px !important;
+  overflow: hidden !important;
+  clip: rect(0, 0, 0, 0) !important;
+  white-space: nowrap !important;
+  border: 0 !important;
+}
+
+/* 14. 打印优化（可按需扩展） */
+@media print {
+  *,
+  *::before,
+  *::after {
+    background: transparent !important;
+    color: #000 !important;
+    box-shadow: none !important;
+    text-shadow: none !important;
+  }
+  a,
+  a:visited {
+    text-decoration: underline;
+    color: #000;
+  }
+}
+
+/* 15. 小屏幕触控优化（按钮和链接点击区域） */
+button,
+a {
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0.05);
+}
+
+/* 16. 可选：页面根级便捷变量（按需启用） */
+/*
+  :root {
+    --font-sans: "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft Yahei", sans-serif;
+    --content-max-width: 1200px;
+  }
+  */
+
+/* End of reset.css */

src/test.tsx

+export default function Test() {
+  return <el-button>测试</el-button>
+}

src/utils/app.ts

+/**
+ * 页面改变标题
+ * @param title
+ */
+export function changeAppTitle(title: string) {
+  document.title = title
+}
+
+/**
+ * 判断设备，判断是 ios 还是 安卓
+ */
+export function checkUserAgent() {
+  const agent = navigator.userAgent
+  const isAndroid = agent.indexOf('Android') > -1 || agent.indexOf('Linux') > -1
+  const isIOS = !!agent.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)
+  if (isAndroid) {
+    return 'android'
+  }
+  if (isIOS) {
+    return 'ios'
+  }
+  return ''
+}
+
+/**
+ * 判断设备，判断是 移动端 还是 PC端
+ */
+export function isMoible() {
+  const UA = navigator.userAgent
+
+  if (window.innerWidth < 500) {
+    return true
+  }
+
+  return !!/(Android|webOS|iPhone|iPod|tablet|BlackBerry|Mobile)/i.test(UA)
+}
+
+/**
+ * 将颜色转成 rgb 的 三个数字，逗号分割
+ * @param {*} hex 颜色
+ * @returns  255,255,255
+ */
+export function hexToRgb(hex: string) {
+  // 去除可能包含的 # 符号
+  hex = hex.replace(/^#/, '')
+
+  // 将 HEX 转换为 RGB
+  const bigint = parseInt(hex, 16)
+  const r = (bigint >> 16) & 255
+  const g = (bigint >> 8) & 255
+  const b = bigint & 255
+
+  // 返回 RGB 格式的颜色
+  return `${r}, ${g}, ${b}`
+}
+
+// 当前路径是否是企业文化
+export function isCulturePath() {
+  const path = window.location.pathname
+  return path.includes('/culture')
+}

src/utils/emoji/face.json

+[
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f600.png",
+    "name": "face_嘿嘿",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f603.png",
+    "name": "face_哈哈",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f604.png",
+    "name": "face_大笑",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f601.png",
+    "name": "face_嘻嘻",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f606.png",
+    "name": "face_斜眼笑",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f605.png",
+    "name": "face_苦笑",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f923.png",
+    "name": "face_笑得满地打滚",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f602.png",
+    "name": "face_笑哭了",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f642.png",
+    "name": "face_呵呵",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f643.png",
+    "name": "face_倒脸",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f609.png",
+    "name": "face_眨眼",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f60a.png",
+    "name": "face_羞涩微笑",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f607.png",
+    "name": "face_微笑天使",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f970.png",
+    "name": "face_喜笑颜开",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f60d.png",
+    "name": "face_花痴",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f929.png",
+    "name": "face_好崇拜哦",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f617.png",
+    "name": "face_亲亲",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f61a.png",
+    "name": "face_羞涩亲亲",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f619.png",
+    "name": "face_微笑亲亲",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f60b.png",
+    "name": "face_好吃",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f61b.png",
+    "name": "face_吐舌",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f61c.png",
+    "name": "face_单眼吐舌",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f92a.png",
+    "name": "face_滑稽",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f911.png",
+    "name": "face_发财",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f917.png",
+    "name": "face_抱抱",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f92d.png",
+    "name": "face_不说",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f92b.png",
+    "name": "face_安静的脸",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f914.png",
+    "name": "face_想一想",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f910.png",
+    "name": "face_闭嘴",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f928.png",
+    "name": "face_挑眉",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f610.png",
+    "name": "face_冷漠",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f611.png",
+    "name": "face_无语",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f636.png",
+    "name": "face_沉默",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f60f.png",
+    "name": "face_得意",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f612.png",
+    "name": "face_不高兴",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f644.png",
+    "name": "face_翻白眼",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f62c.png",
+    "name": "face_龇牙咧嘴",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f925.png",
+    "name": "face_说谎",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f60c.png",
+    "name": "face_松了口气",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f614.png",
+    "name": "face_沉思",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f62a.png",
+    "name": "face_困",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f634.png",
+    "name": "face_睡着了",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f637.png",
+    "name": "face_感冒",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f912.png",
+    "name": "face_发烧",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f915.png",
+    "name": "face_受伤",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f922.png",
+    "name": "face_恶心",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f92e.png",
+    "name": "face_呕吐",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f975.png",
+    "name": "face_脸发烧",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f976.png",
+    "name": "face_冷脸",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f974.png",
+    "name": "face_头昏眼花",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f92f.png",
+    "name": "face_爆炸头",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f920.png",
+    "name": "face_牛仔帽脸",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f973.png",
+    "name": "face_聚会笑脸",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f60e.png",
+    "name": "face_墨镜笑脸",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f913.png",
+    "name": "face_书呆子脸",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f9d0.png",
+    "name": "face_带单片眼镜的脸",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f615.png",
+    "name": "face_困扰",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f641.png",
+    "name": "face_微微不满",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/2639-fe0f.png",
+    "name": "face_不满",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f62f.png",
+    "name": "face_缄默",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f632.png",
+    "name": "face_震惊",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f633.png",
+    "name": "face_脸红",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f97a.png",
+    "name": "face_恳求的脸",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f626.png",
+    "name": "face_啊",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f627.png",
+    "name": "face_极度痛苦",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f628.png",
+    "name": "face_害怕",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f630.png",
+    "name": "face_冷汗",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f625.png",
+    "name": "face_失望但如释重负",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f622.png",
+    "name": "face_哭",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f62d.png",
+    "name": "face_放声大哭",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f631.png",
+    "name": "face_吓死了",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f616.png",
+    "name": "face_困惑",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f61e.png",
+    "name": "face_失望",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f613.png",
+    "name": "face_汗",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f629.png",
+    "name": "face_累死了",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f62b.png",
+    "name": "face_累",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f971.png",
+    "name": "face_打呵欠",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f624.png",
+    "name": "face_傲慢",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f621.png",
+    "name": "face_怒火中烧",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f620.png",
+    "name": "face_生气",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f92c.png",
+    "name": "face_嘴上有符号的脸",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f608.png",
+    "name": "face_恶魔微笑",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f47f.png",
+    "name": "face_生气的恶魔",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f480.png",
+    "name": "face_头骨",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/2620-fe0f.png",
+    "name": "face_骷髅",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f4a9.png",
+    "name": "face_大便",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f921.png",
+    "name": "face_小丑脸",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f479.png",
+    "name": "face_食人魔",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f47a.png",
+    "name": "face_小妖精",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f47b.png",
+    "name": "face_鬼",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f47d.png",
+    "name": "face_外星人",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f47e.png",
+    "name": "face_外星怪物",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f916.png",
+    "name": "face_机器人",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f63a.png",
+    "name": "face_大笑的猫",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f639.png",
+    "name": "face_笑出眼泪的猫",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f63b.png",
+    "name": "face_花痴的猫",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f63c.png",
+    "name": "face_奸笑的猫",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f63d.png",
+    "name": "face_亲亲猫",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f640.png",
+    "name": "face_疲倦的猫",
+    "group": "face",
+    "className": "emoji_small"
+  },
+  {
+    "url": "https://www.emojiall.com/images/60/skype/1f63f.png",
+    "name": "face_哭泣的猫",
+    "group": "face",
+    "className": "emoji_small"
+  }
+]

src/utils/emoji/type.ts

+export interface IEmoji {
+  url: string
+  name: string
+  group: string
+  className: string
+}

src/utils/md5/index.ts

+import CryptoJS from 'crypto-js'
+
+/**
+ * 使用 MD5 加密字符串
+ * @param input - 要加密的字符串
+ * @returns 加密后的 MD5 字符串
+ */
+export function md5Hash(input: string): string {
+  return CryptoJS.MD5(input).toString()
+}
+
+/**
+ * AES 加密方法
+ * @param plaintext 要加密的明文
+ * @param key 密钥 (16, 24 或 32 字节长度的字符串)
+ * @returns 加密后的字符串
+ */
+export function aesEncrypt(plaintext: string, key: string): string {
+  if (![16, 24, 32].includes(key.length)) {
+    throw new Error('秘钥长度必须为 16, 24 或 32 字节。')
+  }
+
+  // 加密数据
+  const encrypted = CryptoJS.AES.encrypt(plaintext, CryptoJS.enc.Utf8.parse(key), {
+    mode: CryptoJS.mode.ECB,
+    padding: CryptoJS.pad.Pkcs7
+  })
+
+  return encrypted.toString()
+}

src/utils/request/axios.ts

+import axios, {
+  type AxiosInstance,
+  type AxiosRequestConfig,
+  type AxiosRequestHeaders,
+  type InternalAxiosRequestConfig,
+} from 'axios'
+import { handleBackendError, handleRequestError, handleResponseError } from './error'
+import type { BackendServiceResult } from './types'
+import { useUserStore } from '@/stores/user'
+
+export default class DhRequest {
+  instance: AxiosInstance
+
+  constructor(axiosConfig: AxiosRequestConfig) {
+    this.instance = axios.create(axiosConfig)
+    this.setRequestInterceptor()
+    this.setResponseInterceptor()
+  }
+
+  // 设置请求拦截器
+  setRequestInterceptor() {
+    this.instance.interceptors.request.use(
+      async (config) => {
+        const userStore = useUserStore()
+        const token = userStore.token
+        if (token) {
+          config.headers.Authorization = token
+        }
+
+        return config
+      },
+      (error) => {
+        return handleRequestError(error)
+      },
+    )
+  }
+  // 设置响应拦截器
+  setResponseInterceptor() {
+    this.instance.interceptors.response.use(
+      (response) => {
+        if (response.status >= 200 && response.status < 300) {
+          const backendResult = response.data as BackendServiceResult<unknown>
+          if (!backendResult.success) {
+            // 处理后端错误
+            return handleBackendError(backendResult)
+          }
+          // 设置token
+          if (response.headers.authorization) {
+            const userStore = useUserStore()
+            userStore.setToken(response.headers.authorization)
+          }
+          return response.data
+        } else {
+          // 处理请求成功后错误
+          return handleResponseError(response)
+        }
+      },
+      (error) => {
+        // 处理请求错误
+        return handleRequestError(error)
+      },
+    )
+  }
+
+  /**
+   * 请求函数
+   * 1. 传入泛型T，T为后端返回的data类型，默认any
+   * 2. 传出一个Promise类型的BackendServiceResult<T>，具体为：
+   * 	{
+   * 		code:string,
+   * 		data:T,
+   * 		message:string
+   *  }
+   */
+  async request<T>(config: AxiosRequestConfig) {
+    try {
+      const res = (await this.instance.request(config)) as BackendServiceResult<T>
+      return res
+    } catch (error) {
+      return Promise.reject(error as BackendServiceResult<T>)
+    }
+  }
+
+  // async get<T>(
+  //   url: string,
+  //   config: AxiosRequestConfig,
+  // ): Promise<AxiosResponse<BackendServiceResult<T>>> {
+  //   return this.request<T>({
+  //     url,
+  //     method: 'GET',
+  //     ...config,
+  //   })
+  // }
+  // async post<T>(
+  //   url: string,
+  //   config: AxiosRequestConfig,
+  // ): Promise<AxiosResponse<BackendServiceResult<T>>> {
+  //   return this.request<T>({
+  //     url,
+  //     method: 'POST',
+  //     ...config,
+  //   })
+  // }
+  // async put<T>(
+  //   url: string,
+  //   config: AxiosRequestConfig,
+  // ): Promise<AxiosResponse<BackendServiceResult<T>>> {
+  //   return this.request<T>({
+  //     url,
+  //     method: 'PUT',
+  //     ...config,
+  //   })
+  // }
+  // async delete<T>(
+  //   url: string,
+  //   config: AxiosRequestConfig,
+  // ): Promise<AxiosResponse<BackendServiceResult<T>>> {
+  //   return this.request<T>({
+  //     url,
+  //     method: 'DELETE',
+  //     ...config,
+  //   })
+  // }
+}

src/utils/request/error.ts

+import {
+  DEFAULT_REQUEST_ERROR_CODE,
+  DEFAULT_REQUEST_ERROR_MSG,
+  ERROR_STATUS,
+  NETWORK_ERROR_CODE,
+  NETWORK_ERROR_MSG,
+  REQUEST_TIMEOUT_CODE,
+  REQUEST_TIMEOUT_MSG,
+} from './service'
+import type { BackendServiceResult, RequestServiceError } from './types'
+import { showErrorMsg } from '@/utils/toast'
+import type { AxiosError, AxiosResponse } from 'axios'
+
+/**
+ * 后端逻辑code报错处理
+ * @param backendServiceResult 后端传来错误信息
+ */
+export function handleBackendError(backendServiceResult: BackendServiceResult) {
+  const error: RequestServiceError = {
+    type: 'backend',
+    code: backendServiceResult.code || DEFAULT_REQUEST_ERROR_CODE,
+    msg: backendServiceResult.message,
+  }
+  showErrorMsg(error)
+  return Promise.reject(backendServiceResult)
+}
+
+/**
+ * 处理请求成功后错误
+ */
+export function handleResponseError(response: AxiosResponse) {
+  const error: RequestServiceError = {
+    type: 'axios',
+    code: DEFAULT_REQUEST_ERROR_CODE,
+    msg: DEFAULT_REQUEST_ERROR_MSG,
+  }
+
+  if (!window.navigator.onLine) {
+    // 网路错误
+    Object.assign(error, { code: NETWORK_ERROR_CODE, msg: NETWORK_ERROR_MSG })
+  } else {
+    // 请求成功的状态码非200的错误
+    const errorCode: ErrorStatus = response.status as ErrorStatus
+    const msg = ERROR_STATUS[errorCode] || DEFAULT_REQUEST_ERROR_MSG
+    Object.assign(error, { type: 'backend', code: errorCode, msg })
+  }
+  showErrorMsg(error)
+
+  return Promise.reject(response)
+}
+
+/**
+ * 处理请求失败
+ */
+type ErrorStatus = keyof typeof ERROR_STATUS
+export function handleRequestError(axiosError: AxiosError<BackendServiceResult>) {
+  const error: RequestServiceError = {
+    type: 'axios',
+    code: DEFAULT_REQUEST_ERROR_CODE,
+    msg: DEFAULT_REQUEST_ERROR_MSG,
+  }
+  // 网络错误
+  if (!window.navigator.onLine || axiosError.message === 'Network Error') {
+    Object.assign(error, { code: NETWORK_ERROR_CODE, msg: NETWORK_ERROR_MSG })
+  }
+  // 请求超时
+  else if (axiosError.code === REQUEST_TIMEOUT_CODE && axiosError.message.includes('timeout')) {
+    /** 超时错误 */
+    Object.assign(error, { code: REQUEST_TIMEOUT_CODE, msg: REQUEST_TIMEOUT_MSG })
+  }
+  // 请求出错,如404， 403
+  else {
+    const errorCode: ErrorStatus = axiosError.response?.status as ErrorStatus
+
+    const msg =
+      axiosError.response?.data.message || ERROR_STATUS[errorCode] || DEFAULT_REQUEST_ERROR_MSG
+    Object.assign(error, { code: errorCode || DEFAULT_REQUEST_ERROR_CODE, msg })
+    // 敏感词
+    if (axiosError.response?.data.code === 501) {
+      const message = axiosError.response?.data.message
+      if (message && JSON.parse(message)) {
+        ElMessage({
+          showClose: true,
+          message: `敏感词不可出现：${JSON.parse(message).join(',')}`,
+          type: 'error',
+          duration: 0,
+        })
+      }
+    }
+    if (axiosError.response?.data.code === 502) {
+      // 502 企业微信登录错误
+      ElMessage({
+        showClose: true,
+        message: `当前链接有问题，请从同事吧入口进入登录后，再点击该连接，如果有其他问题，请联系 张惠忠 解决`,
+        type: 'error',
+        duration: 0,
+      })
+    } else {
+      showErrorMsg(error)
+    }
+    // 鉴权错误
+    if (axiosError.response?.status === 403) {
+      useService404()
+    }
+  }
+
+  return Promise.reject(axiosError.response)
+}
+
+// 403鉴权错误
+function useService404() {
+  // useUserStroe().loginout()
+  // router.replace('/login')
+}

src/utils/request/index.ts

+import { app_config } from '@/config'
+import Axois from './axios'
+
+const baseUrl = app_config[import.meta.env.MODE]?.baseUrl
+export default new Axois({
+  baseURL: baseUrl,
+  timeout: 1000 * 60,
+})

src/utils/request/service.ts

+/**
+ * 封装一些常见的错误类型
+ * @author 王杜鸿
+ * @createAt 2022.04.11
+ */
+
+/** 错误信息的显示时间 */
+export const ERROR_MSG_DURATION = 3 * 1000
+
+/** 兜底的请求错误code */
+export const DEFAULT_REQUEST_ERROR_CODE = 'DEFAULT'
+/** 兜底的请求错误文本 */
+export const DEFAULT_REQUEST_ERROR_MSG = '请求错误~'
+
+/** 重复请求 */
+export const REQUEST_REPEAT_CODE = 'REQUEST_REPEAT'
+export const REQUEST_REPEAT_MSG = '重复请求'
+
+/** 敏感词 */
+export const ERROR_WORD_CODE = 'ERROR_WORD'
+export const ERROR_WORD_MSG = '敏感词'
+
+/** 请求超时的错误code(为固定值：ECONNABORTED) */
+export const REQUEST_TIMEOUT_CODE = 'ECONNABORTED'
+/** 请求超时的错误文本 */
+export const REQUEST_TIMEOUT_MSG = '请求超时~'
+
+/** 网络不可用的code */
+export const NETWORK_ERROR_CODE = 'NETWORK_ERROR'
+/** 网络不可用的错误文本 */
+export const NETWORK_ERROR_MSG = '网络不可用~'
+
+/** 请求不成功各种状态的错误 */
+export const ERROR_STATUS = {
+  400: '400: 请求出现语法错误',
+  401: '401: 用户未授权~',
+  403: '403: 登录凭证已过期，请重新访问~',
+  404: '404: 请求的资源不存在~',
+  405: '405: 请求方法未允许~',
+  408: '408: 网络请求超时~',
+  500: '500: 系统有误，请反馈给IT王立鹏~',
+  501: '501: 服务器未实现请求功能~',
+  502: '502: 错误网关~',
+  503: '503: 服务不可用',
+  504: '504: 网关超时~',
+  505: '505: http版本不支持该请求~'
+}
+
+/** 不弹出错误信息的code */
+export const NO_ERROR_MSG_CODE: string[] = []

src/utils/request/types.ts

+/** 后端接口返回的类型结构 */
+export interface BackendServiceResult<T> {
+  /** 错误状态码 */
+  code?: number
+  /** 接口数据 */
+  data: T
+  /** 接口消息 */
+  message: string
+  success: boolean
+}
+
+/** 后端接口返回的分页类型结构 */
+export interface BackendServicePageResult<T> {
+  list: T[]
+  total: number
+  pageNum: number
+  pageSize: number
+}
+
+/**
+ * 请求服务的错误类型：
+ * - axios: axios错误：网络错误, 请求超时, 默认的兜底错误
+ * - http: 请求成功，响应的状态码非200的错误
+ * - backend: 请求成功，响应的状态码为200，由后端定义的业务错误
+ */
+export type RequestServiceErrorType = 'axios' | 'http' | 'backend'
+
+/** 请求服务的错误 */
+export interface RequestServiceError {
+  /** 请求服务的错误类型 */
+  type: RequestServiceErrorType
+  /** 错误码 */
+  code: string | number
+  /** 错误信息 */
+  msg: string
+}
+
+/** 分页请求参数 */
+export interface PageSearchParams {
+  current: number
+  size: number
+}

src/utils/storage/index.ts

+export { localCache } from './local'
+export { sessionCache } from './session'

src/utils/storage/local.ts

+/**
+ * 使用localStorage进行封装缓存，添加有效期的选项
+ */
+class LocalCache {
+  getCache<T>(key: string) {
+    const valueStr = window.localStorage.getItem(key)
+    if (!valueStr) {
+      return null
+    }
+
+    const value = JSON.parse(valueStr)
+    if (value.time === 0) {
+      return value.data as T
+    }
+    const now = new Date().getTime()
+    if (now >= value.time) {
+      window.localStorage.removeItem(key)
+      return null
+    }
+    return value.data as T
+  }
+
+  setCache(key: string, value: unknown, expireTime = 0) {
+    const obj = {
+      data: value,
+      time: expireTime ? new Date().getTime() + expireTime : 0
+    }
+    window.localStorage.setItem(key, JSON.stringify(obj))
+  }
+
+  removeCache(key: string) {
+    window.localStorage.removeItem(key)
+  }
+
+  clearCache() {
+    window.localStorage.clear()
+  }
+}
+
+export const localCache = new LocalCache()

src/utils/storage/session.ts

+/**
+ * 使用sessionStorage进行封装缓存，添加有效期的选项
+ */
+class SessionCache {
+  getCache<T>(key: string) {
+    const valueStr = window.sessionStorage.getItem(key)
+    if (!valueStr) {
+      return null
+    }
+    const value = JSON.parse(valueStr)
+    return value as T
+  }
+
+  setCache(key: string, value: unknown) {
+    window.sessionStorage.setItem(key, JSON.stringify(value))
+  }
+
+  removeCache(key: string) {
+    window.sessionStorage.removeItem(key)
+  }
+
+  clearCache() {
+    window.sessionStorage.clear()
+  }
+}
+
+export const sessionCache = new SessionCache()

src/utils/toast/index.ts

+export * from './serviceError'

src/utils/toast/serviceError.ts

+import 'element-plus/es/components/message/style/css'
+import type { RequestServiceError } from '@/utils/request/types'
+import { NO_ERROR_MSG_CODE, ERROR_MSG_DURATION } from '@/utils/request/service'
+
+/** 错误消息栈，防止同一错误同时出现 */
+const errorMsgStack = new Map<string | number, string>([])
+
+function addErrorMsg(error: RequestServiceError) {
+  errorMsgStack.set(error.code, error.msg)
+}
+function removeErrorMsg(error: RequestServiceError) {
+  errorMsgStack.delete(error.code)
+}
+function hasErrorMsg(error: RequestServiceError) {
+  return errorMsgStack.has(error.code)
+}
+
+/**
+ * 显示错误信息
+ * @param error
+ */
+export function showErrorMsg(error: RequestServiceError) {
+  if (!NO_ERROR_MSG_CODE.includes(error.code + '')) {
+    if (!hasErrorMsg(error)) {
+      addErrorMsg(error)
+      if (error.msg) {
+        ElMessage.error(error.msg)
+      }
+      setTimeout(() => {
+        removeErrorMsg(error)
+      }, ERROR_MSG_DURATION)
+    }
+  }
+}

src/utils/util-function/array.ts

+/**
+ * 通过某个条件，将一个数组，分隔成两个数组
+ * @param arr
+ * @param callback
+ */
+export function splitArray<T = unknown>(arr: T[], callback: (item: T) => boolean) {
+  const arr1: T[] = []
+  const arr2: T[] = []
+  arr.forEach(v => {
+    if (callback(v)) {
+      arr1.push(v)
+    } else {
+      arr2.push(v)
+    }
+  })
+  return {
+    false: arr2,
+    true: arr1
+  }
+}

src/utils/util-function/index.ts

+export * from './time'
+export * from './tree'
+export * from './string'
+export * from './array'

src/utils/util-function/string.ts

+/**
+ * 针对字符串的一些工具方法
+ */
+
+/**
+ * 解析链接
+ */
+export const encodeUrl = function (str: string) {
+  const result = str
+    .replaceAll('+', '%2B')
+    .replaceAll('=', '%3D')
+    .replaceAll('?', '%3F')
+    .replaceAll('#', '%23')
+    .replaceAll('&', '%26')
+    .replaceAll(' ', '%20')
+    .replaceAll('/', '%2F')
+  return result
+}

src/utils/util-function/time.ts

+/**
+ * 日期格式化
+ * @param value 日期
+ * @param format 格式化 'YYYY-MM-DD HH:mm:ss'
+ * @param useAlias 是否使用别名，如：3小时前
+ * @returns
+ */
+export function time_format(value?: string | number, format = 'YYYY-MM-DD', useAlias = false) {
+  if (!value) {
+    return '-'
+  }
+  if (useAlias) {
+    return formatDateAlias(value, format)
+  }
+  if (Number.isNaN(Number(value))) {
+    // 字符串类型日期：YYYY-MM-DD hh:mm:ss
+    return formatDate(value, format)
+  }
+  // 时间戳日期格式: (秒 是13位以上)
+  if (value.toString().length >= 13) {
+    return formatDate(value, format)
+  }
+  return formatDate(Number(value) * 1000, format)
+}
+
+// 将日期格式化成对应的格式
+export const formatDate = function (str: string | number, format = 'YYYY-MM-DD HH:mm', shortStr = false) {
+  // 兼容苹果
+  if (typeof str === 'string') {
+    str = str.replace(/-/g, '/')
+  }
+
+  let date
+  if (!str) {
+    date = new Date()
+  } else {
+    date = new Date(str)
+  }
+
+  const now = new Date()
+  // 是否去除年显示
+  let formatStr = format
+  const nowYear = now.getFullYear()
+  const year = date.getFullYear()
+  if (shortStr && nowYear === year) {
+    formatStr = formatStr.replace('YYYY-', '')
+  }
+
+  // 是否去除月日显示
+  const nowMonth = new Date().getMonth()
+  const month = date.getMonth()
+  const nowDay = new Date().getDate()
+  const day = date.getDate()
+  if (shortStr && nowYear === year && nowMonth === month && nowDay === day) {
+    formatStr = formatStr.replace('MM-DD ', '')
+  }
+
+  const y = date.getFullYear()
+  let MM: number | string = date.getMonth() + 1
+  MM = MM < 10 ? '0' + MM : MM
+  let d: number | string = date.getDate()
+  d = d < 10 ? '0' + d : d
+  let h: number | string = date.getHours()
+  h = h < 10 ? '0' + h : h
+  let m: number | string = date.getMinutes()
+  m = m < 10 ? '0' + m : m
+  let s: number | string = date.getSeconds()
+  s = s < 10 ? '0' + s : s
+
+  const time = formatStr
+    .replace('YYYY', y + '')
+    .replace('MM', MM + '')
+    .replace('DD', d + '')
+    .replace('HH', h + '')
+    .replace('mm', m + '')
+    .replace('ss', s + '')
+  return time
+}
+// 将日期变成对应的别名
+export const formatDateAlias = function (value: string | number, format = 'YYYY-MM-DD HH:mm:ss') {
+  // 兼容苹果
+  if (typeof value === 'string') {
+    value = value.replace(/-/g, '/')
+  }
+  if (typeof value === 'number' && value.toString().length < 13) {
+    value = Number(value) * 1000
+  }
+  const now = Date.now()
+  const time = new Date(value).getTime()
+  let unit = '后'
+  if (now > time) {
+    unit = '前'
+  }
+
+  // x秒前/后
+  let alias = '秒'
+  const intervalTime = Math.abs(now - time)
+  const seconds = Math.floor(intervalTime / 1000) + 1
+  alias = seconds + alias
+  if (seconds < 60) {
+    return alias + unit
+  }
+
+  // x分前/后
+  alias = '分'
+  const minutes = Math.floor(seconds / 60) + 1
+  alias = minutes + alias
+  if (minutes < 60) {
+    return alias + unit
+  }
+
+  // 今天
+  const date = new Date(value)
+  const nowDate = new Date()
+  const days = date.getDate()
+  const month = date.getMonth()
+  const year = date.getFullYear()
+  const nowDays = nowDate.getDate()
+  const nowMonth = nowDate.getMonth()
+  const nowYear = nowDate.getFullYear()
+  if (days === nowDays && month === nowMonth && year === nowYear) {
+    return '今天 ' + formatDate(value, 'HH:mm')
+  }
+
+  return formatDate(value, format, true)
+}
+
+/**
+ * 给一个时期，获取周的开始和结束
+ * @param date
+ */
+export const getWeek = function (date: Date, format?: string) {
+  const weekNum = date.getDay()
+  const week = []
+  const dayTime = 1000 * 60 * 60 * 24
+  for (let i = 1; i <= 7; i++) {
+    const value = new Date(date.getTime() - dayTime * (weekNum - i))
+    if (format) {
+      week.push(time_format(value.getTime(), format))
+    } else {
+      week.push(value)
+    }
+  }
+
+  return week
+}
+
+/**
+ * 给一个时间分为，获取相隔几天
+ */
+export const getRangeNum = function (startTime = 0, endTime = 0) {
+  let rangeTime = endTime - startTime
+  if (startTime.toString().length < 13) {
+    rangeTime = (endTime - startTime) * 1000
+  }
+  return Math.floor(rangeTime / (60 * 60 * 24 * 1000))
+}
+
+/**
+ * 给一个时间范围，获取对应时间范围
+ * @param date
+ */
+export const getRangeByStartEnd = function (startTime = 0, endTime = 0, format?: string) {
+  const rangeNum = getRangeNum(startTime, endTime)
+  if (!rangeNum) return []
+
+  const arr = [time_format(startTime, format)]
+  for (let i = 1; i < rangeNum; i++) {
+    const date = time_format(startTime + 60 * 60 * 24 * i, format)
+    arr.push(date)
+  }
+  arr.push(time_format(endTime, format))
+  return arr
+}

src/utils/util-function/tree.ts

+/**
+ * 针对树形的一些工具方法
+ */
+
+/**
+ * 扁平数组转tree
+ * @param {*} items 要转换的数组
+ * @param {*} items 作为父id的字段名，默认 parentId
+ * @param {*} items 作为id的字段名，默认id
+ * @returns
+ */
+interface IObject {
+  [key: string]: any
+  children?: IObject[]
+}
+export function arrayToTree<T extends IObject>(items: T[], parentKey = 'parentId', primaryKey = 'id') {
+  const result: T[] = []
+  const itemMap = new Map<string | number, T>()
+  // 遍历源数组，给map添加数据
+  for (const item of items) {
+    itemMap.set(item[primaryKey], item)
+  }
+  for (const item of items) {
+    const pId = item[parentKey]
+    // 根元素
+    if (!itemMap.has(pId)) {
+      result.push(item)
+    }
+    // 如果itemMap中存在 当前元素的parentId，则该元素不为根元素
+    else {
+      const parent = itemMap.get(pId)
+      if (parent!.children && parent!.children instanceof Array) {
+        parent!.children.push(item)
+      } else {
+        parent!.children = [item]
+      }
+    }
+  }
+  return result
+}

src/utils/wxUtil/index.ts

+export * from './wxLogin'
+export * from './initWXConfig'
+
+import wx from 'weixin-js-sdk'
+
+/**
+ * 分享
+ */
+interface IShareWxOption {
+  /** 分享标题 */
+  title: string
+  /** 分享链接 */
+  link: string
+  /** 分享描述 */
+  desc?: string
+  /** 分享封面 */
+  imgUrl?: string
+}
+export function wxShare(option: IShareWxOption) {
+  const url = location.href.split('#')[0]
+  option.link = url + '#' + option.link
+  wx.invoke('shareAppMessage', option, function (res: any) {
+    if (res.err_msg == 'openExistedChatWithMsg:ok') {
+      console.log(res)
+    }
+  })
+}
+
+/**
+ * 企业微信获取部门人员SDK
+ * @params wxOption 企业微信 selectEnterpriseContact 的选项
+ * @params wxOption.fromDepartmentId 必填，表示打开的通讯录从指定的部门开始展示，-1表示自己所在部门开始, 0表示从最上层开始
+ * @params wxOption.mode  必填，选择模式，single表示单选，multi表示多选
+ * @params wxOption.type 必填，选择限制类型，指定department、user中的一个或者多个
+ * @params wxOption.selectedDepartmentIds 非必填，已选部门ID列表。用于多次选人时可重入，single模式下请勿填入多个id
+ * @params wxOption.selectedUserIds 非必填，已选用户ID列表。用于多次选人时可重入，single模式下请勿填入多个id
+ * @returns
+ */
+interface ISelectDepOrUser {
+  err_msg: string
+  result: {
+    userList: ISelectUser[]
+  }
+}
+interface ISelectUser {
+  id: string
+  name: string
+  avatar: string
+}
+export function selectDepOrUser(wxOption = {}): Promise<ISelectDepOrUser> {
+  const defaultOption = {
+    fromDepartmentId: -1,
+    mode: 'single',
+    type: ['user', 'department']
+    // "selectedDepartmentIds": [],
+    // "selectedUserIds": checkPerson
+  }
+  const option = {
+    ...defaultOption,
+    ...wxOption
+  }
+  return new Promise((resolve, reject) => {
+    wx.invoke('selectEnterpriseContact', option, function (res: ISelectDepOrUser) {
+      if (res.err_msg == 'selectEnterpriseContact:ok') {
+        resolve(res)
+      }
+    })
+  })
+}

src/utils/wxUtil/initWXConfig.ts

+/* 企业微信js配置 */
+//注意：如果要在页面调用企业微信内部方法，请现在下面的jsApiList数组中添加方法
+import { getWxSignature } from '@/api'
+import wx from 'weixin-js-sdk'
+
+export async function initWxConfig() {
+  const url = location.href.split('#')[0]
+  const response = await getWxSignature(url)
+  const timestamp = response.data.timestamp //时间戳
+  const nonceStr = response.data.nonceStr //随机字符串
+  const signature = response.data.signature //签名
+  const appId = response.data.appId //企业id
+  wx.config({
+    beta: true, // 必须这么写，否则wx.invoke调用形式的jsapi会有问题
+    debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
+    appId: appId, // 必填，企业微信的corpID
+    timestamp: timestamp, // 必填，生成签名的时间戳
+    nonceStr: nonceStr, // 必填，生成签名的随机串
+    signature: signature, // 必填，签名，见附录1
+    jsApiList: [
+      // 所有要调用的 API 都要加到这个列表中
+      'shareAppMessage',
+      'selectEnterpriseContact'
+    ]
+    // success: function (result) {
+    //   // 回调
+    // }
+  })
+}

src/utils/wxUtil/wxLogin.ts

+import { app_config } from '@/config'
+import { localCache } from '@/utils/storage'
+
+/**
+ * 跳转企业微信获取最新code
+ * @param fullPath to.fullPath
+ */
+export function wxLogin(fullPath: string) {
+  const wxRedirect = app_config[import.meta.env.MODE].wxRedirect
+  localCache.removeCache('token')
+  const wxUrl = 'https://open.weixin.qq.com/connect/oauth2/authorize'
+  const redirect = encodeURIComponent('http://' + wxRedirect + fullPath)
+  const wxParams = `?appid=ww42a2d34b42b8d721&redirect_uri=${redirect}&response_type=code&scope=snsapi_base&state=#wechat_redirect`
+  window.location.href = wxUrl + wxParams
+}
+
+/**
+ * 解析地址栏 code
+ *
+ * ?code=ODwKMle878L26YftD85-nJQwDyQmSDyKeEpODM6qMMM&state=
+ * @param search
+ */
+export function parseCode() {
+  const reg = new RegExp('(^|\\\\?|&)' + 'code' + '=([^&]*)(\\\\s|&|$)', 'i')
+  if (reg.test(window.location.href)) {
+    return unescape(RegExp.$2.replace(/\+/g, ' '))
+  }
+  return ''
+}
+
+/**
+ * 解析地址栏 isCodeLogin
+ *
+ * ?isCodeLogin=1
+ * @param search
+ */
+export function parseIsCodeLogin() {
+  const reg = new RegExp('(^|\\\\?|&)' + 'isCodeLogin' + '=([^&]*)(\\\\s|&|$)', 'i')
+  if (reg.test(window.location.href)) {
+    return unescape(RegExp.$2.replace(/\+/g, ' '))
+  }
+  return ''
+}
+
+/**
+ * 解析地址栏 cutEmail
+ *
+ * ?cutEmail=xxx@yswg.com.cn
+ * @param search
+ */
+export function parseIsCutEmail() {
+  const reg = new RegExp('(^|\\\\?|&)' + 'cutEmail' + '=([^&]*)(\\\\s|&|$)', 'i')
+  if (reg.test(window.location.href)) {
+    return unescape(RegExp.$2.replace(/\+/g, ' '))
+  }
+  return ''
+}

src/views/AboutView.vue

-<template>
-  <div class="about">
-    <h1>This is an about page</h1>
-  </div>
-</template>
-
-<style>
-@media (min-width: 1024px) {
-  .about {
-    min-height: 100vh;
-    display: flex;
-    align-items: center;
-  }
-}
-</style>

src/views/ask/index.vue

+<template>
+  <div class="min-h-screen">
+    <!-- 头部Tabs -->
+    <div class="flex gap-3">
+      <Tabs v-model="activeTab" :tabs="tabs" />
+    </div>
+
+    <!-- 主要内容区域 -->
+    <div class="mx-auto py-6">
+      <!-- 发布问题卡片 -->
+      <div class="bg-white rounded-2xl shadow-sm border border-gray-100 mb-6 overflow-hidden">
+        <div class="p-6">
+          <!-- 用户头像和输入区域 -->
+          <div class="flex items-start">
+            <div class="flex-1 bg-white rounded-lg border border-gray-200">
+              <!-- 主输入区域 -->
+              <div class="flex gap-3 mb-4">
+                <!-- 用户头像 -->
+                <el-avatar :size="48" src="https://via.placeholder.com/150" class="flex-shrink-0">
+                  <el-icon><User /></el-icon>
+                </el-avatar>
+
+                <!-- 输入区域 -->
+                <div class="flex-1">
+                  <!-- 话题标签输入 -->
+                  <div class="mb-4">
+                    <el-input
+                      v-model="tagInput"
+                      placeholder="话题描述...... (非必填)"
+                      class="tag-input"
+                      clearable
+                    />
+                  </div>
+                  <!-- 主要内容输入 -->
+                  <div class="relative mb-3">
+                    <el-input
+                      v-model="questionContent"
+                      type="textarea"
+                      placeholder="请输入你想发布的话题"
+                      :rows="3"
+                      :maxlength="500"
+                      resize="none"
+                      class="main-textarea"
+                    />
+                    <!-- 字符计数 -->
+                    <div class="absolute bottom-3 right-3 text-xs text-gray-400">
+                      {{ questionContent.length }}/30
+                    </div>
+                  </div>
+                </div>
+              </div>
+
+              <!-- 工具栏 -->
+              <div class="flex items-center justify-between pl-15">
+                <!-- 左侧工具按钮 -->
+                <div class="flex items-center gap-1">
+                  <el-tooltip content="添加话题" placement="top">
+                    <el-button
+                      text
+                      class="w-10 h-10 text-gray-500 hover:bg-gray-100 hover:text-gray-700 rounded-lg"
+                    >
+                      <el-icon size="18"><Picture /></el-icon>
+                    </el-button>
+                  </el-tooltip>
+
+                  <el-tooltip content="添加图片" placement="top">
+                    <el-button
+                      text
+                      class="w-10 h-10 text-gray-500 hover:bg-gray-100 hover:text-gray-700 rounded-lg"
+                    >
+                      <el-icon size="18"><Picture /></el-icon>
+                    </el-button>
+                  </el-tooltip>
+
+                  <el-tooltip content="添加视频" placement="top">
+                    <el-button
+                      text
+                      class="w-10 h-10 text-gray-500 hover:bg-gray-100 hover:text-gray-700 rounded-lg"
+                    >
+                      <el-icon size="18"><VideoPlay /></el-icon>
+                    </el-button>
+                  </el-tooltip>
+
+                  <el-tooltip content="添加附件" placement="top">
+                    <el-button
+                      text
+                      class="w-10 h-10 text-gray-500 hover:bg-gray-100 hover:text-gray-700 rounded-lg"
+                    >
+                      <el-icon size="18"><Paperclip /></el-icon>
+                    </el-button>
+                  </el-tooltip>
+                </div>
+
+                <!-- 右侧操作按钮 -->
+                <div class="flex items-center gap-3">
+                  <el-button
+                    class="px-4 py-2 text-gray-600 hover:text-gray-800 hover:bg-gray-50 rounded-lg border border-gray-200 text-sm"
+                  >
+                    存草稿
+                  </el-button>
+
+                  <el-button
+                    type="primary"
+                    :disabled="!questionContent.trim()"
+                    class="px-6 py-2 bg-blue-500 hover:bg-blue-600 disabled:opacity-50 disabled:cursor-not-allowed rounded-lg text-white text-sm font-medium shadow-sm hover:shadow-md transition-all duration-200"
+                  >
+                    发布话题
+                  </el-button>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- 问题列表 -->
+      <div class="space-y-4">
+        <el-card
+          v-for="(question, index) in questions"
+          :key="index"
+          class="question-card !rounded-2xl mb-4"
+          shadow="hover"
+        >
+          <!-- 问题标题 -->
+          <h3
+            class="text-lg font-semibold text-gray-900 mb-3 leading-relaxed cursor-pointer hover:text-blue-600 transition-colors"
+          >
+            {{ question.title }}
+          </h3>
+          <div class="flex gap-4 mb-4">
+            <!-- 图片展示（如果有） -->
+            <el-image
+              v-if="question.images?.length"
+              :src="question.images[0]"
+              fit="cover"
+              class="w-50 h-25 rounded-l"
+            />
+            <!-- 问题内容 -->
+            <div>
+              <p class="text-gray-600 text-base leading-relaxed line-clamp-3">
+                {{ question.content }}
+              </p>
+
+              <!-- 展开/收起按钮 -->
+              <el-button
+                v-if="question.content.length > 100"
+                type="primary"
+                text
+                size="small"
+                class="mt-2 p-0 text-blue-500"
+              >
+                阅读全文
+                <el-icon class="ml-1"><ArrowDown /></el-icon>
+              </el-button>
+            </div>
+          </div>
+          <!-- 底部信息栏 -->
+          <div class="flex items-center justify-between border-t border-gray-100">
+            <!-- 左侧：发布人信息 -->
+            <div class="flex items-center gap-4">
+              <div class="flex items-center gap-2">
+                <span class="text-orange-500 text-sm font-medium">发布人</span>
+                <div class="flex items-center gap-2">
+                  <el-avatar :size="20" :src="question.avatar">
+                    <el-icon><User /></el-icon>
+                  </el-avatar>
+                  <span class="text-sm text-gray-700 font-medium">{{ question.author }}</span>
+                </div>
+              </div>
+
+              <span class="text-xs text-gray-400">{{ question.time }}</span>
+
+              <!-- 操作按钮组 -->
+              <div class="flex items-center">
+                <el-button size="small" plain>
+                  <el-icon><Plus /></el-icon>
+                  添加
+                </el-button>
+
+                <el-button size="small" plain>
+                  <el-icon><Edit /></el-icon>
+                  回答
+                </el-button>
+
+                <el-button size="small" plain>
+                  <el-icon><Star /></el-icon>
+                  关注
+                </el-button>
+
+                <el-button size="small" type="danger" plain>
+                  <el-icon><Warning /></el-icon>
+                  举报
+                </el-button>
+              </div>
+            </div>
+
+            <!-- 右侧：统计信息 -->
+            <div class="flex items-center">
+              <!-- 浏览量 -->
+              <el-button text class="flex items-center gap-2 text-gray-500">
+                <el-icon><View /></el-icon>
+                <span class="text-sm">{{ question.views || 0 }}</span>
+              </el-button>
+
+              <!-- 点赞 -->
+              <el-button
+                text
+                class="flex items-center gap-2 text-gray-500 hover:text-red-500 transition-colors"
+                @click="handleLike(index)"
+              >
+                <el-icon><Star /></el-icon>
+                <span class="text-sm">{{ question.likes || 0 }}</span>
+              </el-button>
+
+              <!-- 评论 -->
+              <el-button
+                text
+                class="flex items-center gap-2 text-gray-500 hover:text-blue-500 transition-colors"
+                @click="handleComment(index)"
+              >
+                <el-icon><ChatDotRound /></el-icon>
+                <span class="text-sm">{{ question.comments || 0 }}</span>
+              </el-button>
+            </div>
+          </div>
+        </el-card>
+      </div>
+    </div>
+
+    <!-- 底部分页 -->
+    <div class="bottom-pagination bg-gray-50/80 backdrop-blur-8 border-t border-gray-200">
+      <div class="max-w-7xl mx-auto px-8 py-6">
+        <div class="flex items-center justify-between">
+          <!-- 左侧：回到顶部按钮 -->
+          <div class="left">
+            <button
+              class="back-top-btn group flex items-center gap-3 px-4 py-2.5 bg-gradient-to-r from-blue-50 to-indigo-50 hover:from-blue-100 hover:to-indigo-100 border border-blue-200/50 rounded-full transition-all duration-300 hover:shadow-lg hover:-translate-y-1 active:scale-95"
+              title="回到顶部"
+              @click="handleBackTop"
+            >
+              <div
+                class="w-8 h-8 bg-gradient-to-r from-blue-500 to-indigo-500 rounded-full flex items-center justify-center group-hover:rotate-12 transition-transform duration-300 shadow-sm"
+              >
+                <SvgIcon color="#409eff" name="icon_top" size="16" />
+              </div>
+              <span
+                class="text-sm font-medium text-gray-700 group-hover:text-blue-600 transition-colors"
+                >回到顶部</span
+              >
+            </button>
+          </div>
+
+          <!-- 右侧：分页器 -->
+          <div class="right">
+            <div
+              class="pagination-wrapper bg-white rounded-xl shadow-sm border border-gray-100 p-3"
+            >
+              <el-pagination
+                v-model:current-page="currentPage"
+                v-model:page-size="pageSize"
+                :page-sizes="[15, 30, 45, 60]"
+                layout="prev, pager, next, jumper, total"
+                :total="400"
+                class="custom-pagination"
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts" name="CultureAsk">
+import { ref } from 'vue'
+import Tabs from '@/components/common/Tabs'
+import {
+  User,
+  Plus,
+  Edit,
+  Star,
+  Warning,
+  View,
+  ChatDotRound,
+  ArrowDown,
+} from '@element-plus/icons-vue'
+const currentPage = ref(1)
+const pageSize = ref(10)
+
+const activeTab = ref('最新')
+const tabs = [
+  { label: '最新', value: '最新' },
+  { label: '热问', value: '热问' },
+  { label: '关注', value: '关注' },
+]
+
+const questionContent = ref('')
+const tagInput = ref('')
+
+const handleBackTop = () => {
+  window.scrollTo({
+    top: 0,
+    behavior: 'smooth',
+  })
+} // 示例数据
+const questions = ref([
+  {
+    title: '什么是顶级思维？',
+    content:
+      '九儿吃亲亲：任何时候，任何情况下，不管别人用什么表情什么眼神看你，什么语气什么措辞跟你说话，什么态度或者什么行为对待你，切记，你只为你努力的事，所有的...',
+    author: '亚声培训',
+    time: '2025-08-21 17:24',
+    avatar: 'https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png',
+    views: 10068,
+    likes: 88,
+    comments: 66,
+    tags: ['思维', '成长', '心理学'],
+    images: [], // 这个没有图片
+  },
+  {
+    title: '如何提高工作效率？',
+    content:
+      '分享一些实用的工作效率提升方法，包括时间管理、任务优先级排序、工具使用等方面的经验...',
+    author: '效率达人',
+    time: '2025-08-21 16:30',
+    avatar: 'https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png',
+    views: 5432,
+    likes: 156,
+    comments: 23,
+    tags: ['效率', '工作', '管理'],
+    images: ['https://picsum.photos/300/300?random=1'],
+  },
+])
+
+// 根据图片数量返回网格布局类
+const getImageGridClass = (count: number) => {
+  if (count === 1) return 'grid-cols-1 max-w-xs'
+  if (count === 2) return 'grid-cols-2 max-w-md'
+  if (count <= 4) return 'grid-cols-2'
+  return 'grid-cols-3'
+}
+
+// 事件处理
+const handleLike = (index: number) => {
+  questions.value[index].likes = (questions.value[index].likes || 0) + 1
+  ElMessage.success('点赞成功')
+}
+
+const handleComment = (index: number) => {
+  ElMessage.info('评论功能')
+}
+</script>
+<style lang="scss" scoped>
+.line-clamp-3 {
+  display: -webkit-box;
+  -webkit-line-clamp: 3;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+}
+</style>

src/views/home/components/recommendList.vue

+<template>
+  <div>
+    <template v-if="list.length > 0">
+      <div class="space-y-3 sm:space-y-4">
+        <div
+          v-for="item in list"
+          :key="item.id"
+          class="group bg-white rounded-lg p-4 sm:p-6 cursor-pointer transition-all duration-300 hover:shadow-lg hover:shadow-gray-100 hover:-translate-y-1 border border-gray-100 hover:border-gray-200 mb-3 sm:mb-4"
+          @click="router.push(`/postDetail/${item.id}`)"
+        >
+          <div class="flex gap-3 sm:gap-4 lg:gap-6">
+            <!-- 内容区域 -->
+            <div class="flex-1 min-w-0">
+              <!-- 标题 -->
+              <h2
+                class="text-base sm:text-lg lg:text-xl font-semibold text-gray-900 mb-2 sm:mb-3 line-clamp-2 group-hover:text-blue-600 transition-colors duration-200 leading-tight"
+              >
+                {{ item.title }}
+              </h2>
+
+              <!-- 内容摘要 -->
+              <div class="mb-3 sm:mb-4 space-y-1">
+                <p
+                  class="text-gray-600 text-sm sm:text-base leading-relaxed line-clamp-1 sm:line-clamp-2"
+                >
+                  {{ item.content }}
+                </p>
+                <!-- <p
+                class="text-gray-600 text-sm sm:text-base leading-relaxed line-clamp-1 sm:line-clamp-2"
+              >
+                终于知道名门正派为什么这么庆祝邪修了，邪修大法就是好用啊！(ᵔ◡ᵔ)
+              </p> -->
+              </div>
+
+              <!-- 统计信息 -->
+              <div
+                class="flex flex-wrap items-center gap-2 sm:gap-4 text-gray-500 text-xs sm:text-sm"
+              >
+                <div class="flex items-center gap-1 hover:text-blue-500 transition-colors">
+                  <el-icon class="text-sm"><View /></el-icon>
+                  <span class="font-medium">{{ item.viewCount }}</span>
+                </div>
+                <div class="flex items-center gap-1 hover:text-red-500 transition-colors">
+                  <el-icon class="text-sm"><ChatDotRound /></el-icon>
+                  <span class="font-medium">{{ item.replyCount }}</span>
+                </div>
+                <div class="flex items-center gap-1 hover:text-yellow-500 transition-colors">
+                  <el-icon class="text-sm"><Star /></el-icon>
+                  <span class="font-medium">{{ item.praiseCount }}</span>
+                </div>
+
+                <!-- 分隔符 -->
+                <div class="hidden sm:block w-1 h-1 bg-gray-300 rounded-full"></div>
+
+                <!-- 时间 -->
+                <span class="text-gray-400 font-medium ml-auto sm:ml-0">
+                  <span class="hidden sm:inline">{{
+                    dayjs(item.createTime).format('YYYY-MM-DD HH:mm')
+                  }}</span>
+                </span>
+              </div>
+            </div>
+
+            <!-- 图片区域 -->
+            <div
+              class="relative flex-shrink-0 w-20 h-16 sm:w-32 sm:h-24 lg:w-40 lg:h-28 xl:w-44 xl:h-32"
+            >
+              <img
+                src="@/assets/img/culture/ask.png"
+                alt="文章配图"
+                class="w-full h-full object-cover rounded-lg sm:rounded-xl group-hover:scale-105 transition-transform duration-300"
+                loading="lazy"
+              />
+              <!-- 图片遮罩效果 -->
+              <div
+                class="absolute inset-0 bg-black bg-opacity-0 group-hover:bg-opacity-5 rounded-lg sm:rounded-xl transition-all duration-300"
+              ></div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- 底部分页 -->
+      <div class="bottom-pagination bg-gray-50/80 backdrop-blur-8 border-t border-gray-200">
+        <div class="max-w-7xl mx-auto px-8 py-6">
+          <div class="flex items-center justify-between">
+            <!-- 左侧：回到顶部按钮 -->
+            <div class="left">
+              <button
+                class="back-top-btn group flex items-center gap-3 px-4 py-2.5 bg-gradient-to-r from-blue-50 to-indigo-50 hover:from-blue-100 hover:to-indigo-100 border border-blue-200/50 rounded-full transition-all duration-300 hover:shadow-lg hover:-translate-y-1 active:scale-95"
+                title="回到顶部"
+                @click="handleBackTop"
+              >
+                <div
+                  class="w-8 h-8 bg-gradient-to-r from-blue-500 to-indigo-500 rounded-full flex items-center justify-center group-hover:rotate-12 transition-transform duration-300 shadow-sm"
+                >
+                  <SvgIcon color="#409eff" name="icon_top" size="16" />
+                </div>
+                <span
+                  class="text-sm font-medium text-gray-700 group-hover:text-blue-600 transition-colors"
+                  >回到顶部</span
+                >
+              </button>
+            </div>
+
+            <!-- 右侧：分页器 -->
+            <div class="right">
+              <div
+                class="pagination-wrapper bg-white rounded-xl shadow-sm border border-gray-100 p-3"
+              >
+                <el-pagination
+                  v-model:current-page="searchParams.current"
+                  v-model:page-size="searchParams.size"
+                  :page-sizes="[5, 20, 1]"
+                  layout="prev, pager, next, jumper, total"
+                  :total="total"
+                  class="custom-pagination"
+                  @current-change="goToPage"
+                  @size-change="changePageSize"
+                />
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </template>
+    <template v-else>
+      <div class="flex items-center justify-center h-full">
+        <el-empty description="暂无数据" />
+      </div>
+    </template>
+  </div>
+</template>
+
+<script setup lang="ts" name="RecommendList">
+import { usePageSearch } from '@/hooks'
+import { getArticleList } from '@/api'
+import { ArticleTypeEnum } from '@/constants'
+import dayjs from 'dayjs'
+
+const router = useRouter()
+
+const { list, total, searchParams, goToPage, changePageSize } = usePageSearch(getArticleList, {
+  defaultParams: { type: ArticleTypeEnum.POST },
+  defaultCurrent: 1,
+  defaultSize: 5,
+})
+
+const handleBackTop = () => {
+  window.scrollTo({
+    top: 0,
+    behavior: 'smooth',
+  })
+}
+</script>
+<!-- <style scoped>
+/* 自定义分页器样式 */
+:deep(.custom-pagination) {
+  --el-pagination-font-size: 14px;
+  --el-pagination-bg-color: transparent;
+  --el-pagination-text-color: #6b7280;
+  --el-pagination-border-radius: 8px;
+  --el-pagination-button-color: #6b7280;
+  --el-pagination-button-bg-color: #f9fafb;
+  --el-pagination-hover-color: #3b82f6;
+  --el-pagination-hover-bg-color: #eff6ff;
+}
+
+/* 分页按钮样式 */
+:deep(.custom-pagination .el-pagination__btn) {
+  border: none;
+  border-radius: 8px;
+  transition: all 0.2s;
+}
+
+:deep(.custom-pagination .el-pagination__btn:hover) {
+  transform: scale(1.05);
+}
+
+:deep(.custom-pagination .el-pager li) {
+  border-radius: 8px;
+  margin: 0 4px;
+  transition: all 0.2s;
+  min-width: 36px;
+  height: 36px;
+  line-height: 34px;
+}
+
+:deep(.custom-pagination .el-pager li:hover) {
+  transform: scale(1.05);
+}
+
+:deep(.custom-pagination .el-pager li.is-active) {
+  background: linear-gradient(135deg, #3b82f6, #6366f1);
+  color: white;
+  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
+}
+
+/* 跳转输入框样式 */
+:deep(.custom-pagination .el-pagination__jump input) {
+  border-radius: 8px;
+  border-color: #e5e7eb;
+  transition: border-color 0.2s;
+}
+
+:deep(.custom-pagination .el-pagination__jump input:focus) {
+  border-color: #3b82f6;
+}
+
+/* 页码选择器样式 */
+:deep(.custom-pagination .el-pagination__sizes .el-input__wrapper) {
+  border-radius: 8px;
+  border-color: #e5e7eb;
+  transition: border-color 0.2s;
+}
+
+:deep(.custom-pagination .el-pagination__sizes .el-input__wrapper:hover) {
+  border-color: #3b82f6;
+}
+
+/* 总数显示样式 */
+:deep(.custom-pagination .el-pagination__total) {
+  color: #6b7280;
+  font-weight: 500;
+}
+
+/* 回到顶部按钮动画 */
+.back-top-btn:hover .w-8 {
+  animation: bounce-rotate 0.6s ease-in-out;
+}
+
+@keyframes bounce-rotate {
+  0%,
+  100% {
+    transform: translateY(0) rotate(0deg);
+  }
+  50% {
+    transform: translateY(-4px) rotate(12deg);
+  }
+}
+</style> -->

src/views/home/components/videoList.vue

+<template>
+  <div class="min-h-screen bg-gray-50/30">
+    <!-- tabs -->
+    <div class="shadow-sm">
+      <div class="max-w-7xl mx-auto px-4">
+        <div class="flex items-center justify-between py-4">
+          <!-- 左侧 Tabs -->
+          <div class="flex items-center space-x-1">
+            <div
+              v-for="tab in tabs"
+              :key="tab.key"
+              :class="[
+                'px-6 py-2 rounded-full text-sm font-medium cursor-pointer transition-all duration-200',
+                activeTab === tab.key
+                  ? 'bg-orange-400 text-white shadow-md'
+                  : 'text-gray-600 hover:text-orange-500 hover:bg-orange-50',
+              ]"
+              @click="activeTab = tab.key"
+            >
+              {{ tab.label }}
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <!-- 第一页的特殊布局 -->
+    <template v-if="currentPage === 1">
+      <!-- 前三个特殊布局 -->
+      <div class="grid grid-cols-1 lg:grid-cols-3 gap-6 mb-8">
+        <!-- 第一个视频 - 占据两列 -->
+        <div
+          class="lg:col-span-2 group relative rounded-2xl overflow-hidden bg-white shadow-sm hover:shadow-xl transition-all duration-500 cursor-pointer"
+        >
+          <div class="relative overflow-hidden">
+            <img
+              src="https://picsum.photos/800/400?random=1"
+              alt="视频封面"
+              class="w-full h-72 object-cover group-hover:scale-105 transition-transform duration-700"
+            />
+            <div
+              class="absolute inset-0 bg-gradient-to-t from-black/60 via-transparent to-transparent"
+            ></div>
+
+            <!-- 标签和数据 -->
+            <div
+              class="absolute top-4 left-4 bg-gradient-to-r from-orange-500 to-red-500 text-white px-3 py-1.5 rounded-full text-sm font-semibold shadow-lg"
+            >
+              🔥 推荐
+            </div>
+            <div
+              class="absolute bottom-4 right-4 bg-black/80 backdrop-blur-sm text-white px-3 py-1.5 rounded-lg text-sm"
+            >
+              01:34:30
+            </div>
+            <div class="absolute bottom-4 left-4 flex gap-4 text-white">
+              <div
+                class="flex items-center gap-1 bg-black/50 backdrop-blur-sm px-3 py-1.5 rounded-lg"
+              >
+                <SvgIcon name="icon_play" size="14" />
+                <span class="text-sm font-medium">1.7万</span>
+              </div>
+              <div
+                class="flex items-center gap-1 bg-black/50 backdrop-blur-sm px-3 py-1.5 rounded-lg"
+              >
+                <SvgIcon name="icon_comment" size="14" />
+                <span class="text-sm font-medium">112</span>
+              </div>
+            </div>
+
+            <!-- 播放按钮 -->
+            <div
+              class="absolute inset-0 flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity duration-300"
+            >
+              <div
+                class="w-16 h-16 bg-white/90 backdrop-blur-sm rounded-full flex items-center justify-center shadow-2xl transform scale-90 group-hover:scale-100 transition-transform duration-300"
+              >
+                <SvgIcon name="icon_play" size="24" color="#374151" />
+              </div>
+            </div>
+          </div>
+
+          <div class="p-6">
+            <h3
+              class="font-bold text-xl mb-3 text-gray-900 group-hover:text-blue-600 transition-colors line-clamp-2"
+            >
+              为什么你的配色"不高级"？
+            </h3>
+            <p class="text-gray-600 mb-4 line-clamp-2 leading-relaxed">
+              【色彩搭配】别让配色毁了你的设计！视觉传达专业暑假改指南，3步让作品集秒变高级...
+            </p>
+            <div class="flex items-center justify-between text-gray-500 text-sm">
+              <div class="flex items-center gap-2">
+                <div
+                  class="w-8 h-8 bg-gradient-to-r from-blue-500 to-purple-500 rounded-full flex items-center justify-center text-white text-xs font-bold"
+                >
+                  柏
+                </div>
+                <span class="font-medium">平面设计小课堂_柏子</span>
+              </div>
+              <span class="text-xs bg-gray-100 px-2 py-1 rounded-full">8-1</span>
+            </div>
+          </div>
+        </div>
+
+        <!-- 右侧两个视频 -->
+        <div class="flex flex-col gap-6">
+          <div
+            v-for="n in 2"
+            :key="n"
+            class="group relative rounded-lg overflow-hidden bg-white shadow-sm hover:shadow-lg transition-all duration-300 cursor-pointer flex-1"
+            @click="goVideoDetail(n)"
+          >
+            <div class="relative overflow-hidden">
+              <img
+                :src="`https://picsum.photos/400/200?random=${n + 1}`"
+                alt="视频封面"
+                class="w-full h-36 object-cover group-hover:scale-105 transition-transform duration-500"
+              />
+              <div class="absolute inset-0 bg-gradient-to-t from-black/50 to-transparent"></div>
+
+              <div
+                class="absolute top-2 left-2 bg-gradient-to-r from-blue-500 to-cyan-500 text-white px-2 py-1 rounded-full text-xs font-semibold"
+              >
+                {{ n === 1 ? '数码' : '教程' }}
+              </div>
+              <div
+                class="absolute bottom-2 right-2 bg-black/80 backdrop-blur-sm text-white px-2 py-1 rounded text-xs"
+              >
+                09:35
+              </div>
+
+              <!-- 播放按钮 -->
+              <div
+                class="absolute inset-0 flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity duration-300"
+              >
+                <div
+                  class="w-10 h-10 bg-white/90 backdrop-blur-sm rounded-full flex items-center justify-center shadow-lg"
+                >
+                  <SvgIcon name="icon_play" size="16" color="#374151" />
+                </div>
+              </div>
+            </div>
+
+            <div class="p-4">
+              <h3
+                class="font-semibold text-base mb-2 group-hover:text-blue-600 transition-colors line-clamp-2"
+              >
+                {{ n === 1 ? '复日奶茶' : 'PS最新版零基础全套' }}
+              </h3>
+              <p class="text-gray-600 text-sm mb-3 line-clamp-2">
+                {{
+                  n === 1
+                    ? 'Figma+3D 奶茶小卡片｜清爽夏日实用指南...'
+                    : '【PS全套教程】3节课，Photoshop零基础入门...'
+                }}
+              </p>
+              <div class="flex items-center justify-between text-gray-500 text-xs">
+                <span class="font-medium">{{ n === 1 ? '设计师的日常' : 'PS教程' }}</span>
+                <span class="bg-gray-100 px-2 py-1 rounded-full">{{
+                  n === 1 ? '7-29' : '7-27'
+                }}</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- 剩余视频 - 标准网格 -->
+      <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6">
+        <div
+          v-for="item in 12"
+          :key="item"
+          class="group relative rounded-lg overflow-hidden bg-white shadow-sm hover:shadow-lg transition-all duration-300 cursor-pointer"
+        >
+          <div class="relative overflow-hidden">
+            <img
+              :src="`https://picsum.photos/300/200?random=${item + 10}`"
+              alt="视频封面"
+              class="w-full h-44 object-cover group-hover:scale-105 transition-transform duration-500"
+            />
+            <div class="absolute inset-0 bg-gradient-to-t from-black/40 to-transparent"></div>
+
+            <!-- 标签 -->
+            <div
+              class="absolute top-3 left-3 bg-gradient-to-r from-indigo-500 to-purple-500 text-white px-2.5 py-1 rounded-full text-xs font-semibold"
+            >
+              {{ item % 2 === 0 ? '🔬 科技' : '🎨 设计' }}
+            </div>
+
+            <!-- 时长 -->
+            <div
+              class="absolute bottom-3 right-3 bg-black/80 backdrop-blur-sm text-white px-2 py-1 rounded-lg text-xs"
+            >
+              {{ String(Math.floor(Math.random() * 60)).padStart(2, '0') }}:{{
+                String(Math.floor(Math.random() * 60)).padStart(2, '0')
+              }}
+            </div>
+
+            <!-- 数据 -->
+            <div class="absolute bottom-3 left-3 flex gap-3 text-white text-xs">
+              <div
+                class="flex items-center gap-1 bg-black/50 backdrop-blur-sm px-2 py-1 rounded-lg"
+              >
+                <SvgIcon name="icon_play" size="12" />
+                <span>{{ (Math.random() * 10).toFixed(1) }}万</span>
+              </div>
+              <div
+                class="flex items-center gap-1 bg-black/50 backdrop-blur-sm px-2 py-1 rounded-lg"
+              >
+                <SvgIcon name="icon_comment" size="12" />
+                <span>{{ Math.floor(Math.random() * 1000) }}</span>
+              </div>
+            </div>
+
+            <!-- 播放按钮 -->
+            <div
+              class="absolute inset-0 flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity duration-300"
+            >
+              <div
+                class="w-12 h-12 bg-white/90 backdrop-blur-sm rounded-full flex items-center justify-center shadow-xl transform scale-90 group-hover:scale-100 transition-transform duration-300"
+              >
+                <SvgIcon name="icon_play" size="20" color="#374151" />
+              </div>
+            </div>
+          </div>
+
+          <div class="p-4">
+            <h3
+              class="font-semibold text-base mb-2 group-hover:text-blue-600 transition-colors line-clamp-2"
+            >
+              {{ ['设计师必看的创意灵感来源', '前端开发实战教程', 'UI设计从入门到精通'][item % 3] }}
+            </h3>
+            <p class="text-gray-600 text-sm mb-3 line-clamp-2 leading-relaxed">
+              这是一个非常有趣的视频教程，包含了丰富的内容和实用的技巧，适合初学者和进阶用户学习...
+            </p>
+            <div class="flex items-center justify-between text-gray-500 text-xs">
+              <div class="flex items-center gap-2">
+                <div
+                  class="w-6 h-6 bg-gradient-to-r from-green-400 to-blue-500 rounded-full flex items-center justify-center text-white text-xs font-bold"
+                >
+                  {{ String(item).slice(-1) }}
+                </div>
+                <span class="font-medium">UP主{{ item }}</span>
+              </div>
+              <span class="bg-gray-100 px-2 py-1 rounded-full"
+                >{{ Math.floor(Math.random() * 30) + 1 }}天前</span
+              >
+            </div>
+          </div>
+        </div>
+      </div>
+    </template>
+
+    <!-- 其他页面 - 标准3列网格 -->
+    <template v-else>
+      <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6">
+        <div
+          v-for="item in 12"
+          :key="item"
+          class="group relative rounded-lg overflow-hidden bg-white shadow-sm hover:shadow-lg transition-all duration-300 cursor-pointer"
+        >
+          <div class="relative overflow-hidden">
+            <img
+              :src="`https://picsum.photos/300/200?random=${item + 10}`"
+              alt="视频封面"
+              class="w-full h-44 object-cover group-hover:scale-105 transition-transform duration-500"
+            />
+            <div class="absolute inset-0 bg-gradient-to-t from-black/40 to-transparent"></div>
+
+            <!-- 标签 -->
+            <div
+              class="absolute top-3 left-3 bg-gradient-to-r from-indigo-500 to-purple-500 text-white px-2.5 py-1 rounded-full text-xs font-semibold"
+            >
+              {{ item % 2 === 0 ? '🔬 科技' : '🎨 设计' }}
+            </div>
+
+            <!-- 时长 -->
+            <div
+              class="absolute bottom-3 right-3 bg-black/80 backdrop-blur-sm text-white px-2 py-1 rounded-lg text-xs"
+            >
+              {{ String(Math.floor(Math.random() * 60)).padStart(2, '0') }}:{{
+                String(Math.floor(Math.random() * 60)).padStart(2, '0')
+              }}
+            </div>
+
+            <!-- 数据 -->
+            <div class="absolute bottom-3 left-3 flex gap-3 text-white text-xs">
+              <div
+                class="flex items-center gap-1 bg-black/50 backdrop-blur-sm px-2 py-1 rounded-lg"
+              >
+                <SvgIcon name="icon_play" size="12" />
+                <span>{{ (Math.random() * 10).toFixed(1) }}万</span>
+              </div>
+              <div
+                class="flex items-center gap-1 bg-black/50 backdrop-blur-sm px-2 py-1 rounded-lg"
+              >
+                <SvgIcon name="icon_comment" size="12" />
+                <span>{{ Math.floor(Math.random() * 1000) }}</span>
+              </div>
+            </div>
+
+            <!-- 播放按钮 -->
+            <div
+              class="absolute inset-0 flex items-center justify-center opacity-0 group-hover:opacity-100 transition-opacity duration-300"
+            >
+              <div
+                class="w-12 h-12 bg-white/90 backdrop-blur-sm rounded-full flex items-center justify-center shadow-xl transform scale-90 group-hover:scale-100 transition-transform duration-300"
+              >
+                <SvgIcon name="icon_play" size="20" color="#374151" />
+              </div>
+            </div>
+          </div>
+
+          <div class="p-4">
+            <h3
+              class="font-semibold text-base mb-2 group-hover:text-blue-600 transition-colors line-clamp-2"
+            >
+              {{ ['设计师必看的创意灵感来源', '前端开发实战教程', 'UI设计从入门到精通'][item % 3] }}
+            </h3>
+            <p class="text-gray-600 text-sm mb-3 line-clamp-2 leading-relaxed">
+              这是一个非常有趣的视频教程，包含了丰富的内容和实用的技巧，适合初学者和进阶用户学习...
+            </p>
+            <div class="flex items-center justify-between text-gray-500 text-xs">
+              <div class="flex items-center gap-2">
+                <div
+                  class="w-6 h-6 bg-gradient-to-r from-green-400 to-blue-500 rounded-full flex items-center justify-center text-white text-xs font-bold"
+                >
+                  {{ String(item).slice(-1) }}
+                </div>
+                <span class="font-medium">UP主{{ item }}</span>
+              </div>
+              <span class="bg-gray-100 px-2 py-1 rounded-full"
+                >{{ Math.floor(Math.random() * 30) + 1 }}天前</span
+              >
+            </div>
+          </div>
+        </div>
+      </div>
+    </template>
+
+    <!-- 底部分页 -->
+    <div class="bottom-pagination bg-gray-50/80 backdrop-blur-8 border-t border-gray-200">
+      <div class="max-w-7xl mx-auto px-8 py-6">
+        <div class="flex items-center justify-between">
+          <!-- 左侧：回到顶部按钮 -->
+          <div class="left">
+            <button
+              class="back-top-btn group flex items-center gap-3 px-4 py-2.5 bg-gradient-to-r from-blue-50 to-indigo-50 hover:from-blue-100 hover:to-indigo-100 border border-blue-200/50 rounded-full transition-all duration-300 hover:shadow-lg hover:-translate-y-1 active:scale-95"
+              title="回到顶部"
+              @click="handleBackTop"
+            >
+              <div
+                class="w-8 h-8 bg-gradient-to-r from-blue-500 to-indigo-500 rounded-full flex items-center justify-center group-hover:rotate-12 transition-transform duration-300 shadow-sm"
+              >
+                <SvgIcon color="#409eff" name="icon_top" size="16" />
+              </div>
+              <span
+                class="text-sm font-medium text-gray-700 group-hover:text-blue-600 transition-colors"
+                >回到顶部</span
+              >
+            </button>
+          </div>
+
+          <!-- 右侧：分页器 -->
+          <div class="right">
+            <div
+              class="pagination-wrapper bg-white rounded-xl shadow-sm border border-gray-100 p-3"
+            >
+              <el-pagination
+                v-model:current-page="currentPage"
+                v-model:page-size="pageSize"
+                :page-sizes="[15, 30, 45, 60]"
+                layout="prev, pager, next, jumper, total"
+                :total="400"
+                class="custom-pagination"
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts" name="RecommendList">
+import { useRouter } from 'vue-router'
+
+const currentPage = ref(1)
+const pageSize = ref(15)
+// Tabs 配置
+const router = useRouter()
+const tabs = [
+  { key: 'latest', label: '最新发布' },
+  { key: 'popular', label: '最多模仿' },
+  { key: 'favorites', label: '最多收藏' },
+]
+
+const activeTab = ref('latest')
+const handleBackTop = () => {
+  window.scrollTo({ top: 0, behavior: 'smooth' })
+}
+
+const goVideoDetail = (n: number) => {
+  router.push(`/videoDetail?id=${n}`)
+}
+</script>
+
+<style>
+/* 文本截断样式 */
+.line-clamp-2 {
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+}
+</style>

src/views/home/index.vue

+<template>
+  <div class="page">
+    <div class="header h-40px items-center justify-between">
+      <div class="left flex gap-3 flex items-center">
+        <Tabs v-model="activeTab" :tabs="tabs" />
+        <!-- 刷新图标 -->
+        <el-icon size="15" class="cursor-pointer hover:rotate-180 transition-all duration-300"
+          ><Refresh
+        /></el-icon>
+      </div>
+    </div>
+    <el-divider style="margin: 10px 0 20px 0" />
+    <!-- 主内容区域 -->
+    <transition name="fade" mode="out-in">
+      <RecommendList v-if="activeTab === '推荐' || activeTab === '最新'" />
+      <VideoList v-else />
+    </transition>
+  </div>
+</template>
+
+<script setup lang="ts" name="CultureHome">
+import RecommendList from './components/recommendList.vue'
+import VideoList from './components/videoList.vue'
+import Tabs from '@/components/common/Tabs'
+
+const tabs = [
+  { label: '推荐', value: '推荐' },
+  { label: '最新', value: '最新' },
+  { label: '视频', value: '视频' },
+]
+const activeTab = ref('推荐')
+</script>
+
+<style lang="scss" scoped>
+.tab-item.active:hover {
+  background-color: #f8b62b !important;
+  color: #000 !important;
+  box-shadow: none !important; /* 如果你还要禁掉 hover 阴影 */
+}
+.fade-enter-active,
+.fade-leave-active {
+  transition: opacity 0.3s ease;
+}
+.fade-enter-from,
+.fade-leave-to {
+  opacity: 0;
+}
+</style>

src/views/pointsStore/components/exchangeContent.tsx

+/**
+ * 确认兑换商品的弹窗内容
+ */
+import { ShopGoodsTypeEnum, regionListOptions } from '@/constants'
+import type { ShopItem } from '@/api'
+import type { SetupContext } from 'vue'
+import ask from '@/assets/img/culture/ask.png'
+
+type ExchangeContentProps = {
+  item: ShopItem
+  type: ShopGoodsTypeEnum
+  modelValue: string
+}
+type ExchangeContentEvents = {
+  'update:modelValue'(message: string): void
+}
+
+export default function ExchangeContent(
+  { item, modelValue, type }: ExchangeContentProps,
+  context: SetupContext<ExchangeContentEvents>,
+) {
+  return (
+    <div class="exchange-content py-6">
+      {/* 商品图片区域 - 同上 */}
+      <div class="flex justify-center mb-8">
+        <div class="relative">
+          <div class="w-32 h-32 bg-gradient-to-br from-orange-100 to-pink-100 rounded-3xl flex items-center justify-center">
+            <div class="w-20 h-20 bg-white rounded-2xl flex items-center justify-center shadow-sm">
+              <img src={ask} alt={item.name} class="w-16 h-16 object-contain" />
+            </div>
+          </div>
+          <div class="absolute -top-2 -right-2 w-7 h-7 bg-blue-500 rounded-full flex items-center justify-center">
+            <span class="text-white text-sm font-medium">6</span>
+          </div>
+        </div>
+      </div>
+
+      {/* 商品信息 */}
+      <div class="space-y-4 mb-8">
+        <div class="flex items-center justify-center gap-3">
+          <div class="w-1.5 h-1.5 bg-gray-400 rounded-full"></div>
+          <span class="text-gray-600 text-sm">名称：</span>
+          <span class="font-medium text-gray-900">{item.name}</span>
+        </div>
+
+        <div class="flex items-center justify-center gap-3">
+          <div class="w-1.5 h-1.5 bg-orange-400 rounded-full"></div>
+          <span class="text-gray-600 text-sm">积分：</span>
+          <span class="font-semibold text-orange-500 text-lg">{item.price}YA币</span>
+        </div>
+      </div>
+
+      {/* 办公点选择 */}
+      {type === ShopGoodsTypeEnum.REAL_GOODS && (
+        <div class="mb-6">
+          <div class="text-center text-gray-700 text-sm font-medium mb-4">选择办公点：</div>
+          <div class=" w-full">
+            <el-select
+              modelValue={modelValue}
+              onUpdate:modelValue={(value: string) => context.emit('update:modelValue', value)}
+              placeholder="请选择办公点"
+            >
+              {regionListOptions.map((office) => (
+                <el-option
+                  class="text-center w-full"
+                  key={office.value}
+                  label={office.label}
+                  value={office.value}
+                />
+              ))}
+            </el-select>
+          </div>
+        </div>
+      )}
+    </div>
+  )
+}
+
+ExchangeContent.props = {
+  item: {
+    type: Object as PropType<ShopItem>,
+    required: true,
+  },
+  modelValue: {
+    type: String,
+    required: false,
+  },
+  type: {
+    type: Number,
+    required: true,
+  },
+}
+
+ExchangeContent.emits = {
+  'update:modelValue': (value: string) => value,
+}

src/views/pointsStore/components/exchangeRecordDilaog.vue

+<template>
+  <el-dialog
+    v-model="visible"
+    title="兑换记录"
+    width="1000px"
+    class="exchange-record-dialog"
+    align-center
+    destroy-on-close
+  >
+    <div class="p-6">
+      <!-- 搜索筛选区域 -->
+      <div class="flex gap-4 mb-6">
+        <el-select v-model="searchParams.type" placeholder="选择类型" clearable>
+          <el-option label="全部类型" value="" />
+          <el-option label="商品兑换" value="product" />
+          <el-option label="积分消费" value="consume" />
+          <el-option label="积分获得" value="earn" />
+        </el-select>
+
+        <el-date-picker
+          v-model="searchParams.dateRange"
+          type="daterange"
+          range-separator="至"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+          format="YYYY-MM-DD"
+          value-format="YYYY-MM-DD"
+          class="w-80"
+          clearable
+        />
+        <el-button type="primary" @click="onSearch">搜索</el-button>
+      </div>
+
+      <!-- 表格 -->
+      <el-table :data="tableData" class="exchange-table" stripe style="width: 100%" height="400">
+        <el-table-column prop="name" label="名称" width="200" />
+        <el-table-column prop="detail" label="详情" min-width="250" show-overflow-tooltip />
+        <el-table-column prop="yaCoin" label="YA币" width="120" align="center">
+          <template #default="scope">
+            <span
+              :class="scope.row.yaCoin > 0 ? 'text-green-500' : 'text-red-500'"
+              class="font-semibold"
+            >
+              {{ scope.row.yaCoin > 0 ? '+' : '' }}{{ scope.row.yaCoin }}
+            </span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="time" label="时间" width="160" />
+        <el-table-column prop="type" label="类型" width="120" align="center">
+          <template #default="scope">
+            <el-tag :type="getTagType(scope.row.type)" size="small" round>
+              {{ getTypeText(scope.row.type) }}
+            </el-tag>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <!-- 分页 -->
+      <div class="flex justify-center mt-6">
+        <el-pagination
+          v-model:current-page="searchParams.current"
+          :page-size="searchParams.size"
+          :total="total"
+          layout="prev, pager, next,total"
+          class="custom-pagination"
+        />
+      </div>
+    </div>
+  </el-dialog>
+</template>
+
+<script setup lang="ts">
+import { usePageSearch } from '@/hooks'
+import { getYabiExchangeList } from '@/api'
+
+const { total, searchParams } = usePageSearch(getYabiExchangeList, {
+  immediate: false,
+})
+
+const visible = shallowRef(false)
+
+// 示例数据
+const tableData = ref([
+  {
+    name: 'YAYA限定T恤',
+    detail: '2024年春季限定款T恤，100%纯棉材质，经典YAYA图案印花',
+    yaCoin: -2000,
+    time: '2024-01-15 14:30',
+    type: 'product',
+  },
+  {
+    name: '每日签到奖励',
+    detail: '连续签到第7天奖励，感谢您的坚持！',
+    yaCoin: 100,
+    time: '2024-01-15 09:00',
+    type: 'earn',
+  },
+  {
+    name: 'YAYA公仔玩偶',
+    detail: '超可爱的YAYA毛绒公仔，高度约20cm，柔软舒适',
+    yaCoin: -3500,
+    time: '2024-01-14 16:45',
+    type: 'product',
+  },
+  {
+    name: '发布优质内容',
+    detail: '您发布的内容《技能升级指南》获得了社区认可',
+    yaCoin: 500,
+    time: '2024-01-14 11:20',
+    type: 'earn',
+  },
+  {
+    name: '专属徽章套装',
+    detail: '包含5枚不同主题的金属徽章，限量发行',
+    yaCoin: -1500,
+    time: '2024-01-13 20:15',
+    type: 'product',
+  },
+  {
+    name: '参与活动奖励',
+    detail: '参与"新年创作挑战"活动获得奖励',
+    yaCoin: 300,
+    time: '2024-01-13 15:30',
+    type: 'earn',
+  },
+  {
+    name: '定制保温杯',
+    detail: '不锈钢保温杯，印有专属YAYA标志，容量500ml',
+    yaCoin: -1200,
+    time: '2024-01-12 09:20',
+    type: 'product',
+  },
+  {
+    name: '邀请好友奖励',
+    detail: '成功邀请新用户注册并完成首次任务',
+    yaCoin: 200,
+    time: '2024-01-12 08:45',
+    type: 'earn',
+  },
+])
+
+const getTagType = (type: string) => {
+  switch (type) {
+    case 'product':
+      return 'danger'
+    case 'earn':
+      return 'success'
+    case 'consume':
+      return 'warning'
+    default:
+      return 'info'
+  }
+}
+
+const getTypeText = (type: string) => {
+  switch (type) {
+    case 'product':
+      return '商品兑换'
+    case 'earn':
+      return '积分获得'
+    case 'consume':
+      return '积分消费'
+    default:
+      return '其他'
+  }
+}
+
+const open = () => {
+  visible.value = true
+}
+
+const onSearch = () => {}
+
+defineExpose({
+  open,
+})
+</script>
+
+<style scoped></style>

src/views/pointsStore/index.vue

+<template>
+  <div class="min-h-screen bg-gradient-to-br from-[#e8f1ff] to-[#f3ebff] p-6">
+    <div class="max-w-[1440px] mx-auto flex flex-col lg:flex-row gap-4 transition-all duration-500">
+      <!-- 左侧主要内容 -->
+      <div class="flex-1 basis-full lg:basis-3/4 transition-all duration-500">
+        <!-- 当前积分 -->
+        <div class="bg-white rounded-2xl p-6 shadow-md flex justify-between items-center mb-6">
+          <span class="text-lg font-semibold text-gray-700">
+            当前YA币：
+            <span class="text-[#8b5cf6] text-2xl font-bold">{{ currentYaBi }}</span>
+          </span>
+          <button
+            class="px-4 py-2 !outline-none bg-gradient-to-r from-[#8b5cf6] to-[#6366f1] text-white rounded-full text-sm hover:bg-gradient-to-r cursor-pointer hover:shadow-lg transition-all duration-300"
+            @click="onOpenExchangeRecordDialog"
+          >
+            YA币收支记录
+          </button>
+        </div>
+
+        <!-- 头像装饰 -->
+        <div class="mb-6">
+          <h2 class="text-lg font-semibold mb-3 text-gray-700">虚拟装饰</h2>
+          <div class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-6 gap-4">
+            <div
+              v-for="item in virtualGoodsList"
+              :key="item.id"
+              class="bg-white rounded-xl shadow p-3 flex flex-col items-center hover:shadow-lg transition-all cursor-pointer"
+              @click="onExchangeGoods(item, ShopGoodsTypeEnum.VIRTUAL_GOODS)"
+            >
+              <img src="@/assets/img/culture/ask.png" alt="" class="w-20 h-20" />
+              <div class="text-sm text-gray-600 mb-2">{{ item.name }}</div>
+              <div class="bg-pink-100 text-pink-600 text-xs px-3 py-1 rounded-full">
+                {{ item.price }}积分
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <!-- 实物奖品 -->
+        <div>
+          <h2 class="text-lg font-semibold mb-3 text-gray-700">亚声实物</h2>
+          <div class="flex gap-3 text-sm text-gray-500 mb-4 items-center">
+            地区：<Tabs
+              :tabs="tabs"
+              v-model="realGoodsSearchParams.region as string"
+              @change="onChangeRegion"
+            />
+          </div>
+          <div
+            v-show="realGoodsList.length"
+            class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 gap-4"
+          >
+            <div
+              v-for="item in realGoodsList"
+              :key="item.id"
+              class="bg-white rounded-xl shadow p-3 flex flex-col items-center hover:shadow-lg transition-all cursor-pointer"
+              @click="onExchangeGoods(item, ShopGoodsTypeEnum.REAL_GOODS)"
+            >
+              <img src="@/assets/img/culture/ask.png" alt="" class="w-20 h-20" />
+              <div class="text-sm text-gray-600 mb-2">{{ item.name }}</div>
+              <div class="bg-pink-100 text-pink-600 text-xs px-3 py-1 rounded-full">
+                {{ item.price }}积分
+              </div>
+            </div>
+          </div>
+          <div v-show="!realGoodsList.length" class="flex justify-center items-center">
+            <el-empty description="暂无数据" />
+          </div>
+        </div>
+      </div>
+
+      <!-- 右侧栏 -->
+      <!-- <div class="hidden lg:flex flex-col gap-4 basis-1/4 transition-all duration-500">
+        <div class="bg-[#e0e7ff] rounded-2xl p-5 shadow flex flex-col items-center text-center">
+          <div
+            class="w-20 h-20 bg-gradient-to-br from-[#a5b4fc] to-[#818cf8] rounded-full mb-3"
+          ></div>
+          <div class="text-gray-700 font-semibold">等级：LV1</div>
+          <div class="text-gray-500 mb-3">YAYA币：8888</div>
+          <button
+            class="px-4 py-2 rounded-full bg-gradient-to-r from-[#f59e0b] to-[#f97316] text-white mb-2"
+          >
+            立即签到
+          </button>
+          <button>大啊啊啊啊啊啊啊啊啊啊啊</button>
+          <button
+            class="px-4 py-2 rounded-full bg-gradient-to-r from-[#a78bfa] to-[#6366f1] text-white"
+          >
+            积分兑换
+          </button>
+        </div>
+
+        <div class="bg-[#f3e8ff] rounded-2xl p-5 shadow text-center">
+          <div class="text-gray-700 font-semibold mb-2">YAYA案例库</div>
+          <p class="text-sm text-gray-500 mb-3">案例库说明文字，可放两行以内</p>
+          <button
+            class="px-4 py-1.5 rounded-full bg-gradient-to-r from-[#8b5cf6] to-[#6366f1] text-white text-sm"
+          >
+            去投稿
+          </button>
+        </div>
+
+        <div class="bg-[#e0f2fe] rounded-2xl p-5 shadow text-center">
+          <div class="text-gray-700 font-semibold mb-2">任务中心</div>
+          <p class="text-sm text-gray-500 mb-3">完成任务领取积分奖励</p>
+          <button
+            class="px-4 py-1.5 rounded-full bg-gradient-to-r from-[#60a5fa] to-[#3b82f6] text-white text-sm"
+          >
+            查看任务
+          </button>
+        </div>
+      </div> -->
+    </div>
+    <div class="mt-40 text-center text-sm text-gray-500 mb-4">
+      实物商品兑换后清联系相关负责人领取奖励 ——
+      <span plain type="primary" class="text-blue-400 cursor-pointer">联系人对照表</span>
+    </div>
+    <ExchangeRecordDialog ref="exchangeRecordDialogRef" />
+  </div>
+</template>
+
+<script setup lang="tsx">
+import { getShopItemList, getYaBiData } from '@/api'
+import { usePageSearch } from '@/hooks'
+
+import { regionListOptions, ShopGoodsTypeEnum } from '@/constants'
+import type { ShopItem } from '@/api'
+
+import Tabs from '@/components/common/Tabs'
+import ExchangeRecordDialog from './components/exchangeRecordDilaog.vue'
+import ExchangeContent from './components/exchangeContent.tsx'
+const activeTab = ref('深圳')
+const tabs = ref(regionListOptions)
+
+const currentYaBi = ref(0)
+const exchangeRecordDialogRef =
+  useTemplateRef<InstanceType<typeof ExchangeRecordDialog>>('exchangeRecordDialogRef')
+
+// 虚拟商品
+const { list: virtualGoodsList } = usePageSearch(getShopItemList, {
+  defaultParams: {
+    goodsType: ShopGoodsTypeEnum.VIRTUAL_GOODS,
+  },
+})
+
+// 实物商品
+const {
+  list: realGoodsList,
+  goToPage: realGoodsGoToPage,
+  searchParams: realGoodsSearchParams,
+} = usePageSearch(getShopItemList, {
+  defaultParams: {
+    goodsType: ShopGoodsTypeEnum.REAL_GOODS,
+    region: activeTab.value,
+  },
+})
+
+const onChangeRegion = () => {
+  realGoodsGoToPage(1)
+}
+
+const onOpenExchangeRecordDialog = () => {
+  exchangeRecordDialogRef.value?.open()
+}
+
+// 获取YA币数据
+const getYaBiDataFn = async () => {
+  const { data } = await getYaBiData()
+  currentYaBi.value = data.currentValue
+}
+
+// 兑换商品
+
+const onExchangeGoods = async (item: ShopItem, type: ShopGoodsTypeEnum) => {
+  // if (currentYaBi.value < item.price) return ElMessage.error('YA币不足')
+  const selectedRegion = ref('广州')
+  await ElMessageBox({
+    title: 'YA币兑换',
+    message: () => (
+      // @ts-ignore
+      <ExchangeContent item={item} type={type} v-model={selectedRegion.value}></ExchangeContent>
+    ),
+    confirmButtonText: '确认兑换',
+    cancelButtonText: '取消',
+    showCancelButton: true,
+    center: true,
+  })
+}
+
+onMounted(async () => {
+  getYaBiDataFn()
+})
+</script>
+<style></style>

src/views/postArticle/index.vue

+```vue
+<template>
+  <div class="min-h-screen bg-gradient-to-br from-blue-400 via-blue-500 to-purple-600">
+    <!-- 顶部导航栏 -->
+    <div class="bg-white/10 backdrop-blur-md border-b border-white/20">
+      <div class="max-w-7xl mx-auto px-6 py-4 flex items-center justify-between">
+        <div class="flex items-center gap-4">
+          <div
+            class="w-8 h-8 bg-gradient-to-r from-orange-400 to-red-500 rounded-lg flex items-center justify-center"
+          >
+            <span class="text-white font-bold text-sm">S</span>
+          </div>
+          <span class="text-white font-semibold">SOUNDASIA</span>
+        </div>
+
+        <div class="flex items-center gap-4">
+          <div class="relative">
+            <input
+              type="text"
+              placeholder="搜索"
+              class="w-80 px-4 py-2 bg-white/20 border border-white/30 rounded-lg text-white placeholder-white/70 focus:outline-none focus:ring-2 focus:ring-white/50"
+            />
+          </div>
+          <div class="w-9 h-9 bg-white/20 rounded-full"></div>
+          <span class="text-white">个人中心</span>
+          <button
+            class="px-4 py-2 bg-white/20 text-white rounded-lg hover:bg-white/30 transition-colors"
+          >
+            意见反馈
+          </button>
+          <button
+            class="px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors"
+          >
+            去发帖
+          </button>
+        </div>
+      </div>
+    </div>
+
+    <!-- 主要内容区域 -->
+    <div class="max-w-7xl mx-auto px-6 py-8">
+      <!-- 页面标题 -->
+      <div class="text-center mb-8">
+        <h1 class="text-4xl font-bold text-white mb-2 flex items-center justify-center gap-3">
+          <svg class="w-9 h-9" fill="currentColor" viewBox="0 0 20 20">
+            <path
+              d="M13.586 3.586a2 2 0 112.828 2.828l-.793.793-2.828-2.828.793-.793zM11.379 5.793L3 14.172V17h2.828l8.38-8.379-2.83-2.828z"
+            />
+          </svg>
+          发布帖子
+        </h1>
+        <p class="text-white/80 text-lg">分享你的想法，记录美好时光</p>
+      </div>
+
+      <!-- 内容区域 -->
+      <div class="grid grid-cols-1 lg:grid-cols-[1fr_320px] gap-6">
+        <!-- 左侧编辑区域 -->
+        <div class="bg-white rounded-2xl shadow-2xl overflow-hidden">
+          <!-- 编辑器头部 -->
+          <div class="bg-gradient-to-r from-blue-500 to-purple-600 px-6 py-4">
+            <div class="flex items-center justify-between">
+              <span class="text-white text-lg font-semibold">创作内容</span>
+              <div class="flex bg-white/20 rounded-lg p-1">
+                <button
+                  class="px-4 py-2 bg-white text-blue-600 shadow-sm rounded-md text-sm font-medium"
+                >
+                  富文本
+                </button>
+                <button
+                  class="px-4 py-2 text-white hover:bg-white/20 rounded-md text-sm font-medium transition-all"
+                >
+                  Markdown
+                </button>
+              </div>
+            </div>
+          </div>
+
+          <!-- 编辑器内容 -->
+          <div class="p-6 space-y-6">
+            <!-- 标题输入 -->
+            <div>
+              <label class="block text-sm font-medium text-gray-700 mb-2">帖子标题</label>
+              <input
+                type="text"
+                placeholder="请输入帖子标题..."
+                maxlength="100"
+                class="w-full px-4 py-3 border-2 border-gray-200 rounded-xl focus:border-blue-500 focus:outline-none focus:ring-4 focus:ring-blue-500/10 transition-all text-lg"
+              />
+              <div class="text-right text-xs text-gray-400 mt-1">0/100</div>
+            </div>
+
+            <!-- 内容输入 -->
+            <div>
+              <textarea
+                placeholder="分享你的想法..."
+                rows="12"
+                maxlength="5000"
+                class="w-full px-4 py-3 border-2 border-gray-200 rounded-xl focus:border-blue-500 focus:outline-none focus:ring-4 focus:ring-blue-500/10 transition-all resize-vertical"
+              ></textarea>
+              <div class="text-right text-xs text-gray-400 mt-1">0/5000</div>
+            </div>
+
+            <!-- 图片上传区域 -->
+            <div>
+              <label class="block text-sm font-medium text-gray-700 mb-3">添加图片</label>
+              <div
+                class="border-2 border-dashed border-gray-200 rounded-xl p-6 hover:border-blue-400 transition-colors"
+              >
+                <div class="grid grid-cols-3 gap-4">
+                  <!-- 上传按钮 -->
+                  <div
+                    class="aspect-square border-2 border-dashed border-gray-300 rounded-lg flex flex-col items-center justify-center text-gray-400 hover:text-blue-500 hover:border-blue-400 transition-colors cursor-pointer"
+                  >
+                    <svg class="w-8 h-8 mb-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                      <path
+                        stroke-linecap="round"
+                        stroke-linejoin="round"
+                        stroke-width="2"
+                        d="M12 6v6m0 0v6m0-6h6m-6 0H6"
+                      />
+                    </svg>
+                    <span class="text-sm">添加图片</span>
+                  </div>
+                  <!-- 示例图片 -->
+                  <div class="aspect-square bg-gray-100 rounded-lg overflow-hidden relative group">
+                    <img
+                      src="https://picsum.photos/150/150?random=1"
+                      alt="预览"
+                      class="w-full h-full object-cover"
+                    />
+                    <div
+                      class="absolute inset-0 bg-black/50 opacity-0 group-hover:opacity-100 transition-opacity flex items-center justify-center"
+                    >
+                      <button class="text-white hover:text-red-400 transition-colors">
+                        <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                          <path
+                            stroke-linecap="round"
+                            stroke-linejoin="round"
+                            stroke-width="2"
+                            d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"
+                          />
+                        </svg>
+                      </button>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+
+            <!-- 设置选项 -->
+            <div class="bg-gray-50 rounded-xl p-6">
+              <h3 class="font-semibold text-gray-800 mb-4">发布设置</h3>
+              <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
+                <!-- 分类选择 -->
+                <div>
+                  <label class="block text-sm font-medium text-gray-700 mb-2">分类</label>
+                  <select
+                    class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:border-blue-500 focus:outline-none"
+                  >
+                    <option>选择分类</option>
+                    <option>日常生活</option>
+                    <option>技术分享</option>
+                    <option>摄影作品</option>
+                    <option>美食分享</option>
+                    <option>旅行游记</option>
+                    <option>学习笔记</option>
+                  </select>
+                </div>
+
+                <!-- 可见性设置 -->
+                <div>
+                  <label class="block text-sm font-medium text-gray-700 mb-2">可见性</label>
+                  <select
+                    class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:border-blue-500 focus:outline-none"
+                  >
+                    <option>公开可见</option>
+                    <option>仅关注者</option>
+                    <option>仅自己</option>
+                  </select>
+                </div>
+              </div>
+
+              <!-- 标签输入 -->
+              <div class="mt-4">
+                <label class="block text-sm font-medium text-gray-700 mb-2">标签</label>
+                <div class="flex flex-wrap gap-2 mb-2">
+                  <span
+                    class="inline-flex items-center gap-1 px-3 py-1 bg-gradient-to-r from-blue-500 to-purple-600 text-white text-sm rounded-full"
+                  >
+                    技术分享
+                    <button class="hover:text-red-200 transition-colors">
+                      <svg class="w-3 h-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path
+                          stroke-linecap="round"
+                          stroke-linejoin="round"
+                          stroke-width="2"
+                          d="M6 18L18 6M6 6l12 12"
+                        />
+                      </svg>
+                    </button>
+                  </span>
+                  <span
+                    class="inline-flex items-center gap-1 px-3 py-1 bg-gradient-to-r from-blue-500 to-purple-600 text-white text-sm rounded-full"
+                  >
+                    Vue.js
+                    <button class="hover:text-red-200 transition-colors">
+                      <svg class="w-3 h-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path
+                          stroke-linecap="round"
+                          stroke-linejoin="round"
+                          stroke-width="2"
+                          d="M6 18L18 6M6 6l12 12"
+                        />
+                      </svg>
+                    </button>
+                  </span>
+                  <button
+                    class="px-3 py-1 border-2 border-dashed border-blue-300 text-blue-600 text-sm rounded-full hover:border-blue-500 hover:bg-blue-50 transition-colors"
+                  >
+                    + 添加标签
+                  </button>
+                </div>
+              </div>
+
+              <!-- 其他选项 -->
+              <div class="flex gap-6 mt-4">
+                <label class="flex items-center gap-2 cursor-pointer">
+                  <input
+                    type="checkbox"
+                    checked
+                    class="w-4 h-4 text-blue-600 border-gray-300 rounded focus:ring-blue-500"
+                  />
+                  <span class="text-sm text-gray-700">允许评论</span>
+                </label>
+                <label class="flex items-center gap-2 cursor-pointer">
+                  <input
+                    type="checkbox"
+                    checked
+                    class="w-4 h-4 text-blue-600 border-gray-300 rounded focus:ring-blue-500"
+                  />
+                  <span class="text-sm text-gray-700">允许分享</span>
+                </label>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <!-- 右侧预览和操作区域 -->
+        <div class="space-y-6">
+          <!-- 预览卡片 -->
+          <div class="bg-white rounded-2xl shadow-xl p-6">
+            <h3 class="font-semibold text-gray-800 mb-4">预览效果</h3>
+
+            <div class="space-y-4">
+              <!-- 用户信息 -->
+              <div class="flex items-center gap-3">
+                <div
+                  class="w-10 h-10 bg-gradient-to-r from-blue-400 to-purple-500 rounded-full"
+                ></div>
+                <div>
+                  <div class="font-medium text-gray-800">用户昵称</div>
+                  <div class="text-sm text-gray-500">刚刚</div>
+                </div>
+              </div>
+
+              <!-- 帖子内容预览 -->
+              <div>
+                <h4 class="font-semibold text-gray-800 mb-2">帖子标题</h4>
+                <p class="text-gray-600 text-sm leading-relaxed">帖子内容预览...</p>
+              </div>
+
+              <!-- 图片预览 -->
+              <div class="grid grid-cols-3 gap-2">
+                <div class="aspect-square rounded-lg overflow-hidden bg-gray-100">
+                  <img
+                    src="https://picsum.photos/100/100?random=2"
+                    alt="预览"
+                    class="w-full h-full object-cover"
+                  />
+                </div>
+                <div class="aspect-square rounded-lg overflow-hidden bg-gray-100">
+                  <img
+                    src="https://picsum.photos/100/100?random=3"
+                    alt="预览"
+                    class="w-full h-full object-cover"
+                  />
+                </div>
+                <div class="aspect-square rounded-lg overflow-hidden bg-gray-100">
+                  <img
+                    src="https://picsum.photos/100/100?random=4"
+                    alt="预览"
+                    class="w-full h-full object-cover"
+                  />
+                </div>
+              </div>
+
+              <!-- 帖子信息 -->
+              <div class="flex items-center gap-2 text-xs text-gray-500">
+                <span>公开可见</span>
+                <span>·</span>
+                <span>技术分享</span>
+              </div>
+            </div>
+          </div>
+
+          <!-- 操作按钮 -->
+          <div class="bg-white rounded-2xl shadow-xl p-6">
+            <div class="space-y-3">
+              <button
+                class="w-full bg-gradient-to-r from-blue-500 to-purple-600 text-white py-3 px-4 rounded-xl font-semibold hover:from-blue-600 hover:to-purple-700 transform hover:-translate-y-0.5 transition-all duration-200 shadow-lg hover:shadow-xl flex items-center justify-center gap-2"
+              >
+                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path stroke-linecap="round" />
+                </svg>
+                发布
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>

src/views/postDetail/index.vue

+<template>
+  <div class="min-h-screen bg-gradient-to-br from-blue-50 via-purple-50 to-cyan-50">
+    <!-- <div class="max-w-6xl mx-auto px-4 py-6 grid grid-cols-1 lg:grid-cols-4 gap-6"> -->
+    <!-- 主内容区 -->
+    <div class="lg:col-span-3">
+      <!-- 帖子主体 -->
+      <div
+        class="bg-white/90 backdrop-blur-sm rounded-2xl shadow-sm border border-white/50 overflow-hidden"
+      >
+        <!-- 发布者信息 -->
+        <div class="p-6 border-b border-gray-100">
+          <div class="flex items-center gap-4">
+            <div class="relative">
+              <img
+                src="https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=100&h=100&fit=crop&crop=face"
+                alt=""
+                class="w-12 h-12 rounded-full object-cover"
+              />
+              <div
+                class="absolute -bottom-1 -right-1 w-6 h-6 bg-gradient-to-r from-yellow-400 to-orange-400 rounded-full flex items-center justify-center text-xs font-bold text-white"
+              >
+                8
+              </div>
+            </div>
+            <div class="flex-1">
+              <div class="flex items-center gap-2">
+                <h3 class="font-semibold text-gray-800">前端小李</h3>
+                <span
+                  class="px-2 py-0.5 text-xs bg-gradient-to-r from-purple-100 to-blue-100 text-purple-600 rounded-full"
+                >
+                  资深前端工程师
+                </span>
+              </div>
+              <p class="text-sm text-gray-500 mt-1">
+                {{ dayjs(articleDetail?.createTime || 0 * 1000).format('YYYY-MM-DD HH:mm:ss') }} ·
+                {{ articleDetail?.viewCount || 0 }} 阅读
+              </p>
+            </div>
+            <button
+              class="px-4 py-2 bg-gradient-to-r from-blue-500 to-purple-500 text-white rounded-full text-sm hover:shadow-lg transition-all"
+            >
+              + 关注
+            </button>
+          </div>
+        </div>
+
+        <!-- 帖子内容 -->
+        <div class="p-6">
+          <h1 class="text-2xl font-bold text-gray-900 mb-4 leading-tight">
+            {{ articleDetail?.title }}
+          </h1>
+
+          <!-- 标签 -->
+          <div class="flex flex-wrap gap-2 mb-6">
+            <span
+              class="px-3 py-1 text-sm bg-gradient-to-r from-cyan-100 to-blue-100 text-cyan-600 rounded-full hover:shadow-md transition-all cursor-pointer"
+            >
+              # Vue3
+            </span>
+            <span
+              class="px-3 py-1 text-sm bg-gradient-to-r from-cyan-100 to-blue-100 text-cyan-600 rounded-full hover:shadow-md transition-all cursor-pointer"
+            >
+              # UnoCSS
+            </span>
+            <span
+              class="px-3 py-1 text-sm bg-gradient-to-r from-cyan-100 to-blue-100 text-cyan-600 rounded-full hover:shadow-md transition-all cursor-pointer"
+            >
+              # 前端开发
+            </span>
+            <span
+              class="px-3 py-1 text-sm bg-gradient-to-r from-cyan-100 to-blue-100 text-cyan-600 rounded-full hover:shadow-md transition-all cursor-pointer"
+            >
+              # 最佳实践
+            </span>
+          </div>
+
+          <!-- 文章内容 -->
+          <div class="prose prose-lg max-w-none">
+            <div class="text-gray-700 leading-relaxed space-y-4">
+              {{ articleDetail?.description }}
+            </div>
+
+            <!-- 图片内容 -->
+            <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mt-6">
+              <img
+                src="https://images.unsplash.com/photo-1633356122544-f134324a6cee?w=500&h=300&fit=crop"
+                alt=""
+                class="rounded-xl object-cover w-full h-64 hover:scale-105 transition-transform cursor-pointer"
+              />
+              <img
+                src="https://images.unsplash.com/photo-1627398242454-45a1465c2479?w=500&h=300&fit=crop"
+                alt=""
+                class="rounded-xl object-cover w-full h-64 hover:scale-105 transition-transform cursor-pointer"
+              />
+            </div>
+          </div>
+        </div>
+
+        <!-- 互动按钮 -->
+        <div class="px-6 py-4 border-t border-gray-100 bg-gray-50/50">
+          <div class="flex items-center justify-between">
+            <div class="flex items-center gap-6">
+              <button
+                class="flex items-center gap-2 px-4 py-2 rounded-full hover:bg-gray-100 text-gray-600 transition-all"
+              >
+                <i class="i-carbon-favorite"></i>
+                <span>128</span>
+              </button>
+
+              <button
+                class="flex items-center gap-2 px-4 py-2 rounded-full hover:bg-gray-100 text-gray-600 transition-all"
+              >
+                <i class="i-carbon-bookmark"></i>
+                <span>56</span>
+              </button>
+
+              <button
+                class="flex items-center gap-2 px-4 py-2 rounded-full hover:bg-gray-100 text-gray-600 transition-all"
+              >
+                <i class="i-carbon-share"></i>
+                <span>分享</span>
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- 评论区 -->
+      <div
+        class="mt-6 bg-white/90 backdrop-blur-sm rounded-2xl shadow-sm border border-white/50 overflow-hidden"
+      >
+        <!-- 评论筛选 -->
+        <div class="p-4 border-b border-gray-100">
+          <div class="flex items-center gap-4">
+            <span class="text-lg font-semibold text-gray-800"
+              >评论 ({{ articleDetail?.replyCount || 0 }})</span
+            >
+            <div class="flex items-center gap-2">
+              <button
+                class="px-3 py-1.5 text-sm bg-gradient-to-r from-blue-500 to-purple-500 text-white rounded-full shadow-md"
+              >
+                最热
+              </button>
+              <button
+                class="px-3 py-1.5 text-sm hover:bg-gray-100 text-gray-600 rounded-full transition-all"
+              >
+                最新
+              </button>
+              <button
+                class="px-3 py-1.5 text-sm hover:bg-gray-100 text-gray-600 rounded-full transition-all"
+              >
+                置顶
+              </button>
+              <button
+                class="px-3 py-1.5 text-sm hover:bg-gray-100 text-gray-600 rounded-full transition-all"
+              >
+                精选
+              </button>
+            </div>
+          </div>
+        </div>
+
+        <!-- 发表评论 -->
+        <div class="p-4 border-b border-gray-100">
+          <div class="flex gap-3">
+            <img
+              src="https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?w=100&h=100&fit=crop&crop=face"
+              alt=""
+              class="w-10 h-10 rounded-full object-cover"
+            />
+            <div class="flex-1">
+              <textarea
+                placeholder="写下你的评论..."
+                class="w-full p-3 border border-gray-200 rounded-xl resize-none focus:outline-none focus:ring-2 focus:ring-blue-500/20 focus:border-blue-500"
+                rows="3"
+              ></textarea>
+              <div class="flex justify-between items-center mt-3">
+                <div class="flex items-center gap-2 text-sm text-gray-500">
+                  <button class="hover:text-blue-500 transition-colors">
+                    <i class="i-carbon-face-satisfied"></i>
+                  </button>
+                  <button class="hover:text-blue-500 transition-colors">
+                    <i class="i-carbon-image"></i>
+                  </button>
+                </div>
+                <button
+                  class="px-6 py-2 bg-gradient-to-r from-blue-500 to-purple-500 text-white rounded-full text-sm hover:shadow-lg transition-all"
+                >
+                  发表
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <!-- 评论列表 -->
+        <div class="divide-y divide-gray-100">
+          <!-- 评论1 -->
+          <div class="p-4 hover:bg-gray-50/50 transition-colors">
+            <div class="flex gap-3">
+              <img
+                src="https://images.unsplash.com/photo-1535713875002-d1d0cf377fde?w=100&h=100&fit=crop&crop=face"
+                alt=""
+                class="w-10 h-10 rounded-full object-cover"
+              />
+              <div class="flex-1">
+                <div class="flex items-center gap-2 mb-2">
+                  <span class="font-semibold text-gray-800">前端大佬</span>
+                  <span
+                    class="px-2 py-0.5 text-xs bg-gradient-to-r from-purple-100 to-blue-100 text-purple-600 rounded-full"
+                  >
+                    技术专家
+                  </span>
+                  <span class="px-2 py-0.5 text-xs bg-red-100 text-red-600 rounded-full">置顶</span>
+                </div>
+                <p class="text-gray-700 mb-3">
+                  写得很好！Vue 3 + UnoCSS 确实是一个很棒的组合，我在项目中也有类似的实践。特别是
+                  Composition API 的使用，让代码组织变得更加清晰。
+                </p>
+                <div class="flex items-center justify-between">
+                  <div class="flex items-center gap-4 text-sm text-gray-500">
+                    <span>1小时前</span>
+                    <button class="flex items-center gap-1 hover:text-red-500 transition-colors">
+                      <i class="i-carbon-favorite"></i>
+                      <span>24</span>
+                    </button>
+                    <button class="hover:text-blue-500 transition-colors">回复</button>
+                  </div>
+                </div>
+
+                <!-- 回复列表 -->
+                <div class="mt-3 ml-4 space-y-3">
+                  <div class="flex gap-2 p-3 bg-gray-50 rounded-lg">
+                    <img
+                      src="https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=100&h=100&fit=crop&crop=face"
+                      alt=""
+                      class="w-8 h-8 rounded-full object-cover"
+                    />
+                    <div class="flex-1">
+                      <div class="flex items-center gap-2 mb-1">
+                        <span class="font-medium text-sm text-gray-800">前端小李</span>
+                        <span class="text-xs text-gray-500">30分钟前</span>
+                      </div>
+                      <p class="text-sm text-gray-700">
+                        谢谢认可！确实这个组合在开发效率上提升很大。
+                      </p>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+
+          <!-- 评论2 -->
+          <div class="p-4 hover:bg-gray-50/50 transition-colors">
+            <div class="flex gap-3">
+              <img
+                src="https://images.unsplash.com/photo-1494790108755-2616b612b786?w=100&h=100&fit=crop&crop=face"
+                alt=""
+                class="w-10 h-10 rounded-full object-cover"
+              />
+              <div class="flex-1">
+                <div class="flex items-center gap-2 mb-2">
+                  <span class="font-semibold text-gray-800">Vue开发者</span>
+                  <span class="px-2 py-0.5 text-xs bg-orange-100 text-orange-600 rounded-full"
+                    >热门</span
+                  >
+                </div>
+                <p class="text-gray-700 mb-3">
+                  能分享一下具体的项目配置吗？我在集成 UnoCSS 的时候遇到了一些问题。
+                </p>
+                <div class="flex items-center justify-between">
+                  <div class="flex items-center gap-4 text-sm text-gray-500">
+                    <span>2小时前</span>
+                    <button class="flex items-center gap-1 hover:text-red-500 transition-colors">
+                      <i class="i-carbon-favorite"></i>
+                      <span>18</span>
+                    </button>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <!-- </div> -->
+  </div>
+</template>
+
+<script lang="ts" setup>
+import dayjs from 'dayjs'
+import { getArticleDetail, type ArticleItemDto } from '@/api'
+
+const route = useRoute()
+const id = route.params.articleId as string
+
+const articleDetail = ref<ArticleItemDto>()
+
+const fetchArticleDetail = async () => {
+  const { data } = await getArticleDetail(id)
+  articleDetail.value = data
+}
+
+onMounted(async () => {
+  fetchArticleDetail()
+})
+</script>

src/views/publishVideo/index.vue

+<template>
+  <div class="min-h-screen">
+    <el-form :model="form" :rules="rules" ref="formRef" label-position="top">
+      <div class="max-w-6xl mx-auto p-6 grid gap-6">
+        <!-- 左侧主要内容 -->
+        <div class="col-span-8 space-y-6">
+          <!-- 视频上传区域 -->
+          <div
+            class="bg-white/70 backdrop-blur-sm rounded-2xl shadow-lg border border-white/20 p-8 hover:shadow-xl transition-all duration-300"
+          >
+            <div class="flex items-center justify-between mb-6">
+              <h3 class="text-xl font-bold text-gray-800">上传视频</h3>
+            </div>
+            <el-form-item prop="videoUrl">
+              <UploadVideo v-model="form.videoUrl" />
+            </el-form-item>
+          </div>
+          <!-- 基本设置 -->
+          <div
+            class="bg-white/70 backdrop-blur-sm rounded-2xl shadow-lg border border-white/20 p-8 hover:shadow-xl transition-all duration-300"
+          >
+            <div class="flex items-center justify-between mb-6">
+              <h3 class="text-xl font-bold text-gray-800">基本设置</h3>
+            </div>
+
+            <!-- 封面设置 -->
+            <div class="mb-8">
+              <label class="block text-sm font-semibold text-gray-700 mb-4">封面选择</label>
+              <div class="flex gap-6 items-start">
+                <!-- 主封面 -->
+                <div class="relative group">
+                  <div
+                    class="w-48 h-28 bg-gradient-to-br from-gray-100 to-gray-200 rounded-xl overflow-hidden shadow-md hover:shadow-lg transition-all duration-300"
+                  >
+                    <img
+                      src="@/assets/img/culture/ask.png"
+                      alt="主封面"
+                      class="w-full h-full object-cover"
+                    />
+                    <div
+                      class="absolute inset-0 bg-black/20 opacity-0 group-hover:opacity-100 transition-opacity duration-300"
+                    ></div>
+                    <div
+                      class="absolute bottom-2 left-2 bg-gradient-to-r from-indigo-500 to-purple-600 text-white text-xs px-2 py-1 rounded-md font-medium"
+                    >
+                      智能封面
+                    </div>
+                  </div>
+                </div>
+
+                <!-- 封面选项 -->
+                <div class="flex gap-3">
+                  <div
+                    v-for="i in 4"
+                    :key="i"
+                    class="w-20 h-12 bg-gray-100 rounded-lg overflow-hidden border-2 hover:border-indigo-400 cursor-pointer transition-all duration-200"
+                    :class="i === 1 ? 'border-indigo-500 shadow-md' : 'border-gray-200'"
+                  >
+                    <img
+                      src="@/assets/img/culture/ask.png"
+                      alt="封面选项"
+                      class="w-full h-full object-cover"
+                    />
+                  </div>
+                </div>
+              </div>
+              <p class="text-sm text-gray-500 mt-3 flex items-center gap-2">
+                <el-icon class="text-indigo-500"><InfoFilled /></el-icon>
+                选择封面UI中的第一张，让作品获得更多推荐机会！
+              </p>
+            </div>
+
+            <!-- 标题 -->
+            <div class="mb-8">
+              <el-form-item prop="title">
+                <label class="block text-sm font-semibold text-gray-700 mb-3">视频标题</label>
+                <el-input
+                  v-model="form.title"
+                  placeholder="请输入视频标题..."
+                  maxlength="80"
+                  show-word-limit
+                  size="large"
+                  class="title-input"
+                />
+              </el-form-item>
+            </div>
+            <div class="mb-8">
+              <el-form-item prop="description">
+                <label class="block text-sm font-semibold text-gray-700 mb-3">视频简介</label>
+                <el-input
+                  v-model="form.description"
+                  type="textarea"
+                  :rows="5"
+                  placeholder="请写上您希望介绍的内容，让更多的人了解您的作品吧！"
+                />
+              </el-form-item>
+            </div>
+            <div class="mb-8">
+              <el-form-item prop="mainTagId">
+                <label class="block text-sm font-semibold text-gray-700 mb-3"
+                  >主标签
+                  <el-tooltip content="添加相关标签可以帮助更多人发现您的作品" placement="top">
+                    <el-icon class="text-gray-400 cursor-help"
+                      ><QuestionFilled
+                    /></el-icon> </el-tooltip
+                ></label>
+                <SelectTags class="w-full" v-model="form.mainTagId" :max-selected-tags="1" />
+              </el-form-item>
+            </div>
+            <div class="mb-8">
+              <el-form-item prop="mainTagId">
+                <label class="block text-sm font-semibold text-gray-700 mb-3"
+                  >副标签
+                  <el-tooltip content="副标签可以添加多个，最多3个" placement="top">
+                    <el-icon class="text-gray-400 cursor-help"
+                      ><QuestionFilled
+                    /></el-icon> </el-tooltip
+                ></label>
+                <SelectTags
+                  class="w-full"
+                  v-model="form.tagList"
+                  :max-selected-tags="3"
+                  :filter-tags-fn="filterTagsFn"
+                />
+              </el-form-item>
+            </div>
+          </div>
+          <div
+            class="bg-white/70 backdrop-blur-sm rounded-2xl shadow-lg border border-white/20 p-6 hover:shadow-xl transition-all duration-300"
+          >
+            <h4 class="text-lg font-bold text-gray-800 mb-4">发布设置</h4>
+
+            <div class="space-y-4">
+              <div class="flex items-center justify-between p-3 bg-gray-50 rounded-xl">
+                <div>
+                  <div class="text-sm font-medium text-gray-800">定时发布</div>
+                  <div class="text-xs text-gray-500">设置发布时间</div>
+                </div>
+                <div>
+                  <el-date-picker
+                    v-if="form.sendType === SendTypeEnum.SCHEDULED"
+                    v-model="form.sendTime"
+                    type="datetime"
+                    placeholder="选择发布时间"
+                    size="small"
+                    value-format="timestamp"
+                  />
+                  <el-switch
+                    v-model="form.sendType"
+                    :active-value="SendTypeEnum.SCHEDULED"
+                    :inactive-value="SendTypeEnum.IMMEDIATE"
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            class="bg-white/70 backdrop-blur-sm rounded-2xl shadow-lg border border-white/20 p-6"
+          >
+            <div class="space-y-3 flex justify-center items-center gap-4">
+              <el-button
+                size="large"
+                class="w-full !border-gray-200 hover:!border-indigo-300 hover:!text-indigo-600 transition-all duration-200"
+              >
+                <el-icon class="mr-2"><Document /></el-icon>
+                保存草稿
+              </el-button>
+              <span></span>
+              <el-button
+                type="primary"
+                size="large"
+                class="w-full !bg-gradient-to-r !from-indigo-500 !to-purple-600 !border-none shadow-lg hover:shadow-xl transition-all duration-300"
+                @click="handleSubmit"
+              >
+                <el-icon class="mr-2"><Upload /></el-icon>
+                立即发布
+              </el-button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </el-form>
+    <!-- 右上角tips -->
+    <!-- <div
+      class="w-200px fixed bottom-0 left-0 bg-gradient-to-br from-amber-50 to-orange-50 rounded-2xl p-6 border border-amber-200"
+    >
+      <div class="flex items-start gap-3">
+        <el-icon class="text-amber-500 mt-1"><Warning /></el-icon>
+        <div>
+          <h5 class="text-sm font-semibold text-amber-800 mb-2">发布小贴士</h5>
+          <ul class="text-xs text-amber-700 space-y-1">
+            <li>• 选择合适的封面能提高点击率</li>
+            <li>• 添加相关标签帮助推荐</li>
+            <li>• 详细的简介让观众更了解内容</li>
+          </ul>
+        </div>
+      </div>
+    </div> -->
+  </div>
+</template>
+<script setup lang="ts">
+import UploadVideo from '@/components/common/UploadVideo/index.vue'
+import { useResetData } from '@/hooks'
+import { ArticleTypeEnum, SendTypeEnum } from '@/constants'
+import { addOrUpdateArticle } from '@/api'
+
+import SelectTags from '@/components/common/SelectTags/index.vue'
+
+const formRef = useTemplateRef('formRef')
+
+const [form] = useResetData({
+  videoUrl: '',
+  title: '视频标题',
+  type: ArticleTypeEnum.VIDEO,
+  description: '',
+  mainTagId: '',
+  tagList: [],
+  sendType: SendTypeEnum.IMMEDIATE,
+  sendTime: '',
+})
+
+const filterTagsFn = (tags: { value: number; label: string }[]) => {
+  return tags.filter((tag) => tag.value !== Number(form.value.mainTagId))
+}
+
+const rules = {
+  videoUrl: [{ required: true, message: '请上传视频', trigger: 'change' }],
+  title: [{ required: true, message: '请输入视频标题', trigger: 'blur' }],
+  description: [{ required: true, message: '请输入视频简介', trigger: 'blur' }],
+  mainTagId: [{ required: true, message: '请选择标签', trigger: 'change' }],
+}
+
+const tansformData = () => {
+  return {
+    ...form.value,
+    tagList: [form.value.mainTagId, ...form.value.tagList].map((item, index) => ({
+      tagId: Number(item),
+      sort: index,
+    })),
+    mainTagId: Number(form.value.mainTagId),
+  }
+}
+const handleSubmit = async () => {
+  await formRef.value?.validate()
+  const res = await addOrUpdateArticle(tansformData())
+  if (res) {
+    ElMessage.success('发布成功')
+  }
+}
+</script>
+
+<style scoped></style>

src/views/HomeView.vue → src/views/test.vue

-<script setup lang="ts">
-import TheWelcome from '../components/TheWelcome.vue'
-</script>
-
 <template>
-  <main>
-    <TheWelcome />
-  </main>
+  <el-button>{{ count }}</el-button>
+  <ElButton>{{ count }}</ElButton>
 </template>
+<script setup lang="ts">
+import { ref } from 'vue'
+const count = ref(0)
+</script>

src/views/userPage/components/editUserInfo.vue

+<template>
+  <el-dialog
+    v-model="dialogVisible"
+    title="个人信息"
+    width="500px"
+    :before-close="handleClose"
+    class="user-info-dialog"
+  >
+    <el-form ref="formRef" :model="form" :rules="rules" label-width="60px" class="px-4">
+      <!-- 昵称 -->
+      <el-form-item label="昵称" prop="hiddenName">
+        <el-input v-model="form.hiddenName" placeholder="将心比心" clearable class="w-full" />
+      </el-form-item>
+
+      <!-- 签名 -->
+      <el-form-item label="签名" prop="signature">
+        <el-input v-model="form.signature" placeholder="个性签名" clearable class="w-full" />
+      </el-form-item>
+
+      <!-- 头像 -->
+      <el-form-item label="头像" prop="hiddenAvatar">
+        <div class="w-full">
+          <UploadFile v-model="form.hiddenAvatar" />
+          <div class="text-xs text-gray-400 mt-2">修改资料后，请点击清除缓存</div>
+        </div>
+      </el-form-item>
+    </el-form>
+
+    <template #footer>
+      <div class="flex justify-end gap-3">
+        <el-button @click="handleCancel">取消</el-button>
+        <el-button type="primary" @click="handleConfirm" :loading="loading"> 确认 </el-button>
+      </div>
+    </template>
+  </el-dialog>
+</template>
+
+<script lang="ts" setup>
+import type { FormInstance, FormRules } from 'element-plus'
+import UploadFile from '@/components/common/UploadFile/index.vue'
+import { updateUserInfo } from '@/api'
+import type { UpdateUserInfoDto } from '@/api'
+import { useResetData } from '@/hooks'
+
+const dialogVisible = ref(false)
+const loading = ref(false)
+const formRef = useTemplateRef<FormInstance>('formRef')
+
+const [form, resetForm] = useResetData<UpdateUserInfoDto>({
+  hiddenName: '',
+  signature: '',
+  hiddenAvatar: '',
+})
+
+// 表单验证规则
+const rules: FormRules = {
+  hiddenName: [
+    { required: true, message: '请输入昵称', trigger: 'blur' },
+    { min: 1, max: 20, message: '昵称长度在 1 到 20 个字符', trigger: 'blur' },
+  ],
+  signature: [{ max: 100, message: '签名长度不能超过 100 个字符', trigger: 'blur' }],
+  hiddenAvatar: [{ required: true, message: '请上传头像', trigger: 'blur' }],
+}
+
+// 打开弹窗方法
+const open = (userInfo: UpdateUserInfoDto) => {
+  dialogVisible.value = true
+  form.value = userInfo
+  console.log(form.value)
+}
+
+// 关闭弹窗方法
+const close = () => {
+  dialogVisible.value = false
+  resetForm()
+}
+
+// 关闭弹窗前的处理
+const handleClose = (done: () => void) => {
+  done()
+}
+
+// 取消操作
+const handleCancel = () => {
+  close()
+}
+
+// 确认操作
+const handleConfirm = async () => {
+  try {
+    // 验证表单
+    await formRef.value?.validate()
+
+    loading.value = true
+
+    // 这里可以添加保存逻辑
+    await updateUserInfo(form.value)
+    close()
+
+    ElMessage.success('保存成功')
+  } catch (error) {
+    console.error('表单验证失败:', error)
+  } finally {
+    loading.value = false
+  }
+}
+
+// 暴露方法给父组件
+defineExpose({
+  open,
+})
+</script>
+
+<style scoped>
+.user-info-dialog :deep(.el-dialog__header) {
+  padding: 20px 20px 10px 20px;
+  border-bottom: 1px solid #f0f0f0;
+}
+
+.user-info-dialog :deep(.el-dialog__body) {
+  padding: 20px;
+}
+
+.user-info-dialog :deep(.el-dialog__footer) {
+  padding: 10px 20px 20px 20px;
+  border-top: 1px solid #f0f0f0;
+}
+
+.user-info-dialog :deep(.el-form-item__label) {
+  color: #606266;
+  font-weight: 500;
+}
+</style>

src/views/userPage/index.vue

+<template>
+  <div class="min-h-screen bg-gray-50 mt-2 rounded-lg">
+    <!-- 顶部背景区域 -->
+    <div class="box relative h-200px bg-gradient-to-r from-purple-400 via-pink-300 to-blue-300">
+      <!-- 顶部操作按钮 -->
+      <div class="absolute top-4 right-4 flex gap-2">
+        <el-button type="info" plain size="small">清除缓存</el-button>
+        <el-button type="info" plain size="small">切换账号</el-button>
+        <el-button type="primary" size="small">编辑个人资料</el-button>
+      </div>
+    </div>
+
+    <!-- 主要内容区域 -->
+    <div class="relative -mt-20 px-6">
+      <div class="flex gap-6">
+        <!-- 左侧个人信息卡片 -->
+        <div class="w-300px">
+          <!-- 个人信息卡片 -->
+          <div class="bg-white rounded-lg shadow-sm p-6 mb-4">
+            <div class="flex items-start gap-4">
+              <el-avatar
+                :size="80"
+                :src="userInfo?.avatar"
+                class="border-4 border-white shadow-lg"
+              />
+              <div class="flex-1">
+                <h2 class="text-xl font-semibold text-gray-800 mb-1">{{ userInfo?.name }}</h2>
+                <p class="text-gray-500 text-sm mb-2">{{ userInfo?.signature }}</p>
+                <el-button type="warning" size="small" plain @click="handleEdit">
+                  <el-icon><Edit /></el-icon>
+                  修改资料
+                </el-button>
+              </div>
+            </div>
+          </div>
+
+          <!-- 左侧菜单 -->
+          <div class="bg-white rounded-lg shadow-sm overflow-hidden">
+            <div
+              v-for="item in menuItems"
+              :key="item.key"
+              @click="activeMenu = item.key"
+              :class="[
+                'flex items-center gap-3 px-4 py-3 cursor-pointer transition-colors border-b border-gray-100 last:border-b-0',
+                activeMenu === item.key
+                  ? 'bg-blue-50 text-blue-600 border-r-3 border-r-blue-600'
+                  : 'text-gray-700 hover:bg-gray-50',
+              ]"
+            >
+              <el-icon :size="16">
+                <component :is="item.icon" />
+              </el-icon>
+              <span class="text-sm">{{ item.label }}</span>
+            </div>
+          </div>
+        </div>
+
+        <!-- 右侧内容区域 -->
+        <div class="flex-1">
+          <div class="bg-white rounded-lg shadow-sm min-h-500px">
+            <!-- 标签页 -->
+            <div class="border-b border-gray-200">
+              <div class="flex">
+                <div
+                  v-for="tab in tabs"
+                  :key="tab.key"
+                  @click="activeTab = tab.key"
+                  :class="[
+                    'px-6 py-4 cursor-pointer text-sm font-medium transition-colors relative',
+                    activeTab === tab.key ? 'text-blue-600' : 'text-gray-500 hover:text-gray-700',
+                  ]"
+                >
+                  {{ tab.label }}
+                  <div
+                    v-if="activeTab === tab.key"
+                    class="absolute bottom-0 left-0 right-0 h-2px bg-blue-600"
+                  ></div>
+                </div>
+              </div>
+            </div>
+
+            <!-- 内容区域 -->
+            <div class="p-8">
+              <!-- 空状态 -->
+              <div class="flex flex-col items-center justify-center py-20">
+                <div class="w-120px h-120px mb-6 opacity-30">
+                  <svg viewBox="0 0 1024 1024" class="w-full h-full fill-gray-400">
+                    <path
+                      d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
+                    />
+                    <path
+                      d="M623.6 316.7C593.6 290.4 554 276 512 276s-81.6 14.4-111.6 40.7C369.2 344 352 380.7 352 420v7.6c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V420c0-44.1 43.1-80 96-80s96 35.9 96 80c0 31.1-22 59.6-56.1 72.7-21.2 8.1-39.2 22.3-52.1 40.9-13.1 19-19.9 41.8-19.9 65.1V620c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8v-21.3c0-33.6 32.2-62.1 72.9-81.68C625.9 495.1 672 442.2 672 420c0-39.3-17.2-76-48.4-103.3z"
+                    />
+                    <circle cx="512" cy="732" r="40" />
+                  </svg>
+                </div>
+                <p class="text-gray-400 text-sm">暂无帖子</p>
+              </div>
+
+              <!-- 分页 -->
+              <div class="flex justify-center mt-8">
+                <el-pagination
+                  v-model:current-page="currentPage"
+                  :page-size="10"
+                  :total="0"
+                  layout="prev, pager, next"
+                  :hide-on-single-page="true"
+                />
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <EditUserInfo ref="editUserInfoRef" />
+  </div>
+</template>
+
+<script lang="ts" setup>
+import {
+  Edit,
+  User,
+  Calendar,
+  Trophy,
+  Document,
+  Star,
+  ChatDotRound,
+  Link,
+  View,
+  Setting,
+} from '@element-plus/icons-vue'
+import { useUserStore } from '@/stores/user'
+import { storeToRefs } from 'pinia'
+import EditUserInfo from './components/editUserInfo.vue'
+
+const editUserInfoRef = useTemplateRef<InstanceType<typeof EditUserInfo>>('editUserInfoRef')
+const userStore = useUserStore()
+const { userInfo } = storeToRefs(userStore)
+console.log(userInfo.value)
+// 当前激活的菜单
+const activeMenu = ref('posts')
+
+// 当前激活的标签页
+const activeTab = ref('published')
+
+// 当前页码
+const currentPage = ref(1)
+
+// 左侧菜单项
+const menuItems = ref([
+  { key: 'posts', label: '我的帖子', icon: User },
+  { key: 'activity', label: '我的活动', icon: Calendar },
+  { key: 'votes', label: '我的投票', icon: Trophy },
+  { key: 'articles', label: '我的文章', icon: Document },
+  { key: 'favorites', label: '我的收藏', icon: Star },
+  { key: 'comments', label: '评论回复', icon: ChatDotRound },
+  { key: 'follows', label: '获赞列表', icon: Trophy },
+  { key: 'social', label: '关注和粉', icon: Link },
+  { key: 'feedback', label: '反馈列表', icon: View },
+  { key: 'screen', label: '屏蔽管理', icon: Setting },
+])
+
+// 标签页
+const tabs = ref([
+  { key: 'published', label: '发布' },
+  { key: 'draft', label: '草稿' },
+])
+
+const handleEdit = () => {
+  console.log('修改资料')
+  editUserInfoRef.value?.open({
+    hiddenAvatar: userInfo.value.avatar,
+    hiddenName: userInfo.value.name,
+    signature: '',
+  })
+}
+</script>
+
+<style scoped>
+.box {
+  background-image: url('http://soundasia.oss-cn-shenzhen.aliyuncs.com/OA/2022/10/13/1665643787806.jpg');
+}
+/* 如果需要额外的样式可以在这里添加 */
+</style>

src/views/videoDetail/index.vue

+<template>
+  <div class="min-h-screen bg-gray-50">
+    <!-- 主容器 -->
+    <div class="max-w-6xl mx-auto px-4 py-6">
+      <!-- 视频播放器 -->
+      <div class="relative w-full aspect-video bg-black rounded-lg overflow-hidden mb-4">
+        <div class="absolute inset-0">
+          <!-- 模拟视频内容 -->
+          <div class="w-full h-full bg-gradient-to-br from-gray-800 to-black relative">
+            <!-- 视频标题叠加 -->
+            <div class="absolute inset-0 flex items-center justify-center">
+              <div class="text-center">
+                <h1 class="text-4xl md:text-6xl font-bold text-yellow-400 mb-4 drop-shadow-lg">
+                  《黑神话：钟馗》
+                </h1>
+                <p class="text-xl text-white drop-shadow">里的钟馗，有着怎样的身世？</p>
+              </div>
+            </div>
+
+            <!-- 播放控制栏 -->
+            <div
+              class="absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black/90 to-transparent p-4"
+            >
+              <div class="flex items-center justify-between text-white">
+                <div class="flex items-center space-x-4">
+                  <button class="hover:text-blue-400 transition-colors">⏮️</button>
+                  <button class="hover:text-blue-400 transition-colors">▶️</button>
+                  <button class="hover:text-blue-400 transition-colors">⏭️</button>
+                  <span class="text-sm">00:00 / 10:35</span>
+                </div>
+                <div class="flex items-center space-x-3">
+                  <button class="hover:text-blue-400 transition-colors">自动</button>
+                  <button class="hover:text-blue-400 transition-colors">倍速</button>
+                  <button class="hover:text-blue-400 transition-colors">字幕</button>
+                  <button class="hover:text-blue-400 transition-colors">🔊</button>
+                  <button class="hover:text-blue-400 transition-colors">⚙️</button>
+                  <button class="hover:text-blue-400 transition-colors">📺</button>
+                  <button class="hover:text-blue-400 transition-colors">⛶</button>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- 视频信息区域 -->
+      <div class="bg-white rounded-lg p-6 mb-4 shadow-sm">
+        <!-- 标题和基本信息 -->
+        <div class="mb-4">
+          <h1 class="text-xl md:text-2xl font-bold text-gray-900 mb-3 leading-tight">
+            《黑神话：钟馗》里的钟馗，有着怎样的身世？
+          </h1>
+
+          <div class="flex flex-wrap items-center gap-4 text-sm text-gray-600 mb-4">
+            <div class="flex items-center gap-1">
+              <span>▶️</span>
+              <span>63.2万</span>
+            </div>
+            <div class="flex items-center gap-1">
+              <span>💬</span>
+              <span>589</span>
+            </div>
+            <div class="text-gray-500">2025-08-20 12:24:18</div>
+            <div class="flex items-center gap-1 text-blue-500">
+              <span>#文化标签</span>
+            </div>
+          </div>
+        </div>
+
+        <!-- 互动按钮区域 -->
+        <div class="flex flex-wrap items-center justify-between gap-4 mb-4">
+          <div class="flex flex-wrap items-center gap-3">
+            <button
+              class="flex items-center gap-2 px-4 py-2 bg-gray-100 hover:bg-gray-200 rounded-full transition-colors"
+            >
+              <span>👍</span>
+              <span class="font-medium">1.1万</span>
+            </button>
+
+            <button
+              class="flex items-center gap-2 px-4 py-2 bg-gray-100 hover:bg-gray-200 rounded-full transition-colors border-2 border-blue-500"
+            >
+              <div class="w-6 h-6 bg-blue-500 rounded-full flex items-center justify-center">
+                <span class="text-white text-sm">💰</span>
+              </div>
+              <span class="font-medium text-blue-500">1121</span>
+            </button>
+
+            <button
+              class="flex items-center gap-2 px-4 py-2 bg-gray-100 hover:bg-gray-200 rounded-full transition-colors"
+            >
+              <span>⭐</span>
+              <span class="font-medium">4341</span>
+            </button>
+
+            <button
+              class="flex items-center gap-2 px-4 py-2 bg-gray-100 hover:bg-gray-200 rounded-full transition-colors"
+            >
+              <span>📤</span>
+              <span class="font-medium">488</span>
+            </button>
+          </div>
+        </div>
+
+        <!-- UP主信息 -->
+        <div class="flex items-center justify-between p-4 bg-gray-50 rounded-lg mb-4">
+          <div class="flex items-center gap-3">
+            <div
+              class="w-12 h-12 bg-gradient-to-r from-pink-400 to-purple-500 rounded-full flex items-center justify-center"
+            >
+              <span class="text-white font-bold">UP</span>
+            </div>
+            <div>
+              <h3 class="font-medium text-gray-900">UP主名称</h3>
+              <p class="text-sm text-gray-600">粉丝 12.3万 · 获赞 45.6万</p>
+            </div>
+          </div>
+          <button
+            class="px-6 py-2 bg-pink-500 hover:bg-pink-600 text-white rounded-full transition-colors"
+          >
+            + 关注
+          </button>
+        </div>
+        <!-- 评论区 -->
+        <div class="bg-white rounded-lg p-6 shadow-sm">
+          <div class="flex items-center justify-between mb-6">
+            <h3 class="text-lg font-bold flex items-center gap-2">
+              <span>评论</span>
+              <span class="text-blue-500">1171</span>
+            </h3>
+            <div class="flex gap-1">
+              <button class="px-3 py-1 text-sm bg-pink-100 text-pink-600 rounded transition-colors">
+                最热
+              </button>
+              <button
+                class="px-3 py-1 text-sm text-gray-600 hover:bg-gray-100 rounded transition-colors"
+              >
+                最新
+              </button>
+              <button
+                class="px-3 py-1 text-sm text-gray-600 hover:bg-gray-100 rounded transition-colors"
+              >
+                精选
+              </button>
+              <button
+                class="px-3 py-1 text-sm text-gray-600 hover:bg-gray-100 rounded transition-colors"
+              >
+                置顶
+              </button>
+            </div>
+          </div>
+
+          <!-- 评论输入框 -->
+          <div class="flex gap-3 mb-6">
+            <div
+              class="w-10 h-10 bg-teal-400 rounded-full flex items-center justify-center flex-shrink-0"
+            >
+              <span class="text-white">👤</span>
+            </div>
+            <div class="flex-1">
+              <input
+                type="text"
+                placeholder="这里是评论区，不是无人区:)"
+                class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:outline-none focus:border-blue-500 transition-colors"
+              />
+            </div>
+          </div>
+
+          <!-- 评论列表 -->
+          <div class="space-y-6">
+            <!-- 评论项 1 -->
+            <div class="flex gap-3">
+              <div
+                class="w-10 h-10 bg-red-400 rounded-full flex items-center justify-center flex-shrink-0"
+              >
+                <span class="text-white">👤</span>
+              </div>
+              <div class="flex-1">
+                <div class="flex items-center gap-2 mb-2">
+                  <span class="font-medium text-gray-900">秋名</span>
+                  <span class="bg-red-500 text-white text-xs px-2 py-0.5 rounded">UP主</span>
+                </div>
+                <p class="text-gray-800 mb-2">
+                  正值抗日反法西斯胜利80周年之际
+                  <br />
+                  《黑神话 钟馗》发布可谓正当其时!🔥
+                </p>
+                <div class="flex items-center gap-4 text-sm text-gray-500">
+                  <span>2025-08-20 12:41</span>
+                  <button class="flex items-center gap-1 hover:text-blue-500 transition-colors">
+                    <span>👍</span>
+                    <span>887</span>
+                  </button>
+                  <button class="hover:text-blue-500 transition-colors">👎</button>
+                  <button class="hover:text-blue-500 transition-colors">回复</button>
+                </div>
+              </div>
+            </div>
+            <!-- 评论项 2 -->
+            <div class="flex gap-3">
+              <div
+                class="w-10 h-10 bg-green-400 rounded-full flex items-center justify-center flex-shrink-0"
+              >
+                <span class="text-white">👤</span>
+              </div>
+              <div class="flex-1">
+                <div class="flex items-center gap-2 mb-2">
+                  <span class="font-medium text-gray-900">低昂星残</span>
+                  <span class="bg-red-500 text-white text-xs px-2 py-0.5 rounded">UP主</span>
+                </div>
+                <p class="text-gray-800 mb-2">我比较期待：黑神话 妲己🤔</p>
+                <div class="flex items-center gap-4 text-sm text-gray-500">
+                  <span>2025-08-20 13:45</span>
+                  <button class="flex items-center gap-1 hover:text-blue-500 transition-colors">
+                    <span>👍</span>
+                    <span>551</span>
+                  </button>
+                  <button class="hover:text-blue-500 transition-colors">👎</button>
+                  <button class="hover:text-blue-500 transition-colors">回复</button>
+                </div>
+              </div>
+            </div>
+
+            <!-- 评论项 3 -->
+            <div class="flex gap-3">
+              <div
+                class="w-10 h-10 bg-purple-400 rounded-full flex items-center justify-center flex-shrink-0"
+              >
+                <span class="text-white">👤</span>
+              </div>
+              <div class="flex-1">
+                <div class="flex items-center gap-2 mb-2">
+                  <span class="font-medium text-gray-900">希木林M</span>
+                  <span class="bg-red-500 text-white text-xs px-2 py-0.5 rounded">UP主</span>
+                </div>
+                <p class="text-gray-800 mb-2">这是黑神话😂</p>
+                <div class="flex items-center gap-4 text-sm text-gray-500">
+                  <span>2025-08-20 14:08</span>
+                  <button class="flex items-center gap-1 hover:text-blue-500 transition-colors">
+                    <span>👍</span>
+                    <span>296</span>
+                  </button>
+                  <button class="hover:text-blue-500 transition-colors">👎</button>
+                  <button class="hover:text-blue-500 transition-colors">回复</button>
+                </div>
+              </div>
+            </div>
+
+            <!-- 评论项 4 -->
+            <div class="flex gap-3">
+              <div
+                class="w-10 h-10 bg-pink-400 rounded-full flex items-center justify-center flex-shrink-0"
+              >
+                <span class="text-white">👤</span>
+              </div>
+              <div class="flex-1">
+                <div class="flex items-center gap-2 mb-2">
+                  <span class="font-medium text-gray-900">夏冰</span>
+                  <span class="bg-red-500 text-white text-xs px-2 py-0.5 rounded">UP主</span>
+                </div>
+                <p class="text-gray-800 mb-2">那还不如叫期待全能游戏本创作的游戏</p>
+                <div class="flex items-center gap-4 text-sm text-gray-500">
+                  <span>2025-08-20 15:07</span>
+                  <button class="flex items-center gap-1 hover:text-blue-500 transition-colors">
+                    <span>👍</span>
+                    <span>70</span>
+                  </button>
+                  <button class="hover:text-blue-500 transition-colors">👎</button>
+                  <button class="hover:text-blue-500 transition-colors">回复</button>
+                </div>
+                <div class="text-xs text-gray-500 mt-3">共37条回复，点击查看</div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+// 可以在这里添加响应式数据和方法
+</script>
+
+<style scoped lang="scss">
+// 自定义样式
+.line-clamp-2 {
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+}
+</style>

src/views/ya/components/columnList.vue

+<template>
+  <div class="w-full max-w-6xl mx-auto">
+    <div
+      v-for="item in columnList"
+      :key="item.id"
+      class="bg-white rounded-lg shadow-sm mb-6 overflow-hidden"
+      :style="{ '--dynamic-color': item.color }"
+    >
+      <div
+        class="flex items-center justify-between pr-4 pl-4 pt-2 pb-2 bg-green-50 border-b border-green-100"
+        :style="{ backgroundColor: item.color, '--dynamic-color': item.color }"
+      >
+        <h3 class="text-lg font-medium text-gray-800 flex items-center">
+          <span class="w-1 h-5 mr-2 bg-#444"></span>
+          {{ item.title }}
+        </h3>
+        <div class="flex items-center cursor-pointer hover:text-[var(--dynamic-color)]">
+          <span class="mr-1 text-14px color-#606266 hover:text-[var(--dynamic-color)]"
+            >查看更多</span
+          >
+          <el-icon><ArrowRight /></el-icon>
+        </div>
+      </div>
+
+      <div class="p-4">
+        <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
+          <div v-for="item in section2Items" :key="item.id" class="group cursor-pointer">
+            <div class="relative mb-3 overflow-hidden rounded-lg">
+              <img
+                src="@/assets/img/culture/ask.png"
+                :alt="item.title"
+                class="w-full h-32 object-cover group-hover:scale-105 transition-transform duration-300"
+              />
+              <div class="absolute top-2 left-2">
+                <el-tag size="small" class="bg-orange-500 text-white border-none">
+                  {{ item.tag }}
+                </el-tag>
+              </div>
+            </div>
+            <h3 class="text-sm font-medium text-gray-800 mb-2 transition-colors">
+              {{ item.title }}
+            </h3>
+            <p class="text-xs text-gray-500 mb-3 line-clamp-2">
+              {{ item.description }}
+            </p>
+            <div class="flex items-center justify-between text-xs text-gray-400">
+              <div class="flex items-center space-x-4">
+                <span class="flex items-center">
+                  <el-icon class="mr-1"><View /></el-icon>
+                  {{ item.views }}
+                </span>
+                <span class="flex items-center">
+                  <el-icon class="mr-1"><ChatDotRound /></el-icon>
+                  {{ item.comments }}
+                </span>
+                <span class="flex items-center">
+                  <el-icon class="mr-1"><Star /></el-icon>
+                  {{ item.likes }}
+                </span>
+              </div>
+              <span>{{ item.date }}</span>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ArrowRight, View, ChatDotRound, Star } from '@element-plus/icons-vue'
+import { getColumnList } from '@/api'
+
+import type { ColumnItemDto } from '@/api'
+
+const section2Items = ref([
+  {
+    id: 4,
+    title: '宿主，你的负面清单该更新啦！',
+    description: '宿主你好呀！正在文化一本分与平常心的知识，我们一起来学习吧的知识。',
+    image: 'https://via.placeholder.com/300x200/DDA0DD/FFFFFF?text=Image4',
+    tag: '推荐',
+    views: '300',
+    comments: '0',
+    likes: '24',
+    date: '2025-04-13 12:01',
+  },
+  {
+    id: 5,
+    title: '不打破惯性思维，永远无法创新',
+    description:
+      '当我们的思路被惯性思维束缚了，想要得到一些不一样的结果就会变得很困难。但是，我们可以通过一些方法来打破惯性思维。',
+    image: 'https://via.placeholder.com/300x200/F0E68C/FFFFFF?text=Image5',
+    tag: '推荐',
+    views: '280',
+    comments: '0',
+    likes: '24',
+    date: '2025-04-13 12:10',
+  },
+  {
+    id: 6,
+    title: '文化共创｜你提意见"我听你"',
+    description: '巧妙设手段第三名，出让各有所需满意的额外为为你们带来更多一些精彩。',
+    image: 'https://via.placeholder.com/300x200/FFA07A/FFFFFF?text=Image6',
+    tag: '推荐',
+    views: '280',
+    comments: '0',
+    likes: '24',
+    date: '2025-04-13 14:28',
+  },
+])
+
+const columnList = ref<ColumnItemDto[]>([])
+const getColumnListData = async () => {
+  const { data } = await getColumnList()
+  console.log(data)
+  columnList.value = data
+}
+
+onMounted(() => {
+  getColumnListData()
+})
+</script>
+
+<style scoped></style>

src/views/ya/components/interviewList.vue

+<template>
+  <div class="w-full max-w-6xl mx-auto">
+    <div
+      v-for="item in columnList"
+      :key="item.id"
+      class="bg-white rounded-lg shadow-sm mb-6 overflow-hidden"
+      :style="{ '--dynamic-color': item.color }"
+    >
+      <div
+        class="flex items-center justify-between pr-4 pl-4 pt-2 pb-2 bg-green-50 border-b border-green-100"
+        :style="{ backgroundColor: item.color, '--dynamic-color': item.color }"
+      >
+        <h3 class="text-lg font-medium text-gray-800 flex items-center">
+          <span class="w-1 h-5 mr-2 bg-#444"></span>
+          {{ item.title }}
+        </h3>
+        <div class="flex items-center cursor-pointer hover:text-[var(--dynamic-color)]">
+          <span class="mr-1 text-14px color-#606266 hover:text-[var(--dynamic-color)]"
+            >查看更多</span
+          >
+          <el-icon><ArrowRight /></el-icon>
+        </div>
+      </div>
+
+      <div class="p-4">
+        <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
+          <div v-for="item in section2Items" :key="item.id" class="group cursor-pointer">
+            <div class="relative mb-3 overflow-hidden rounded-lg">
+              <img
+                src="@/assets/img/culture/ask.png"
+                :alt="item.title"
+                class="w-full h-32 object-cover group-hover:scale-105 transition-transform duration-300"
+              />
+              <div class="absolute top-2 left-2">
+                <el-tag size="small" class="bg-orange-500 text-white border-none">
+                  {{ item.tag }}
+                </el-tag>
+              </div>
+            </div>
+            <h3 class="text-sm font-medium text-gray-800 mb-2 transition-colors">
+              {{ item.title }}
+            </h3>
+            <p class="text-xs text-gray-500 mb-3 line-clamp-2">
+              {{ item.description }}
+            </p>
+            <div class="flex items-center justify-between text-xs text-gray-400">
+              <div class="flex items-center space-x-4">
+                <span class="flex items-center">
+                  <el-icon class="mr-1"><View /></el-icon>
+                  {{ item.views }}
+                </span>
+                <span class="flex items-center">
+                  <el-icon class="mr-1"><ChatDotRound /></el-icon>
+                  {{ item.comments }}
+                </span>
+                <span class="flex items-center">
+                  <el-icon class="mr-1"><Star /></el-icon>
+                  {{ item.likes }}
+                </span>
+              </div>
+              <span>{{ item.date }}</span>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ArrowRight, View, ChatDotRound, Star } from '@element-plus/icons-vue'
+import { getInterviewList } from '@/api'
+
+import type { ColumnItemDto } from '@/api'
+
+const section2Items = ref([
+  {
+    id: 4,
+    title: '宿主，你的负面清单该更新啦！',
+    description: '宿主你好呀！正在文化一本分与平常心的知识，我们一起来学习吧的知识。',
+    image: 'https://via.placeholder.com/300x200/DDA0DD/FFFFFF?text=Image4',
+    tag: '推荐',
+    views: '300',
+    comments: '0',
+    likes: '24',
+    date: '2025-04-13 12:01',
+  },
+  {
+    id: 5,
+    title: '不打破惯性思维，永远无法创新',
+    description:
+      '当我们的思路被惯性思维束缚了，想要得到一些不一样的结果就会变得很困难。但是，我们可以通过一些方法来打破惯性思维。',
+    image: 'https://via.placeholder.com/300x200/F0E68C/FFFFFF?text=Image5',
+    tag: '推荐',
+    views: '280',
+    comments: '0',
+    likes: '24',
+    date: '2025-04-13 12:10',
+  },
+  {
+    id: 6,
+    title: '文化共创｜你提意见"我听你"',
+    description: '巧妙设手段第三名，出让各有所需满意的额外为为你们带来更多一些精彩。',
+    image: 'https://via.placeholder.com/300x200/FFA07A/FFFFFF?text=Image6',
+    tag: '推荐',
+    views: '280',
+    comments: '0',
+    likes: '24',
+    date: '2025-04-13 14:28',
+  },
+])
+
+const columnList = ref<ColumnItemDto[]>([])
+const getColumnListData = async () => {
+  const { data } = await getInterviewList()
+  console.log(data)
+  columnList.value = data
+}
+
+onMounted(() => {
+  getColumnListData()
+})
+</script>
+
+<style scoped></style>

src/views/ya/components/practiceList.vue

+<template>
+  <div class="min-h-screen bg-gray-50">
+    <!-- 发布区域 -->
+    <div class="bg-white p-6 mb-6 rounded-lg shadow-sm">
+      <div class="flex items-start gap-3">
+        <el-avatar :size="40" src="/avatar.jpg" />
+        <div class="flex-1">
+          <div class="text-gray-500 mb-2">添加话题</div>
+          <div class="text-gray-400 text-sm mb-4">分享你的企业文化实践案例......</div>
+
+          <!-- 工具栏 -->
+          <div class="flex items-center justify-between">
+            <div class="flex items-center gap-4 text-gray-400">
+              <i class="i-carbon-hashtag cursor-pointer hover:text-gray-600"></i>
+              <i class="i-carbon-face-satisfied cursor-pointer hover:text-gray-600"></i>
+              <i class="i-carbon-video cursor-pointer hover:text-gray-600"></i>
+              <i class="i-carbon-attachment cursor-pointer hover:text-gray-600"></i>
+            </div>
+
+            <div class="flex items-center gap-2">
+              <el-tag size="small" color="#f0f9ff" class="text-blue-600">仅粉丝可见</el-tag>
+              <el-tag size="small" color="#fef3c7" class="text-yellow-600">草稿</el-tag>
+              <el-tag size="small" color="#dbeafe" class="text-blue-600">发布动态</el-tag>
+            </div>
+          </div>
+
+          <div class="text-right text-gray-400 text-sm mt-2">0/30</div>
+        </div>
+      </div>
+    </div>
+
+    <!-- 标签导航 -->
+    <div class="bg-white p-4 mb-6 rounded-lg shadow-sm">
+      <div class="flex flex-wrap gap-2">
+        <el-tag
+          v-for="tag in tags"
+          :key="tag.name"
+          :type="tag.active ? 'primary' : ''"
+          :effect="tag.active ? 'dark' : 'plain'"
+          class="cursor-pointer"
+          @click="handleTagClick(tag)"
+        >
+          {{ tag.name }}
+        </el-tag>
+      </div>
+    </div>
+
+    <!-- 内容区域 -->
+    <div class="bg-white rounded-lg shadow-sm">
+      <!-- 最新标题 -->
+      <div class="flex items-center justify-between p-4 border-b border-gray-100">
+        <div class="flex items-center gap-2">
+          <div class="w-1 h-6 bg-red-500 rounded"></div>
+          <h2 class="text-lg font-medium">最新</h2>
+        </div>
+        <div class="text-blue-600 text-sm cursor-pointer hover:text-blue-700">查看更多 >></div>
+      </div>
+
+      <!-- 动态列表 -->
+      <div class="divide-y divide-gray-100">
+        <div v-for="post in posts" :key="post.id" class="p-4 hover:bg-gray-50 transition-colors">
+          <div class="flex gap-3">
+            <!-- 左侧内容 -->
+            <div class="flex-1">
+              <h3 class="text-base font-medium text-gray-900 mb-2 leading-relaxed">
+                {{ post.title }}
+              </h3>
+
+              <!-- 带图片的内容 -->
+              <div v-if="post.image" class="flex gap-3 mb-3">
+                <img
+                  :src="post.image"
+                  :alt="post.title"
+                  class="w-20 h-20 object-cover rounded-lg flex-shrink-0"
+                />
+                <div class="flex-1">
+                  <div class="text-gray-600 text-sm leading-relaxed">
+                    {{ post.description }}
+                  </div>
+                </div>
+              </div>
+
+              <!-- 无图片的内容 -->
+              <div v-else class="text-gray-600 text-sm leading-relaxed mb-3">
+                {{ post.description }}
+              </div>
+
+              <!-- 互动数据 -->
+              <div class="flex items-center gap-6 text-gray-400 text-sm">
+                <div class="flex items-center gap-1">
+                  <i class="i-carbon-view text-base"></i>
+                  <span>{{ post.views }}</span>
+                </div>
+                <div class="flex items-center gap-1">
+                  <i class="i-carbon-favorite text-base"></i>
+                  <span>{{ post.likes }}</span>
+                </div>
+                <div class="flex items-center gap-1">
+                  <i class="i-carbon-chat text-base"></i>
+                  <span>{{ post.comments }}</span>
+                </div>
+                <div class="ml-auto">{{ post.time }}</div>
+              </div>
+            </div>
+
+            <!-- 右侧头像 -->
+            <div class="flex flex-col items-center gap-1 flex-shrink-0">
+              <el-avatar :size="40" :src="post.avatar" />
+              <div class="text-xs text-gray-500">{{ post.author }}</div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+// 标签数据
+const tags = ref([
+  { name: '最新', active: true },
+  { name: '最热', active: false },
+  { name: '商务观看', active: false },
+  { name: '多收藏', active: false },
+  { name: 'Amazon产品开发部', active: false },
+  { name: 'Amazon销售部', active: false },
+  { name: 'Amazon运营部', active: false },
+  { name: '领导设计部', active: false },
+  { name: '知识产权部', active: false },
+  { name: '供应链管理部', active: false },
+  { name: 'IT技术部', active: false },
+  { name: '财务部', active: false },
+  { name: '人力资源中心', active: false },
+])
+
+// 动态数据
+const posts = ref([
+  {
+    id: 1,
+    title: 'YA文化|郭修启示录——名门正派还在编说明书，野路子已经满天飞了',
+    description:
+      '最近听布谷鸟在网上聊了很多的郭修启示录，经过充分思考后发现这个问题，明明大家都是做好的！(☆_☆)',
+    image: null,
+    views: '1068',
+    likes: '94',
+    comments: '66',
+    time: '2023-08-20 17:00',
+    author: 'AAA超哥',
+    avatar: '/avatar1.jpg',
+  },
+  {
+    id: 2,
+    title: 'YA文化|郭修启示录——名门正派还在编说明书，野路子已经满天飞了',
+    description:
+      '最近听布谷鸟在网上聊了几个月的郭修启示录，经过充分思考后发现这个问题，明明大家都是做好的！(☆_☆) 但为什么总是有人在编说明书，而野路子已经满天飞了呢？这个问题值得我们深思。在这个快速发展的时代，我们需要更加灵活的思维方式，不能总是按部就班地按照传统的方式来做事情。',
+    image: '/post-image.jpg',
+    views: '1068',
+    likes: '94',
+    comments: '66',
+    time: '2023-08-20 17:00',
+    author: 'AAA超哥',
+    avatar: '/avatar2.jpg',
+  },
+  {
+    id: 3,
+    title: 'YA文化|郭修启示录——名门正派还在编说明书，野路子已经满天飞了',
+    description:
+      '最近听布谷鸟在网上聊了几个月的郭修启示录，经过充分思考后发现这个问题，明明大家都是做好的！(☆_☆)',
+    image: null,
+    views: '1068',
+    likes: '94',
+    comments: '66',
+    time: '2023-08-20 17:00',
+    author: 'AAA超哥',
+    avatar: '/avatar3.jpg',
+  },
+  {
+    id: 4,
+    title: 'YA文化|郭修启示录——名门正派还在编说明书，野路子已经满天飞了',
+    description:
+      '最近听布谷鸟在网上聊了几个月的郭修启示录，经过充分思考后发现这个问题，明明大家都是做好的！(☆_☆) 但为什么总是有人在编说明书，而野路子已经满天飞了呢？这个问题值得我们深思。',
+    image: '/post-image2.jpg',
+    views: '1068',
+    likes: '94',
+    comments: '66',
+    time: '2023-08-20 17:00',
+    author: 'AAA超哥',
+    avatar: '/avatar4.jpg',
+  },
+])
+
+// 标签点击事件
+const handleTagClick = (clickedTag) => {
+  tags.value.forEach((tag) => {
+    tag.active = tag.name === clickedTag.name
+  })
+}
+</script>
+
+<style scoped>
+/* 如果需要自定义样式可以在这里添加 */
+</style>

src/views/ya/index.vue

+<template>
+  <div class="min-h-screen">
+    <!-- 头部Tabs -->
+    <div class="header h-40px items-center justify-between">
+      <div class="left flex gap-3 flex items-center">
+        <Tabs v-model="activeTab" :tabs="tabs" />
+        <!-- 刷新图标 -->
+        <el-icon size="15" class="cursor-pointer hover:rotate-180 transition-all duration-300"
+          ><Refresh
+        /></el-icon>
+      </div>
+    </div>
+    <el-divider style="margin: 10px 0 20px 0" />
+    <ColumnList v-if="activeTab === '专栏'" />
+    <InterviewList v-if="activeTab === '专访'" />
+    <PracticeList v-if="activeTab === '实践'" />
+    <!-- 底部分页 -->
+    <div class="bottom-pagination bg-gray-50/80 backdrop-blur-8 border-t border-gray-200">
+      <div class="max-w-7xl mx-auto px-8 py-6">
+        <div class="flex items-center justify-between">
+          <!-- 左侧：回到顶部按钮 -->
+          <div class="left">
+            <button
+              class="back-top-btn group flex items-center gap-3 px-4 py-2.5 bg-gradient-to-r from-blue-50 to-indigo-50 hover:from-blue-100 hover:to-indigo-100 border border-blue-200/50 rounded-full transition-all duration-300 hover:shadow-lg hover:-translate-y-1 active:scale-95"
+              title="回到顶部"
+              @click="handleBackTop"
+            >
+              <div
+                class="w-8 h-8 bg-gradient-to-r from-blue-500 to-indigo-500 rounded-full flex items-center justify-center group-hover:rotate-12 transition-transform duration-300 shadow-sm"
+              >
+                <SvgIcon color="#409eff" name="icon_top" size="16" />
+              </div>
+              <span
+                class="text-sm font-medium text-gray-700 group-hover:text-blue-600 transition-colors"
+                >回到顶部</span
+              >
+            </button>
+          </div>
+          <!-- 右侧：分页器 -->
+          <div class="right">
+            <div
+              class="pagination-wrapper bg-white rounded-xl shadow-sm border border-gray-100 p-3"
+            >
+              <el-pagination
+                v-model:current-page="currentPage"
+                v-model:page-size="pageSize"
+                :page-sizes="[15, 30, 45, 60]"
+                layout="prev, pager, next, jumper, total"
+                :total="400"
+                class="custom-pagination"
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts" name="CultureAsk">
+import { ref } from 'vue'
+import Tabs from '@/components/common/Tabs'
+import { Refresh } from '@element-plus/icons-vue'
+import ColumnList from './components/columnList.vue'
+import InterviewList from './components/interviewList.vue'
+import PracticeList from './components/practiceList.vue'
+const currentPage = ref(1)
+const pageSize = ref(10)
+
+const activeTab = ref('专栏')
+const tabs = [
+  { label: '专栏', value: '专栏' },
+  { label: '实践', value: '实践' },
+  { label: '专访', value: '专访' },
+  { label: '视频', value: '视频' },
+]
+
+const handleBackTop = () => {
+  window.scrollTo({
+    top: 0,
+    behavior: 'smooth',
+  })
+}
+</script>
+<style lang="scss" scoped></style>

tsconfig.app.json

 {
   "extends": "@vue/tsconfig/tsconfig.dom.json",
-  "include": ["env.d.ts", "src/**/*", "src/**/*.vue"],
+  "include": [
+    "env.d.ts",
+    "src/**/*",
+    "src/**/*.vue",
+    "src/**/*.tsx",
+    "auto-imports.d.ts",
+    "components.d.ts"
+  ],
   "exclude": ["src/**/__tests__/*"],
   "compilerOptions": {
     "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
-
+    // "types": ["element-plus/global"],
     "paths": {
       "@/*": ["./src/*"]
-    }
+    },
+    "target": "es2022",
+    "lib": ["es2022", "dom"]
   }
 }

uno.config.ts

+import { defineConfig } from 'unocss'
+import { presetMini, presetWind3 } from 'unocss'
+export default defineConfig({
+  // ...UnoCSS options
+  shortcuts: [
+    // [
+    //   'btn',
+    //   'px-4 py-1 rounded inline-block bg-teal-700 text-white cursor-pointer !outline-none hover:bg-teal-800 disabled:cursor-default disabled:bg-gray-600 disabled:opacity-50',
+    // ],
+    // [
+    //   'icon-btn',
+    //   'inline-block cursor-pointer select-none opacity-75 transition duration-200 ease-in-out hover:opacity-100 hover:text-teal-600',
+    // ],
+  ],
+  presets: [presetMini(), presetWind3()],
+})

vite.config.ts

 import { fileURLToPath, URL } from 'node:url'
-
 import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
 import vueJsx from '@vitejs/plugin-vue-jsx'
 import vueDevTools from 'vite-plugin-vue-devtools'
+import AutoImport from 'unplugin-auto-import/vite'
+import Components from 'unplugin-vue-components/vite'
+import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
+import { createSvgIconsPlugin } from 'vite-plugin-svg-icons'
+import UnoCSS from 'unocss/vite'
+
+import path from 'node:path'
 
 // https://vite.dev/config/
 export default defineConfig({
+  resolve: {
+    //设置别名
+    alias: {
+      '@': fileURLToPath(new URL('./src', import.meta.url)),
+    },
+  },
   plugins: [
     vue(),
     vueJsx(),
     vueDevTools(),
+    AutoImport({
+      imports: ['vue', 'vue-router'],
+      resolvers: [ElementPlusResolver()],
+      dts: true,
+      eslintrc: {
+        enabled: true, // 生成 eslint 配置
+      },
+    }),
+    Components({
+      resolvers: [ElementPlusResolver()],
+      include: ['src/**/*.vue', 'src/**/*.tsx'],
+      dts: true,
+    }),
+    UnoCSS(),
+    createSvgIconsPlugin({
+      // 指定需要缓存的图标文件夹(路径为存放所有svg图标的文件夹不单个svg图标)
+      iconDirs: [path.resolve(process.cwd(), 'src/assets/svg')],
+      // 指定symbolId格式
+      symbolId: 'icon-[dir]-[name]',
+    }),
   ],
-  resolve: {
-    alias: {
-      '@': fileURLToPath(new URL('./src', import.meta.url))
+  server: {
+    // 是否开启 https
+    // https: false as const,
+    proxy: {
+      '/api1': {
+        target: 'http://192.168.2.168:8089', // 首拥本地
+        changeOrigin: true,
+        rewrite: (path) => {
+          return path.replace(/^\/api1/, '')
+        },
+      },
     },
   },
 })