Make post images responsive

main
Raymond Wanyoike 2014-10-29 14:23:13 +03:00
parent 51e4a557c0
commit c80409e460
3 changed files with 100 additions and 99 deletions

File diff suppressed because one or more lines are too long

View File

@ -9,93 +9,93 @@
// version: v3.0.1 (2014-05-27)
// TABLE OF MIXINS:
// align-content
// align-items
// align-self
// animation
// animation-delay
// animation-direction
// animation-duration
// animation-fill-mode
// animation-iteration-count
// animation-name
// animation-play-state
// animation-timing-function
// appearance
// backface-visibility
// background-clip
// background-image
// background-origin
// background-size
// blur
// border-bottom-left-radius
// border-bottom-right-radius
// border-image
// border-radius
// border-top-left-radius
// border-top-right-radius
// box-shadow
// box-sizing
// brightness
// calc
// column-count
// column-gap
// column-rule
// column-width
// columns
// contrast
// display
// drop-shadow
// filter
// flex
// flex-basis
// flex-direction
// flex-grow
// flex-shrink
// flex-wrap
// font-face
// grayscale
// hue-rotate
// hyphens
// invert
// justify-content
// keyframes
// opacity
// order
// perspective
// perspective-origin
// placeholder
// rotate
// rotate3d
// rotateX
// rotateY
// rotateZ
// saturate
// scale
// scale3d
// scaleX
// scaleY
// scaleZ
// selection
// sepia
// size
// skew
// skewX
// skewY
// transform
// transform-origin
// transform-style
// transition
// transition-delay
// transition-duration
// transition-property
// transition-timing-function
// translate
// translate3d
// translateX
// translateY
// translateZ
// user-select
// align-content
// align-items
// align-self
// animation
// animation-delay
// animation-direction
// animation-duration
// animation-fill-mode
// animation-iteration-count
// animation-name
// animation-play-state
// animation-timing-function
// appearance
// backface-visibility
// background-clip
// background-image
// background-origin
// background-size
// blur
// border-bottom-left-radius
// border-bottom-right-radius
// border-image
// border-radius
// border-top-left-radius
// border-top-right-radius
// box-shadow
// box-sizing
// brightness
// calc
// column-count
// column-gap
// column-rule
// column-width
// columns
// contrast
// display
// drop-shadow
// filter
// flex
// flex-basis
// flex-direction
// flex-grow
// flex-shrink
// flex-wrap
// font-face
// grayscale
// hue-rotate
// hyphens
// invert
// justify-content
// keyframes
// opacity
// order
// perspective
// perspective-origin
// placeholder
// rotate
// rotate3d
// rotateX
// rotateY
// rotateZ
// saturate
// scale
// scale3d
// scaleX
// scaleY
// scaleZ
// selection
// sepia
// size
// skew
// skewX
// skewY
// transform
// transform-origin
// transform-style
// transition
// transition-delay
// transition-duration
// transition-property
// transition-timing-function
// translate
// translate3d
// translateX
// translateY
// translateZ
// user-select
.align-content(...) {
@process: ~`(function(r){return r=r||"stretch"})((function(){var r="@{arguments}";return r=r.replace(/^\[|\]$/g,"")})())`;

View File

@ -44,11 +44,6 @@ a {
}
}
pre,
img {
border-radius: 4px;
}
.container {
max-width: 970px;
}
@ -99,8 +94,8 @@ img {
.post {
font-size: 16px;
&.mini-post {
padding: 30px 0;
border-bottom: 1px solid #ddd;
padding: 30px 0;
&:last-child {
border-bottom: none;
}
@ -115,14 +110,21 @@ img {
font-size: 18px;
}
}
&.full-post {
* img {
max-width: 940px;
.post-content {
img {
display: block;
height: auto;
max-width: 100%;
width: 100% \9;
}
pre,
img {
.border-radius(4px);
}
}
}
.separator {
margin-top: 30px;
margin-bottom: 30px;
margin-top: 30px;
}