diff --git a/themes/common.css b/themes/common.css index 05d97af3..16508e31 100644 --- a/themes/common.css +++ b/themes/common.css @@ -158,39 +158,33 @@ transition: opacity 1s ease-in-out; opacity: 0; } - .welcome-card-container.show { opacity: 1; } .welcome-card-container.hide { opacity: 0; } - .welcome-card { border-radius: 10px; box-shadow: 0px 0px 6px 3px #e5e7eb6b; padding: 15px; margin: 10px; - flex: 0 0 calc(30% - 10px); - transition: opacity 0.2s ease-in-out; + flex: 1 0 calc(30% - 5px); + transition: opacity 0.1s ease-in-out; opacity: 1; } - .welcome-card.show { opacity: 1; } - .welcome-card.hide { opacity: 0; } - .welcome-title { font-size: 40px; padding: 20px; margin: 10px; flex: 0 0 calc(90%); } - .welcome-card-title { font-size: 20px; margin: 2px; @@ -202,7 +196,6 @@ display: flex; justify-content: center; } - .welcome-svg { padding-right: 10px; } @@ -210,9 +203,11 @@ .welcome-title-text { text-wrap: nowrap; } - .welcome-content { text-wrap: balance; + height: 55px; + display: flex; + align-items: center; } diff --git a/themes/welcome.js b/themes/welcome.js index feb40c0f..adfa1827 100644 --- a/themes/welcome.js +++ b/themes/welcome.js @@ -112,7 +112,7 @@ class WelcomeMessage { // 更新卡片信息 const message = this.static_welcome_message_previous[index]; const title = card.getElementsByClassName('welcome-card-title')[0]; - const content = card.getElementsByClassName('welcome-content')[0]; + const content = card.getElementsByClassName('welcome-content-c')[0]; const svg = card.getElementsByClassName('welcome-svg')[0]; const text = card.getElementsByClassName('welcome-title-text')[0]; svg.src = message.svg; @@ -195,7 +195,10 @@ class WelcomeMessage { // 创建内容 const content = document.createElement('div'); content.classList.add('welcome-content'); - content.textContent = message.content; + const content_c = document.createElement('div'); + content_c.classList.add('welcome-content-c'); + content_c.textContent = message.content; + content.appendChild(content_c); // 将标题和内容添加到卡片 div 中 card.appendChild(title); @@ -243,7 +246,6 @@ class WelcomeMessage { const welcome_card_container = document.getElementsByClassName('welcome-card-container')[0]; // 添加隐藏动画 welcome_card_container.classList.add('hide'); - // 等待动画结束后再移除元素 welcome_card_container.addEventListener('transitionend', () => { elem_chatbot.removeChild(welcome_card_container);