241 lines
5.8 KiB
CSS
241 lines
5.8 KiB
CSS
/* 重写样式 */
|
|
.fui-header.block {
|
|
display: block;
|
|
}
|
|
|
|
.fui-tab {
|
|
margin: 0;
|
|
}
|
|
|
|
.fui-tab a {
|
|
height: 2.2rem;
|
|
line-height: 2.2rem;
|
|
}
|
|
|
|
.fui-tab:after {
|
|
display: none;
|
|
}
|
|
|
|
|
|
/* 直播首页 */
|
|
.live-category-list .fui-list-inner{height:5.5rem;}
|
|
.live-category-list-inner{height:5.5rem; display: flex;overflow-x: scroll;overflow-y: hidden;text-align: center;}
|
|
.live-category-list-inner a{width:5.5rem;height:5.5rem;display: block;float:left;margin-right:0.2rem;}
|
|
.live-category-list-inner a p{height:4.5rem;display: block;-webkit-border-radius: 0.5rem;border-radius: 0.5rem;margin:0 auto;overflow: hidden;}
|
|
.live-category-list-inner a p img{width:100%;height:100%;}
|
|
.live-category-list-inner a span{font-size:0.7rem;color:#000;}
|
|
|
|
.live-list{margin-top:0.5rem;position: relative;}
|
|
.live-list .fui-list{padding:0 0.5rem 0 0;background: #fff;height:6rem;border-bottom:0.3rem solid #ededed;}
|
|
.live-list .fui-list .fui-list-media{width:6rem;height:6rem;}
|
|
.live-list .fui-list .fui-list-inner h3{font-size:0.8rem;color:#000;height:2.4rem;line-height: 1.2rem;overflow: hidden;}
|
|
.live-list .fui-list .fui-list-inner p{font-size:0.6rem;color:#118cff;height:1.2rem;line-height: 1.2rem;display: block;}
|
|
.live-list-subscribe{font-size:0.6rem;color:#666;line-height: 1.2rem;}
|
|
.live-subscribe-a{height:1.2rem;width:3rem;display: inline-block;border:1px solid #118cff;line-height: 1.1rem;text-align: center;-webkit-border-radius: 0.2rem;border-radius: 0.2rem;float:right;}
|
|
.live-subscribe-a.live-subscribe-default-a{color:#118cff;}
|
|
.live-subscribe-a.live-subscribe-default-a.disabled{color:#f95959;border:1px solid #f95959;}
|
|
.live-subscribe-a.live-subscribe-full-a{color:#fff;background: #118cff;}
|
|
.live-list .fui-list-media a{width:6rem;height:6rem;position: relative;}
|
|
.live-list .fui-list-media img{width:100%;height:100%;}
|
|
.live-living{height:1rem;display: inline-block;border:1px solid #ededed;-webkit-border-radius: 1rem;border-radius: 1rem;background: rgba(0, 0, 0, 0.8) none repeat scroll 0 0;color:#fff;line-height: 0.9rem;font-size:0.6rem;position: absolute;opacity:0.8;padding:0 0.5rem;right:0.15rem;top:0.3rem;z-index: 10;}
|
|
.live-living i{width:5px;height:5px;display: inline-block;background: #00ff00;-webkit-border-radius: 5px;border-radius: 5px;float:left;margin:0.3rem 0.2rem 0 0;}
|
|
|
|
.live-hot-list{padding:0 0.1rem;background: #ededed;}
|
|
.live-hot-list-room{width:50%;float:left;padding:0.1rem;}
|
|
.live-hot-list-inner{background: #fff;padding:0 0 0.5rem 0;}
|
|
.live-hot-list-img{display: block;text-align: center;overflow: hidden;position: relative;}
|
|
.live-hot-list-img img{width:9rem;height:9rem;}
|
|
.live-hot-list-room h3{font-size:0.8rem;color:#000;height:2.4rem;line-height: 1rem;overflow: hidden;padding:0.2rem 0.3rem;}
|
|
.live-hot-list-room p{font-size:0.6rem;color:#118cff;height:1.2rem;line-height: 1.2rem;display: block;padding:0 0.3rem;}
|
|
|
|
.live-category{height:2rem;background: #fff;line-height: 1.9rem;position: relative;}
|
|
.live-category-content{height:2rem;display:flex;overflow-x: scroll;overflow-y:hidden;}
|
|
.live-category:before{position: absolute;content: "";border-top:1px solid #ededed;left:0;top:0;bottom:0;right:0;}
|
|
.live-category a{padding:0 0.5rem;font-size:0.7rem;color:#000;position: relative;height:2rem;display: inline-table;line-height: 2rem;}
|
|
.live-category a.active:before{position: absolute;content: "";border-bottom: 2px solid #118cff;left:0;bottom:0;right:0;top:0;}
|
|
|
|
|
|
/*.live-banner {
|
|
height: 10.5rem;
|
|
background: #eee;
|
|
|
|
!*以下为测试样式*!
|
|
line-height: 10.5rem;
|
|
text-align: center;
|
|
color: #333;
|
|
display: block;
|
|
}
|
|
|
|
.live-search {
|
|
height: 2.2rem;
|
|
background: #ccc;
|
|
|
|
!*以下为测试样式*!
|
|
line-height: 2.2rem;
|
|
text-align: center;
|
|
}
|
|
|
|
.live-list {
|
|
height: auto;
|
|
padding: 0.25rem;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.live-list .live-room {
|
|
height: auto;
|
|
width: 50%;
|
|
padding: 0.25rem;
|
|
float: left;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.live-list .live-room .thumb {
|
|
height: 8rem;
|
|
background: #eee;
|
|
|
|
!*以下为测试样式*!
|
|
line-height: 8rem;
|
|
text-align: center;
|
|
color: #333;
|
|
}*/
|
|
|
|
.live-more {
|
|
line-height: 3rem;
|
|
text-align: center;
|
|
}
|
|
|
|
/* 直播间 */
|
|
.live-video {
|
|
height: 10.5rem;
|
|
background: #000;
|
|
}
|
|
|
|
.live-tab {}
|
|
|
|
.live-content {
|
|
padding: 0.5rem;
|
|
}
|
|
|
|
.live-msg {
|
|
padding-bottom: 0.2rem;
|
|
color: #666;
|
|
font-size: 14px;
|
|
}
|
|
|
|
.live-msg .name {
|
|
color: #00bbee;
|
|
}
|
|
|
|
.live-msg img {
|
|
max-width: 200px;
|
|
}
|
|
|
|
.live-footer {
|
|
padding: 0.25rem 0.5rem;
|
|
display: -webkit-box;
|
|
display: -webkit-flex;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
}
|
|
|
|
.live-footer .live-emoji {
|
|
width: 2rem;
|
|
background: red;
|
|
margin-right: 0.5rem;
|
|
}
|
|
|
|
.live-footer .live-input {
|
|
padding-right: 0.5rem;
|
|
|
|
-webkit-box-flex: 1;
|
|
-webkit-flex: 1;
|
|
-ms-flex: 1;
|
|
flex: 1;
|
|
}
|
|
.live-footer .live-input .input {
|
|
height: 2rem;
|
|
width: 100%;
|
|
padding: 0.2rem 0.5rem;
|
|
border-radius: 3px;
|
|
border: 1px solid #ddd;
|
|
font-size: 16px;
|
|
color: #666;
|
|
word-break: break-all;
|
|
outline: none;
|
|
overflow-y: auto;
|
|
}
|
|
|
|
.live-footer .live-input .input:focus {
|
|
border: 1px solid #00bbee;
|
|
}
|
|
|
|
/*
|
|
|
|
.live-footer .live-input .input img {
|
|
vertical-align: text-top;
|
|
height: 20px;
|
|
}
|
|
|
|
.live-footer .live-input .input:empty :before {
|
|
content: attr(placeholder);
|
|
line-height: 1.5rem;
|
|
color:#bbb;
|
|
}
|
|
|
|
.live-footer .live-input .input input[type='button'] {
|
|
background: none;
|
|
border: 0;
|
|
padding: 0;
|
|
color: #50b6fe;
|
|
font-size: 0.65rem;
|
|
}
|
|
*/
|
|
|
|
|
|
.live-footer .live-send {
|
|
width: 3.5rem;
|
|
background: #ccc;
|
|
color: #fff;
|
|
line-height: 2rem;
|
|
height: 2rem;
|
|
text-align: center;
|
|
border-radius: 3px;
|
|
display: block;
|
|
}
|
|
|
|
.live-footer .live-send.active {
|
|
background: #00bbee;
|
|
}
|
|
|
|
|
|
.live-footer-emoji {
|
|
height: 4.5rem;
|
|
}
|
|
|
|
.nickname {
|
|
color: #50b6fe;
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|