更新

assets/css/joe.global.min.scss

@@ -1620,6 +1620,7 @@
 	border-radius: var(--radius-inner);
 	border: 1px solid var(--classC);
 	background: var(--background);
+	line-height: 26px;
 	&-title {
 		padding: 8px 12px;
 		border-bottom: 1px solid var(--classC);
@@ -1641,6 +1642,7 @@
 	border-left-style: solid;
 	padding: 8px 15px;
 	border-radius: 0 4px 4px 0;
+	line-height: 26px;
 	&:hover {
 		.joe_message__icon {
 			transform: rotate(360deg);
@@ -1756,6 +1758,7 @@
 	border-left-width: 4px;
 	border-radius: var(--radius-inner);
 	color: var(--routine);
+	line-height: 26px;
 	*:last-child {
 		margin-bottom: 0 !important;
 	}
@@ -1764,6 +1767,7 @@
 	border: 1px solid var(--classC);
 	border-radius: var(--radius-inner);
 	overflow: hidden;
+	line-height: 26px;
 	&-item {
 		padding: 12px;
 		border-bottom: 1px solid var(--classC);
@@ -1776,6 +1780,7 @@
 	}
 }
 .joe_timeline {
+	line-height: 26px;
 	&__item {
 		position: relative;
 		padding-bottom: 15px;
@@ -1797,7 +1802,7 @@
 		&-content {
 			padding-left: 24px;
 			position: relative;
-			top: -3px;
+			top: -5px;
 			*:last-child {
 				margin-bottom: 0 !important;
 			}
@@ -1817,6 +1822,7 @@
 	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
 	border: 1px solid var(--classC);
 	border-radius: var(--radius-inner);
+	line-height: 26px;
 	&__head {
 		width: 100%;
 		overflow-x: auto;
@@ -1871,6 +1877,7 @@
 .joe_card__describe {
 	position: relative;
 	border: 1px dashed var(--classA);
+	line-height: 26px;
 	&-title {
 		position: absolute;
 		top: 0;
@@ -1921,6 +1928,7 @@
 	}
 }
 .joe_collapse {
+	line-height: 26px;
 	&__item {
 		margin-bottom: 10px;
 		color: var(--routine);

assets/js/joe.short.js

@@ -370,27 +370,30 @@ document.addEventListener('DOMContentLoaded', () => {
 				span.innerHTML = htmlStr;
 				this.appendChild(span);
 			}
-			this.querySelectorAll('.joe_collapse__item-head--label').forEach(item => {
-				const label = item.getAttribute('label') || '折叠标题';
-				item.innerHTML = label;
-			});
 			this.querySelectorAll('.joe_collapse__item').forEach(item => {
+				const label = item.getAttribute('label') || '折叠标题';
 				const head = getChildren(item, 'joe_collapse__item-head');
+				const headLabel = getChildren(head, 'joe_collapse__item-head--label');
+				headLabel.innerHTML = label;
 				const wrapper = getChildren(item, 'joe_collapse__item-wrapper');
 				const content = getChildren(wrapper, 'joe_collapse__item-wrapper--content');
 				const open = item.getAttribute('open');
 				if (open !== null) {
 					item.classList.add('active');
-					wrapper.style.maxHeight = content.offsetHeight + 'px';
+					wrapper.style.maxHeight = 'none';
 				}
 				head.addEventListener('click', () => {
-					if (item.classList.contains('active')) {
-						item.classList.remove('active');
-						wrapper.style.maxHeight = 0;
-					} else {
-						item.classList.add('active');
-						wrapper.style.maxHeight = content.offsetHeight + 'px';
-					}
+					wrapper.style.maxHeight = content.offsetHeight + 'px';
+					let timer = setTimeout(() => {
+						if (item.classList.contains('active')) {
+							item.classList.remove('active');
+							wrapper.style.maxHeight = 0;
+						} else {
+							item.classList.add('active');
+							wrapper.style.maxHeight = content.offsetHeight + 'px';
+						}
+						clearTimeout(timer);
+					}, 30);
 				});
 			});
 		}