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

173 lines
2.9 KiB
Stylus
Raw Normal View History

2014-07-12 02:00:18 +02:00
//
// kremalicious3
// --------------
// Generic Content
//
// Page Title
/////////////////////////////////////
.page-title
@extend .h2, .heading-band
color: $brand-grey-light
2014-07-12 21:22:47 +02:00
margin-top: ($line-height-computed/2)
margin-bottom: ($line-height-computed/2)
2014-07-12 02:00:18 +02:00
@media $breakpoint2
margin-left: -108%
2014-07-12 21:22:47 +02:00
2014-07-12 02:00:18 +02:00
.page-photos &
2014-07-12 21:22:47 +02:00
margin-bottom: ($line-height-computed*4)
2014-07-12 02:00:18 +02:00
.hentry
@extend .divider-bottom
2014-07-12 21:22:47 +02:00
padding: ($line-height-computed*2) 0
2014-07-12 02:00:18 +02:00
2014-07-12 21:22:47 +02:00
@media $breakpoint2
padding: ($line-height-computed*4) 0
2014-07-12 02:00:18 +02:00
2014-07-12 21:22:47 +02:00
&:first-child
2014-07-12 02:00:18 +02:00
padding-top: $line-height-computed
.page-single &
2014-07-12 21:22:47 +02:00
padding-bottom: ($line-height-computed*2)
2014-07-12 02:00:18 +02:00
border: none
2014-07-12 21:22:47 +02:00
2014-07-12 02:00:18 +02:00
&:before
@extend .hide
// Post Title
/////////////////////////////////////
2014-07-12 21:22:47 +02:00
.entry-title
2014-07-12 02:00:18 +02:00
@extend .h1, .textcenter
2014-07-12 21:22:47 +02:00
color: $headings-color
margin-top: 0
margin-bottom: $line-height-computed
2014-07-12 02:00:18 +02:00
2014-07-12 21:22:47 +02:00
.format-link &
2014-07-12 02:00:18 +02:00
@extend .h3
2014-07-12 21:22:47 +02:00
2014-07-12 02:00:18 +02:00
// Post Content
/////////////////////////////////////
.entry-content
2014-07-12 21:22:47 +02:00
h1,
2014-07-12 02:00:18 +02:00
h2
@extend .heading-band
h1
font-size: ceil($font-size-base * 2.5)
p:last-child
margin-bottom: 0
// Post meta
/////////////////////////////////////
.entry-meta
@extend .clearfix
2014-07-12 21:22:47 +02:00
margin-top: ($line-height-computed*2)
2014-07-12 02:00:18 +02:00
font-size: $font-size-small
.byline,
time,
2015-06-07 22:53:01 +02:00
.tags
2014-07-12 02:00:18 +02:00
@extend .textcenter
.byline,
time
2014-07-12 21:22:47 +02:00
font-style: italic
2014-07-12 02:00:18 +02:00
.byline
2014-07-12 21:22:47 +02:00
margin-bottom: 0
2014-07-12 02:00:18 +02:00
color: $text-color-light
.by
display: block
time
display: block
color: $text-color-dimmed
2015-06-07 22:53:01 +02:00
.tags
2014-07-12 02:00:18 +02:00
margin-top: $line-height-computed
2015-06-07 22:53:01 +02:00
.tag
color: $text-color-dimmed
margin-right: 5px
&:before
content: '#'
color: darken($page-bg, 15%)
margin-right: 2px
2014-07-12 02:00:18 +02:00
.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
2014-07-12 21:22:47 +02:00
margin-top: ($line-height-computed/2)
2014-07-12 02:00:18 +02:00
@media $breakpoint2
margin-top: 0
text-align: right
// Masonry
/////////////////////////////////////
.masonry
@media $breakpoint2
width: 125%
margin-left: -12.5%
2014-07-12 21:22:47 +02:00
clearfix()
2014-07-12 02:00:18 +02:00
.hentry
@media $breakpoint1
width: 49%
2014-07-12 21:22:47 +02:00
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
2014-07-12 02:00:18 +02:00
display: none
&:nth-child(2n+1)
margin-right: 0
2014-07-12 21:22:47 +02:00
&:last-child
2014-07-12 02:00:18 +02:00
margin-bottom: 3em
.grid-sizer
width: 100%
@media screen and (min-width: 480px)
width: 50%