1
0
mirror of https://github.com/kremalicious/blog.git synced 2024-09-24 10:08:50 +02:00
blog/_src/_assets/styl/content.styl

187 lines
3.2 KiB
Stylus

//
// kremalicious3
// --------------
// Generic Content
//
// Page Title
/////////////////////////////////////
.page-title
@extend .h2, .heading-band
color: $brand-grey-light
margin-top: ($line-height-computed/2)
margin-bottom: ($line-height-computed/2)
@media $breakpoint2
margin-left: -108%
.page-photos &
margin-bottom: ($line-height-computed*4)
.hash
@extend .h3
color: darken($page-bg, 15%)
margin-right: 2px
.hentry
@extend .divider-bottom
padding-top: ($line-height-computed*2)
padding-bottom: ($line-height-computed*2)
width: 100%
@media $breakpoint2
padding-top: ($line-height-computed*4)
padding-bottom: ($line-height-computed*4)
.page-index &:first-child
padding-top: ($line-height-computed*3)
.page-single &
padding-bottom: ($line-height-computed*2)
border: none
&:before
@extend .hide
// Post Title
/////////////////////////////////////
.entry-title
@extend .h1, .textcenter
color: $headings-color
margin-top: 0
margin-bottom: $line-height-computed
.format-link &
@extend .h3
// Post Content
/////////////////////////////////////
.entry-content
h1,
h2
@extend .heading-band
h1
font-size: ceil($font-size-base * 2.5)
.teaser
box-shadow: 0 1px 3px rgba(0,0,0,.2)
p:last-child
margin-bottom: 0
// Post meta
/////////////////////////////////////
.entry-meta
@extend .clearfix
margin-top: ($line-height-computed*2)
font-size: $font-size-small
.byline,
.time,
.tags,
.categories
@extend .textcenter
.byline,
.time
font-style: italic
color: $text-color-dimmed
.byline
margin-bottom: 0
.by
display: block
// Categories & Tags
/////////////////////////////////////
.categories
margin-bottom: 0
.category
text-transform: capitalize
.tag
color: $text-color
margin-right: 5px
&:before
content: '#'
color: darken($page-bg, 15%)
margin-right: 2px
.avatar
width: 80px
height: 80px
border-radius: 80px
border: 2px solid #fff
// Goodies download
/////////////////////////////////////
.goodie-actions
@extend .clearfix, .aligncenter
max-width: 640px
p,
.btn
margin-bottom: 0
.btn
display: block
.download
margin-top: ($line-height-computed/2)
@media $breakpoint2
margin-top: 0
text-align: right
// Masonry
/////////////////////////////////////
.masonry
@media $breakpoint2
width: 125%
margin-left: -12.5%
clearfix()
.hentry
@media $breakpoint1
width: 49%
float: left
clear: none
padding-top: 0
padding-bottom: 0
margin-bottom: .7em
margin-top: 0
margin-left: 0
margin-right: 1%
border: none
&:before
display: none
&:nth-child(2n+1)
margin-right: 0
&:last-child
margin-bottom: 3em
.grid-sizer
width: 100%
@media screen and (min-width: 480px)
width: 50%