Browse Source

Sophisticated Business 1.2 - fixes entry meta structure.
Closes #806

Jeffrey Pearce 6 năm trước cách đây
mục cha
commit
8fb1001f9b

+ 9 - 29
sophisticated-business/sass/navigation/_next-previous.scss

@@ -3,37 +3,30 @@
 // Singular navigation
 .post-navigation {
 
-	margin: calc(3 * 1rem) 0;
+	margin: calc(3 * #{ $size__spacing-unit}) $size__spacing-unit $size__spacing-unit;
 
 	@include media(tablet) {
-		margin: calc(3 * 1rem) auto;
-		max-width: calc(6 * (100vw / 12));
+		margin: calc(3 * 1rem) auto calc(1rem / 2);
+		max-width: $size__site-tablet-content;
 	}
 
 	@include media(desktop) {
-		margin: calc(3 * 1rem) 0;
-		max-width: 100%;
+		max-width: $size__site-desktop-content;
 	}
 
 	.nav-links {
-		margin: 0 $size__spacing-unit;
+
 		max-width: 100%;
 		display: flex;
 		flex-direction: column;
 
 		@include media(tablet) {
-			margin: 0;
-		}
-
-		@include media(desktop) {
 			flex-direction: row;
-			margin: 0 auto;
-			max-width: $size__site-desktop-content;
 		}
 
 		a {
 			.meta-nav {
-				color: $color__text-light;
+				color: $color__text-main;
 				user-select: none;
 
 				&:before,
@@ -41,7 +34,7 @@
 					display: none;
 					content: "—";
 					width: 2em;
-					color: $color__text-light;
+					color: $color__text-main;
 					height: 1em;
 				}
 			}
@@ -55,21 +48,9 @@
 			}
 		}
 
-		.nav-previous,
-		.nav-next {
-
-			@include media(desktop) {
-				min-width: calc(50% - 2 * #{$size__spacing-unit});
-			}
-		}
-
 		.nav-previous {
 			order: 2;
 
-			@include media(desktop) {
-				order: 1;
-			}
-
 			+ .nav-next {
 				margin-bottom: $size__spacing-unit;
 			}
@@ -82,11 +63,10 @@
 		}
 
 		.nav-next {
-			order: 1;
-
-			@include media(desktop) {
+			@include media(tablet) {
 				order: 2;
 				padding-left: $size__spacing-unit;
+				margin-left: auto;
 			}
 
 			.meta-nav {

+ 6 - 2
sophisticated-business/sass/site/primary/_posts-and-pages.scss

@@ -36,9 +36,13 @@
 		text-align: center;
 
 		@include media(tablet) {
-			max-width: $size__site-desktop-content;
+			max-width: $size__site-tablet-content;
 			margin: calc(3 * #{ $size__spacing-unit}) auto auto;
 		}
+
+		@include media(desktop) {
+			max-width: $size__site-desktop-content;
+		}
 	}
 
 	.entry-title {
@@ -103,7 +107,7 @@
 			max-width: $size__site-tablet-content;
 		}
 
-		@include media(tablet) {
+		@include media(desktop) {
 			max-width: $size__site-desktop-content;
 		}
 	}

+ 11 - 6
sophisticated-business/style-rtl.css

@@ -7,7 +7,7 @@ Author URI: https://automattic.com/
 Template: twentynineteen
 Description: Your classy establishment needs an equally classy website to showcase your delicious food and special concoctions! With its bold typography and chic color scheme, Sophisticated Business exudes the same cool, intimate atmosphere as an upscale bar, lounge, or pub.
 Requires at least: WordPress 4.9.6
-Version: 1.1
+Version: 1.2
 License: GNU General Public License v2 or later
 License URI: LICENSE
 Text Domain: sophisticated-business
@@ -1623,14 +1623,13 @@ body.page .main-navigation {
 @media only screen and (min-width: 768px) {
   .post-navigation {
     margin: calc(3 * 1rem) auto;
-    max-width: calc(6 * (100vw / 12));
+    max-width: calc(8 * (100vw / 12) - 28px);
   }
 }
 
 @media only screen and (min-width: 1168px) {
   .post-navigation {
-    margin: calc(3 * 1rem) 0;
-    max-width: 100%;
+    max-width: calc(6 * (100vw / 12) - 28px);
   }
 }
 
@@ -2339,11 +2338,17 @@ body.page .main-navigation {
 
 @media only screen and (min-width: 768px) {
   .entry .entry-header {
-    max-width: calc(6 * (100vw / 12) - 28px);
+    max-width: calc(8 * (100vw / 12) - 28px);
     margin: calc(3 * 1rem) auto auto;
   }
 }
 
+@media only screen and (min-width: 1168px) {
+  .entry .entry-header {
+    max-width: calc(6 * (100vw / 12) - 28px);
+  }
+}
+
 .entry .entry-title {
   margin: 0;
 }
@@ -2409,7 +2414,7 @@ body.page .main-navigation {
   }
 }
 
-@media only screen and (min-width: 768px) {
+@media only screen and (min-width: 1168px) {
   .entry .entry-footer {
     max-width: calc(6 * (100vw / 12) - 28px);
   }

+ 17 - 37
sophisticated-business/style.css

@@ -7,7 +7,7 @@ Author URI: https://automattic.com/
 Template: twentynineteen
 Description: Your classy establishment needs an equally classy website to showcase your delicious food and special concoctions! With its bold typography and chic color scheme, Sophisticated Business exudes the same cool, intimate atmosphere as an upscale bar, lounge, or pub.
 Requires at least: WordPress 4.9.6
-Version: 1.1
+Version: 1.2
 License: GNU General Public License v2 or later
 License URI: LICENSE
 Text Domain: sophisticated-business
@@ -1617,46 +1617,36 @@ body.page .main-navigation {
 --------------------------------------------------------------*/
 /* Next/Previous navigation */
 .post-navigation {
-  margin: calc(3 * 1rem) 0;
+  margin: calc(3 * 1rem) 1rem 1rem;
 }
 
 @media only screen and (min-width: 768px) {
   .post-navigation {
-    margin: calc(3 * 1rem) auto;
-    max-width: calc(6 * (100vw / 12));
+    margin: calc(3 * 1rem) auto calc(1rem / 2);
+    max-width: calc(8 * (100vw / 12) - 28px);
   }
 }
 
 @media only screen and (min-width: 1168px) {
   .post-navigation {
-    margin: calc(3 * 1rem) 0;
-    max-width: 100%;
+    max-width: calc(6 * (100vw / 12) - 28px);
   }
 }
 
 .post-navigation .nav-links {
-  margin: 0 1rem;
   max-width: 100%;
   display: flex;
   flex-direction: column;
 }
 
 @media only screen and (min-width: 768px) {
-  .post-navigation .nav-links {
-    margin: 0;
-  }
-}
-
-@media only screen and (min-width: 1168px) {
   .post-navigation .nav-links {
     flex-direction: row;
-    margin: 0 auto;
-    max-width: calc(6 * (100vw / 12) - 28px);
   }
 }
 
 .post-navigation .nav-links a .meta-nav {
-  color: #cccccc;
+  color: #fff;
   -webkit-user-select: none;
      -moz-user-select: none;
       -ms-user-select: none;
@@ -1667,7 +1657,7 @@ body.page .main-navigation {
   display: none;
   content: "—";
   width: 2em;
-  color: #cccccc;
+  color: #fff;
   height: 1em;
 }
 
@@ -1681,23 +1671,10 @@ body.page .main-navigation {
   color: #b59439;
 }
 
-@media only screen and (min-width: 1168px) {
-  .post-navigation .nav-links .nav-previous,
-  .post-navigation .nav-links .nav-next {
-    min-width: calc(50% - 2 * 1rem);
-  }
-}
-
 .post-navigation .nav-links .nav-previous {
   order: 2;
 }
 
-@media only screen and (min-width: 1168px) {
-  .post-navigation .nav-links .nav-previous {
-    order: 1;
-  }
-}
-
 .post-navigation .nav-links .nav-previous + .nav-next {
   margin-bottom: 1rem;
 }
@@ -1706,14 +1683,11 @@ body.page .main-navigation {
   display: inline;
 }
 
-.post-navigation .nav-links .nav-next {
-  order: 1;
-}
-
-@media only screen and (min-width: 1168px) {
+@media only screen and (min-width: 768px) {
   .post-navigation .nav-links .nav-next {
     order: 2;
     padding-left: 1rem;
+    margin-left: auto;
   }
 }
 
@@ -2345,11 +2319,17 @@ body.page .main-navigation {
 
 @media only screen and (min-width: 768px) {
   .entry .entry-header {
-    max-width: calc(6 * (100vw / 12) - 28px);
+    max-width: calc(8 * (100vw / 12) - 28px);
     margin: calc(3 * 1rem) auto auto;
   }
 }
 
+@media only screen and (min-width: 1168px) {
+  .entry .entry-header {
+    max-width: calc(6 * (100vw / 12) - 28px);
+  }
+}
+
 .entry .entry-title {
   margin: 0;
 }
@@ -2415,7 +2395,7 @@ body.page .main-navigation {
   }
 }
 
-@media only screen and (min-width: 768px) {
+@media only screen and (min-width: 1168px) {
   .entry .entry-footer {
     max-width: calc(6 * (100vw / 12) - 28px);
   }

+ 1 - 1
sophisticated-business/style.scss

@@ -6,7 +6,7 @@ Author URI: https://automattic.com/
 Template: twentynineteen
 Description: Your classy establishment needs an equally classy website to showcase your delicious food and special concoctions! With its bold typography and chic color scheme, Sophisticated Business exudes the same cool, intimate atmosphere as an upscale bar, lounge, or pub.
 Requires at least: WordPress 4.9.6
-Version: 1.1
+Version: 1.2
 License: GNU General Public License v2 or later
 License URI: LICENSE
 Text Domain: sophisticated-business