样式完成

2024-06-06 18:38:05 +08:00
parent 840934372e
commit 180cc0778d
3 changed files with 175 additions and 5 deletions
--- a/ui/packages/ai/components/thinkingBar.vue
+++ b/ui/packages/ai/components/thinkingBar.vue
@@ -0,0 +1,28 @@
+<template>
+  <section class="thinkingBar"/>
+</template>
+
+<script>
+export default {
+  name: "thinkingBar",
+}
+</script>
+
+<style lang="scss" scoped>
+.thinkingBar {
+  position: relative;
+  height: 2px;
+  background-image: linear-gradient(to right, #eea2a2 0%, #bbc1bf 19%, #57c6e1 42%, #b49fda 79%, #7ac5d8 100%);
+  background-size: 100%;
+  animation: shrink-and-expand 2s ease-in-out infinite alternate;
+
+  @keyframes shrink-and-expand {
+    0%, 100% {
+      transform: scaleX(1);
+    }
+    50% {
+      transform: scaleX(0);
+    }
+  }
+}
+</style>