From 576beb89046a78d9e1777ff15d18e4d703e0f9c8 Mon Sep 17 00:00:00 2001
From: sophiamersmann <sophia.mersmann1@gmail.com>
Date: Tue, 3 Oct 2023 14:59:11 +0000
Subject: [PATCH 1/3] enhance: update designs of injected "Add button" text
 with control appearance

---
 baker/formatWordpressPost.tsx |  6 +++--
 site/css/content.scss         | 44 +++++++++++------------------------
 2 files changed, 17 insertions(+), 33 deletions(-)

diff --git a/baker/formatWordpressPost.tsx b/baker/formatWordpressPost.tsx
index 3e8c3ace037..4ea569ad7ac 100644
--- a/baker/formatWordpressPost.tsx
+++ b/baker/formatWordpressPost.tsx
@@ -266,9 +266,11 @@ export const formatWordpressPost = async (
         /(\+ )?[a|A]dd [c|C]ountry/g,
         `<span class="add-country">
             <span class="icon">
-                <svg width="16" height="16"><path d="M3,8 h10 m-5,-5 v10"></path></svg>
+                <svg viewBox="0 0 512 512">
+                    <path fill="currentColor" d="M410.3 231l11.3-11.3-33.9-33.9-62.1-62.1L291.7 89.8l-11.3 11.3-22.6 22.6L58.6 322.9c-10.4 10.4-18 23.3-22.2 37.4L1 480.7c-2.5 8.4-.2 17.5 6.1 23.7s15.3 8.5 23.7 6.1l120.3-35.4c14.1-4.2 27-11.8 37.4-22.2L387.7 253.7 410.3 231zM160 399.4l-9.1 22.7c-4 3.1-8.5 5.4-13.3 6.9L59.4 452l23-78.1c1.4-4.9 3.8-9.4 6.9-13.3l22.7-9.1v32c0 8.8 7.2 16 16 16h32zM362.7 18.7L348.3 33.2 325.7 55.8 314.3 67.1l33.9 33.9 62.1 62.1 33.9 33.9 11.3-11.3 22.6-22.6 14.5-14.5c25-25 25-65.5 0-90.5L453.3 18.7c-25-25-65.5-25-90.5 0zm-47.4 168l-144 144c-6.2 6.2-16.4 6.2-22.6 0s-6.2-16.4 0-22.6l144-144c6.2-6.2 16.4-6.2 22.6 0s6.2 16.4 0 22.6z"></path>
+                </svg>
             </span>
-            Add country
+            Edit countries or regions
         </span>`
     )
 
diff --git a/site/css/content.scss b/site/css/content.scss
index 8ddb6784bd4..96e2162f98e 100644
--- a/site/css/content.scss
+++ b/site/css/content.scss
@@ -256,39 +256,21 @@ figure[data-explorer-src] {
 .article-content {
     span.add-country {
         font-size: 0.9rem;
-        font-weight: bold;
-        color: $controls-color;
+        font: 400 13px/16px Lato, "Helvetica Neue", Helvetica, Arial,
+            "Liberation Sans", sans-serif;
+        letter-spacing: 0.01em;
+        display: inline-flex;
+        align-items: center;
+        border: 1px solid #e7e7e7;
+        border-radius: 4px;
+        padding: 7px;
+        color: #5b5b5b;
+        white-space: nowrap;
 
         .icon {
-            position: relative;
-            display: inline-block;
-            width: 16px;
-            height: 16px;
-            margin-right: 3px;
-            vertical-align: text-bottom;
-
-            svg {
-                position: absolute;
-                top: 0;
-                left: 0;
-            }
-
-            path {
-                stroke: #fff;
-                stroke-width: 2px;
-            }
-
-            &::before {
-                display: block;
-                content: "";
-                position: absolute;
-                left: 0;
-                top: 0;
-                width: 16px;
-                height: 16px;
-                background-color: $controls-color;
-                border-radius: 50%;
-            }
+            width: 0.75rem;
+            height: 0.75rem;
+            margin-right: 5px;
         }
     }
 }

From 570d3209aa489ef6a9e6eb9a8dada7e6f36ad029 Mon Sep 17 00:00:00 2001
From: sophiamersmann <sophia.mersmann1@gmail.com>
Date: Wed, 4 Oct 2023 10:11:51 +0000
Subject: [PATCH 2/3] fix: fix wording issue in "Add country" button

---
 baker/formatWordpressPost.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/baker/formatWordpressPost.tsx b/baker/formatWordpressPost.tsx
index 4ea569ad7ac..cc54c4570bf 100644
--- a/baker/formatWordpressPost.tsx
+++ b/baker/formatWordpressPost.tsx
@@ -270,7 +270,7 @@ export const formatWordpressPost = async (
                     <path fill="currentColor" d="M410.3 231l11.3-11.3-33.9-33.9-62.1-62.1L291.7 89.8l-11.3 11.3-22.6 22.6L58.6 322.9c-10.4 10.4-18 23.3-22.2 37.4L1 480.7c-2.5 8.4-.2 17.5 6.1 23.7s15.3 8.5 23.7 6.1l120.3-35.4c14.1-4.2 27-11.8 37.4-22.2L387.7 253.7 410.3 231zM160 399.4l-9.1 22.7c-4 3.1-8.5 5.4-13.3 6.9L59.4 452l23-78.1c1.4-4.9 3.8-9.4 6.9-13.3l22.7-9.1v32c0 8.8 7.2 16 16 16h32zM362.7 18.7L348.3 33.2 325.7 55.8 314.3 67.1l33.9 33.9 62.1 62.1 33.9 33.9 11.3-11.3 22.6-22.6 14.5-14.5c25-25 25-65.5 0-90.5L453.3 18.7c-25-25-65.5-25-90.5 0zm-47.4 168l-144 144c-6.2 6.2-16.4 6.2-22.6 0s-6.2-16.4 0-22.6l144-144c6.2-6.2 16.4-6.2 22.6 0s6.2 16.4 0 22.6z"></path>
                 </svg>
             </span>
-            Edit countries or regions
+            Edit countries and regions
         </span>`
     )
 

From 66a021e917eed6f219a6dc2fbced12d13339e909 Mon Sep 17 00:00:00 2001
From: sophiamersmann <sophia.mersmann1@gmail.com>
Date: Thu, 5 Oct 2023 15:25:39 +0000
Subject: [PATCH 3/3] enhance: improve styling of in-text "Add country" button

---
 site/css/content.scss | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/site/css/content.scss b/site/css/content.scss
index 96e2162f98e..7398bd544af 100644
--- a/site/css/content.scss
+++ b/site/css/content.scss
@@ -263,9 +263,10 @@ figure[data-explorer-src] {
         align-items: center;
         border: 1px solid #e7e7e7;
         border-radius: 4px;
-        padding: 7px;
+        padding: 5px 7px;
         color: #5b5b5b;
         white-space: nowrap;
+        margin: -5px 0px -5px -2px;
 
         .icon {
             width: 0.75rem;