Selaa lähdekoodia

Merge pull request #1591 from Automattic/fix/rivington-issue-1515

Rivington: Unset measuere variable default
Takashi Irie 5 vuotta sitten
vanhempi
commit
e3c99ba098
3 muutettua tiedostoa jossa 99 lisäystä ja 37 poistoa
  1. 1 1
      rivington/sass/_config-child-theme-deep.scss
  2. 49 18
      rivington/style-rtl.css
  3. 49 18
      rivington/style.css

+ 1 - 1
rivington/sass/_config-child-theme-deep.scss

@@ -100,7 +100,7 @@ $config-global: (
 	/* Spacing */
 	/* Spacing */
 	"spacing": (
 	"spacing": (
 		"unit": (2 * $baseline-unit), // 16px
 		"unit": (2 * $baseline-unit), // 16px
-		"measure": inherit, // Use ch units here. ie: 60ch = 60 character max-width
+		"measure": unset, // Use ch units here. ie: 60ch = 60 character max-width
 		"horizontal": (2 * $baseline-unit), // 16px
 		"horizontal": (2 * $baseline-unit), // 16px
 		"vertical": (4 * $baseline-unit), // 32px matches default spacing in the editor.
 		"vertical": (4 * $baseline-unit), // 32px matches default spacing in the editor.
 	),
 	),

+ 49 - 18
rivington/style-rtl.css

@@ -11,7 +11,7 @@ License: GNU General Public License v2 or later
 License URI: LICENSE
 License URI: LICENSE
 Template: varia
 Template: varia
 Text Domain: rivington
 Text Domain: rivington
-Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, rtl-language-support, sticky-post, threaded-comments, translation-ready, auto-loading-homepage, a8c-global-styles
+Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, rtl-language-support, sticky-post, threaded-comments, translation-ready, auto-loading-homepage, jetpack-global-styles
 
 
 This theme, like WordPress, is licensed under the GPL.
 This theme, like WordPress, is licensed under the GPL.
 Use it to make something cool, have fun, and share what you've learned with others.
 Use it to make something cool, have fun, and share what you've learned with others.
@@ -684,9 +684,7 @@ a {
 .site-header:after,
 .site-header:after,
 .site-content:after,
 .site-content:after,
 .site-footer:after {
 .site-footer:after {
-	content: "";
-	display: table;
-	table-layout: fixed;
+	clear: both;
 }
 }
 
 
 /**
 /**
@@ -696,7 +694,7 @@ a {
 header *,
 header *,
 main *,
 main *,
 footer * {
 footer * {
-	max-width: inherit;
+	max-width: unset;
 }
 }
 
 
 html,
 html,
@@ -1967,6 +1965,10 @@ hr.wp-block-separator {
 		 */
 		 */
 }
 }
 
 
+hr.wp-block-separator:not(.is-style-wide):not(.is-style-dots) {
+	max-width: 96px;
+}
+
 hr.wp-block-separator.is-style-dots:before {
 hr.wp-block-separator.is-style-dots:before {
 	color: #353a46;
 	color: #353a46;
 	font-size: 1.95312rem;
 	font-size: 1.95312rem;
@@ -2056,7 +2058,10 @@ table th,
  */
  */
 .aligncenter {
 .aligncenter {
 	clear: both;
 	clear: both;
+	display: block;
 	float: none;
 	float: none;
+	margin-left: auto;
+	margin-right: auto;
 	text-align: center;
 	text-align: center;
 }
 }
 
 
@@ -3002,36 +3007,43 @@ body:not(.fse-enabled) .footer-menu a {
 	margin-left: calc( $avatar-size + (0.5 * 16px));
 	margin-left: calc( $avatar-size + (0.5 * 16px));
 }
 }
 
 
-@media only screen and (min-width: 560px) {
-	.comment-meta {
-		margin-left: inherit;
-	}
+.comment-meta .comment-author {
+	line-height: 1.125;
+	margin-bottom: 4px;
+	padding-left: 40px;
+	max-width: calc(100% - 48px);
 }
 }
 
 
 @media only screen and (min-width: 560px) {
 @media only screen and (min-width: 560px) {
 	.comment-meta .comment-author {
 	.comment-meta .comment-author {
 		display: flex;
 		display: flex;
 		align-items: center;
 		align-items: center;
+		margin-bottom: 0;
+		padding-left: 0;
 	}
 	}
 }
 }
 
 
+.comment-meta .comment-author .fn {
+	word-wrap: break-word;
+	word-break: break-word;
+	hyphens: auto;
+}
+
 .comment-meta .comment-author .avatar {
 .comment-meta .comment-author .avatar {
 	display: block;
 	display: block;
 	position: absolute;
 	position: absolute;
 	left: 0;
 	left: 0;
 }
 }
 
 
-@media only screen and (min-width: 560px) {
-	.comment-meta .comment-author .avatar {
-		margin-left: 16px;
-		display: inherit;
-		position: inherit;
-		left: inherit;
-	}
-}
-
 .comment-meta .comment-metadata {
 .comment-meta .comment-metadata {
 	color: #f2f2f2;
 	color: #f2f2f2;
+	padding-left: 40px;
+}
+
+@media only screen and (min-width: 560px) {
+	.comment-meta .comment-metadata {
+		padding-left: 0;
+	}
 }
 }
 
 
 .comment-meta .comment-metadata a {
 .comment-meta .comment-metadata a {
@@ -3044,10 +3056,29 @@ body:not(.fse-enabled) .footer-menu a {
 
 
 @media only screen and (min-width: 560px) {
 @media only screen and (min-width: 560px) {
 	.comment-meta {
 	.comment-meta {
+		margin-left: inherit;
 		align-items: center;
 		align-items: center;
 		display: flex;
 		display: flex;
 		justify-content: space-between;
 		justify-content: space-between;
 	}
 	}
+	.comment-meta .comment-author {
+		display: flex;
+		align-items: center;
+		max-width: inherit;
+		flex: 0 1 auto;
+	}
+	.comment-meta .comment-author .fn {
+		padding-left: 16px;
+	}
+	.comment-meta .comment-author .avatar {
+		margin-left: 16px;
+		display: inherit;
+		position: inherit;
+		left: inherit;
+	}
+	.comment-meta .comment-metadata {
+		flex: 0 1 auto;
+	}
 }
 }
 
 
 .comment-metadata,
 .comment-metadata,

+ 49 - 18
rivington/style.css

@@ -11,7 +11,7 @@ License: GNU General Public License v2 or later
 License URI: LICENSE
 License URI: LICENSE
 Template: varia
 Template: varia
 Text Domain: rivington
 Text Domain: rivington
-Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, rtl-language-support, sticky-post, threaded-comments, translation-ready, auto-loading-homepage, a8c-global-styles
+Tags: one-column, flexible-header, accessibility-ready, custom-colors, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, rtl-language-support, sticky-post, threaded-comments, translation-ready, auto-loading-homepage, jetpack-global-styles
 
 
 This theme, like WordPress, is licensed under the GPL.
 This theme, like WordPress, is licensed under the GPL.
 Use it to make something cool, have fun, and share what you've learned with others.
 Use it to make something cool, have fun, and share what you've learned with others.
@@ -684,9 +684,7 @@ a {
 .site-header:after,
 .site-header:after,
 .site-content:after,
 .site-content:after,
 .site-footer:after {
 .site-footer:after {
-	content: "";
-	display: table;
-	table-layout: fixed;
+	clear: both;
 }
 }
 
 
 /**
 /**
@@ -696,7 +694,7 @@ a {
 header *,
 header *,
 main *,
 main *,
 footer * {
 footer * {
-	max-width: inherit;
+	max-width: unset;
 }
 }
 
 
 html,
 html,
@@ -1967,6 +1965,10 @@ hr.wp-block-separator {
 		 */
 		 */
 }
 }
 
 
+hr.wp-block-separator:not(.is-style-wide):not(.is-style-dots) {
+	max-width: 96px;
+}
+
 hr.wp-block-separator.is-style-dots:before {
 hr.wp-block-separator.is-style-dots:before {
 	color: #353a46;
 	color: #353a46;
 	font-size: 1.95312rem;
 	font-size: 1.95312rem;
@@ -2059,7 +2061,10 @@ table th,
  */
  */
 .aligncenter {
 .aligncenter {
 	clear: both;
 	clear: both;
+	display: block;
 	float: none;
 	float: none;
+	margin-right: auto;
+	margin-left: auto;
 	text-align: center;
 	text-align: center;
 }
 }
 
 
@@ -3019,36 +3024,43 @@ body:not(.fse-enabled) .footer-menu a {
 	margin-right: calc( $avatar-size + (0.5 * 16px));
 	margin-right: calc( $avatar-size + (0.5 * 16px));
 }
 }
 
 
-@media only screen and (min-width: 560px) {
-	.comment-meta {
-		margin-right: inherit;
-	}
+.comment-meta .comment-author {
+	line-height: 1.125;
+	margin-bottom: 4px;
+	padding-right: 40px;
+	max-width: calc(100% - 48px);
 }
 }
 
 
 @media only screen and (min-width: 560px) {
 @media only screen and (min-width: 560px) {
 	.comment-meta .comment-author {
 	.comment-meta .comment-author {
 		display: flex;
 		display: flex;
 		align-items: center;
 		align-items: center;
+		margin-bottom: 0;
+		padding-right: 0;
 	}
 	}
 }
 }
 
 
+.comment-meta .comment-author .fn {
+	word-wrap: break-word;
+	word-break: break-word;
+	hyphens: auto;
+}
+
 .comment-meta .comment-author .avatar {
 .comment-meta .comment-author .avatar {
 	display: block;
 	display: block;
 	position: absolute;
 	position: absolute;
 	right: 0;
 	right: 0;
 }
 }
 
 
-@media only screen and (min-width: 560px) {
-	.comment-meta .comment-author .avatar {
-		margin-right: 16px;
-		display: inherit;
-		position: inherit;
-		right: inherit;
-	}
-}
-
 .comment-meta .comment-metadata {
 .comment-meta .comment-metadata {
 	color: #f2f2f2;
 	color: #f2f2f2;
+	padding-right: 40px;
+}
+
+@media only screen and (min-width: 560px) {
+	.comment-meta .comment-metadata {
+		padding-right: 0;
+	}
 }
 }
 
 
 .comment-meta .comment-metadata a {
 .comment-meta .comment-metadata a {
@@ -3061,10 +3073,29 @@ body:not(.fse-enabled) .footer-menu a {
 
 
 @media only screen and (min-width: 560px) {
 @media only screen and (min-width: 560px) {
 	.comment-meta {
 	.comment-meta {
+		margin-right: inherit;
 		align-items: center;
 		align-items: center;
 		display: flex;
 		display: flex;
 		justify-content: space-between;
 		justify-content: space-between;
 	}
 	}
+	.comment-meta .comment-author {
+		display: flex;
+		align-items: center;
+		max-width: inherit;
+		flex: 0 1 auto;
+	}
+	.comment-meta .comment-author .fn {
+		padding-right: 16px;
+	}
+	.comment-meta .comment-author .avatar {
+		margin-right: 16px;
+		display: inherit;
+		position: inherit;
+		right: inherit;
+	}
+	.comment-meta .comment-metadata {
+		flex: 0 1 auto;
+	}
 }
 }
 
 
 .comment-metadata,
 .comment-metadata,