BookStack Code Mirror - website/blob - themes/bookstack/sass/_blog.scss

   1
   2 .post-image {
   3     height: 360px;
   4     background-size: cover;
   5     background-position: 50% 50%;
   6 }
   7
   8 .container .post-avatar {
   9         border-radius: 100%;
  10         position: relative;
  11         display: inline-block;
  12         top: 10px;
  13         margin: 0 $-xs;
  14         border: 0;
  15 }
  16
  17 .post-content {
  18         max-width: 700px;
  19         margin: 0 auto;
  20 }
  21
  22 .post-content img:not(.no-border) {
  23         border-radius: 3px;
  24         border: 1px solid #DDD;
  25 }
  26
  27 .post-content video {
  28   max-width: 100%;
  29   border: 1px solid $primary;
  30   border-radius: 3px;
  31 }
  32
  33 .post-content iframe {
  34   max-width: 100%;
  35 }
  36
  37 .pagination {
  38         text-align: center;
  39         font-size: 0.8em;
  40         color: #666;
  41         margin: $-m 0;
  42         display: block;
  43         margin-bottom: $-xxl;
  44         a {
  45                 display: inline-block;
  46                 border: 1px solid #BBB;
  47                 border-radius: 3px;
  48                 padding: $-xs $-m;
  49                 color: #666;
  50                 margin-top: -$-s
  51         }
  52         .older-posts {
  53                 float: right;
  54         }
  55         .newer-posts {
  56                 float: left;
  57         }
  58 }
  59
  60 article.post {
  61         h2 {
  62                 margin-bottom: 0;
  63         }
  64 }
  65
  66 .blog-cover {
  67         h1 {
  68                 font-size: 5em;
  69                 color: #FFF;
  70                 font-weight: 300;
  71                 padding: 0.5em 0;
  72         }
  73 }
  74
  75 #mc_embed_signup {
  76         background: #F8F8F8;
  77         padding: $-l;
  78         border: 1px solid #DDD;
  79         margin-bottom: $-xl;
  80         margin-top: $-l;
  81         border-radius: 4px;
  82         h4 {
  83                 margin-top: 0;
  84         }
  85         input {
  86                 padding: $-xs;
  87                 line-height: 1.4;
  88                 font-family: $text;
  89                 border: 1px solid #bbb;
  90         }
  91 }
  92
  93 .blog-sidebar-post-list {
  94         padding-top: $-m;
  95         opacity: 0.7;
  96         transition: opacity 180ms ease-in-out;
  97         &:hover {
  98                 opacity: 1;
  99         }
 100 }
 101 .blogpost-list-small {
 102         display: block;
 103         text-decoration: none;
 104         border-bottom: 1px solid #DDD;
 105         padding: $-s 0;
 106         h5 {
 107                 color: #666;
 108         }
 109         time {
 110                 color: #888;
 111                 font-size: 0.9em;
 112         }
 113         &:last-of-type {
 114                 border-bottom: 0;
 115         }
 116         &:hover {
 117                 text-decoration: none;
 118                 h5 {
 119                         color: $primary;
 120                 }
 121         }
 122 }
 123
 124 p.post-date {
 125   margin-top: -$-m;
 126   margin-bottom: $-l;
 127   .post-avatar {
 128     margin-left: 0;
 129   }
 130 }