1
0
mirror of https://github.com/kremalicious/blog.git synced 2024-11-13 16:45:14 +01:00
blog/_src/_assets/styl/content-featured.styl

73 lines
1.4 KiB
Stylus
Raw Normal View History

2014-07-12 21:22:47 +02:00
//
// kremalicious3
// --------------
// Content - Featured Posts
//
.featured
@extend .divider-bottom
2015-08-18 20:55:30 +02:00
padding-bottom: ($line-height-computed*2)
2014-07-12 21:22:47 +02:00
2015-08-18 19:51:49 +02:00
.grid
margin-bottom: 0
2014-07-12 21:22:47 +02:00
2015-11-20 18:13:34 +01:00
.grid__col
&:first-child
margin-left: -8%
&:last-child
margin-right: -8%
2015-08-20 20:06:14 +02:00
@media $breakpoint2
2015-11-20 18:13:34 +01:00
padding-bottom: ($line-height-computed*3)
2015-08-20 20:06:14 +02:00
.grid__col
padding-top: 0
2015-11-20 18:13:34 +01:00
&:first-child
margin-left: -16%
&:last-child
margin-right: -16%
.hentry__teaser
picture
margin: 0
@media $breakpoint1
margin-left: 0
margin-right: 0
2015-08-20 20:06:14 +02:00
2014-07-12 21:22:47 +02:00
.featured-link
display: block
2015-11-20 18:13:34 +01:00
position: relative
2014-07-12 21:22:47 +02:00
@media $breakpoint2
&:hover
transform: scale(1.03)
.featured-title
2015-11-20 18:13:34 +01:00
@extend .transition
margin: 0
position: absolute
top: 25%
min-width: 45%
text-align: right
font-family: $headings-font-family
font-weight: $headings-font-weight
font-style: normal
font-size: $font-size-small
padding: ($line-height-computed/3)
background: $link-color
background: alpha($link-color, .7)
color: #fff
text-shadow: 0 1px 0 #000
left: 0
opacity: 0
transform: translate(0, -20px)
.featured-link:hover &
opacity: 1
transform: translate(0, 0)
2014-07-12 21:22:47 +02:00
2015-11-20 18:13:34 +01:00
img.featured-image
2014-07-12 21:22:47 +02:00
display: block
2015-08-02 21:15:22 +02:00
margin-bottom: 0