SVG export - Safari - Prevent box appearing on rounded corners (#2201)

* Use box-shadow instead of outline for Safari support

* Update changelog re Safari SVG export square corner bug

Author: darrenburns

CHANGELOG.md

@@ -15,6 +15,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 - Fall back to `sys.__stderr__` on POSIX systems when trying to get the terminal size (fix issues when Rich is piped to another process)
 - Fixed markup escaping issue https://github.com/Textualize/rich/issues/2187
+- Safari - Box appearing around SVG export https://github.com/Textualize/rich/pull/2201
 
 ## [12.2.0] - 2022-04-05
 

rich/_export_format.py

@@ -69,7 +69,7 @@
             align-items: center;
             background-color: {theme_background_color};
             border-radius: 14px;
-            outline: 1px solid #484848;
+            box-shadow: 0 0 0 1px #484848;
         }}
         .{classes_prefix}-terminal:after {{
             position: absolute;

tests/test_console.py

@@ -543,7 +543,7 @@ def test_export_html_inline():
             align-items: center;
             background-color: #0c0c0c;
             border-radius: 14px;
-            outline: 1px solid #484848;
+            box-shadow: 0 0 0 1px #484848;
         }
         .rich-svg-${SVG_HASH}-terminal:after {
             position: absolute;