56 lines
1.0 KiB
SCSS
56 lines
1.0 KiB
SCSS
.article-card {
|
|
margin: 0px 0px ($unit * 4) 0px;
|
|
padding: ($unit * 2);
|
|
background: lighten($mist, 3%);
|
|
border-radius: ($unit / 2);
|
|
min-height: 200px;
|
|
position: relative;
|
|
@media handheld and (max-width: $phone-breakpoint),
|
|
screen and (max-device-width: $phone-breakpoint),
|
|
screen and (max-width: $tablet-breakpoint) {
|
|
padding: ($unit * 2) ($unit * 1);
|
|
}
|
|
a {
|
|
text-decoration: none;
|
|
}
|
|
strong {
|
|
color: darken($darkgrey, 5%);
|
|
font-weight: 400;
|
|
}
|
|
&:last-child {
|
|
margin-right: 0;
|
|
}
|
|
.date {
|
|
text-transform: uppercase;
|
|
margin-bottom: $unit;
|
|
}
|
|
.title {
|
|
font-size: 20px;
|
|
color: $regal;
|
|
}
|
|
p, .date {
|
|
font-size: 16px;
|
|
color: darken($darkgrey, 5%);
|
|
}
|
|
p {
|
|
margin-bottom: 50px;
|
|
}
|
|
.posted {
|
|
color: $bismark;
|
|
font-size: 16px;
|
|
display: inline;
|
|
padding-left: 10px;
|
|
}
|
|
img {
|
|
width: 40px;
|
|
height: 40px;
|
|
border-radius: 50% 50%;
|
|
display: inline;
|
|
vertical-align: middle;
|
|
}
|
|
.author {
|
|
position: absolute;
|
|
bottom: 20px;
|
|
}
|
|
}
|