place/static/zaiui/style/sort_vue.scss

page {
	background-color: #FFFFFF;
}

.zaiui-bar-search-title-box {
	.cu-bar {
		padding-top: var(--status-bar-height);
		min-height: calc(var(--status-bar-height) + 101upx);
		.content {
			top: var(--status-bar-height);
			
			/* #ifndef MP */
			left: 18.18upx;
			width: calc(100% - 127.27upx);
			/* #endif */
			
			/* #ifdef MP */
			left: -140upx;
			width: calc(100% - 300upx);
			/* #endif */
			
			.search-form {
				display: inherit;
				flex: inherit;
				margin: 0;
				color: #717171;
				[class*="cuIcon-"] {
					margin: 0;
				}
			}
		}
	}
	.cu-bar.fixed.no-shadow {
		box-shadow: inherit;
	}
	.cu-bar.bg-white {
		color: #333333;
	}
	.zaiui-seat-height {
		width: 100%;
		height: calc(var(--status-bar-height) + 101upx);
	}
}

.VerticalNav.nav {
	width: 200upx;
	color: #666666;
	height: calc(100vh - (var(--status-bar-height) + 101upx));
	white-space: initial;
}

.VerticalNav.nav .cu-item {
	width: 100%;
	text-align: center;
	background-color: #FAFAFA;
	margin: 0;
	border: none;
	height: 50px;
	position: relative;
}

.VerticalNav.nav .cu-item.cur {
	background-color: #FFFFFF;
}

.VerticalNav.nav .cu-item.cur::after {
	content: "";
	width: 7.27upx;
	height: 32.72upx;
	border-radius: 0px 9.09upx 9.09upx 0px;
	position: absolute;
	background-color: currentColor;
	top: 0;
	left: 0;
	bottom: 0;
	margin: auto;
}

.VerticalBox {
	display: flex;
}

.VerticalMain {
	background-color: #FFFFFF;
	height: calc(100vh - (var(--status-bar-height) + 101upx));
	flex: 1;
}

.zaiui-grid-icon-box {
	position: relative;
	width: 100%;
	.cu-list.grid {
		background-color: inherit;
		.grid-icon {
			margin: 0;
			.icon {
				width: 127.27upx;
			}
		}
	}
	.cu-list.grid>.cu-item {
		padding-bottom: 9.09upx;
		text {
			color: #333333;
		}
	}
	.cu-list.grid.no-border {
	    padding: 0;
	}
}