From 2991f4c2bcec9ce1e2872ab87fb91ba1513b76d1 Mon Sep 17 00:00:00 2001
From: Dion Hulse <dion@wordpress.org>
Date: Wed, 15 Feb 2023 10:24:31 +1000
Subject: [PATCH] Include whitespace between the leading text and the code
 input. (#519)

* Include whitespace between the leading text and the code input.
* Switch from using <br> to using CSS.
---
 class-two-factor-core.php                   | 3 +++
 providers/class-two-factor-backup-codes.php | 2 +-
 providers/class-two-factor-email.php        | 2 +-
 providers/class-two-factor-totp.php         | 2 +-
 4 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/class-two-factor-core.php b/class-two-factor-core.php
index 20877a07..9d57c16d 100644
--- a/class-two-factor-core.php
+++ b/class-two-factor-core.php
@@ -772,6 +772,9 @@ public static function login_html( $user, $login_nonce, $redirect_to, $error_msg
 			.jetpack-sso-form-display #loginform > div {
 			display: block;
 			}
+			#login form p.two-factor-prompt {
+			margin-bottom: 1em;
+			}
 		</style>
 
 		<?php
diff --git a/providers/class-two-factor-backup-codes.php b/providers/class-two-factor-backup-codes.php
index d4df12ef..76fd5ec2 100644
--- a/providers/class-two-factor-backup-codes.php
+++ b/providers/class-two-factor-backup-codes.php
@@ -327,7 +327,7 @@ public static function codes_remaining_for_user( $user ) {
 	public function authentication_page( $user ) {
 		require_once ABSPATH . '/wp-admin/includes/template.php';
 		?>
-		<p><?php esc_html_e( 'Enter a backup verification code.', 'two-factor' ); ?></p><br/>
+		<p class="two-factor-prompt"><?php esc_html_e( 'Enter a backup verification code.', 'two-factor' ); ?></p>
 		<p>
 			<label for="authcode"><?php esc_html_e( 'Verification Code:', 'two-factor' ); ?></label>
 			<input type="tel" name="two-factor-backup-code" id="authcode" class="input" value="" size="20" pattern="[0-9]*" />
diff --git a/providers/class-two-factor-email.php b/providers/class-two-factor-email.php
index 5946c719..b8566c11 100644
--- a/providers/class-two-factor-email.php
+++ b/providers/class-two-factor-email.php
@@ -266,7 +266,7 @@ public function authentication_page( $user ) {
 
 		require_once ABSPATH . '/wp-admin/includes/template.php';
 		?>
-		<p><?php esc_html_e( 'A verification code has been sent to the email address associated with your account.', 'two-factor' ); ?></p>
+		<p class="two-factor-prompt"><?php esc_html_e( 'A verification code has been sent to the email address associated with your account.', 'two-factor' ); ?></p>
 		<p>
 			<label for="authcode"><?php esc_html_e( 'Verification Code:', 'two-factor' ); ?></label>
 			<input type="tel" name="two-factor-email-code" id="authcode" class="input" value="" size="20" />
diff --git a/providers/class-two-factor-totp.php b/providers/class-two-factor-totp.php
index ac20ae9f..01d4aad0 100644
--- a/providers/class-two-factor-totp.php
+++ b/providers/class-two-factor-totp.php
@@ -638,7 +638,7 @@ public function is_available_for_user( $user ) {
 	public function authentication_page( $user ) {
 		require_once ABSPATH . '/wp-admin/includes/template.php';
 		?>
-		<p>
+		<p class="two-factor-prompt">
 			<?php esc_html_e( 'Please enter the code generated by your authenticator app.', 'two-factor' ); ?>
 		</p>
 		<p>