From ab8fd45442e9524c4ada6c773ef0e727661e6bdb Mon Sep 17 00:00:00 2001 From: "Stephen A. Bernhardt" Date: Thu, 17 Feb 2022 15:17:54 -0600 Subject: [PATCH 1/7] Twenty Nineteen: assign max-width for linked images https://core.trac.wordpress.org/ticket/48697 --- .../themes/twentynineteen/sass/blocks/_blocks.scss | 13 +++++++++---- src/wp-content/themes/twentynineteen/style-rtl.css | 14 ++++++++++++-- src/wp-content/themes/twentynineteen/style.css | 14 ++++++++++++-- 3 files changed, 33 insertions(+), 8 deletions(-) diff --git a/src/wp-content/themes/twentynineteen/sass/blocks/_blocks.scss b/src/wp-content/themes/twentynineteen/sass/blocks/_blocks.scss index 806df3a760585..9162cfcd0377d 100644 --- a/src/wp-content/themes/twentynineteen/sass/blocks/_blocks.scss +++ b/src/wp-content/themes/twentynineteen/sass/blocks/_blocks.scss @@ -546,10 +546,13 @@ } // If an image does not have a left/center/right alignment, - // it's a direct child of .wp-block-img. If it has no other - // alignment added, we want to make sure the image does not - // extend beyond the width of the text column. - &:not(.alignwide):not(.alignfull) > img { + // it's a direct child of .wp-block-image. If it has no other + // alignment added, we want to make sure the image and its + // caption do not extend beyond the width of the text column. + &:not(.alignwide):not(.alignfull) > img, + &:not(.alignwide):not(.alignfull) > a > img, + &:not(.alignwide):not(.alignfull) > img + figcaption, + &:not(.alignwide):not(.alignfull) > a + figcaption { @include postContentMaxWidth(); } @@ -803,6 +806,8 @@ } // Ensure images do not expand beyond the column. + .wp-block-image:not(.alignwide):not(.alignfull) > img, + .wp-block-image:not(.alignwide):not(.alignfull) > a > img, .wp-block-image > img:not(.alignwide):not(.alignfull), .wp-block-image > figure { diff --git a/src/wp-content/themes/twentynineteen/style-rtl.css b/src/wp-content/themes/twentynineteen/style-rtl.css index 9382635db7008..10b62e13b4696 100644 --- a/src/wp-content/themes/twentynineteen/style-rtl.css +++ b/src/wp-content/themes/twentynineteen/style-rtl.css @@ -5847,13 +5847,19 @@ body.page .main-navigation { } @media only screen and (min-width: 768px) { - .entry .entry-content .wp-block-image:not(.alignwide):not(.alignfull) > img { + .entry .entry-content .wp-block-image:not(.alignwide):not(.alignfull) > img, + .entry .entry-content .wp-block-image:not(.alignwide):not(.alignfull) > a > img, + .entry .entry-content .wp-block-image:not(.alignwide):not(.alignfull) > img + figcaption, + .entry .entry-content .wp-block-image:not(.alignwide):not(.alignfull) > a + figcaption { max-width: calc(8 * (100vw / 12) - 28px); } } @media only screen and (min-width: 1168px) { - .entry .entry-content .wp-block-image:not(.alignwide):not(.alignfull) > img { + .entry .entry-content .wp-block-image:not(.alignwide):not(.alignfull) > img, + .entry .entry-content .wp-block-image:not(.alignwide):not(.alignfull) > a > img, + .entry .entry-content .wp-block-image:not(.alignwide):not(.alignfull) > img + figcaption, + .entry .entry-content .wp-block-image:not(.alignwide):not(.alignfull) > a + figcaption { max-width: calc(6 * (100vw / 12) - 28px); } } @@ -6181,6 +6187,8 @@ body.page .main-navigation { } @media only screen and (min-width: 768px) { + .entry .entry-content .wp-block-columns .wp-block-image:not(.alignwide):not(.alignfull) > img, + .entry .entry-content .wp-block-columns .wp-block-image:not(.alignwide):not(.alignfull) > a > img, .entry .entry-content .wp-block-columns .wp-block-image > img:not(.alignwide):not(.alignfull), .entry .entry-content .wp-block-columns .wp-block-image > figure { max-width: 100%; @@ -6188,6 +6196,8 @@ body.page .main-navigation { } @media only screen and (min-width: 1168px) { + .entry .entry-content .wp-block-columns .wp-block-image:not(.alignwide):not(.alignfull) > img, + .entry .entry-content .wp-block-columns .wp-block-image:not(.alignwide):not(.alignfull) > a > img, .entry .entry-content .wp-block-columns .wp-block-image > img:not(.alignwide):not(.alignfull), .entry .entry-content .wp-block-columns .wp-block-image > figure { max-width: 100%; diff --git a/src/wp-content/themes/twentynineteen/style.css b/src/wp-content/themes/twentynineteen/style.css index dc2ea1ddb8a0a..73a5ce75e739d 100644 --- a/src/wp-content/themes/twentynineteen/style.css +++ b/src/wp-content/themes/twentynineteen/style.css @@ -5859,13 +5859,19 @@ body.page .main-navigation { } @media only screen and (min-width: 768px) { - .entry .entry-content .wp-block-image:not(.alignwide):not(.alignfull) > img { + .entry .entry-content .wp-block-image:not(.alignwide):not(.alignfull) > img, + .entry .entry-content .wp-block-image:not(.alignwide):not(.alignfull) > a > img, + .entry .entry-content .wp-block-image:not(.alignwide):not(.alignfull) > img + figcaption, + .entry .entry-content .wp-block-image:not(.alignwide):not(.alignfull) > a + figcaption { max-width: calc(8 * (100vw / 12) - 28px); } } @media only screen and (min-width: 1168px) { - .entry .entry-content .wp-block-image:not(.alignwide):not(.alignfull) > img { + .entry .entry-content .wp-block-image:not(.alignwide):not(.alignfull) > img, + .entry .entry-content .wp-block-image:not(.alignwide):not(.alignfull) > a > img, + .entry .entry-content .wp-block-image:not(.alignwide):not(.alignfull) > img + figcaption, + .entry .entry-content .wp-block-image:not(.alignwide):not(.alignfull) > a + figcaption { max-width: calc(6 * (100vw / 12) - 28px); } } @@ -6193,6 +6199,8 @@ body.page .main-navigation { } @media only screen and (min-width: 768px) { + .entry .entry-content .wp-block-columns .wp-block-image:not(.alignwide):not(.alignfull) > img, + .entry .entry-content .wp-block-columns .wp-block-image:not(.alignwide):not(.alignfull) > a > img, .entry .entry-content .wp-block-columns .wp-block-image > img:not(.alignwide):not(.alignfull), .entry .entry-content .wp-block-columns .wp-block-image > figure { max-width: 100%; @@ -6200,6 +6208,8 @@ body.page .main-navigation { } @media only screen and (min-width: 1168px) { + .entry .entry-content .wp-block-columns .wp-block-image:not(.alignwide):not(.alignfull) > img, + .entry .entry-content .wp-block-columns .wp-block-image:not(.alignwide):not(.alignfull) > a > img, .entry .entry-content .wp-block-columns .wp-block-image > img:not(.alignwide):not(.alignfull), .entry .entry-content .wp-block-columns .wp-block-image > figure { max-width: 100%; From 8a9b93e09a71cb4356ea9e0e6f274af1aebe06b5 Mon Sep 17 00:00:00 2001 From: "Stephen A. Bernhardt" Date: Fri, 18 Mar 2022 15:01:24 -0500 Subject: [PATCH 2/7] Twenty Nineteen: override flex order --- src/wp-content/themes/twentynineteen/comments.php | 5 ++--- src/wp-content/themes/twentynineteen/print.css | 1 + src/wp-content/themes/twentynineteen/print.scss | 1 + .../themes/twentynineteen/sass/site/primary/_comments.scss | 5 +++++ src/wp-content/themes/twentynineteen/style.css | 5 +++++ 5 files changed, 14 insertions(+), 3 deletions(-) diff --git a/src/wp-content/themes/twentynineteen/comments.php b/src/wp-content/themes/twentynineteen/comments.php index d00ac46118354..28198e5e7ea41 100644 --- a/src/wp-content/themes/twentynineteen/comments.php +++ b/src/wp-content/themes/twentynineteen/comments.php @@ -101,10 +101,9 @@ // Show comment form at bottom if showing newest comments at the bottom. if ( comments_open() && 'asc' === strtolower( get_option( 'comment_order', 'asc' ) ) ) : ?> -
- +
+

-
Date: Mon, 21 Mar 2022 13:28:29 -0500 Subject: [PATCH 3/7] Restoring print styles and correcting HTML comment The print styles change is unnecessary. The form is already hidden in print with the `.comment-form-flex` selector. Also, the wrong class name was used where the comments title div is closed (above this form). --- src/wp-content/themes/twentynineteen/comments.php | 2 +- src/wp-content/themes/twentynineteen/print.css | 1 - src/wp-content/themes/twentynineteen/print.scss | 1 - 3 files changed, 1 insertion(+), 3 deletions(-) diff --git a/src/wp-content/themes/twentynineteen/comments.php b/src/wp-content/themes/twentynineteen/comments.php index 28198e5e7ea41..9ef3fd6accfd7 100644 --- a/src/wp-content/themes/twentynineteen/comments.php +++ b/src/wp-content/themes/twentynineteen/comments.php @@ -61,7 +61,7 @@ get_template_part( 'template-parts/post/discussion', 'meta' ); } ?> -
+ Date: Mon, 21 Mar 2022 13:41:34 -0500 Subject: [PATCH 4/7] Include RTL stylesheet --- src/wp-content/themes/twentynineteen/style-rtl.css | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/wp-content/themes/twentynineteen/style-rtl.css b/src/wp-content/themes/twentynineteen/style-rtl.css index 10b62e13b4696..113c56b2470e2 100644 --- a/src/wp-content/themes/twentynineteen/style-rtl.css +++ b/src/wp-content/themes/twentynineteen/style-rtl.css @@ -4693,6 +4693,11 @@ body.page .main-navigation { display: block; } +.comment-form-wrapper, +.comment-form-wrapper .comments-title { + display: block; +} + .comment-list { list-style: none; padding: 0; From a1c0ec0af1bb462cc0f4f82ac2485fabe9d23a29 Mon Sep 17 00:00:00 2001 From: "Stephen A. Bernhardt" Date: Mon, 28 Mar 2022 00:11:39 -0500 Subject: [PATCH 5/7] Twenty Nineteen styles: spaces instead of tab --- src/wp-content/themes/twentynineteen/style-rtl.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/wp-content/themes/twentynineteen/style-rtl.css b/src/wp-content/themes/twentynineteen/style-rtl.css index 113c56b2470e2..82c8cb4d79514 100644 --- a/src/wp-content/themes/twentynineteen/style-rtl.css +++ b/src/wp-content/themes/twentynineteen/style-rtl.css @@ -4695,7 +4695,7 @@ body.page .main-navigation { .comment-form-wrapper, .comment-form-wrapper .comments-title { - display: block; + display: block; } .comment-list { From 92a3e2506afae60c671b22c44b0839c2608673ba Mon Sep 17 00:00:00 2001 From: "Stephen A. Bernhardt" Date: Wed, 23 Mar 2022 17:22:08 -0500 Subject: [PATCH 6/7] Add container div and use flex display --- src/wp-admin/css/login.css | 13 +++++++++++++ src/wp-login.php | 12 +++++++----- 2 files changed, 20 insertions(+), 5 deletions(-) diff --git a/src/wp-admin/css/login.css b/src/wp-admin/css/login.css index 1f89db216eda0..64d39b3bf9cd2 100644 --- a/src/wp-admin/css/login.css +++ b/src/wp-admin/css/login.css @@ -125,6 +125,19 @@ p { position: relative; } +.js.login .has-password-toggle { + display: flex; +} + +.js.login .has-password-toggle .password-input { + padding-right: 0.3125rem; +} + +.js.login .has-password-toggle .button.wp-hide-pw { + border-color: inherit; + position: static; +} + .no-js .hide-if-no-js { display: none; } diff --git a/src/wp-login.php b/src/wp-login.php index 45c207d81a679..1b64b0c8c9039 100644 --- a/src/wp-login.php +++ b/src/wp-login.php @@ -941,11 +941,13 @@ function wp_login_viewport_meta() {

- +
+ - + +
@@ -1392,7 +1394,7 @@ function wp_login_viewport_meta() {
-
+
class="input password-input" value="" size="20" autocomplete="current-password" />