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) // version: v3.0.1 (2014-05-27)
// TABLE OF MIXINS: // TABLE OF MIXINS:
// align-content // align-content
// align-items // align-items
// align-self // align-self
// animation // animation
// animation-delay // animation-delay
// animation-direction // animation-direction
// animation-duration // animation-duration
// animation-fill-mode // animation-fill-mode
// animation-iteration-count // animation-iteration-count
// animation-name // animation-name
// animation-play-state // animation-play-state
// animation-timing-function // animation-timing-function
// appearance // appearance
// backface-visibility // backface-visibility
// background-clip // background-clip
// background-image // background-image
// background-origin // background-origin
// background-size // background-size
// blur // blur
// border-bottom-left-radius // border-bottom-left-radius
// border-bottom-right-radius // border-bottom-right-radius
// border-image // border-image
// border-radius // border-radius
// border-top-left-radius // border-top-left-radius
// border-top-right-radius // border-top-right-radius
// box-shadow // box-shadow
// box-sizing // box-sizing
// brightness // brightness
// calc // calc
// column-count // column-count
// column-gap // column-gap
// column-rule // column-rule
// column-width // column-width
// columns // columns
// contrast // contrast
// display // display
// drop-shadow // drop-shadow
// filter // filter
// flex // flex
// flex-basis // flex-basis
// flex-direction // flex-direction
// flex-grow // flex-grow
// flex-shrink // flex-shrink
// flex-wrap // flex-wrap
// font-face // font-face
// grayscale // grayscale
// hue-rotate // hue-rotate
// hyphens // hyphens
// invert // invert
// justify-content // justify-content
// keyframes // keyframes
// opacity // opacity
// order // order
// perspective // perspective
// perspective-origin // perspective-origin
// placeholder // placeholder
// rotate // rotate
// rotate3d // rotate3d
// rotateX // rotateX
// rotateY // rotateY
// rotateZ // rotateZ
// saturate // saturate
// scale // scale
// scale3d // scale3d
// scaleX // scaleX
// scaleY // scaleY
// scaleZ // scaleZ
// selection // selection
// sepia // sepia
// size // size
// skew // skew
// skewX // skewX
// skewY // skewY
// transform // transform
// transform-origin // transform-origin
// transform-style // transform-style
// transition // transition
// transition-delay // transition-delay
// transition-duration // transition-duration
// transition-property // transition-property
// transition-timing-function // transition-timing-function
// translate // translate
// translate3d // translate3d
// translateX // translateX
// translateY // translateY
// translateZ // translateZ
// user-select // user-select
.align-content(...) { .align-content(...) {
@process: ~`(function(r){return r=r||"stretch"})((function(){var r="@{arguments}";return r=r.replace(/^\[|\]$/g,"")})())`; @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 { .container {
max-width: 970px; max-width: 970px;
} }
@ -99,8 +94,8 @@ img {
.post { .post {
font-size: 16px; font-size: 16px;
&.mini-post { &.mini-post {
padding: 30px 0;
border-bottom: 1px solid #ddd; border-bottom: 1px solid #ddd;
padding: 30px 0;
&:last-child { &:last-child {
border-bottom: none; border-bottom: none;
} }
@ -115,14 +110,21 @@ img {
font-size: 18px; font-size: 18px;
} }
} }
&.full-post { .post-content {
* img { img {
max-width: 940px; display: block;
height: auto;
max-width: 100%;
width: 100% \9;
}
pre,
img {
.border-radius(4px);
} }
} }
} }
.separator { .separator {
margin-top: 30px;
margin-bottom: 30px; margin-bottom: 30px;
margin-top: 30px;
} }