From f07a9d40adc1e566a287e7bf00ea4be169dc91bc Mon Sep 17 00:00:00 2001
From: Jeff Stieler <jeff.m.stieler@gmail.com>
Date: Tue, 4 Jan 2022 13:48:21 -0700
Subject: [PATCH] Fix message display on my account page.

---
 .../legacy/css/twenty-twenty-two.scss         | 78 ++++++++++---------
 1 file changed, 41 insertions(+), 37 deletions(-)

diff --git a/plugins/woocommerce/legacy/css/twenty-twenty-two.scss b/plugins/woocommerce/legacy/css/twenty-twenty-two.scss
index 0de4788d42f..e34fa036061 100644
--- a/plugins/woocommerce/legacy/css/twenty-twenty-two.scss
+++ b/plugins/woocommerce/legacy/css/twenty-twenty-two.scss
@@ -27,6 +27,8 @@
 
 @import "mixins";
 
+$tt2-gray: #f7f7f7;
+
 /**
  * Main layout.
  */
@@ -88,53 +90,55 @@
 		display: none;
 	}
 
-	.woocommerce-notices-wrapper {
+	.woocommerce-message,
+	.woocommerce-error,
+	.woocommerce-info {
+		background: $tt2-gray;
+		border-top-color: var( --wp--preset--color--primary );
+		border-top-style: solid;
+		padding: 1rem 1.5rem;
+		list-style: none;
+		font-size: var(--wp--preset--font-size--small);
 
-		.woocommerce-message,
-		.woocommerce-error,
-		.woocommerce-info {
-			margin-bottom: 5rem;
-			background: #f7f7f7;
-			border-top-color: var( --wp--preset--color--primary );
-			border-top-style: solid;
-			padding: 1rem;
-			list-style: none;
+		&[role='alert']::before {
+			color: var( --wp--preset--color--background );
+			background: var( --wp--preset--color--primary );
+			border-radius: 5rem;
+			font-size: 1rem;
+			padding-left: 3px;
+			padding-right: 3px;
+			margin-right: 1rem;
+		}
 
-			&[role='alert']::before {
-				color: var( --wp--preset--color--background );
-				background: var( --wp--preset--color--primary );
-				border-radius: 5rem;
-				font-size: 1rem;
-				padding-left: 3px;
-				padding-right: 3px;
-				margin-right: 1rem;
-			}
+		a.button {
+			margin-top: -0.5rem;
+			background: #ebe9eb;
+			color: var(--wp--preset--color--black);
 
-			a.button {
-				margin-top: -0.5rem;
-				background: #ebe9eb;
+			&:hover,
+			&:visited {
 				color: var(--wp--preset--color--black);
 			}
 		}
+	}
 
-		.woocommerce-error[role='alert'] {
-			margin: 0;
+	.woocommerce-error[role='alert'] {
+		margin: 0;
 
-			&::before {
-				content: 'X';
-				padding-right: 4px;
-				padding-left: 4px;
-			}
-
-			li {
-				display: inline-block;
-			}
+		&::before {
+			content: 'X';
+			padding-right: 4px;
+			padding-left: 4px;
 		}
 
-		.woocommerce-message {
-			&[role='alert']::before {
-				content: '\2713';
-			}
+		li {
+			display: inline-block;
+		}
+	}
+
+	.woocommerce-message {
+		&[role='alert']::before {
+			content: '\2713';
 		}
 	}