118 lines
2.1 KiB
CSS
118 lines
2.1 KiB
CSS
/* recommend_03.css */
|
|
.__PFX__-recC-block{
|
|
margin:14px 12px 6px;
|
|
padding:10px 10px 8px;
|
|
border-radius:12px;
|
|
background:linear-gradient(135deg,var(--grad-start),var(--grad-end));
|
|
color:#fff;
|
|
}
|
|
.__PFX__-recC-top{
|
|
display:flex;
|
|
flex-direction:column;
|
|
gap:2px;
|
|
margin-bottom:6px;
|
|
}
|
|
.__PFX__-recC-title{
|
|
font-size:15px;
|
|
font-weight:600;
|
|
}
|
|
.__PFX__-recC-tip{
|
|
font-size:11px;
|
|
opacity:.85;
|
|
}
|
|
.__PFX__-recC-body{
|
|
display:flex;
|
|
gap:8px;
|
|
}
|
|
@media(max-width:767px){
|
|
.__PFX__-recC-body{
|
|
flex-direction:column;
|
|
}
|
|
}
|
|
.__PFX__-recC-main{
|
|
flex:1.1;
|
|
min-width:0;
|
|
}
|
|
.__PFX__-recC-mainLink{
|
|
display:flex;
|
|
gap:8px;
|
|
text-decoration:none;
|
|
color:inherit;
|
|
}
|
|
.__PFX__-recC-mainCover{
|
|
width:38%;
|
|
max-width:120px;
|
|
border-radius:10px;
|
|
overflow:hidden;
|
|
position:relative;
|
|
background:#000;
|
|
}
|
|
.__PFX__-recC-mainImg{
|
|
width:100%;
|
|
aspect-ratio:2/3;
|
|
object-fit:cover;
|
|
display:block;
|
|
}
|
|
.__PFX__-recC-mainBadge{
|
|
position:absolute;
|
|
left:6px;
|
|
top:6px;
|
|
font-size:10px;
|
|
padding:2px 6px;
|
|
border-radius:999px;
|
|
background:rgba(0,0,0,.6);
|
|
}
|
|
.__PFX__-recC-mainText{
|
|
flex:1;
|
|
min-width:0;
|
|
display:flex;
|
|
flex-direction:column;
|
|
justify-content:center;
|
|
}
|
|
.__PFX__-recC-mainName{
|
|
font-size:14px;
|
|
font-weight:600;
|
|
line-height:1.3;
|
|
}
|
|
.__PFX__-recC-mainRemark{
|
|
margin-top:3px;
|
|
font-size:11px;
|
|
opacity:.85;
|
|
}
|
|
.__PFX__-recC-side{
|
|
flex:1;
|
|
min-width:0;
|
|
list-style:none;
|
|
margin:0;
|
|
padding:0;
|
|
}
|
|
.__PFX__-recC-sideItem + .__PFX__-recC-sideItem{
|
|
margin-top:3px;
|
|
}
|
|
.__PFX__-recC-sideLink{
|
|
display:flex;
|
|
align-items:center;
|
|
text-decoration:none;
|
|
color:inherit;
|
|
font-size:11px;
|
|
padding:4px 6px;
|
|
border-radius:6px;
|
|
background:rgba(0,0,0,0.14);
|
|
}
|
|
.__PFX__-recC-sideNo{
|
|
width:20px;
|
|
font-family:monospace;
|
|
opacity:.8;
|
|
}
|
|
.__PFX__-recC-sideName{
|
|
flex:1;
|
|
min-width:0;
|
|
overflow:hidden;
|
|
text-overflow:ellipsis;
|
|
white-space:nowrap;
|
|
}
|
|
.__PFX__-recC-sideRemark{
|
|
margin-left:6px;
|
|
opacity:.8;
|
|
}
|