MeikanClient/sass/animeList.scss

75 lines
1.9 KiB
SCSS
Raw Normal View History

@import 'variables';
.search {
display: flex;
.filters {
width: 300px;
}
.cardList {
padding: 20px 0;
flex: 1;
.card {
display: flex;
overflow: hidden;
border-radius: 2px;
background: #fff;
box-shadow: 0 1px 3px rgba(0,0,0,.12), 0 1px 2px rgba(0,0,0,.24);
&:not(:last-child) {
margin-bottom: 20px;
}
img {
height: 200px;
}
.body {
display: flex;
flex-direction: column;
max-height: 200px;
flex: 1;
.info {
display: flex;
overflow: hidden;
flex-direction: column;
padding: 16px 16px 0;
flex: 1;
.title {
font-size: 25px;
color: $pink;
}
.synopsis {
overflow: hidden;
display: -webkit-box;
padding: 16px 0 0 0;
color: rgba(0,0,0,.52);
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
margin-bottom: 16px;
}
}
.action {
padding: 16px;
border-top: 1px rgba(0,0,0,.12) solid;
button {
font-size: 16px;
color: #448aff;
border: none;
background: none;
outline: none;
}
}
}
}
}
}