vue3-chat-yz
Version:
vue3-chat-yz
2 lines (1 loc) • 16.4 kB
CSS
:root{--light: 0, 0, 0;--dark: 255, 255, 255;--color-primary: #1677ff;--color-primary-hover: #4096ff;--color-success: #52c41a;--color-warning: #faad14;--color-error: #ff4d4f;--color-info: #1677ff;--color-link: #1677ff;--color-text: rgb(var(--light), 85%);--color-text-disabled: rgb(var(--light), 25%);--color-text-placeholder: #bfbfbf;--color-text-description: rgb(var(--light), 45%);--color-text-tertiary: rgb(var(--light), 45%);--color-text-heading: rgb(var(--light), 88%);--color-fill: rgb(var(--light), 15%);--color-fill-content: rgb(var(--light), 12%);--color-fill-content-hover: rgb(var(--light), 18%);--color-fill-alter: rgb(var(--light), 4%);--color-fill-tertiary: rgb(var(--light), 8%);--color-fill-quaternary: rgb(var(--light), 2%);--color-bg-layout: rgb(var(--light));--color-bg-container: #fff;--color-bg-elevated: #fff;--color-bg-spotlight: rgba(0, 0, 0, .85);--color-bg-blur: rgb(var(--light), 4%);--color-bg-welcome: #e6f4ff;--color-bg-bubble: #f0f2f5;--color-hover: #f8f8f8;--color-bg-thinking: #f5f5f5;--color-thinking-text: #71757f;--border-radius: 6px;--border-radius-xs: 2px;--border-radius-sm: 4px;--border-radius-lg: 8px;--border-color: #d9d9d9;--border-secondary: #f0f0f0;--line-width-bold: 2px;--padding-xxs: 4px;--padding-xs: 8px;--padding-sm: 12px;--padding: 16px;--padding-md: 20px;--padding-lg: 24px;--padding-xl: 32px;--margin-xxs: 4px;--margin-xs: 8px;--margin-sm: 12px;--margin: 16px;--margin-md: 20px;--margin-lg: 24px;--margin-xl: 32px;--margin-xxl: 48px;--control-padding-horizontal: 12px;--control-padding-horizontal-sm: 8px;--padding-content-horizontal-lg: 24px;--padding-content-vertical-lg: 16px;--padding-content-horizontal: 16px;--padding-content-vertical: 12px;--padding-content-horizontal-sm: 16px;--padding-content-vertical-sm: 8px;--font-size-sm: 12px;--font-size: 14px;--font-size-lg: 16px;--font-size-xl: 20px;--font-size-heading-1: 38px;--font-size-heading-2: 30px;--font-size-heading-3: 24px;--font-size-heading-4: 20px;--font-size-heading-5: 16px;--line-height: 1.5714;--line-height-lg: 1.5;--line-height-sm: 1.6667;--font-height: 22px;--font-height-lg: 24px;--font-height-sm: 20px;--line-width: 1px;--line-type: solid;--box-shadow-tertiary: 0 1px 2px 0 rgba(0, 0, 0, .03), 0 1px 6px -1px rgba(0, 0, 0, .02), 0 2px 4px 0 rgba(0, 0, 0, .02);--box-shadow-secondary: 0 6px 16px 0 rgba(0, 0, 0, .08), 0 3px 6px -4px rgba(0, 0, 0, .12), 0 9px 28px 8px rgba(0, 0, 0, .05);--motion-duration-slow: .3s;--attachments-color-bg-placeholder-hover: rgba(255, 255, 255, .85);--start-color: var(--el-color-warning);--thinking-color: var(--el-color-primary);--end-color: var(--el-color-success);--error-color: var(--el-color-danger)}:root.dark{--light: 255, 255, 255;--dark: 0, 0, 0;--color-light: #000;--color-dark: #fff;--color-primary-dark: #1677ff;--color-primary-dark-hover: #4096ff;--color-success-dark: #52c41a;--color-warning-dark: #faad14;--color-error-dark: #ff4d4f;--color-info-dark: #1677ff;--color-link-dark: #1677ff;--color-bg-container: #141414;--color-bg-elevated: #1f1f1f;--color-bg-spotlight: #424242;--border-color: #414243;--border-secondary: #303030;--attachments-color-bg-placeholder-hover: rgb(20 20 20 / 85%);--color-bg-welcome: #141414;--color-bg-bubble: #1f1f1f;--color-hover: #222222;--color-bg-thinking: #34363a;--color-thinking-text: #71757f;color-scheme:dark}.Vc-welcome[data-v-f9b19b9d]{box-sizing:border-box;display:flex;gap:16px}.Vc-welcome-icon[data-v-f9b19b9d]{display:flex;height:58px}.Vc-welcome-icon img[data-v-f9b19b9d]{max-width:100%;height:100%}.Vc-welcome-left[data-v-f9b19b9d]{direction:ltr}.Vc-welcome-right[data-v-f9b19b9d]{direction:rtl}.Vc-welcome-content-wrapper[data-v-f9b19b9d]{display:flex;flex:auto;flex-direction:column;justify-content:space-between;align-items:stretch;width:0}.Vc-welcome-content-wrapper .Vc-welcome-title[data-v-f9b19b9d]{font-size:var(--font-size-heading-4);line-height:var(--line-height-heading-4);color:var(--color-text-heading);overflow-wrap:break-word}.Vc-welcome-content-wrapper .Vc-welcome-title h4[data-v-f9b19b9d]{padding:0;margin:0}.Vc-welcome-content-wrapper .Vc-welcome-title.extra[data-v-f9b19b9d]{display:flex;gap:var(--padding-xs);align-items:flex-start}.Vc-welcome-content-wrapper .Vc-welcome-title .Vc-welcome-extra[data-v-f9b19b9d]{margin-inline-start:auto}.Vc-welcome-content-wrapper-description[data-v-f9b19b9d]{box-sizing:border-box;font-size:var(--font-size);line-height:var(--line-height);color:var(--color-text);overflow-wrap:break-word}.Vc-welcome.Vc-welcome-filled[data-v-f9b19b9d]{padding-block:12px;padding-block:var(--padding-sm);padding-inline:16px;padding-inline:var(--padding);background:var(--color-bg-welcome);border-radius:8px;border-radius:var(--border-radius-lg)}.Vc-welcome.Vc-welcome-borderless .Vc-welcome-title[data-v-f9b19b9d]{font-size:var(--font-size-heading-3);line-height:var(--line-height-heading-3)}.Vc-thinking[data-v-144544e5]{box-sizing:border-box;height:auto;display:flex;flex-direction:column;justify-content:center}.Vc-thinking .Vc-thinking-top[data-v-144544e5]{display:flex;width:fit-content;flex-direction:row;justify-content:space-between;align-items:center;padding:var(--padding-xs);background-color:var(--color-bg-thinking);border:none;border-radius:12px;box-shadow:var(--box-shadow-tertiary);cursor:pointer}.Vc-thinking .Vc-thinking-top[data-v-144544e5]:hover{background:var(--color-hover)}.Vc-thinking .Vc-thinking-top[data-v-144544e5]:disabled{cursor:not-allowed;opacity:.7}.Vc-thinking .Vc-thinking-icon[data-v-144544e5]{flex:0 0 auto;display:inline-flex;align-items:center}.Vc-thinking .Vc-thinking-label[data-v-144544e5]{flex:1;text-align:center;padding:0 var(--padding-sm)}.Vc-thinking .Vc-thinking-arrow[data-v-144544e5]{flex:0 0 auto;display:inline-flex;align-items:center;transition:transform .3s ease;transform:rotate(0)}.Vc-thinking .Vc-thinking-arrow.is-open[data-v-144544e5]{transform:rotate(-180deg)}.Vc-thinking .Vc-thinking-content[data-v-144544e5]{width:fit-content;box-sizing:border-box;height:auto;padding:var(--padding-sm);margin-top:var(--margin);font-size:var(--font-size);color:var(--color-thinking-text);border-radius:var(--border-radius)}.Vc-thinking .Vc-thinking-content-lb[data-v-144544e5]{border-left:2px solid var(--border-color);border-radius:0;padding:0 var(--padding-sm)}.thinking-loading[data-v-144544e5]{animation:rotate-144544e5 1s linear infinite}@keyframes rotate-144544e5{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.thinking-content-enter-active[data-v-144544e5],.thinking-content-leave-active[data-v-144544e5]{transition:all .3s ease}.thinking-content-enter-from[data-v-144544e5],.thinking-content-leave-to[data-v-144544e5]{opacity:0;height:0}.Vc-bubble[data-v-88aadeec]{display:flex;column-gap:12px;max-width:100%}.Vc-bubble .Vc-bubble-avatar[data-v-88aadeec]{display:inline-flex;align-self:flex-start;justify-content:center}.Vc-bubble .Vc-bubble-content-wrapper[data-v-88aadeec]{display:flex;flex-direction:column;align-items:flex-start;max-width:100%}.Vc-bubble .Vc-bubble-header[data-v-88aadeec]{margin-bottom:4px;width:100%;display:flex;justify-content:flex-start}.Vc-bubble .Vc-bubble-footer[data-v-88aadeec]{margin-top:4px;width:100%;display:flex;justify-content:flex-start}.Vc-bubble .Vc-bubble-content[data-v-88aadeec]{position:relative;box-sizing:border-box;min-height:49.1424px;font-size:16px;line-height:1.5714;overflow-wrap:break-word}.Vc-bubble .Vc-bubble-content-filled[data-v-88aadeec]{background-color:var(--color-bg-bubble)}.Vc-bubble .Vc-bubble-content-filled-transparent[data-v-88aadeec]{background-color:transparent}.Vc-bubble .Vc-bubble-content-outlined[data-v-88aadeec]{border:1px solid var(--border-secondary)}.Vc-bubble .Vc-bubble-content-shadow[data-v-88aadeec]{box-shadow:0 1px 2px rgb(var(--light),3%),0 1px 6px -1px rgb(var(--light),2%),0 2px 4px rgb(var(--light),2%)}.Vc-bubble-header[data-v-88aadeec],.Vc-bubble-footer[data-v-88aadeec]{font-size:14px;box-sizing:border-box;line-height:1.5714;color:var(--color-text);padding:0 16px}.Vc-bubble-content-filled[data-v-88aadeec],.Vc-bubble-content-shadow[data-v-88aadeec],.Vc-bubble-content-outlined[data-v-88aadeec]{padding:12px 16px;border-radius:8px}.Vc-bubble-end[data-v-88aadeec]{flex-direction:row-reverse;justify-content:end}.Vc-bubble-end .Vc-bubble-header[data-v-88aadeec],.Vc-bubble-end .Vc-bubble-footer[data-v-88aadeec]{justify-content:flex-end}.Vc-bubble-content-start-corner[data-v-88aadeec]{border-start-start-radius:2px}.Vc-bubble-content-end-corner[data-v-88aadeec]{border-start-end-radius:2px}.round[data-v-88aadeec],.Vc-bubble-content-start-round[data-v-88aadeec],.Vc-bubble-content-end-round[data-v-88aadeec]{padding-inline:20px;border-radius:22.9998px}@keyframes loadingMove-88aadeec{0%{transform:translateY(0)}10%{transform:translateY(4px)}20%{transform:translateY(0)}30%{transform:translateY(-4px)}40%{transform:translateY(0)}}@keyframes cursorBlink-88aadeec{0%{opacity:1}50%{opacity:0}to{opacity:1}}[class$=-dot][data-v-88aadeec]{position:relative;display:flex;column-gap:8px;align-items:center;height:100%;padding:0 4px}[class$=-dot] [class$=-dot-item][data-v-88aadeec]{width:4px;height:4px;background-color:var(--color-primary);border-radius:100%;animation-name:loadingMove-88aadeec;animation-duration:2s;animation-timing-function:linear;animation-iteration-count:infinite}[class$=-dot] [class$=-dot-item][data-v-88aadeec]:nth-child(1){animation-delay:0s}[class$=-dot] [class$=-dot-item][data-v-88aadeec]:nth-child(2){animation-delay:.2s}[class$=-dot] [class$=-dot-item][data-v-88aadeec]:nth-child(3){animation-delay:.4s}.Vc-bubble[data-v-fba8283d]{display:flex;column-gap:12px;max-width:100%}.Vc-bubble .Vc-bubble-avatar[data-v-fba8283d]{display:inline-flex;align-self:flex-start;justify-content:center}.Vc-bubble .Vc-bubble-content-wrapper[data-v-fba8283d]{display:flex;flex-direction:column;align-items:flex-start;max-width:100%}.Vc-bubble .Vc-bubble-header[data-v-fba8283d]{margin-bottom:4px;width:100%;display:flex;justify-content:flex-start}.Vc-bubble .Vc-bubble-footer[data-v-fba8283d]{margin-top:4px;width:100%;display:flex;justify-content:flex-start}.Vc-bubble .Vc-bubble-content[data-v-fba8283d]{position:relative;box-sizing:border-box;min-height:49.1424px;font-size:16px;line-height:1.5714;overflow-wrap:break-word}.Vc-bubble .Vc-bubble-content-filled[data-v-fba8283d]{background-color:var(--color-bg-bubble)}.Vc-bubble .Vc-bubble-content-filled-transparent[data-v-fba8283d]{background-color:transparent}.Vc-bubble .Vc-bubble-content-outlined[data-v-fba8283d]{border:1px solid var(--border-secondary)}.Vc-bubble .Vc-bubble-content-shadow[data-v-fba8283d]{box-shadow:0 1px 2px rgb(var(--light),3%),0 1px 6px -1px rgb(var(--light),2%),0 2px 4px rgb(var(--light),2%)}.Vc-bubble-header[data-v-fba8283d],.Vc-bubble-footer[data-v-fba8283d]{font-size:14px;box-sizing:border-box;line-height:1.5714;color:var(--color-text);padding:0 16px}.Vc-bubble-content-filled[data-v-fba8283d],.Vc-bubble-content-shadow[data-v-fba8283d],.Vc-bubble-content-outlined[data-v-fba8283d]{padding:12px 16px;border-radius:8px}.Vc-bubble-end[data-v-fba8283d]{flex-direction:row-reverse;justify-content:end}.Vc-bubble-end .Vc-bubble-header[data-v-fba8283d],.Vc-bubble-end .Vc-bubble-footer[data-v-fba8283d]{justify-content:flex-end}.Vc-bubble-content-start-corner[data-v-fba8283d]{border-start-start-radius:2px}.Vc-bubble-content-end-corner[data-v-fba8283d]{border-start-end-radius:2px}.round[data-v-fba8283d],.Vc-bubble-content-start-round[data-v-fba8283d],.Vc-bubble-content-end-round[data-v-fba8283d]{padding-inline:20px;border-radius:22.9998px}@keyframes loadingMove-fba8283d{0%{transform:translateY(0)}10%{transform:translateY(4px)}20%{transform:translateY(0)}30%{transform:translateY(-4px)}40%{transform:translateY(0)}}@keyframes cursorBlink-fba8283d{0%{opacity:1}50%{opacity:0}to{opacity:1}}[class$=-dot][data-v-fba8283d]{position:relative;display:flex;column-gap:8px;align-items:center;height:100%;padding:0 4px}[class$=-dot] [class$=-dot-item][data-v-fba8283d]{width:4px;height:4px;background-color:var(--color-primary);border-radius:100%;animation-name:loadingMove-fba8283d;animation-duration:2s;animation-timing-function:linear;animation-iteration-count:infinite}[class$=-dot] [class$=-dot-item][data-v-fba8283d]:nth-child(1){animation-delay:0s}[class$=-dot] [class$=-dot-item][data-v-fba8283d]:nth-child(2){animation-delay:.2s}[class$=-dot] [class$=-dot-item][data-v-fba8283d]:nth-child(3){animation-delay:.4s}.Vc-bubble-list[data-v-d2106e49]{display:flex;flex-direction:column;gap:16px;overflow-y:auto}.Vc-conversations-item[data-v-2b5b7ab3]{display:flex;gap:8px;align-items:center;padding:12px;cursor:pointer;border-radius:6px}.Vc-conversations-item .Vc-conversations-label[data-v-2b5b7ab3]{display:-webkit-box;flex:1;overflow:hidden;text-overflow:ellipsis;color:var(--color-text);-webkit-box-orient:vertical}.Vc-conversations-item[data-v-2b5b7ab3]:hover{background-color:rgb(var(--light),12%)}.Vc-conversations-item-active[data-v-2b5b7ab3],.Vc-conversations-item-active[data-v-2b5b7ab3]:hover{background-color:rgb(var(--light),18%)}.Vc-conversations-item-disabled[data-v-2b5b7ab3]{cursor:not-allowed;opacity:.6}.Vc-conversations-item:hover .Vc-conversations-menu-icon[data-v-2b5b7ab3],.Vc-conversations-item-active .Vc-conversations-menu-icon[data-v-2b5b7ab3]{opacity:1}.Vc-conversations-item-active[data-v-2b5b7ab3]{background-color:rgb(var(--light),18%)}.Vc-conversations[data-v-2b5b7ab3]{display:flex;flex-direction:column;gap:8px;padding:0;margin:0;overflow-y:auto}.Vc-conversations-list[data-v-2b5b7ab3]{padding:0;margin:0}.Vc-conversations-rtl[data-v-2b5b7ab3]{direction:rtl}.Vc-conversations-item[data-v-2078bce4]{display:flex;gap:8px;align-items:center;padding:12px;cursor:pointer;border-radius:6px}.Vc-conversations-item .Vc-conversations-label[data-v-2078bce4]{display:-webkit-box;flex:1;overflow:hidden;text-overflow:ellipsis;color:var(--color-text);-webkit-box-orient:vertical}.Vc-conversations-item[data-v-2078bce4]:hover{background-color:rgb(var(--light),12%)}.Vc-conversations-item-active[data-v-2078bce4],.Vc-conversations-item-active[data-v-2078bce4]:hover{background-color:rgb(var(--light),18%)}.Vc-conversations-item-disabled[data-v-2078bce4]{cursor:not-allowed;opacity:.6}.Vc-conversations-item:hover .Vc-conversations-menu-icon[data-v-2078bce4],.Vc-conversations-item-active .Vc-conversations-menu-icon[data-v-2078bce4]{opacity:1}.Vc-conversations-item-active[data-v-2078bce4]{background-color:rgb(var(--light),18%)}.Vc-conversations[data-v-2078bce4]{display:flex;flex-direction:column;gap:8px;padding:0;margin:0;overflow-y:auto}.Vc-conversations-list[data-v-2078bce4]{padding:0;margin:0}.Vc-conversations-rtl[data-v-2078bce4]{direction:rtl}[data-v-ae15ee9c] .el-textarea .el-textarea__inner{padding:var(--padding-sm);border:none;box-shadow:none;background:transparent;color:var(--dark)}[data-v-ae15ee9c] .el-textarea .el-textarea__inner:focus{box-shadow:none;border:none}[data-v-ae15ee9c] .el-textarea .el-textarea__inner:hover{border:none}[data-v-ae15ee9c] .el-input__wrapper,[data-v-ae15ee9c] .el-input__wrapper:hover,[data-v-ae15ee9c] .el-input__wrapper.is-focus{box-shadow:none}.Vc-sender[data-v-ae15ee9c]{width:100%;height:auto;box-sizing:border-box;overflow:hidden;border:1px solid var(--border-color);border-radius:12px;box-shadow:var(--box-shadow-tertiary);transition:all .3s}.Vc-sender .Vc-sender-container[data-v-ae15ee9c]{display:flex}.Vc-sender .Vc-sender-default[data-v-ae15ee9c]{flex-direction:row;justify-content:center;align-items:center}.Vc-sender .Vc-sender-updown[data-v-ae15ee9c]{flex-direction:column;justify-content:center;align-items:center}.Vc-sender .foo[data-v-ae15ee9c]{display:flex;width:100%;justify-content:space-between;align-items:center}.Vc-sender .Vc-sender-prefix[data-v-ae15ee9c],.Vc-sender .Vc-sender-actionsList[data-v-ae15ee9c],.Vc-sender .Vc-sender-actionsList-default[data-v-ae15ee9c]{padding:var(--padding-sm)}.Vc-sender[data-v-ae15ee9c]:focus-within{border-color:var(--color-primary);box-shadow:var(--box-shadow-secondary)}.Vc-sender.Vc-sender-disabled[data-v-ae15ee9c]{color:rgb(var(--light),.25);background:rgb(var(--light),.04)}.header-slide-enter-active[data-v-ae15ee9c],.header-slide-leave-active[data-v-ae15ee9c]{height:calc-size(max-content,size);opacity:1;transition:all var(--motion-duration-slow);overflow:hidden}.header-slide-enter-from[data-v-ae15ee9c],.header-slide-leave-to[data-v-ae15ee9c]{height:0;opacity:0}