tongshanred/components/lb-picker/style/picker.scss

.lb-picker {
	position: relative;

	.lb-picker-mask {
		position: fixed;
		z-index: 999;
		top: 0;
		right: 0;
		left: 0;
		bottom: 0;
	}

	.lb-picker-container {
		width: 100%;
		position: fixed;
		left: 0;
		bottom: 0;
		transform: translateY(100%);
		backface-visibility: hidden;
		background-color: #efeff4;
		box-shadow: 0px 0px 1px 0px #e5e5e5;
		visibility: hidden;
		overflow: hidden;
		z-index: 999;
		transition: all 0.3s;

		&.lb-picker-toggle {
			visibility: visible;
			transform: translate(0);
		}

		.lb-picker-header {
			position: relative;
			font-size: 36rpx;
			box-sizing: border-box;
			background-color: $uni-bg-color;
			display: flex;
			justify-content: space-between;

			&::after {
				content: "";
				position: absolute;
				left: 0;
				bottom: 0;
				right: 0;
				height: 1px;
				clear: both;
				border-bottom: 1px solid #e5e5e5;
				color: #e5e5e5;
				transform-origin: 0 100%;
				-webkit-transform: scaleY(0.5);
				transform: scaleY(0.5);
			}

			.lb-picker-action {
				font-size: 32rpx;
				padding: 0 28rpx;
				display: flex;
				align-items: center;

				.lb-picker-action-cancel {
					color: #999;
				}

				.lb-picker-action-confirm {
					color: #007aff;
				}
			}
		}

		.lb-picker-content {
			position: relative;
			width: 100%;
			background-color: #fff;
			font-size: 32rpx;

			.uni-picker-view-indicator {
				&::after {
					bottom: 1px;
				}
			}

			.lb-picker-loading,
			.lb-picker-empty {
				height: 100%;
				display: flex;
				justify-content: center;
				align-items: center;
			}

			.lb-picker-loading {
				.lb-picker-loading-img {
					width: 64rpx;
					height: 64rpx;
					background-image: url(data:image/png;base64,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);
					background-repeat: no-repeat;
					background-size: 100% 100%;
					animation: rotating 2s linear infinite;
				}
			}

			.lb-picker-empty {
				font-size: 32rpx;

				.lb-picker-empty-text {
					color: #999;
				}
			}
		}
	}

	&.lb-picker-inline {
		.lb-picker-container {
			position: relative;
			visibility: visible;
			box-shadow: unset;
			transform: translateY(0);
		}
	}
}

@keyframes rotating {
	0% {
		transform: rotate(0deg)
	}

	to {
		transform: rotate(1turn)
	}
}