// Place all the styles related to the Entries controller here. // They will automatically be included in application.css. // You can use Sass (SCSS) here: http://sass-lang.com/ @import url('https://fonts.googleapis.com/css?family=Slabo+27px'); @import url('https://fonts.googleapis.com/css?family=Roboto:400,700'); #blog-post { font-size: 16px; line-height: 24px; margin: 0 1em; .blog-title { h2 { width: 100%; margin-left: 10px; margin-top: 0; margin-bottom: 0; color: #59770e; border-bottom: 1px dotted #CCCCCC; padding-bottom: 3px; } } header { display: flex; .post-calendar { width: 45px; height: 49px; &.post-date-1 { background: image-url("date-bg-1.gif") no-repeat; } &.post-date-2 { background: image-url("date-bg-2.gif") no-repeat; } &.post-date-3 { background: image-url("date-bg-3.gif") no-repeat; } &.post-date-4 { background: image-url("date-bg-4.gif") no-repeat; } .post-month { font-size: 11px; color: white; text-align: center; display: block; line-height: 11px; padding-top: 2px; margin-left: -3px; } .post-day { font-size: 18px; color: #999999; text-align: center; display: block; line-height: 18px; padding-top: 7px; margin-left: -3px; } } .post-author { background: image-url("Hatkirby.ico") no-repeat; padding-left: 20px; margin-left: 10px; float: left; font-size: 95%; font: 75%/150% sans-serif; color: #999; } } } #blog-footer { background-color: #f8f8f8; border-width: 1px 0 1px 0; border-style: solid; border-color: #DDD; color: #777; padding: .75em 1em; font-size: 0.9em; margin-bottom: 1em; time { border-bottom: 1px dotted #777; } } #stream-post { h2 { background-color: #98FB98; display: block; font-size: 20px; font-family: 'Roboto', sans-serif; padding: 0.5em 20px; border-top: 1px solid #7BCC70; border-bottom: 1px solid #7BCC70; } #stream-intro { font-size: 16px; margin: 0 20px; } .stream-update { font-size: 16px; padding: 0 20px; .update-posted { display: block; font-style: italic; background-color: #EAADEA; font-size: 16px; margin: .5em -20px; padding: .5em 20px; border-width: 1px 0 1px 0; border-style: solid; border-color: #DB70DB; } } } .entry-content { hyphens: auto; word-wrap: break-word; font-family: 'Roboto', sans-serif; a { text-decoration: none; font-weight: bold; &, &:visited { color: #ee2c2c; } &:hover { text-decoration: underline; color: #9ea1ad; } } li { & + li { margin-top: 1em; } } img { max-width: 100%; box-sizing: border-box; } figure { background-color: #eee; border: 1px solid #bbb; padding: 0.25em 0.25em 0 0.25em; font-size: 0.75em; line-height: 24px; img { display: block; border: 1px solid #bbb; } figcaption { font-style: italic; text-align: center; margin: 0.25em; } } }