fix: Increase visibility for the plan selection button

mozilla · Dec 17, 2024 · a6d6b70 · a6d6b70
1 parent 34f53a5
commit a6d6b70
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 1 deletion.
diff --git a/...r/(dashboard)/dashboard/fix/data-broker-profiles/automatic-remove/AutomaticRemoveView.tsx b/...r/(dashboard)/dashboard/fix/data-broker-profiles/automatic-remove/AutomaticRemoveView.tsx
@@ -248,7 +248,7 @@ export function AutomaticRemoveView(props: Props) {
                     )}
               </span>
               <Button
-                variant="primary"
+                variant="secondary"
                 /* c8 ignore start */
                 onPress={() => {
                   selectedPlanIsYearly

diff --git a/...cated)/user/(dashboard)/dashboard/fix/data-broker-profiles/dataBrokerProfiles.module.scss b/...cated)/user/(dashboard)/dashboard/fix/data-broker-profiles/dataBrokerProfiles.module.scss
@@ -197,6 +197,18 @@
       font: $text-title-sm;
       font-weight: 500;
     }
+
+    // Invert color for the plan selection CTA to increase visibility
+    // against the purple background.
+    & > a {
+      color: $color-white;
+      box-shadow: inset 0 0 0 2px $color-white;
+
+      &:hover {
+        background-color: $color-white;
+        color: $color-purple-70;
+      }
+    }
   }
 }