From 1b8e32e36387f704104a4bdca3b273f5a7736149 Mon Sep 17 00:00:00 2001
From: Matthias Metelka <62722460+kleinerpirat@users.noreply.github.com>
Date: Tue, 30 Aug 2022 17:41:36 +0200
Subject: [PATCH] Fix focus box shadow transition and remove default shadow for
 a cleaner look

I couldn't quite get the inset look the way I wanted, because inset box-shadows do not respect the border radius, therefore causing aliasing.
---
 ts/editor/EditingArea.svelte | 10 ++++------
 1 file changed, 4 insertions(+), 6 deletions(-)

diff --git a/ts/editor/EditingArea.svelte b/ts/editor/EditingArea.svelte
index edc00e11c..e3dd417a2 100644
--- a/ts/editor/EditingArea.svelte
+++ b/ts/editor/EditingArea.svelte
@@ -191,10 +191,8 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
         background: var(--canvas-outset);
         border-radius: 5px;
 
-        transition: box-shadow 80ms cubic-bezier(0.33, 1, 0.68, 1);
-
-        /* This pseudo-element is required to display
-               the inset box-shadow above field contents */
+        /* Pseudo-element required to display
+           inset focus box-shadow above field contents */
         &::after {
             content: "";
             position: absolute;
@@ -204,8 +202,8 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
             left: 0;
             pointer-events: none;
             border-radius: 5px;
-            border: 1px solid var(--border-subtle);
-            box-shadow: inset 0 0 1px 1px var(--shadow-inset);
+            border: 1px solid var(--border-default);
+            transition: box-shadow 80ms cubic-bezier(0.33, 1, 0.68, 1);
         }
 
         &:focus-within {