// BLOG AND MAGAZINE COMPONENTS // Horizontal listing .horizontal-listing { padding: 0 1rem; .row { padding-top: 1rem; padding-bottom: 1rem; border-bottom: 1px solid #e0e0e0; @extend .hoverable; &:last-of-type { border-bottom: none; } h2 { @extend .h2-responsive; } @extend .card-data; .card-data ul li { font-size: 0.8rem; padding: 0; } .view { @extend .z-depth-2; } } a { color: #01579b; } } @media (max-width: 772px) { .horizontal-listing { .view { margin-bottom: 1.4rem; } } } // 2 column horizontal listing .hl-2-col { .view, img { @extend .z-depth-2; } @extend .card-data; padding: 0; .card-data ul li { font-size: 0.8rem; padding: 0; } .col-md-6 .row { padding: 1rem 0; @extend .hoverable; } .main-card { @extend .hoverable; margin-top: 1rem; } a { color: #01579b; } h2 { @extend .h2-responsive; } h4 { @extend .h4-responsive; } } // Tabs widget .tab-pane { .horizontal-listing { h2 { @extend .h4-responsive; margin-top: 0; } } } // Author box .author-box { @extend .jumbotron; } @media (max-width: 772px) { .author-box { text-align: center; img { margin-bottom: 2rem; display: inline; } } } // Comments section .comments-section { @extend .horizontal-listing; .heading { text-align: center; @extend .h1-responsive; } } // Review listing .review-listing { .col-xs-8 p { margin-bottom: 5px; } .row .col-md-6 .row { padding-bottom: 1rem; padding-top: 1rem; @extend .hoverable; } .col-xs-8 .rating { background-color: $stylish-color; font-size: 0.6rem; margin: 0; &:hover .fa { color: gold; transition: 0.4s; } .fa { color: #fff; } } }