feat:修改暗黑样式

src/components/AIRobot/src/AIRobot.vue

@@ -248,7 +248,7 @@ defineExpose({
   padding-left: 8px;
 }
 .dialogue_title_left {
-  background: linear-gradient(90deg, #A71549 1.77%, #06256E 46.77%);
+  background: var(--color-dialogue_title);
   -webkit-background-clip: text;
   background-clip: text;
   color: transparent;
@@ -276,7 +276,7 @@ defineExpose({
   width: 64px;
   height: 64px;
   border-radius: 12px;
-  background: radial-gradient(50% 43% at 50% 54.79%, #D5B4F3 0%, #FFF9FC 100%);
+  background: var(--color-dialogue-icon-bg);
   position: absolute;
   box-shadow: -2px 2px 12px rgba(0, 0, 0, 15%);
   z-index: 2013;
@@ -284,27 +284,27 @@ defineExpose({
   bottom: 164px;
 }
 .AIRobot_dialog {
-  background: linear-gradient(92deg, #EAECFF 1.33%, #F1E3FB 99.63%);
+  background: var(--color-dialogue-text-bg);
   box-shadow: -10px 10px 24px 0px rgba(58, 0, 78, 0.15);
   padding: 5px 8px;
   border-radius: 3px;
 }
 .dialogue_title {
-  background: linear-gradient(92deg, #EAECFF 1.33%, #F1E3FB 99.63%);
+  background: var(--color-dialogue-text-bg);
   padding: 8px;
   border-radius: 12px;
   margin: 10px 0;
   width: 294px;
 }
 .dialogue_content {
-  background: linear-gradient(92deg, #EAECFF 1.33%, #F1E3FB 99.63%);
+  background: var(--color-dialogue-text-bg);
   padding: 8px 0 0 0;
   border-radius: 12px;
 }
 .AIAvator {
   width: 40px;
   height: 40px;
-  background: radial-gradient(50% 43% at 50% 54.79%, #D5B4F3 0%, #FFF9FC 100%);
+  background: var(--color-dialogue-icon-bg);
   border-radius: 12px;
   margin-right: 8px;
 }
@@ -312,9 +312,9 @@ defineExpose({
   width: 420px;
   height: 156px;
   border-radius: 12px;
-  border: 1px solid #FFF;
+  border: 1px solid var(--color-dialogue_container-border);
   padding: 8px;
-  background: rgba(255, 255, 255, 0.50);
+  background: var(--color-dialogue_container-bg);
 }
 .dialogue_content_item {
   width: 404px;

src/styles/elementui.scss

@@ -820,7 +820,8 @@ div .carousel .el-carousel__item--card, .el-carousel__item.is-animating {
 }
 div .carousel .el-carousel__arrow {
   opacity: 1;
-  background-color: var(--color-system-card-bg);
+  background-color: var(--color-carousel-card-bg);
+  box-shadow: 2px 2px 12px 0px rgba(0, 0, 0, 0.10);
 }
 div .carousel .el-carousel__arrow--left {
   left: 0;

src/styles/theme-g.scss

@@ -83,4 +83,12 @@
   
   // AI Robot
   --color-dialogue-bg: rgba(255,255,255,0.13);
+  --color-dialogue_container-border: rgba(255,255,255,0.20);
+  --color-carousel-card-bg: rgba(255,255,255,0.70);
+  --color-dialogue-icon-bg: linear-gradient(92deg, var(--1-gradient-ai-robot-0, #525CBA) 1.33%, var(--1-gradient-ai-robot-100, #724493) 99.63%);
+  --color-dialogue-text-bg: linear-gradient(92deg, var(--1-gradient-ai-robot-0, #525CBA) 1.33%, var(--1-gradient-ai-robot-100, #724493) 99.63%);
+  --color-dialogue_container-bg:rgba(255, 255, 255, 0.10);
+  --color-dialogue_title: linear-gradient(90deg, var(--1-gradient-ai-robot-faq-0, #FFA8C7) 1.77%, var(--1-gradient-ai-robot-faq-46, #5988f3) 46.77%);
+  --color-dialogue_content-bg:linear-gradient(117deg, var(--1-gradient-ai-robot-0, #525CBA) 4.31%, var(--1-gradient-ai-robot-15, #5A57B2) 14.24%, var(--1-gradient-ai-robot-38, #5F54AD) 29.71%, var(--1-gradient-ai-robot-59, #664EA2) 43.72%, var(--1-gradient-ai-robot-83, #694CA0) 59.35%, var(--1-gradient-ai-robot-100, #724493) 70.56%);
+
 }

src/styles/theme.scss

@@ -283,6 +283,13 @@
 
   // AI Robot
   --color-dialogue-bg: #fff;
+  --color-dialogue_container-border: #fff;
+  --color-carousel-card-bg: #fff;
+  --color-dialogue-icon-bg: radial-gradient(50% 43% at 50% 54.79%, #D5B4F3 0%, #FFF9FC 100%);
+  --color-dialogue-text-bg: linear-gradient(92deg, #EAECFF 1.33%, #F1E3FB 99.63%);
+  --color-dialogue_title: linear-gradient(90deg, #A71549 1.77%, #06256E 46.77%);
+  --color-dialogue_container-bg:rgba(255, 255, 255, 0.50);
+  --color-dialogue_content-bg:linear-gradient(117deg, var(--1-gradient-ai-robot-0, #B5FEF3) 4.31%, var(--1-gradient-ai-robot-15, #F9EEEC) 14.24%, var(--1-gradient-ai-robot-38, #FBD3EE) 29.71%, var(--1-gradient-ai-robot-59, #DDD5F7) 43.72%, var(--1-gradient-ai-robot-83, #C8F4F3) 59.35%, var(--1-gradient-ai-robot-100, #CADFF8) 70.56%);
   --color-ai-chat-header-bg-gradient-begin: #eaecff;
   --color-ai-chat-header-bg-gradient-end: #fefdff;
   --color-ai-user-bubble-bg-gradient-begin: #ffede6;

src/views/AIRobotChat/src/components/AIQuestions.vue

@@ -199,7 +199,7 @@ onMounted(() => {
 
 <style lang="scss" scoped>
 .dialogue_content {
-  background: linear-gradient(117deg, var(--1-gradient-ai-robot-0, #B5FEF3) 4.31%, var(--1-gradient-ai-robot-15, #F9EEEC) 14.24%, var(--1-gradient-ai-robot-38, #FBD3EE) 29.71%, var(--1-gradient-ai-robot-59, #DDD5F7) 43.72%, var(--1-gradient-ai-robot-83, #C8F4F3) 59.35%, var(--1-gradient-ai-robot-100, #CADFF8) 70.56%);
+  background: var(--color-dialogue_content-bg);
 }
 .dialogue_title_left {
   position: relative;
@@ -209,7 +209,7 @@ onMounted(() => {
   top: -22px;
 }
 .dialogue_title_left_text {
-  background: linear-gradient(90deg, #A71549 1.77%, #06256E 46.77%);
+  background: var(--color-dialogue_title);
   -webkit-background-clip: text;
   background-clip: text;
   color: transparent;