/* 公共样式 注:hmly为喜马拉雅的缩写 */ /* 轮播图 */ .hmly-swiper { width: 100%; height: 100%; border-radius: 15rpx; } .hmly-swiper-container { width: 90%; height: 280rpx; margin: 0rpx auto; position: relative; border-radius: 15rpx; overflow: hidden; } .hmly-swiper-item { width: 100%; height: 100%; border-radius: 15rpx; } .hmly-swiper-item>image { width: 100%; height: 100%; border-radius: 15rpx; } .hmly-dots { width: auto; height: 10rpx; position: absolute; bottom: 20rpx; border-radius: 50rpx; left: 240rpx; display: flex; justify-content: space-between; align-items: center; padding: 3rpx 10rpx; } .hmly-dots-item { width: 8rpx; height: 8rpx; margin: 0rpx 8rpx; border-radius: 50%; background-color: #cdcdcd; transition: all .3s; } .hmly-dot-active { width: 10rpx; height: 10rpx; background-color: #fff; } /* 主要内容列表样式 */ .hmly-content-list { width: 90%; margin: 0rpx auto; margin-top: 10rpx; } .hmly-content { width: 100%; height: auto; padding: 20rpx 0rpx; display: flex; justify-content: space-between; border-bottom: 1rpx solid #f1f1f1; } .hmly-content-img { width: 232rpx; height: 232rpx; border-radius: 15rpx; } .hmly-content-img>image { width: 100%; height: 100%; border-radius: 15rpx; } .hmly-content-right { width: 530rpx; height: 100%; margin-left: 20rpx; display: flex; flex-direction: column; } .hmly-content-title { width: 100%; height: 138rpx; overflow: hidden; display: flex; flex-direction: column; } .hmly-title-text { width: 100%; font-size: 35rpx; color: #333; text-align: left; display: -webkit-box; -webkit-line-clamp: 1; /*行数n*/ -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; } .hmly-introduction { width: 100%; font-size: 28rpx; color: #cdcdcd; text-align: left; padding: 15rpx 0rpx; display: -webkit-box; -webkit-line-clamp: 2; /*行数n*/ -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; } .hmly-count { width: 100%; height: 50rpx; display: flex; justify-content: start; align-items: center; } .hmly-play-count { font-size: 25rpx; color: #cdcdcd; margin-right: 30rpx; } .hmly-ji-count { font-size: 25rpx; color: #cdcdcd; } /* 登录样式 */ .hmly-logo { width: 128rpx; height: 128rpx; margin: 0rpx auto; position: relative; top: 200rpx; } .hmly-logo-img { width: 100%; height: 100%; } .hmly-login-button { width: 80%; margin: 0rpx auto; position: relative; top: 500rpx; } .hmly-wechat-login, .phone-login { width: 100%; height: 80rpx; border-radius: 50rpx; border: 0rpx; outline: none; } .hmly-wechat-login button { background-color: #70e500; border-radius: 50rpx; border: none; color: #fff; } .hmly-phone-login { margin-top: 40rpx; } .hmly-phone-login button { border-radius: 50rpx; border: 1rpx solid #70e500; background-color: #fff; color: #70e500; } /*蒙板*/ .hmly-cover { position: fixed; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 9000; background: rgba(0, 0, 0, 0.6); opacity: 0.7; } /* bar相关 */ .hmly-margin-top-bottom { margin-top: 20rpx; margin-bottom: 30rpx; } .hmly-bar-title { width: 100%; height: 56rpx; padding: 20rpx 0rpx; text-align: center; } .hmly-title-left { float: left; font-size: 37rpx; font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif; font-weight: 800; color: #333; } .hmly-title-right { float: right; font-size: 26rpx; color: #aaa; }