Merge branch 'feature/fix-assessments' of github.com:Yoast/wordpress-…

…seo into ai-fixes-buttons-in-the-sidebar-go-blank
Yoast · Jun 18, 2024 · f198a9d · f198a9d
2 parents 08df467 + 4041cc8
commit f198a9d
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 13 deletions.
diff --git a/packages/components/src/AIFixesButton.js b/packages/components/src/AIFixesButton.js
@@ -7,23 +7,23 @@ const yoastPrimary100 = "#F3E5ED";
 const yoastPrimary300 = "#CD82AB";
 const yoastPrimary400 = "#B94986";
 const yoastPrimary500 = "#A61E69";
-const blue50 = "#EFF6FF";
-const blue100 = "#DBEAFE";
-const blue300 = "#93C5FD";
-const blue500 = "#3B82F6";
+const yoastIndigo50 = "#EEF2FF";
+const yoastIndigo100 = "#E0E7FF";
+const yoastIndigo300 = "#A5B4FC";
+const yoastIndigo500 = "#6366F1";
 
 const direction = "to bottom right";
 
 const gradientEffect = {
-	defaultStateBackground: `linear-gradient(${direction}, ${yoastPrimary50}, ${blue50})`,
-	defaultStateBorder: `linear-gradient(${direction}, ${yoastPrimary300}, ${blue300}) 1`,
-	hoverStateBackground: `linear-gradient(${direction}, ${yoastPrimary100}, ${blue100})`,
-	pressedStateBackground: `linear-gradient(${direction}, ${yoastPrimary500}, ${blue500})`,
+	defaultStateBackground: `linear-gradient(${direction}, ${yoastPrimary50}, ${yoastIndigo50})`,
+	defaultStateBorder: `linear-gradient(${direction}, ${yoastPrimary300}, ${yoastIndigo300}) 1`,
+	hoverStateBackground: `linear-gradient(${direction}, ${yoastPrimary100}, ${yoastIndigo100})`,
+	pressedStateBackground: `linear-gradient(${direction}, ${yoastPrimary500}, ${yoastIndigo500})`,
 };
 
 const AIFixesButtonBase = styled( IconButtonBase )`
 	overflow: hidden;
-	border: ${ props => props.pressed ? "none" : "1px solid #A5B4FC" }; /*indigo-300*/
+	border: ${ props => props.pressed ? "none" : `1px solid ${yoastIndigo300}` }; /*indigo-300*/
 	background-image: ${ props => props.pressed
 		? gradientEffect.pressedStateBackground
 		: gradientEffect.defaultStateBackground } !important;

diff --git a/packages/components/tests/__snapshots__/IconAIFixesButtonTest.js.snap b/packages/components/tests/__snapshots__/IconAIFixesButtonTest.js.snap
@@ -35,12 +35,12 @@ exports[`the pressed IconAIFixesButton matches the snapshot 1`] = `
 .c1 {
   overflow: hidden;
   border: none;
-  background-image: linear-gradient(to bottom right,#A61E69,#3B82F6) !important;
+  background-image: linear-gradient(to bottom right,#A61E69,#6366F1) !important;
   box-shadow: inset 0 -2px 0 #B94986;
 }
 
 .c1:hover {
-  background-image: linear-gradient(to bottom right,#A61E69,#3B82F6) !important;
+  background-image: linear-gradient(to bottom right,#A61E69,#6366F1) !important;
 }
 
 <button
@@ -91,12 +91,12 @@ exports[`the unpressed IconAIFixesButton matches the snapshot 1`] = `
 .c1 {
   overflow: hidden;
   border: 1px solid #A5B4FC;
-  background-image: linear-gradient(to bottom right,#FAF3F7,#EFF6FF) !important;
+  background-image: linear-gradient(to bottom right,#FAF3F7,#EEF2FF) !important;
   box-shadow: 0 1px 0 rgba( 204,204,204,0.7 );
 }
 
 .c1:hover {
-  background-image: linear-gradient(to bottom right,#F3E5ED,#DBEAFE) !important;
+  background-image: linear-gradient(to bottom right,#F3E5ED,#E0E7FF) !important;
 }
 
 <button