1
0
mirror of https://github.com/kremalicious/blog.git synced 2024-11-14 09:05:17 +01:00
blog/_src/_assets/styl/content-photo.styl

95 lines
1.9 KiB
Stylus
Raw Normal View History

2014-07-12 21:22:47 +02:00
//
// kremalicious3
// --------------
// Content - Photo Post
//
.hentry.format-photo
@extend .textcenter
2016-03-02 01:28:01 +01:00
.hentry__teaser
picture
margin-top: 0
margin-bottom: 0
2014-07-12 21:22:47 +02:00
figure
@extend .aligncenter
position: relative
display: inline-block
img,
figcaption
margin-bottom: 0
figcaption
@extend .transition
2015-12-05 15:15:35 +01:00
transition-property: transform, opacity
2014-07-12 21:22:47 +02:00
position: absolute
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: ($spacer/3)
2014-07-12 21:22:47 +02:00
background: $link-color
2015-08-09 18:11:26 +02:00
background: alpha($link-color, .7)
2014-07-12 21:22:47 +02:00
color: #fff
text-shadow: 0 1px 0 #000
2015-08-20 20:06:14 +02:00
left: -8%
top: $spacer
2015-08-20 20:06:14 +02:00
@media $breakpoint2
left: -16%
2014-07-12 21:22:47 +02:00
opacity: 0
2015-12-05 15:15:35 +01:00
transform: translate3d(0, -20px, 0)
2014-07-12 21:22:47 +02:00
&:hover figcaption
opacity: 1
2015-12-05 15:15:35 +01:00
transform: translate3d(0, 0, 0)
2014-07-12 21:22:47 +02:00
.entry-content
text-align: left
margin-top: $spacer
2014-07-12 21:22:47 +02:00
.page-single &
2016-03-02 01:28:01 +01:00
padding-top: 0
padding-bottom: ($spacer*3)
2014-07-12 21:22:47 +02:00
@media $breakpoint2
2016-03-02 01:28:01 +01:00
padding-top: 0
padding-bottom: ($spacer*6)
2014-07-12 21:22:47 +02:00
figure img
max-height: none
figcaption
opacity: 1
transform: translate(0,0)
background: #000
background: rgba(#000, .4)
2015-10-31 20:43:50 +01:00
2014-07-12 21:22:47 +02:00
.photo-link
display: block
&:hover
img
border-color: $link-color
2014-07-12 21:22:47 +02:00
&:active
background: none
//
// Photo background change adjustment
//
.ab-dark
.entry-content
color: $text-color-dimmed
.byline, time, .comments
2015-06-15 01:41:53 +02:00
color: $text-color-light