From 7755a0092c36ed9f2361f8a10ffa95c2f1b80744 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Keviin=20=C3=85berg=20Kultalahti?= <kevin.aberg@gmail.com>
Date: Wed, 21 Jul 2021 13:13:36 +0200
Subject: [PATCH] update transitions to match modal component

---
 .../src/components/feedback/NPSFeedbackForm.svelte | 14 +++++++++++---
 1 file changed, 11 insertions(+), 3 deletions(-)

diff --git a/packages/builder/src/components/feedback/NPSFeedbackForm.svelte b/packages/builder/src/components/feedback/NPSFeedbackForm.svelte
index c56e79905f..1bbb68d8a0 100644
--- a/packages/builder/src/components/feedback/NPSFeedbackForm.svelte
+++ b/packages/builder/src/components/feedback/NPSFeedbackForm.svelte
@@ -1,7 +1,7 @@
 <script>
   import analytics from "analytics"
   import { createEventDispatcher } from "svelte"
-  import { fly } from "svelte/transition"
+  import { fade, fly } from "svelte/transition"
   import {
     ActionButton,
     RadioGroup,
@@ -49,8 +49,16 @@
   }
 </script>
 
-<div class="position">
-  <div class="feedback-frame" transition:fly>
+<div
+  class="position"
+  in:fade={{ duration: 200 }}
+  out:fade|local={{ duration: 200 }}
+>
+  <div
+    class="feedback-frame"
+    in:fly={{ y: 30, duration: 200 }}
+    out:fly|local={{ y: 30, duration: 200 }}
+  >
     <Layout gap="XS">
       {#if step === 0}
         <Heading size="XS"