Viewing File: /home/maglabs/sogefab/wp-content/themes/sofass/sass/template/_post.scss
/*
* General Post Style using for all with naming class entry
*/
.post.no-results{
text-align:center;
.widget-search{
margin-top: $theme-margin;
}
}
.entry-title{
font-weight:500;
font-size: 24px;
margin: 5px 0 12px;
word-wrap: break-word;
}
.entry-create{
font-size: 13px;
margin: 0 0 15px;
> *{
@include rtl-margin-right(2px);
}
.author{
font-style: italic;
text-transform: capitalize;
}
}
.comment-form-cookies-consent{
[type="checkbox"]{
@include rtl-margin-right(7px);
}
}
.entry-link{
margin-top: 20px;
.readmore {
color: $theme-color;
text-transform: capitalize;
font-weight: 500;
font-size: $font-size-base - 2;
&:hover{
color: #000;
}
}
}
.entry-meta{
margin:0;
.fa,.icon{
@include rtl-margin-right(3px);
}
}
blockquote{
color:$link-color;
font-size:18px;
padding:0 25px;
@include rtl-border-left(3px solid $theme-color);
font-style:italic;
}
.entry-vote{
z-index: 1;
display: table;
text-align: center;
top: 20px;
position: absolute;
background: rgba($black,.5);
@include square(44px);
@include rtl-right(20px);
.entry-vote-inner{
color: $white;
display: table-cell;
vertical-align: middle;
font-weight: $headings-font-weight;
}
&.vote-perfect{
.entry-vote-inner{
color: $red;
}
}
&.vote-good{
.entry-vote-inner{
color: $yellow;
}
}
&.vote-average{
.entry-vote-inner{
color: #91e536;
}
}
&.vote-bad{
.entry-vote-inner{
color: $orange;
}
}
&.vote-poor{
.entry-vote-inner{
color: $green;
}
}
}
.type-post{
margin-bottom:$theme-margin;
@media(max-width:767px){
margin: 0 0 15px;
}
}
.blog-title{
margin-bottom: $theme-margin;
}
//commentform
#commentform{
margin-bottom:30px;
.logged-in-as {
margin: 0 0 25px;
a {
color: #666;
}
}
.form-control{
padding: 5px 20px;
margin: 0;
@include border-radius(0);
height: 50px;
&::-webkit-input-placeholder { /* Chrome/Opera/Safari */
color: #666;
}
&::-moz-placeholder { /* Firefox 19+ */
color: #666;
}
&:-ms-input-placeholder { /* IE 10+ */
color: #666;
}
&:-moz-placeholder { /* Firefox 18- */
color: #666;
}
&:focus{
border-color:#1e1e27;
}
}
textarea.form-control {
height: 115px ;
padding: 0;
resize: none;
@include border-radius(0);
}
.form-group{
margin: 0 0 20px;
}
.space-comment{
margin: 0 0 30px;
}
#cancel-comment-reply-link{
color: $theme-color;
}
#submit{
@include border-radius(50px);
}
}
/*
* using for new, magazine
*/
.post-specail{
.entry-title{
font-size: 16px;
}
.entry-date{
font-style: italic;
}
.entry-create{
margin: 0 0 18px;
}
}
.post-title{
@include font-size(font-size,$entry-title-font-size);
}
.post-thumb{
position: relative;
}
.blog-meta{
top: 0;
position: absolute;
@include rtl-right($entry-meta-position);
}
/** Post blog style **/
.blog{
&.style1 .blog-date{
top: 0;
position: absolute;
@include rtl-right(0);
}
&.style2 {
border: 1px solid $border-color;
.blog-date{
@include rtl-float-left();
@include rtl-margin(-1px,$theme-margin,0px,0px);
}
.entry-title{
@include rtl-padding-left(65px);
@include rtl-padding-right(20px);
}
.entry-description{
@include rtl-padding-left(65px);
@include rtl-padding-right(20px);
}
.entry-content{
@include clearfix();
border: 0px;
margin-bottom: 20px;
}
}
.blog-date{
display: table;
background: $blog-date-bg;
text-align: $align-center;
color: $blog-date-color;
text-transform: $blog-date-transform;
@include font-size(font-size,$blog-date-font-size);
font-weight: $blog-date-font-weight;
@include size($blog-date-size,$blog-date-size);
line-height: normal;
.blog-date-inner{
display: table-cell;
vertical-align: middle;
}
span{
display: block;
margin: 2px 0 3px 0;
line-height:$blog-date-number-line-height;
@include font-size(font-size,$blog-date-font-size-number);
font-weight: $blog-date-font-weight-number;
}
}
.blog-date--grids{
position: absolute;
top: 0;
@include rtl-right(15px);
}
.entry-content--info{
overflow: hidden;
padding: $theme-margin 0;
}
}
/// style posts
.post{
.entry-description{
margin: 0 0 30px;
clear:both;
overflow:hidden;
p {
margin: 0 0 10px;
line-height: 1.6;
}
p:last-child{
margin:0;
}
.wp-block-quote {
background-color: #f5f5f5;
padding-inline-start: 30px;
padding-inline-end: 30px;
padding-block: 24px;
font-size: 16px;
line-height: 30px;
color: #222;
position: relative;
margin-top: 30px;
margin-bottom: 30px;
@include border-radius(6px);
border-left: 5px solid $theme-color;
@media(min-width: 768px){
font-size: 16px;
}
a {
display: block;
font-size: 15px;
font-weight: 700;
font-style: italic;
margin-top: 12px;
}
}
h1, h2, h3, h4, h5, h6 {
color: $theme-color-secondary;
font-weight: 600;
@media(max-width: 767px){
font-size: 18px;
}
}
}
&.sticky{
.entry-title a{
}
}
.wp-block-image figcaption {
margin-top: 1em;
margin-bottom: 1em;
}
}
/* Post type: half content */
.grid-half{
// style for carousel
&.owl-carousel .owl-controls{
top:100%;
@include translate(50px,-80px);
@include rtl-left(50%);
.owl-nav .owl-prev,
.owl-nav .owl-next{
@include opacity(1);
position: static;
}
.owl-nav .owl-next{
@include rtl-margin-left(5px);
}
}
&.halfdark{
&.owl-carousel .owl-controls{
.owl-nav .owl-prev,
.owl-nav .owl-next{
background: #e1e4e6;
border-color: #e1e4e6;
color: $link-color;
&:hover,&:active{
background: $theme-color;
border-color: $theme-color;
color: #fff;
}
}
}
}
// style image
&.style_img.owl-carousel{
.owl-controls{
@include rtl-left(0);
@include translate(0,0);
}
}
}
.layout-half{
margin-left: 0;
margin-right: 0;
margin-bottom: 0;
background:$theme-color;
color: #fff;
.entry-content{
max-width: 650px;
padding-bottom: 120px;
padding-top: 50px;
&[class *='-6']{
padding-left: 50px;
padding-right: 50px;
}
}
> div{
padding-left: 0px;
padding-right: 0px;
}
@media(max-width:1024px){
.entry-content[class *='-6']{
padding-left: $theme-margin;
padding-right: $theme-margin;
padding-top: $theme-margin;
max-width: none;
}
}
.entry-title{
font-size: 50px;
margin: 0 0 20px;
line-height: 1.1;
a{
color: #fff !important;
}
}
.entry-description{
margin:0 0 40px;
font-size: 17px;
font-weight: 400;
}
}
.layout-dark{
background: #eff1f2 !important;
color: $text-color;
.meta{
font-size: 20px;
font-weight: 400;
position: relative;
padding:0 0 10px;
margin: 0 0 35px;
&:before{
content: '';
@include size(80px,2px);
background: $link-color;
position: absolute;
bottom:0;
@include rtl-left(0);
}
}
.entry-title {
margin: 0 0 10px;
a{
color: $link-color !important;
font-size: 30px;
}
}
.entry-description{
font-size: 15px;
font-weight: 300;
}
}
.layout-halfimg{
position: relative;
background: transparent;
margin-bottom: 60px;
.entry-content{
padding: 40px 40px 80px;
background:$theme-color;
color: #fff;
.entry-title{
font-size: 35px;
line-height: 1.1;
margin: 0 0 10px;
font-weight: 500;
a{
color: #fff !important;
}
}
}
@media(min-width:768px){
.half-img{
width: 75%;
}
.entry-content{
max-width: 500px;
position: absolute;
top: 50%;
@include translateY(-50%);
@include rtl-right(0);
}
}
}
/* Post type: List widget list*/
.posts-list{
list-style: none;
padding:0;
margin:0;
li{
overflow: hidden;
margin:0 0 10px;
padding-bottom: 10px;
border-bottom: 1px dashed $border-color;
@media(min-width: 1200px){
margin:0 0 20px;
padding-bottom: 20px;
}
&:last-child{
padding-bottom:0;
border-bottom:0;
margin: 0;
}
}
.content-info{
width:calc(100% - 100px);
}
.image{
width: 100px;
@include rtl-padding-right(15px);
}
.entry-title{
font-size: 13px;
@media(min-width: 1200px){
font-size: 16px;
}
text-transform: inherit;
margin:0 0 5px;
}
.top-info{
color: #666;
font-size: 13px;
line-height: 1.1;
a{
color: #666;
&:hover,&:focus{
color: $link-color;
}
}
}
}
// post-grid
.post-layout{
z-index: 0;
position: relative;
&:before{
content: "";
position: absolute;
@include rtl-right(0);
bottom: 0;
width: 0;
height: 3px;
background-color: $theme-color;
z-index: 99;
transition: width 0.5s cubic-bezier(0.35, 0.7, 0.35, 1);
}
&:hover{
&:before {
width: 100%;
@include rtl-left(0);
}
}
.post-sticky{
background:$theme-color;
color:#fff;
display:inline-block;
padding:3px 15px;
margin: 0;
font-size:14px;
position: absolute;
z-index: 10;
@include rtl-right(0);
}
.entry-title{
margin:0 0 15px;
font-weight: 700;
font-size: 20px;
text-transform: none;
line-height: 26px;
-ms-word-wrap: break-word;
word-wrap: break-word;
@media(min-width: 1200px){
font-size: 28px;
line-height: 36px;
}
}
.description{
margin-bottom: 10px;
font-size: 14px;
line-height: 24px;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
@media(min-width: 1200px){
margin-bottom: 20px;
font-size: 16px;
line-height: 26px;
-webkit-line-clamp: 4;
}
}
.top-image{
.date{
line-height: 1;
text-align: center;
padding:10px;
display: inline-block;
position: absolute;
top: 10px;
@include rtl-left(10px);
@include border-radius(0);
background-color: #fff;
text-transform: uppercase;
color: $link-color !important;
font-weight: 700;
font-size: 12px;
.day{
font-size: 18px;
display: block;
margin-top: 5px;
@media(min-width: 1200px){
font-size: 26px;
}
}
@media(min-width: 1200px){
@include rtl-left(15px);
top: 15px;
padding:10px 15px;
}
}
}
.no-image {
.top-info{
position: static;
.top-info-inner {
padding: 0;
}
}
}
.post-thumbnail{
display:block;
position:relative;
&:before{
content:'';
position:absolute;
top:0;
left: 0;
@include size(100%,100%);
background:rgba(0,0,0,0.5);
@include opacity(0);
@include transition(all 0.3s ease-in-out 0s);
@include border-radius(0);
}
}
&:hover{
.post-thumbnail:before{
@include opacity(1);
}
}
.post-info {
box-sizing: border-box;
position: relative;
z-index: 9;
border: 1px solid $border-color;
@include border-radius(0);
padding: 20px;
background-color: #fff;
@include rtl-text-align-left();
@media(min-width: 1200px){
padding: 20px 30px 30px;
}
.readmore {
position: relative;
font-weight: 600;
font-size: 12px;
padding: 5px 20px;
// &:after {
// content: '';
// position: absolute;
// top: 100%;
// margin-top: 0;
// height: 1px;
// background-color:$theme-color-secondary;
// width: 100%;
// left: 50%;
// @include transition(transform 0.5s cubic-bezier(0.28, 0, 0.18, 1) 0.2s);
// transform: translateX(-50%) scaleX(1);
// }
// &:hover:after{
// transform: translateX(-50%) scaleX(0);
// @include transition(transform 0.5s cubic-bezier(0.28, 0, 0.18, 1));
// }
i {
margin-inline-start: 0;
@include transition(.3s cubic-bezier(.24, .74, .58, 1));
font-size: 12px;
font-weight: 600;
}
&:hover {
i {
-webkit-transform: translateX(8px);
-khtml-transform: translateX(8px);
-moz-transform: translateX(8px);
-ms-transform: translateX(8px);
-o-transform: translateX(8px);
transform: translateX(8px);
}
}
}
}
.list-categories {
position: relative;
@include rtl-margin-left(15px);
&:before {
content: "\f02e";
font-family: 'Font Awesome 5 Free';
color: $theme-color;
@include rtl-left(-15px);
padding: 0;
position: absolute;
font-size: 14px;
font-weight: 100;
line-height: 20px;
}
a{
margin:0;
display: inline-block;
float: none;
+ a{
&:before{
content:',';
@include rtl-margin-right(5px);
}
}
}
}
.top-info{
font-size:14px;
margin:0 0 15px;
a, span{
color:$theme-color-third;
margin: 0;
position: relative;
&:hover,&:focus{
color: $theme-color;
}
// &.blog-time:before {
// content: "/";
// color: $theme-color-secondary;
// @include rtl-right(-15px);
// padding: 0;
// position: absolute;
// font-size: 14px;
// font-weight: 100;
// line-height: 20px;
// }
}
.blog-time,
span {
@include rtl-margin-right(5px);
@media(min-width: 1200px){
@include rtl-margin-right(12px);
}
}
i{
color:$theme-color;
@include rtl-margin-right(5px);
}
> *{
display: inline-block;
vertical-align: middle;
@include rtl-margin-right(15px);
&:last-child{
@include rtl-margin-right(0);
}
}
}
.categories-name{
// letter-spacing: 2px;
// text-transform: uppercase;
// display: inline-block;
// color: #fff !important;
// background:$theme-color;
// @include border-radius(2px);
// padding:3px 12px;
// font-size: 12px;
// line-height: $line-height-base;
// @include rtl-margin-right(2px);
// margin-bottom: 2px;
@media(min-width: 768px){
// @include rtl-margin-right(5px);
}
&:last-child{
@include rtl-margin-right(0);
}
}
iframe{
max-width: 100%;
width: 100%;
}
.slick-slide img {
width: 100%;
}
}
.post-grid-v1{
margin-bottom:20px;
@media(min-width:1200px){
margin-bottom:30px;
}
.top-image{
@include border-radius(0);
overflow: hidden;
}
.no-image{
margin-bottom: 20px;
@media(min-width: 768px){
margin-bottom: 33px;
}
}
.space{
margin:0 3px;
}
.entry-thumb{
margin-bottom:0;
img {
width: 100%;
}
}
.top-info {
.top-info-inner{
margin: 0;
}
}
.list-categories {
a {
}
}
.top-image,.no-image{
position:relative;
.list-categories{
// position:absolute;
// top:15px;
// @include rtl-left(15px);
// z-index: 2;
}
}
}
.post-grid-v2{
position:relative;
overflow: hidden;
@include transition(all 0.2s ease-in-out 0s);
margin: 0;
.post-info {
background-color: #fff;
box-sizing: border-box;
position: relative;
z-index: 9;
overflow: hidden;
border: 1px solid $border-color;
padding: 15px;
@media(min-width: 1200px){
padding: 20px 30px 30px;
}
}
.entry-thumb {
img{
@include border-radius(0) ;
}
}
.entry-title{
margin: 10px 0;
font-weight: 700;
font-size: 16px;
text-transform: none;
line-height: 1.5em;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
overflow: hidden;
@media(min-width: 1200px){
font-size: 20px;
}
}
.description{
font-size: 14px;
margin-bottom: 25px;
@media(min-width: 1200px){
font-size: 16px;
}
}
.image {
position: relative;
}
.no-image{
.top-info {
}
}
.top-info {
z-index: 9;
margin: 0;
direction: ltr;
}
.bottom-info {
a, span{
color:$theme-color-third;
@include rtl-margin-right(7px);
position: relative;
&:hover,&:focus{
color: $theme-color;
}
// &.blog-time:before {
// content: "/";
// color: $theme-color-secondary;
// @include rtl-right(-15px);
// padding: 0;
// position: absolute;
// font-size: 14px;
// font-weight: 100;
// line-height: 20px;
// }
}
i{
@include rtl-margin-right(5px);
}
}
.content{
padding:0;
margin: 0 0 20px;
background:#fff;
@include border-radius(0);
@media(min-width: 1200px){
padding:0;
margin: 0 0 30px;
}
}
}
.post-grid-v3{
margin-bottom: 20px;
@media(min-width: 1200px){
margin-bottom: 30px;
}
.post-info {
padding: 15px;
@media(min-width: 1200px){
padding: 20px 30px;
}
}
.top-image, .no-image{
}
.entry-title {
font-size: 14px;
line-height: 24px;
margin: 15px 0 0;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
@media(min-width: 1200px){
font-size: 20px;
line-height: 26px;
}
}
.list-categories {
a {
padding: 0;
&:hover{
background-color: transparent;
}
}
}
.top-info {
z-index: 9;
margin: 0;
direction: ltr;
position: static;
bottom: 0;
.top-info-inner{
margin: 0;
}
}
.entry-thumb{
margin-bottom:0;
}
.title{
margin:0;
font-weight: 500;
font-size: 14px;
text-transform: none;
line-height: 24px;
@media(min-width: 1200px){
font-size: 16px;
}
}
}
.layout-blog {
.post-grid-v2{
margin: 0 0 30px;
}
}
.single-blog .no-sidebar {
max-width: 900px;
margin-right: auto;
margin-left: auto;
}
.list-small{
overflow:hidden;
.entry-title{
font-size:14px;
margin:0 0 5px;
line-height: 20px;
font-weight: 400;
}
.date{
font-size: 12px;
}
.image{
@include rtl-float-left();
@include rtl-padding-right(15px);
img{
min-width: 62px;
}
}
.info{
overflow: hidden;
}
}
.post-list-item{
margin-bottom:20px;
@media(min-width: 1200px){
margin-bottom: 30px;
}
&:last-child{
border:none;
padding:0;
}
.list-inner {
background-color: #fff;
border: 1px solid $border-color;
@include border-radius(0);
}
.post-info {
padding: 0;
border:0;
@include rtl-text-align-left();
@media(min-width: 1024px){
padding: 8px 20px 10px 0;
}
@media(max-width: 991px){
padding: 15px 20px;
}
}
.no-image{
.post-info {
padding: 20px 30px;
@media(max-width: 991px){
padding: 15px 20px;
}
}
}
.no-image-content {
.post-content {
.post-content-inner {
margin: 0;
}
}
.list-categories {
margin: 0;
left:0;
}
}
.top-info {
@include rtl-text-align-left();
z-index: 9;
margin: 0;
direction: ltr;
position: relative;
@media(min-width: 1200px){
margin: 15px 0;
}
.top-info-inner{
padding: 20px 15px;
background-color: #fff;
margin: 0;
}
a{
color:$theme-color-third;
margin: 0;
position: relative;
&:hover,&:focus{
color: $theme-color;
}
&.blog-time:before {
content: "/";
color: $theme-color-third;
@include rtl-right(-12px);
padding: 0;
position: absolute;
font-size: 14px;
font-weight: 100;
line-height: 20px;
}
}
span {
@include rtl-margin-left(10px);
// @media(max-width: 991px){
// @include rtl-margin-left(3px);
// }
}
i{
color:$theme-color;
@include rtl-margin-right(5px);
}
> *{
display: inline-block;
vertical-align: middle;
@include rtl-margin-right(15px);
&:last-child{
@include rtl-margin-right(0);
}
}
}
.no-image {
.list-categories {
left:0;
}
}
.top-image{
position: relative;
z-index: 1;
}
.list-categories {
@media(min-width: 1200px){
@include rtl-margin-left(10px);
}
}
.entry-title{
margin:0 0 10px;
font-size: 20px;
line-height: 26px;
@media(min-width: 1200px){
font-size: 26px;
line-height: 32px;
}
}
.description{
margin-bottom: 10px;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
@media(min-width: 1200px){
-webkit-line-clamp: 2;
margin-bottom: 20px;
}
}
.btn-readmore{
margin-top: 10px;
@media(min-width: 1200px){
margin-top: 20px;
}
}
}
/* Post type: By Category */
.posts-grid-category{
overflow: hidden;
}
.top-blog-info{
padding:25px 0;
margin-bottom:20px;
border-bottom:1px solid $border-color;
i{
@include rtl-margin-right(10px);
}
.categories{
@include rtl-margin-right(35px);
}
.author{
a{
color: $theme-color;
}
}
a{
color: $text-color;
&:hover,&:active{
color:$theme-color;
}
}
}
.list-default{
margin-bottom:45px;
.entry-title{
font-weight: 500;
font-size: 30px;
margin:0 0 10px;
}
.description{
margin:0 0 15px;
}
}
.category-posts{
position: relative;
&::after{
content: "";
top: 20px;
position: absolute;
@include rtl-right(0);
@include size(1px,1000px);
background: $border-color;
}
.post{
border-bottom: 1px solid $border-color;
}
.category-posts-label{
padding: 1px 3px;
@include border-radius(0);
background: $theme-color;
font-weight: $category-posts-label-font-weight;
@include font-size(font-size,$category-posts-label-font-size);
text-transform: $category-posts-label-transform;
a{
color: $category-posts-label-color;
}
}
.entry-meta{
&::after{
display: none;
}
}
.posts-more{
.post{
&:last-child{
border: 0px;
}
}
.entry-title{
@include font-size(font-size,$category-posts-subtitle-font-size);
a{
color: $gray-light;
&:hover{
color: $theme-color;
}
}
}
}
}
/*------------------------------------*\
Post detail
\*------------------------------------*/
.sharebox{
margin-bottom: $post-share-margin;
.sharebox-title{
margin: $post-share-title-margin;
}
}
.top-info-detail{
position:relative;
&.post-layout .bottom-info a.blog-time:before {
line-height: 26px;
}
}
.entry-title-detail{
color: $theme-color-secondary;
font-size: 24px;
margin:0 0 15px;
word-wrap: break-word;
text-transform: none;
@media(min-width: 1200px){
font-size: 32px;
font-weight: 500;
}
}
.social-networks{
li{
padding-left: 10px;
padding-right: 10px;
&:last-child{
a{
margin-right: 0;
}
}
a{
font-size: 14px;
&:hover{
color: $theme-color;
}
}
}
}
.tag-links,
.post-share {
margin-bottom: 10px;
span i {
@include rtl-margin-right(5px);
}
}
/*------------------------------------*\
Comment List
\*------------------------------------*/
#respond{
.title{
margin:0 0 5px;
}
}
.comment-list{
padding:0;
margin: 0 0 30px 0;
list-style: none;
li.comment{
border-top: 1px solid $border-color;
padding-top: 30px;
margin-top: 30px;
&:last-child {
}
}
.comment-respond{
padding-bottom:10px;
}
#cancel-comment-reply-link{
color:$theme-color;
}
.comment-author{
strong {
font-style:normal;
}
}
.children{
list-style: none;
margin: 0;
@include rtl-padding-left(100px);
}
div.avatar{
min-width: 100px;
@include rtl-padding-right(30px);
@include rtl-float-left();
}
.comment-edit-link{
color:$theme-color;
font-size:14px;
@include rtl-margin-left(5px);
}
.date{
color: #666;
font-size:12px;
text-transform: uppercase;
letter-spacing: 0.01em;
}
strong {
font-size: 16px;
color:$headings-color;
font-weight: 500;
}
.comment-reply-link{
font-size:15px;
color:$theme-color;
position: absolute;
top: 0;
right:0;
@include transition(all 0.2s ease-in-out 0s);
&:before{
content: "\e6bd";
font-family: "themify";
font-size:13px;
vertical-align:unset;
@include rtl-margin-right(0);
}
&:hover,&:active{
color:darken($theme-color, 15%);
}
}
.comment-box{
overflow:hidden;
position: relative;
}
.comment-text{
margin: 0 0 10px;
p:last-child{
margin:0;
}
}
img.avatar{
@include size(70px,70px);
overflow:hidden;
@include border-radius(50%);
}
.the-comment{
padding: 0;
@media(min-width:992px){
padding: 0;
}
}
}
.commentform {
.title{
color: $theme-color-secondary;
margin: 0;
font-size: 26px;
font-weight: 600;
}
.comment-notes{
display: none;
}
}
.comment-form{
#submit{
text-transform: none;
}
}
.post-navigation{
a{
color: $text-color;
&:hover,&:active{
color: $link-color;
}
}
.navi{
display: block;
float: none;
width: 100%;
margin: 0;
font-size: 14px;
i{
font-size: 12px;
@include rtl-margin-right(5px);
}
}
.post-title{
font-size: 16px;
font-weight:700;
margin:10px 0 0;
display: block;
}
.nav-next{
.navi i{
@include rtl-margin-right(0);
@include rtl-margin-left(5px);
}
}
}
/*------------------------------------*\
Single post
\*------------------------------------*/
.detail-post{
.entry-title-detail{
margin: 0 0 20px;
}
iframe {
max-width: 100%;
}
.top-info{
font-size:14px;
margin:0 0 15px;
@media(max-width:767px){
font-size:13px;
margin:0 0 10px;
}
a, span{
color:$theme-color-third;
margin: 0;
position: relative;
&:hover,&:focus{
color: $theme-color;
}
// &.blog-time:before {
// content: "/";
// color: $theme-color-secondary;
// @include rtl-right(-15px);
// padding: 0;
// position: absolute;
// font-size: 14px;
// font-weight: 100;
// line-height: 20px;
// }
}
.blog-time,
span {
@include rtl-margin-right(5px);
@media(min-width: 1200px){
@include rtl-margin-right(15px);
}
}
i{
color:$theme-color;
@include rtl-margin-right(5px);
}
> *{
display: inline-block;
vertical-align: middle;
@include rtl-margin-right(15px);
&:last-child{
@include rtl-margin-right(0);
}
}
}
.entry-thumb {
position: relative;
margin-bottom: 0;
@include border-radius(0) ;
overflow: hidden;
&.no-thumb{
margin:0;
+ .top-info {
position: static;
}
.list-categories {
}
}
.list-categories {
}
}
.related-posts .entry-thumb {
margin: 0;
}
.entry-content-detail {
margin: 0 0 30px;
background-color: #fff;
padding: 30px;
border-width: 1px;
border-style: solid;
border-color: $border-color;
@include border-radius(0);
@media(max-width:767px){
padding: 15px;
margin: 0 0 15px;
}
.wp-block-gallery{
margin-bottom: 20px;
}
.list-categories {
position: relative;
@include rtl-margin-left(15px);
&:before {
content: "\e617";
font-family: "themify";
color: $theme-color;
@include rtl-left(-15px);
padding: 0;
position: absolute;
font-size: 14px;
font-weight: 100;
line-height: 20px;
}
a{
margin:0;
display: inline-block;
float: none;
+ a{
&:before{
content:',';
@include rtl-margin-right(5px);
}
}
}
}
}
.font-second{
font-size: 24px;
margin: 0 0 20px;
}
.goal-social-share{
margin-top: 0;
.title{
@include rtl-margin-right(15px);
font-weight: 600;
color: $link-color;
}
a{
color:$text-color;
font-size:14px;
@include rtl-margin-right(10px);
@media(min-width:1200px){
@include rtl-margin-right(15px);
}
// &:last-child{
// margin: 0;
// }
&:hover,&:active{
color: $link-color;
}
}
}
.tag-social{
margin-bottom: 0;
border-top: 1px solid $border-color;
padding-top: 15px;
display: inline-flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
margin-top: 0;
width: 100%;
@media(min-width:992px){
padding: 30px 0 0;
}
@media(max-width:767px){
padding-bottom: 0;
}
strong{
@include rtl-margin-right(15px);
font-weight: 600;
color: $link-color;
}
}
.entry-tags-list{
strong{
}
a{
font-size: 13px;
text-transform:none;
padding: 5px 15px;
color: $theme-color-secondary;
font-weight: 400;
display: inline-block;
@include transition(all 0.2s ease-in-out 0s);
@include rtl-margin-right(10px);
margin-bottom:5px;
@include border-radius(3px);
background-color: #f1f1f1;
border: 1px solid #f1f1f1;
@media(min-width:767px){
font-size: 13px;
padding: 5px 20px;
}
&:hover,&:active{
color: #fff;
border-color:$theme-color;
background:$theme-color;
}
}
}
.post-navigation{
margin: 0 0 30px;
padding-top:0;
background-color: #fff;
@media(max-width:767px){
margin: 0 0 15px;
}
}
.nav-links{
.navi{
font-size: 16px;
color: $theme-color-secondary;
&:hover,&:active{
color: $theme-color;
}
i{
line-height: 1;
vertical-align: middle;
font-size: 42px;
}
}
}
.entry-content-detail .entry-title{
font-size:28px;
font-weight: 400;
margin:0 0 5px;
}
.sub-title{
font-size:21px;
}
#comments{
padding:0;
border:0;
#reply-title{
// margin: 0 !important;
}
.comment-list-wrap {
background-color: #fff;
@include border-radius(0);
border: 1px solid $border-color;
padding: 30px;
margin: 0 0 20px;
@media(max-width:767px){
padding: 15px;
}
}
.comment-list .comment-text {
margin: 15px 0 10px;
background-color: #f5f5f5;
padding: 10px;
border-radius: 5px;
border: 1px solid #ebebeb;
box-sizing: border-box;
}
.comments-title{
font-size: 22px;
margin: 0 0 25px;
}
}
}
//post-navigation
.post-navigation{
position: relative;
.screen-reader-text{
display: none;
}
.nav-links{
overflow: hidden;
display: flex;
flex-wrap: wrap;
> a {
@include transition(all 0.3s ease-in-out 0s);
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
line-height: 24px;
padding: 20px;
border: 1px solid $border-color;
@include border-radius(0);
@media(min-width:767px){
width: 50%;
}
+a {
margin: -1px 0 0;
@media(min-width:767px){
border-left: 0;
margin: 0;
@include border-radius(0);
}
>div {
@media(min-width:767px){
flex-direction: row-reverse;
}
img {
@media(min-width:767px){
margin-left: 20px;
margin-right: 0;
}
}
.meta-nav {
@media(min-width:767px){
justify-content: flex-end;
}
&::before{
display: none;
}
&::after{
content: "\e649";
font-family:'themify';
padding-left: 3px;
font-size: 14px;
}
}
.wrapper-title-meta {
@media(min-width:767px){
text-align: right;
}
}
}
}
.wrapper-title-meta {
padding: 15px 0;
}
img {
margin-right: 20px;
margin-left: 0;
}
}
.media {
display: flex;
align-items: flex-start;
overflow: hidden;
}
.meta-nav{
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
align-items: center;
line-height: 17px;
position: relative;
text-transform: uppercase;
font-size: 14px;
&::before{
color: #666 !important;
display: inline-block;
content: "\e64a";
font-family:'themify';
padding-right: 3px;
font-size: 14px;
}
}
.post-title {
color: $theme-color-secondary;
font-weight: 700;
display: block;
-ms-word-wrap: break-word;
word-wrap: break-word;
font-size: 15px;
line-height: 20px;
padding-top: 0;
&:hover{
color: $theme-color;
}
}
}
}
.author-info{
padding:20px 0;
@media(min-width:992px){
padding:40px 0;
}
border-top:1px solid $border-color;
.author-title{
font-size: 18px;
font-weight:400;
margin:0 0 5px;
}
.avatar-img {
@include rtl-padding-right(20px);
.avatar {
overflow: hidden;
max-width: none;
}
}
}
//related-posts
.related-posts{
padding: 0;
margin: 30px 0 0;
.post-grid-v3 {
.post-info {
}
.content{
.list-categories {
}
}
}
.title{
margin: 0 0 15px;
font-size: 28px;
text-transform: capitalize;
@media(min-width:1200px){
font-size: 36px;
margin: 0 0 25px;
}
}
}
.blog-post-icon{
display: table;
color: $white;
text-align: center;
position: absolute;
top: 0;
z-index: 1;
background: $theme-color;
@include opacity(0.9);
@include rtl-left(0);
@include square(50px);
.fa{
display: table-cell;
vertical-align: middle;
font-size: 22px;
}
}
/*------------------------------------*\
Blog Masonry Page
\*------------------------------------*/
.blog-masonry{
.entry-thumb{
margin-bottom: 0;
}
}
// post gallery
.gallery{
margin-left: -($theme-margin / 2);
margin-right: -($theme-margin / 2);
overflow: hidden;
.gallery-item{
@include rtl-float-left();
margin-bottom:($theme-margin / 2);
padding-right: ($theme-margin / 2);
padding-left: ($theme-margin / 2);
position: relative;
figcaption{
position: absolute;
left: 0;
bottom: 0;
width: 100%;
color: #fff;
max-height: 50%;
font-size: 12px;
background: rgba(0,0,0,0.5);
margin-left: ($theme-margin / 2);
margin-right: ($theme-margin / 2);
@include opacity(0);
padding:8px ($theme-margin / 2);
}
&:hover{
figcaption{
@include opacity(1);
}
}
}
&.gallery-columns-9{
.gallery-item{
width: 33.33%;
@media(min-width: 768px){
width: 11%;
}
}
}
&.gallery-columns-8{
.gallery-item{
width: 33.33%;
@media(min-width: 768px){
width: 12.5%;
}
}
}
&.gallery-columns-7{
.gallery-item{
width: 33.33%;
@media(min-width: 768px){
width: 14%;
}
}
}
&.gallery-columns-6{
.gallery-item{
width: 33.33%;
@media(min-width: 768px){
width: 16.66%;
}
}
}
&.gallery-columns-5{
.gallery-item{
width: 20%;
}
}
&.gallery-columns-4{
.gallery-item{
width: 25%;
}
}
&.gallery-columns-3{
.gallery-item{
width: 33%;
}
}
&.gallery-columns-1{
.gallery-item{
width: 100%;
}
}
&.gallery-columns-2{
.gallery-item{
width: 50%;
}
}
}
// post cover
.wp-block-cover-image h1:not(.has-text-color), .wp-block-cover-image h2:not(.has-text-color),
.wp-block-cover-image h3:not(.has-text-color), .wp-block-cover-image h4:not(.has-text-color),
.wp-block-cover-image h5:not(.has-text-color), .wp-block-cover-image h6:not(.has-text-color),
.wp-block-cover-image p:not(.has-text-color), .wp-block-cover h1:not(.has-text-color),
.wp-block-cover h2:not(.has-text-color), .wp-block-cover h3:not(.has-text-color), .wp-block-cover h4:not(.has-text-color),
.wp-block-cover h5:not(.has-text-color), .wp-block-cover h6:not(.has-text-color), .wp-block-cover p:not(.has-text-color) {
color: #fff;
}
.wp-block-cover, .wp-block-cover-image {
margin: 0 0 10px;
}
// post button
.wp-block-button {
margin: 0 0 10px;
&.aligncenter{
// .wp-block-button__link {
// padding: 20px 70px;
// }
}
&.is-style-squared{
.wp-block-button__link{
@include border-radius(0);
}
}
}
// navigation
.comment-navigation{
overflow: hidden;
padding: 20px 0;
.nav-links{
> div{
display: inline-block;
+ div{
line-height: 1.1;
@include rtl-margin-left($theme-margin / 2);
@include rtl-padding-left($theme-margin / 2);
@include rtl-border-left(2px solid $border-color);
}
}
}
}
.list-check{
list-style: none;
padding:0;
margin:0;
li{
margin-bottom: 10px;
}
i{
color: $theme-color;
@include rtl-margin-right(10px);
}
}
.author-post{
.avatar {
@include border-radius(50%);
}
.avatar-img{
@include rtl-float-left();
@include rtl-padding-right(8px);
}
.name-author{
display:inline-block;
margin-top:9px;
}
}
Back to Directory
File Manager