Calm Business: More style for Posts List block

calm-business/sass/blocks/_blocks.scss

@@ -1005,7 +1005,7 @@
 		color: #FFF;
 	}
 
-	/* Posts List */
+	//! Posts List
 	.a8c-posts-list-item__title,
 	.a8c-posts-list-item__meta {
 		a {

calm-business/style-rtl.css

@@ -3581,10 +3581,6 @@ body.page .main-navigation {
   }
 }
 
-.entry .entry-content {
-  /* Posts List */
-}
-
 .entry .entry-content p.has-background {
   padding: 20px 30px;
 }
@@ -4572,6 +4568,154 @@ body.page .main-navigation {
   color: #FAF8F5;
 }
 
+.entry .entry-content .a8c-posts-list__item:not(:first-child) {
+  margin-top: calc(6 * 1rem);
+}
+
+.entry .entry-content .a8c-posts-list-item__featured {
+  margin: 0 auto;
+}
+
+.entry .entry-content .a8c-posts-list-item__featured span {
+  background: #8D6708;
+  color: #fff;
+  display: inline-block;
+  font-size: 0.71111em;
+  font-weight: bold;
+  line-height: 1;
+  padding: .25rem;
+  text-transform: uppercase;
+  z-index: 1;
+}
+
+@media only screen and (min-width: 768px) and (min-width: 768px) {
+  .entry .entry-content .a8c-posts-list-item__featured {
+    max-width: calc(8 * (100vw / 12) - 28px);
+  }
+}
+
+@media only screen and (min-width: 768px) and (min-width: 1168px) {
+  .entry .entry-content .a8c-posts-list-item__featured {
+    max-width: calc(6 * (100vw / 12) - 28px);
+  }
+}
+
+.entry .entry-content .a8c-posts-list-item__post-thumbnail {
+  margin-bottom: 32px;
+}
+
+.entry .entry-content .a8c-posts-list-item__post-thumbnail img {
+  display: block;
+}
+
+.entry .entry-content .a8c-posts-list-item__title {
+  font-size: 1.6875em;
+  margin: 0 auto;
+}
+
+@media only screen and (min-width: 768px) and (min-width: 768px) {
+  .entry .entry-content .a8c-posts-list-item__title {
+    max-width: calc(8 * (100vw / 12) - 28px);
+  }
+}
+
+@media only screen and (min-width: 768px) and (min-width: 1168px) {
+  .entry .entry-content .a8c-posts-list-item__title {
+    max-width: calc(6 * (100vw / 12) - 28px);
+  }
+}
+
+.entry .entry-content .a8c-posts-list-item__meta {
+  color: #242424;
+  font-size: 0.71111em;
+  margin: 0 auto;
+}
+
+.entry .entry-content .a8c-posts-list-item__meta a {
+  color: #242424;
+}
+
+@media only screen and (min-width: 768px) and (min-width: 768px) {
+  .entry .entry-content .a8c-posts-list-item__meta {
+    max-width: calc(8 * (100vw / 12) - 28px);
+  }
+}
+
+@media only screen and (min-width: 768px) and (min-width: 1168px) {
+  .entry .entry-content .a8c-posts-list-item__meta {
+    max-width: calc(6 * (100vw / 12) - 28px);
+  }
+}
+
+.entry .entry-content .a8c-posts-list-item__edit-link {
+  transition: background 150ms ease-in-out;
+  background: #8D6708;
+  border-radius: 3px;
+  font-family: "Poppins", sans-serif;
+  font-weight: 700;
+  margin-right: calc(.5 * 1rem);
+  padding: .05rem .4rem;
+}
+
+.entry .entry-content .a8c-posts-list-item__edit-link:hover, .entry .entry-content .a8c-posts-list-item__edit-link:focus {
+  background: #111;
+  cursor: pointer;
+}
+
+.entry .entry-content .a8c-posts-list-item__excerpt {
+  margin: 0 auto;
+}
+
+@media only screen and (min-width: 768px) {
+  .entry .entry-content .a8c-posts-list-item__excerpt {
+    max-width: calc(8 * (100vw / 12) - 28px);
+  }
+}
+
+@media only screen and (min-width: 1168px) {
+  .entry .entry-content .a8c-posts-list-item__excerpt {
+    max-width: calc(6 * (100vw / 12) - 28px);
+  }
+}
+
+.entry .entry-content .a8c-posts-list-item__excerpt p {
+  margin: 32px 0;
+}
+
+.entry .entry-content .a8c-posts-list__view-all {
+  transition: background 150ms ease-in-out;
+  background: #8D6708;
+  border: none;
+  border-radius: 5px;
+  box-sizing: border-box;
+  color: #FAF8F5;
+  display: inline-block;
+  font-family: "Poppins", sans-serif;
+  font-size: 0.88889em;
+  font-weight: 700;
+  line-height: 1.2;
+  margin-top: calc(6 * 1rem - 32px);
+  outline: none;
+  padding: 0.76rem 1rem;
+  vertical-align: bottom;
+}
+
+.entry .entry-content .a8c-posts-list__view-all:hover {
+  background: #111;
+  cursor: pointer;
+}
+
+.entry .entry-content .a8c-posts-list__view-all:visited {
+  color: #FAF8F5;
+  text-decoration: none;
+}
+
+.entry .entry-content .a8c-posts-list__view-all:focus {
+  background: #111;
+  outline: thin dotted;
+  outline-offset: -4px;
+}
+
 /* Site Builder */
 /* !Site Builder styles */
 .entry .entry-content .site-builder__header {

calm-business/style.css

@@ -3593,10 +3593,6 @@ body.page .main-navigation {
   }
 }
 
-.entry .entry-content {
-  /* Posts List */
-}
-
 .entry .entry-content p.has-background {
   padding: 20px 30px;
 }