@import "../stars/stars-template.wxss"; .container{ display:flex; flex-direction: column; } .head-img{ width:100%; height: 320rpx; -webkit-filter:blur(20px); } .head-img-hover{ width: 100%; height: 320rpx; position:absolute; top:0; left:0; display:flex; flex-direction: column; } .main-title{ font-size: 19px; color:#fff; font-weight:bold; margin-top: 50rpx; margin-left: 40rpx; letter-spacing: 2px; } .sub-title{ font-size: 28rpx; color:#fff; margin-left: 40rpx; margin-top: 30rpx; } .like{ display:flex; flex-direction: row; margin-top: 30rpx; margin-left: 40rpx; } .highlight-font{ color: #f21146; font-size:22rpx; margin-right: 10rpx; } .plain-font{ color: #666; font-size:22rpx; margin-right: 30rpx; } .movie-img{ height:238rpx; width: 175rpx; position: absolute; top:160rpx; right: 30rpx; } .summary{ margin-left:40rpx; margin-top: 40rpx; color: #777777; } .original-title{ color: #1f3463; font-size: 24rpx; font-weight: bold; margin-bottom: 40rpx; } .flex-row{ display:flex; flex-direction: row; margin-bottom: 10rpx; } .mark{ margin-right: 30rpx; white-space:nowrap; color: #999999; } .hr{ margin-top:45rpx; height:1px; width: 100%; background-color: #d9d9d9; } .synopsis{ margin-left:40rpx; display:flex; flex-direction: column; margin-top: 50rpx; } .synopsis-font{ color:#999; } .summary-content{ margin-top: 20rpx; margin-right: 40rpx; line-height:40rpx; letter-spacing: 1px; } .cast{ margin-left:40rpx; display:flex; flex-direction: column; margin-top:50rpx; } .cast-font{ color: #999; margin-bottom: 40rpx; } .cast-container{ display:inline-flex; flex-direction: column; margin-bottom: 50rpx; margin-right: 40rpx; width: 170rpx; text-align:center; white-space: normal; } .cast-imgs{ white-space: nowrap; } .cast-img{ width: 170rpx; height: 210rpx; } .cast-name{ margin: 10rpx auto 0; } .hidden{ opacity: 0; } .visible{ opacity: 1; transition: opacity 1s ease-in-out; }