62 lines
1.1 KiB
Plaintext
62 lines
1.1 KiB
Plaintext
|
|
.container {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
padding: 20rpx;
|
|
height: 100vh;
|
|
background-color: #f5f5f5;
|
|
}
|
|
.screen {
|
|
width: 80%;
|
|
height: 40rpx;
|
|
background: linear-gradient(to bottom, #ccc, #fff);
|
|
margin-bottom: 40rpx;
|
|
text-align: center;
|
|
font-size: 28rpx;
|
|
color: #333;
|
|
border-radius: 8rpx;
|
|
box-shadow: 0 4rpx 8rpx rgba(0, 0, 0, 0.1);
|
|
}
|
|
.seat-canvas {
|
|
width: 100%;
|
|
height: 500rpx;
|
|
background-color: #fff;
|
|
margin-bottom: 20rpx;
|
|
border-radius: 8rpx;
|
|
box-shadow: 0 4rpx 8rpx rgba(0, 0, 0, 0.1);
|
|
}
|
|
.legend {
|
|
display: flex;
|
|
justify-content: center;
|
|
margin-bottom: 20rpx;
|
|
}
|
|
.legend-item {
|
|
display: flex;
|
|
align-items: center;
|
|
margin: 0 20rpx;
|
|
}
|
|
.seat-icon {
|
|
width: 30rpx;
|
|
height: 30rpx;
|
|
margin-right: 10rpx;
|
|
border-radius: 4rpx;
|
|
}
|
|
.available {
|
|
background-color: #4CAF50;
|
|
}
|
|
.selected {
|
|
background-color: #2196F3;
|
|
}
|
|
.sold {
|
|
background-color: #9E9E9E;
|
|
}
|
|
.selected-seats {
|
|
padding: 20rpx;
|
|
background-color: #fff;
|
|
border-radius: 8rpx;
|
|
width: 90%;
|
|
text-align: center;
|
|
box-shadow: 0 4rpx 8rpx rgba(0, 0, 0, 0.1);
|
|
}
|