From 5a730a1aa1d52125e994fa4d7e60b00334657f20 Mon Sep 17 00:00:00 2001 From: Ken Date: Sat, 1 Feb 2025 15:23:26 +0100 Subject: [PATCH] :dizzy: Updated default Modal animation --- @navikt/core/css/darkside/modal.darkside.css | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/@navikt/core/css/darkside/modal.darkside.css b/@navikt/core/css/darkside/modal.darkside.css index 57ac50eb51..f7faa997c3 100644 --- a/@navikt/core/css/darkside/modal.darkside.css +++ b/@navikt/core/css/darkside/modal.darkside.css @@ -19,7 +19,7 @@ &[open] { display: flex; flex-direction: column; - animation: akselModalFadeIn 0.35s cubic-bezier(0.15, 1, 0.3, 1); + animation: akselModalFadeIn 0.6s cubic-bezier(0.15, 1, 0.3, 1); } } @@ -101,7 +101,7 @@ * TODO: Check that overlay-color is correct after the new colors is set in stone. */ background: #0214317d; - animation: akselModalBackdropFadeIn 0.35s cubic-bezier(0.15, 1, 0.3, 1); + animation: akselModalBackdropFadeIn 0.8s cubic-bezier(0.15, 1, 0.3, 1); } .navds-modal--polyfilled + .backdrop /* Cannot be combined with ::backdrop selector */ { @@ -182,8 +182,8 @@ @keyframes akselModalFadeIn { 0% { - opacity: 0.0001; /* Safari will not set focus inside the modal when it opens if we set this to 0 */ - transform: translate3d(0, calc(2% + 4px), 0); + opacity: 0.01; /* Safari will not set focus inside the modal when it opens if we set this to 0 */ + transform: scale(103%); } 50% { @@ -191,7 +191,7 @@ } 100% { - transform: none; + transform: scale(100%); } }