add journal-detail-panel

miniprogram/pages/main/journal-map/index.less

@@ -25,6 +25,7 @@
 			.thumb-container {
 				width: 72rpx;
 				height: 72rpx;
+				position: relative;
 				flex-shrink: 0;
 				margin-right: 12rpx;
 				overflow: hidden;
@@ -34,6 +35,17 @@
 					width: 100%;
 					height: 100%;
 				}
+
+				.count-badge {
+					top: 4rpx;
+					right: 4rpx;
+					color: #fff;
+					padding: 2rpx 6rpx;
+					position: absolute;
+					font-size: 20rpx;
+					background: rgba(0, 0, 0, .7);
+					border-radius: 8rpx;
+				}
 			}
 
 			.text-container {
@@ -43,24 +55,18 @@
 				flex-direction: column;
 
 				.location {
-					flex: 1;
 					color: #999;
 					overflow: hidden;
 					font-size: 24rpx;
 					white-space: nowrap;
 					text-overflow: ellipsis;
-					margin-bottom: 8rpx;
+					margin-bottom: 4rpx;
 				}
 
-				.idea {
-					color: #333;
-					display: -webkit-box;
-					font-size: 26rpx;
-					line-height: 1.4;
-					overflow: hidden;
-					-webkit-line-clamp: 3;
-					text-overflow: ellipsis;
-					-webkit-box-orient: vertical;
+				.count-text {
+					color: var(--theme-wx);
+					font-size: 24rpx;
+					font-weight: 600;
 				}
 			}
 		}
@@ -81,128 +87,4 @@
 			box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, .15);
 		}
 	}
-
-	.marker-detail {
-		left: 0;
-		right: 0;
-		bottom: 0;
-		height: 61.8vh;
-		z-index: 999;
-		display: flex;
-		position: fixed;
-		transition: transform 350ms cubic-bezier(.19, .1, .22, 1);
-		transform: translateY(100%);
-		background: var(--theme-bg-card);
-		box-shadow: 0 -2rpx 20rpx rgba(0, 0, 0, .15);
-		border-radius: 24rpx 24rpx 0 0;
-		flex-direction: column;
-
-		&.visible {
-			transform: translateY(0);
-		}
-
-		.detail-content {
-			flex: 1;
-			display: flex;
-			padding: 32rpx;
-			flex-direction: column;
-
-			.header {
-				display: flex;
-				flex-shrink: 0;
-				margin-bottom: 16rpx;
-				align-items: flex-start;
-				justify-content: space-between;
-
-				.info {
-					flex: 1;
-					display: flex;
-					flex-direction: column;
-
-					.date {
-						color: #333;
-						font-size: 32rpx;
-						font-weight: 600;
-						margin-bottom: 8rpx;
-					}
-
-					.location {
-						color: #666;
-						display: flex;
-						font-size: 26rpx;
-						align-items: center;
-
-						.icon {
-							width: 32rpx;
-							height: 32rpx;
-						}
-					}
-				}
-
-				.close {
-					width: 48rpx;
-					height: 48rpx;
-					color: #999;
-					display: flex;
-					font-size: 48rpx;
-					line-height: 1;
-					flex-shrink: 0;
-					align-items: center;
-					justify-content: center;
-				}
-			}
-
-			.idea {
-				color: #333;
-				display: block;
-				font-size: 28rpx;
-				line-height: 1.6;
-				flex-shrink: 0;
-				margin-bottom: 16rpx;
-			}
-
-			.items {
-				flex: 1;
-				overflow: scroll;
-
-				.wrapper {
-					position: relative;
-					column-gap: .25rem;
-					column-count: 3;
-					padding-bottom: 2rem;
-		
-					.item {
-						overflow: hidden;
-						background: var(--theme-bg-card);
-						break-inside: avoid;
-						margin-bottom: .25rem;
-		
-						&.thumbnail {
-							width: 100%;
-							display: block;
-						}
-		
-						&.video {
-							height: auto;
-							position: relative;
-		
-							&::after {
-								content: "";
-								top: 50%;
-								left: 53%;
-								width: 0;
-								height: 0;
-								position: absolute;
-								transform: translate(-50%, -50%);
-								border-top: 16px solid transparent;
-								border-left: 24px solid var(--theme-video-play);
-								border-bottom: 16px solid transparent;
-								pointer-events: none;
-							}
-						}
-					}
-				}
-			}
-		}
-	}
 }