1#@!#!123s

: / home / mihaidwf / justshea.net / wp-content / themes / oceanwp / sass / components / blog /
Filename : _blog-grid.scss
back
@media only screen and (min-width: 481px) and (max-width: 980px) {
  .tablet-col .col.first {
    clear: none;
  }

  .has-blog-grid {
    .blog-grid.oceanwp-row,
    .blog-masonry-grid.oceanwp-row {
      &.tablet-col .col {
        clear: none;
      }

      &.tablet-1-col .blog-entry {
        clear: both;
      }
      &.tablet-2-col .blog-entry:nth-child(2n + 1),
      &.tablet-3-col .blog-entry:nth-child(3n + 1),
      &.tablet-4-col .blog-entry:nth-child(4n + 1),
      &.tablet-5-col .blog-entry:nth-child(5n + 1),
      &.tablet-6-col .blog-entry:nth-child(6n + 1),
      &.tablet-7-col .blog-entry:nth-child(7n + 1) {
        clear: both;
      }
    }

    .blog-grid,
    .blog-masonry-grid {
      &.tablet-1-col .blog-entry { width: 100% !important; }
      &.tablet-2-col .blog-entry { width: 50% !important; }
      &.tablet-3-col .blog-entry { width: 33.33% !important; }
      &.tablet-4-col .blog-entry { width: 25% !important; }
      &.tablet-5-col .blog-entry { width: 20% !important; }
      &.tablet-6-col .blog-entry { width: 16.66% !important; }
      &.tablet-7-col .blog-entry { width: 14.28% !important; }
    }
  }
}

@media only screen and (max-width: 480px) {
  .mobile-col .col.first {
    clear: none;
  }

  .has-blog-grid {
    .blog-grid.oceanwp-row,
    .blog-masonry-grid.oceanwp-row {
      &.mobile-col .col {
        clear: none;
      }

      &.mobile-1-col .blog-entry {
        clear: both;
      }
      &.mobile-2-col .blog-entry:nth-child(2n + 1),
      &.mobile-3-col .blog-entry:nth-child(3n + 1),
      &.mobile-4-col .blog-entry:nth-child(4n + 1),
      &.mobile-5-col .blog-entry:nth-child(5n + 1),
      &.mobile-6-col .blog-entry:nth-child(6n + 1),
      &.mobile-7-col .blog-entry:nth-child(7n + 1) {
        clear: both;
      }
    }

    .blog-grid,
    .blog-masonry-grid {
      &.mobile-1-col .blog-entry { width: 100% !important; }
      &.mobile-2-col .blog-entry { width: 50% !important; }
      &.mobile-3-col .blog-entry { width: 33.33% !important; }
      &.mobile-4-col .blog-entry { width: 25% !important; }
      &.mobile-5-col .blog-entry { width: 20% !important; }
      &.mobile-6-col .blog-entry { width: 16.66% !important; }
      &.mobile-7-col .blog-entry { width: 14.28% !important; }
    }
  }
}


.blog-entry.grid-entry {
	justify-content: flex-start;

	.blog-entry-inner {
		padding: 0 1.25rem 1.25rem;
		border: 1px solid $color-7;
	}

	.thumbnail {
		margin: 0 -1.25rem;
	}

	.blog-entry-header {
		margin: 1rem 0 1rem;

		.entry-title {
			font-size: 18px;
		}
	}

	.blog-entry-summary {
		line-height: 1.6;
		margin-top: 0.625rem;
	}

	.blog-entry-readmore {
		margin-top: 1rem;

		a {
			display: inline-block;
		    font-size: 12px;
		    line-height: 1.2;
		    padding-bottom: 0.19rem;
		    border-bottom: 1px solid;
		    text-transform: capitalize;

		    i {
		    	margin-left: 0.5rem;
		    }

			svg.owp-icon {
				margin-left: 0.7rem;
			}
		}
	}
}