@opendesign-plus/components 0.0.1-rc.4 → 0.0.1-rc.40

package/docs/design.md

@@ -1,27 +0,0 @@
-# 业务组件设计文档
-
-## 目录结构
-
-```text
-components
-  ├─ docs // 文档
-  ├─ playground // 演练场
-  ├─ scripts // 脚本
-  ├─ src // 具体内容
-```
-
-## 总览
-
-| 名称 | 文件名 | 状态       | 备注 |
-|:------|:------|:------|:------|
-| Banner | OBanner.vue   | 10月完成   ||
-| 通用楼层布局 | OSection.vue   |   10月完成  ||
-| 导航搜索| OHeaderSearch.vue   |  10月完成  ||
-| 会议日历| OMettingCalendar.vue   |  11月完成  ||
-| openEuler社区页头| OHeader_openEuler.vue   |  11月完成  ||
-| openEuler社区页脚| OFooter_openEuler.vue   |  11月完成  ||
-| 悬浮按钮| OFloatingButton.vue   |  11月完成  ||
-| 语言切换| OLanguageSwitcher.vue   |  11月完成  |调用useLocale的能力|
-| 风格切换| OThemeSwitcher.vue   |  11月完成  |调用useTheme的能力|
-| 导航用户信息| OUserInfo.vue   |  11月完成  |调用useLogin的能力|
-| 隐私管理| OCookieNotice.vue   |  11月完成  ||

package/docs/design_banner.md

@@ -1,41 +0,0 @@
-# banner 组件设计文档
-
-## 使用场景
-
-运用于首页主 Banner 的呈现，将 Banner 的不同细分场景配置化，支持图文型、图片型、多端，满足绝大部分 Banner 场景。
-
-## 字段配置
-
-| 字段名          | 字段用途                                       |
-| :-------------- | :--------------------------------------------- |
-| light           | light 主题下相关配置                           |
-| dark            | dark 主题下相关配置                            |
-| bg_pc           | PC 端 Banner 图                                |
-| bg_pad          | Pad 端 Banner 图                               |
-| bg_mb           | 移动端端 Banner 图                             |
-| bg_theme        | Banner 图所在主题                              |
-| bg_href         | Banner 跳转链接                                |
-| bg_btn          | Banner 按钮内容                                |
-| pc_text_width   | PC 端下图片型适配，文本图片宽度                |
-| pc_text_height  | PC 端下图片型适配，文本图片高度                |
-| pad_text_width  | Pad 端下图片型适配，文本图片宽度               |
-| pad_text_height | Pad 端下图片型适配，文本图片高度               |
-| pad_offset      | Pad 端下 Banner 图适配，偏移量使主视觉元素位置 |
-
-## 规范描述
-
-### 适配原则
-
-#### ≥1680px: banner 高度： 460px；标题距离顶部导航 128px；标题字号 56px；正文字号 20px；
-
-#### 1680px ~ 1201px: banner 高度： 400px；标题距离顶部导航 88px；标题字号 48px；正文字号 18px；
-
-#### 1200px ~ 841px: banner 高度： 320px；标题距离顶部导航 64px；标题字号 40px；正文字号 16px；
-
-#### 840px ~ 601px: 折叠屏、手机横屏、Pad 竖屏，banner 高度： 184px；标题距离顶部导航 24px；标题字号 22px；正文字号 12px；banner 圆角 12px；
-
-#### 600px ~ 360px: 手机竖屏，banner 高度： 184px；标题距离顶部导航 24px；标题字号 22px；正文字号 21px；banner 圆角 12px；
-
-### 切图原则 -- 待补充
-
-### 交互原则 -- 待补充

package/docs/design_section.md

@@ -1,27 +0,0 @@
-# 全局通用楼层组件设计文档--OSection
-
-## 使用场景
-
-运用于社区需要通用楼层的场景，提供标准化楼层标题、主体、楼层注脚等内容的模板。
-
-## 属性
-
-| 属性                  | 属性用途                             | 类型    |
-| :-------------------- | :----------------------------------- | :------ |
-| title                 | 楼层大标题                           | String  |
-| subtitle              | 楼层副标题                           | String  |
-| full                  | 是否整屏宽度显示                     | Boolean |
-| header-justify-center | 楼层主标题是否居中                   | Boolean |
-| footer                | 楼层 footer 内容                     | String  |
-| footer-href           | 楼层 footer 如需跳转，可配置跳转链接 | String  |
-
-## 插槽
-
-| 插槽名   | 插槽用途          |
-| :------- | :---------------- |
-| title    | 自定义楼层标题    |
-| subtitle | 自定义楼层副标题  |
-| footer   | 自定义楼层 footer |
-| default  | 自定义楼层主内容  |
-
-## 规范描述 -- 待补充

package/scripts/generate-components-index.js

@@ -1,81 +0,0 @@
-#!/usr/bin/env node
-
-import fs from 'fs';
-import path from 'path';
-
-// 组件目录路径
-const componentsDir = path.resolve(process.cwd(), 'src/components');
-const indexFilePath = path.resolve(process.cwd(), 'src/index.ts');
-
-// 生成组件索引文件
-function generateComponentsIndex() {
-  console.log('开始生成组件索引文件...');
-  
-  try {
-    // 读取组件目录
-    const files = fs.readdirSync(componentsDir);
-    
-    // 过滤出.vue文件（不包含common目录）
-    const vueFiles = files.filter(file => 
-      file.endsWith('.vue') && !fs.statSync(path.join(componentsDir, file)).isDirectory()
-    );
-    
-    console.log(`发现 ${vueFiles.length} 个组件文件`);
-    
-    // 生成导入语句
-    const importStatements = vueFiles.map(file => {
-      const componentName = file.replace('.vue', '');
-      return `import ${componentName} from './components/${file}';`;
-    }).join('\n');
-    
-    // 生成组件列表
-    const componentNames = vueFiles.map(file => file.replace('.vue', ''));
-    const componentsObject = componentNames.map(name => `  ${name}`).join(',\n');
-    
-    // 生成导出语句
-    const exportStatement = `export { ${componentNames.join(', ')} };`;
-    
-    // 生成完整的index.ts内容
-    const indexContent = `// OpenDesignPlus Components 库入口文件
-// 此文件由 scripts/generate-components-index.js 自动生成
-
-${importStatements}
-
-// 导出组件
-const components = {
-${componentsObject}
-};
-
-// 导出单个组件
-${exportStatement}
-
-// 默认导出（用于Vue插件安装）
-export default {
-  install: (app: any) => {
-    // 注册所有组件
-    Object.entries(components).forEach(([name, component]) => {
-      app.component(name, component);
-    });
-  }
-};
-`;
-    
-    // 写入文件
-    fs.writeFileSync(indexFilePath, indexContent, 'utf-8');
-    console.log(`组件索引文件已生成: ${indexFilePath}`);
-    console.log(`成功导出 ${componentNames.length} 个组件`);
-    return true;
-  } catch (error) {
-    console.error('生成组件索引文件失败:', error);
-    return false;
-  }
-}
-
-// 执行生成
-try {
-  const success = generateComponentsIndex();
-  process.exit(success ? 0 : 1);
-} catch (error) {
-  console.error('执行脚本时发生错误:', error);
-  process.exit(1);
-}

package/src/assets/svg-icons/icon-chevron-right.svg

@@ -1,3 +0,0 @@
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
-<path d="M9.246 5.764c-0.251 0.251-0.271 0.644-0.063 0.918l0.063 0.072 5.016 5.016c0.1 0.1 0.115 0.254 0.043 0.37l-0.043 0.054-5.062 5.062c-0.273 0.273-0.273 0.717 0 0.99 0.251 0.251 0.644 0.271 0.918 0.063l0.072-0.063 5.062-5.062c0.629-0.629 0.662-1.628 0.099-2.296l-0.099-0.108-5.016-5.016c-0.273-0.273-0.717-0.273-0.99 0z"></path>
-</svg>

package/src/assets/svg-icons/icon-close.svg

@@ -1,3 +0,0 @@
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
-<path fill="currentColor" d="M18.528 5.472c0.246 0.246 0.271 0.63 0.074 0.903l-0.074 0.087-5.54 5.538 0.006 0.006-0.989 0.989-0.006-0.006-5.538 5.54c-0.273 0.273-0.717 0.273-0.99 0-0.246-0.246-0.271-0.63-0.074-0.903l0.074-0.087 5.538-5.539-5.538-5.538-0.074-0.087c-0.197-0.274-0.172-0.657 0.074-0.903s0.63-0.271 0.903-0.074l0.087 0.074 5.538 5.539 5.539-5.539c0.273-0.273 0.717-0.273 0.99 0zM14.551 13.561l3.978 3.978 0.074 0.087c0.197 0.274 0.172 0.657-0.074 0.903s-0.63 0.271-0.903 0.074l-0.087-0.074-3.978-3.978c-0.273-0.273-0.273-0.717 0-0.99v0c0.273-0.273 0.717-0.273 0.99 0z"></path>
-</svg>

package/src/assets/svg-icons/icon-delete.svg

@@ -1,3 +0,0 @@
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
-<path fill="currentColor" d="M19.154 5.295c0.387 0 0.7 0.313 0.7 0.7 0 0.354-0.263 0.647-0.605 0.694l-0.095 0.006-12.201-0.001 0.001 12.413c0 0.17 0.12 0.311 0.28 0.344l0.071 0.007h9.39c0.17 0 0.311-0.12 0.344-0.28l0.007-0.071v-10.47c0-0.387 0.313-0.7 0.7-0.7 0.354 0 0.647 0.263 0.694 0.605l0.006 0.095v10.47c0 0.919-0.708 1.672-1.608 1.745l-0.144 0.006h-9.39c-0.919 0-1.672-0.708-1.745-1.608l-0.006-0.144-0.001-12.413-0.707 0.001c-0.387 0-0.7-0.313-0.7-0.7 0-0.354 0.263-0.647 0.605-0.694l0.095-0.006h14.308zM10.011 9.744c0.354 0 0.647 0.263 0.694 0.605l0.006 0.095v5.68c0 0.387-0.313 0.7-0.7 0.7-0.354 0-0.647-0.263-0.694-0.605l-0.006-0.095v-5.68c0-0.387 0.313-0.7 0.7-0.7zM13.953 9.744c0.354 0 0.647 0.263 0.694 0.605l0.006 0.095v5.68c0 0.387-0.313 0.7-0.7 0.7-0.354 0-0.647-0.263-0.694-0.605l-0.006-0.095v-5.68c0-0.387 0.313-0.7 0.7-0.7zM13.652 3.189c0.387 0 0.7 0.313 0.7 0.7 0 0.354-0.263 0.647-0.605 0.694l-0.095 0.006h-3.972c-0.387 0-0.7-0.313-0.7-0.7 0-0.354 0.263-0.647 0.605-0.694l0.095-0.006h3.972z"></path>
-</svg>

package/src/assets/svg-icons/icon-header-back.svg

@@ -1,3 +0,0 @@
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="36" height="32" viewBox="0 0 36 32">
-<path fill="currentColor" d="M5.886 19.111l10.672 10.677c0.46 0.524 0.44 1.322-0.060 1.822s-1.298 0.52-1.822 0.060l-0.064-0.060-12.498-12.498h3.772zM14.613 0.391c0.521-0.521 1.365-0.521 1.886 0 0.5 0.5 0.52 1.298 0.060 1.822l-0.060 0.064-12.391 12.391h29.67c0.71 0 1.291 0.555 1.331 1.255l0.002 0.078c0 0.71-0.555 1.291-1.255 1.331l-0.078 0.002h-31.816c-0.472 0-0.924-0.187-1.257-0.521-0.671-0.671-0.694-1.745-0.067-2.443l0.067-0.071 13.908-13.908z"></path>
-</svg>

package/src/assets/svg-icons/icon-header-delete.svg

@@ -1,3 +0,0 @@
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
-<path fill="currentColor" d="M10.858 22.41c-0.349 0.349-0.915 0.349-1.263 0-0.314-0.314-0.345-0.804-0.094-1.153l0.094-0.111 5.146-5.15-5.177-5.178c-0.274-0.305-0.3-0.755-0.077-1.087l0.111-0.135c0.347-0.347 0.91-0.347 1.257 0l5.142 5.143 5.15-5.146c0.349-0.349 0.915-0.349 1.263 0 0.314 0.314 0.345 0.804 0.094 1.153l-0.094 0.111-11.552 11.552zM17.89 16.634l4.551 4.552c0.313 0.349 0.302 0.886-0.034 1.222-0.347 0.347-0.91 0.347-1.257 0l-4.516-4.518 1.256-1.256z"></path>
-</svg>

package/src/assets/svg-icons/icon-header-search.svg

@@ -1,4 +0,0 @@
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
-<path opacity="0.8" fill="currentColor" d="M13.215 0.524c-7.048 0-12.762 5.714-12.762 12.762s5.714 12.762 12.762 12.762c7.048 0 12.762-5.714 12.762-12.762s-5.714-12.762-12.762-12.762zM13.215 2.809c5.786 0 10.476 4.69 10.476 10.476s-4.69 10.476-10.476 10.476c-5.786 0-10.476-4.69-10.476-10.476s4.69-10.476 10.476-10.476z"></path>
-<path opacity="0.8" fill="currentColor" d="M23.33 23.22c0.446-0.447 1.169-0.448 1.616-0.002l4.771 4.759c0.447 0.446 0.448 1.169 0.002 1.616s-1.169 0.448-1.616 0.002l-4.771-4.759c-0.447-0.446-0.448-1.169-0.002-1.616z"></path>
-</svg>

package/src/assets/svg-icons/icon-moon.svg

@@ -1,3 +0,0 @@
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
-<path opacity="0.8" fill="currentColor" d="M12 2.3c5.357 0 9.7 4.343 9.7 9.7s-4.343 9.7-9.7 9.7c-4.651 0-8.622-3.298-9.515-7.806-0.101-0.509 0.369-0.948 0.87-0.812 0.531 0.144 1.082 0.218 1.645 0.218 3.479 0 6.3-2.82 6.3-6.3 0-1.276-0.379-2.494-1.079-3.527-0.291-0.43-0.029-1.016 0.486-1.086 0.425-0.057 0.857-0.086 1.293-0.086zM12 3.7l-0.042 0.001 0.058 0.121c0.402 0.887 0.634 1.85 0.677 2.845l0.007 0.333c0 4.253-3.447 7.7-7.7 7.7-0.229 0-0.457-0.010-0.682-0.030l-0.186-0.021 0.076 0.218c1.147 3.123 4.102 5.321 7.528 5.429l0.264 0.004c4.584 0 8.3-3.716 8.3-8.3s-3.716-8.3-8.3-8.3z"></path>
-</svg>

package/src/assets/svg-icons/icon-sun.svg

@@ -1,3 +0,0 @@
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
-<path opacity="0.8" fill="currentColor" d="M12 1.992c0.387 0 0.7 0.313 0.7 0.7v1.2c0 0.387-0.313 0.7-0.7 0.7s-0.7-0.313-0.7-0.7v-1.2c0-0.387 0.313-0.7 0.7-0.7zM6.769 6.747c-0.273 0.273-0.717 0.273-0.99 0l-0.849-0.849c-0.137-0.137-0.205-0.316-0.205-0.495s0.068-0.358 0.205-0.495c0.273-0.273 0.717-0.273 0.99 0l0.849 0.849c0.136 0.137 0.205 0.316 0.205 0.495s-0.068 0.358-0.205 0.495zM18.192 6.747c-0.273 0.273-0.717 0.273-0.99 0-0.137-0.137-0.205-0.316-0.205-0.495s0.068-0.358 0.205-0.495l0.849-0.849c0.273-0.273 0.717-0.273 0.99 0 0.137 0.137 0.205 0.316 0.205 0.495s-0.068 0.358-0.205 0.495l-0.849 0.849zM5.3 12c0-3.7 3-6.7 6.7-6.7s6.7 3 6.7 6.7-3 6.7-6.7 6.7c-3.7 0-6.7-3-6.7-6.7zM17.3 12c0-2.927-2.373-5.3-5.3-5.3s-5.3 2.373-5.3 5.3c0 2.927 2.373 5.3 5.3 5.3s5.3-2.373 5.3-5.3zM4.594 11.969c0 0.387-0.313 0.7-0.7 0.7h-1.2c-0.387 0-0.7-0.313-0.7-0.7s0.313-0.7 0.7-0.7h1.2c0.386 0 0.7 0.313 0.7 0.7zM21.977 11.999c0 0.387-0.314 0.7-0.7 0.7h-1.2c-0.387 0-0.7-0.313-0.7-0.7s0.313-0.7 0.7-0.7h1.2c0.387 0 0.7 0.313 0.7 0.7zM5.921 19.060c-0.273 0.273-0.717 0.273-0.99 0-0.137-0.137-0.205-0.316-0.205-0.495s0.068-0.358 0.205-0.495l0.849-0.849c0.273-0.273 0.717-0.273 0.99 0 0.137 0.137 0.205 0.316 0.205 0.495s-0.068 0.358-0.205 0.495l-0.849 0.849zM19.041 19.060c-0.273 0.273-0.717 0.273-0.99 0l-0.849-0.849c-0.137-0.137-0.205-0.316-0.205-0.495s0.068-0.358 0.205-0.495c0.273-0.273 0.717-0.273 0.99 0l0.849 0.849c0.137 0.137 0.205 0.316 0.205 0.495s-0.068 0.358-0.205 0.495zM11.971 19.376c0.387 0 0.7 0.313 0.7 0.7v1.2c0 0.387-0.313 0.7-0.7 0.7s-0.7-0.313-0.7-0.7v-1.2c0-0.387 0.313-0.7 0.7-0.7z"></path>
-</svg>

package/src/components/OBanner.vue

@@ -1,390 +0,0 @@
-<script setup lang="ts">
-import { OButton, OCarousel, OCarouselItem, OFigure } from '@opensig/opendesign';
-import { computed, ref } from 'vue';
-
-import { useScreen, useTheme } from '@opendesign-plus/composables';
-import ContentWrapper from './common/ContentWrapper.vue';
-
-const props = defineProps({
-  options: undefined,
-  size: 'large',
-  contentJustifyCenter: false,
-});
-
-const { isLight } = useTheme('opendesignplus', document.domain || 'localhost');
-const { isPhone } = useScreen();
-
-const bannerInfo = computed(() => props.options);
-
-// 主题切换
-const theme = ref('');
-const onBeforeChange = (idx: number) => {
-  setTimeout(() => {
-    theme.value = bannerInfo.value[idx].bg_theme ?? 'light';
-  }, 100);
-};
-
-// banner跳转
-const onClick = (href: string, hasBtn: boolean | undefined) => {
-  if (href && !hasBtn) {
-    window.open(href);
-  }
-};
-</script>
-
-<template>
-  <div :class="['home-banner', size]">
-    <div v-if="size === 'tiny'">
-      {{ bannerInfo[1].title }}
-    </div>
-
-    <OCarousel
-      v-else-if="!isPhone"
-      class="banner-carousel"
-      effect="toggle"
-      active-class="current-slide"
-      indicator-click
-      :auto-play="true"
-      :data-o-theme="theme"
-      @before-change="onBeforeChange"
-    >
-      <OCarouselItem v-for="(info, index) in bannerInfo" :key="index" class="banner-item" :class="`banner-item${index}`">
-        <OFigure
-          class="banner-bg"
-          :src="info.bg"
-          :class="{
-            'with-sticky-bg': info.withStickyBg,
-            'in-dark': !isLight,
-            'cursor-pointer': info.href && !info.btn,
-          }"
-          :style="{
-            '--pad-offset': info.pad_offset,
-          }"
-          @click="onClick(info.href, info.btn)"
-        >
-          <ContentWrapper class="banner-wrapper" :class="['banner-wrapper', contentJustifyCenter ? 'content-center' : '']">
-            <div class="banner-content">
-              <img v-if="!isPhone && info.attach" :src="info.attach" class="banner-attach" />
-
-              <!-- 标题 -->
-              <div class="banner-title" v-if="info.title">{{ info.title }}</div>
-              <!-- 副标题 -->
-              <div class="banner-subtitle" v-if="info.subtitle">{{ info.subtitle }}</div>
-              <div
-                class="banner-text"
-                v-if="info.bg_text"
-                :style="{
-                  backgroundImage: `url(${info.bg_text})`,
-                  '--pc-width': info.pc_text_width,
-                  '--pc-height': info.pc_text_height,
-                  '--pad-width': info.pad_text_width,
-                  '--pad-height': info.pad_text_height,
-                }"
-              ></div>
-              <!-- 操作按钮 -->
-              <div v-if="info.btn" class="banner-opts">
-                <OButton :href="info.href" target="_blank" variant="solid" color="primary" :size="size">
-                  {{ info.btn }}
-                </OButton>
-              </div>
-            </div>
-          </ContentWrapper>
-        </OFigure>
-      </OCarouselItem>
-    </OCarousel>
-
-    <OCarousel
-      v-else="isPhone"
-      class="banner-carousel"
-      effect="gallery"
-      indicator-click
-      :data-o-theme="theme"
-      arrow="never"
-      :auto-play="true"
-      @before-change="onBeforeChange"
-    >
-      <OCarouselItem v-for="(info, index) in bannerInfo" class="banner-item" :class="`banner-item${index}`">
-        <ContentWrapper class="banner-wrapper">
-          <OFigure class="banner-bg" :src="info.bg" @click="onClick(info.href)" />
-        </ContentWrapper>
-      </OCarouselItem>
-    </OCarousel>
-  </div>
-</template>
-
-<style lang="scss" scoped>
-.home-banner {
-  overflow: hidden;
-  position: relative;
-
-  &.tiny {
-    @include display2;
-    font-weight: 500;
-    margin: var(--o-gap-8) 0;
-    color: var(--o-color-info1);
-  }
-
-  .banner-title {
-    color: var(--o-color-info1);
-    font-weight: 500;
-    font-size: 48px; // 基础字体大小
-    margin-bottom: 8px;
-  }
-
-  .banner-subtitle {
-    color: var(--o-color-info1);
-    margin-top: 8px;
-    font-size: 16px;
-  }
-
-  .banner-text {
-    height: var(--pc-height);
-    width: var(--pc-width);
-    background-size: contain;
-    background-repeat: no-repeat;
-
-    @include respond-to('pad') {
-      height: var(--pad-height);
-      width: var(--pad-width);
-    }
-  }
-
-  &.large {
-    --banner-height: 460px;
-    height: var(--banner-height);
-
-    .banner-title {
-      @include display1;
-    }
-
-    .banner-subtitle {
-      @include h4;
-    }
-
-    @include respond-to('laptop-pc_s') {
-      --banner-height: 400px;
-    }
-
-    @include respond-to('pad_h') {
-      --banner-height: 360px;
-    }
-
-    @include respond-to('<=pad_v') {
-      --banner-height: 184px;
-    }
-  }
-
-  &.medium {
-    --banner-height: 360px;
-    height: var(--banner-height);
-
-    .banner-title {
-      @include display2;
-    }
-
-    .banner-subtitle {
-      @include text2;
-    }
-
-    @include respond-to('laptop-pc_s') {
-      --banner-height: 280px;
-    }
-
-    @include respond-to('pad_h') {
-      --banner-height: 220px;
-    }
-
-    @include respond-to('<=pad_v') {
-      --banner-height: 120px;
-    }
-
-    .banner-text {
-      --pc-height: 100px !important;
-      --pc-width: 500px !important;
-
-      @include respond-to('pad') {
-        --pc-height: 60px !important;
-        --pc-width: 300px !important;
-      }
-    }
-  }
-
-  &.small {
-    --banner-height: 280px;
-    height: var(--banner-height);
-
-    .banner-title {
-      @include display2;
-    }
-
-    .banner-subtitle {
-      @include text2;
-    }
-
-    @include respond-to('laptop-pc_s') {
-      --banner-height: 220px;
-    }
-
-    @include respond-to('pad_h') {
-      --banner-height: 180px;
-    }
-
-    @include respond-to('<=pad_v') {
-      display: none;
-    }
-
-    .banner-text {
-      --pc-height: 80px !important;
-      --pc-width: 400px !important;
-
-      @include respond-to('pad') {
-        --pc-height: 50px !important;
-        --pc-width: 250px !important;
-      }
-    }
-  }
-
-  :deep(.o-btn) {
-    border-radius: var(--btn-height);
-  }
-}
-
-.banner-carousel {
-  width: 100%;
-  height: 100%;
-  @include respond-to('>pad_v') {
-    --carousel-indicator-offset: 53px;
-  }
-
-  @include respond-to('<=pad_v') {
-    --carousel-indicator-offset: 1px;
-  }
-
-  :deep(.o-carousel-indicator-bar) {
-    height: 24px;
-  }
-}
-
-.banner-item {
-  width: 100%;
-  height: 100%;
-}
-
-.banner-bg {
-  width: 100%;
-  height: 100%;
-
-  :deep(.o-figure-img) {
-    width: 100%;
-    height: 100%;
-  }
-
-  @include respond-to('pad') {
-    :deep(.o-figure-img) {
-      transition: object-position 0.3s ease;
-      object-position: var(--pad-offset);
-    }
-  }
-
-  @include respond-to('phone') {
-    --figure-radius: 4px;
-  }
-}
-
-.banner-wrapper {
-  height: 100%;
-
-  &.content-center {
-    display: flex;
-    justify-content: center;
-
-    & .banner-content {
-      align-items: center;
-    }
-  }
-}
-
-.banner-content {
-  height: 100%;
-  display: inline-flex;
-  flex-direction: column;
-  justify-content: center;
-  position: relative;
-}
-
-.banner-opts {
-  margin-top: 24px;
-  --d: 20px;
-}
-
-@keyframes fade-up {
-  from {
-    transform: translateY(var(--d));
-    opacity: 0;
-  }
-  to {
-    transform: translateY(0);
-    opacity: 1;
-  }
-}
-
-.current-slide {
-  .banner-title {
-    animation: fade-up 400ms ease-in;
-  }
-  .banner-subtitle {
-    animation: fade-up 400ms ease-in;
-  }
-  .banner-text {
-    animation: fade-up 400ms ease-in;
-  }
-  .banner-opts {
-    animation: fade-up 400ms ease-in;
-  }
-}
-
-.in-dark.with-sticky-bg {
-  :deep(.o-figure-img) {
-    @include img-in-dark;
-  }
-}
-.cursor-pointer {
-  cursor: pointer;
-}
-</style>
-
-<style lang="scss" scoped>
-// 定制修改item1
-.banner-item0 {
-  .banner-attach {
-    height: 120px;
-
-    @include respond-to('pad') {
-      height: 80px;
-    }
-  }
-}
-
-.banner-item1 {
-  .banner-attach {
-    height: 156px;
-
-    @include respond-to('pad') {
-      height: 120px;
-    }
-  }
-}
-
-// 定制修改item2
-.banner-item2 {
-  .banner-content {
-    width: 100%;
-    justify-content: center;
-  }
-  .banner-attach {
-    height: 38%;
-    margin-top: -60px;
-    object-fit: contain;
-  }
-}
-</style>