From 6bd82550a7ed3d41d2246b6db64dc143af6bc5b0 Mon Sep 17 00:00:00 2001
From: Tessa Kelly <tessakkelly@gmail.com>
Date: Tue, 30 Nov 2021 12:17:05 -0800
Subject: [PATCH] Adds border

---
 src/Nri/Ui/RadioButton/V3.elm | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/src/Nri/Ui/RadioButton/V3.elm b/src/Nri/Ui/RadioButton/V3.elm
index 197fd8d5..dfd9edf4 100644
--- a/src/Nri/Ui/RadioButton/V3.elm
+++ b/src/Nri/Ui/RadioButton/V3.elm
@@ -14,6 +14,7 @@ module Nri.Ui.RadioButton.V3 exposing
   - list based API instead of record based
   - add disclosure to show rich content when the radio is selected
   - allow customization of the id
+  - add gray and azure borders to make the radios easier to distinguish visually
 
 @docs view
 
@@ -543,6 +544,7 @@ unselectedSvg =
             ]
         ]
         |> Nri.Ui.Svg.V1.fromHtml
+        |> withImageBorder Colors.gray85
 
 
 selectedSvg : Svg
@@ -587,6 +589,7 @@ selectedSvg =
             ]
         ]
         |> Nri.Ui.Svg.V1.fromHtml
+        |> withImageBorder Colors.azure
 
 
 lockedSvg : Svg
@@ -634,3 +637,12 @@ lockedSvg =
             ]
         ]
         |> Nri.Ui.Svg.V1.fromHtml
+        |> withImageBorder Colors.gray85
+
+
+withImageBorder : Color -> Svg -> Svg
+withImageBorder color =
+    Nri.Ui.Svg.V1.withCss
+        [ Css.border3 (px 1) solid color
+        , Css.borderRadius (Css.pct 50)
+        ]