X-Git-Url: http://source.bookstackapp.com/bookstack/blobdiff_plain/1ee3e779e4b9b0a92f701a72f21a72c83cb1ce68..refs/pull/5721/head:/resources/sass/_animations.scss diff --git a/resources/sass/_animations.scss b/resources/sass/_animations.scss index 85fd96206..ccbe36161 100644 --- a/resources/sass/_animations.scss +++ b/resources/sass/_animations.scss @@ -2,7 +2,7 @@ .anim.fadeIn { opacity: 0; animation-name: fadeIn; - animation-duration: 180ms; + animation-duration: 120ms; animation-timing-function: ease-in-out; animation-fill-mode: forwards; } @@ -16,23 +16,21 @@ } } -.anim.searchResult { - opacity: 0; - transform: translate3d(580px, 0, 0); - animation-name: searchResult; - animation-duration: 220ms; +.search-suggestions-animation{ + animation-name: searchSuggestions; + animation-duration: 120ms; animation-fill-mode: forwards; animation-timing-function: cubic-bezier(.62, .28, .23, .99); } -@keyframes searchResult { +@keyframes searchSuggestions { 0% { - opacity: 0; - transform: translate3d(400px, 0, 0); + opacity: .5; + transform: scale(0.9); } 100% { opacity: 1; - transform: translate3d(0, 0, 0); + transform: scale(1); } } @@ -69,4 +67,26 @@ animation-duration: 180ms; animation-delay: 0s; animation-timing-function: cubic-bezier(.62, .28, .23, .99); +} + +@keyframes highlight { + 0% { + background-color: var(--color-primary-light); + } + 33% { + background-color: transparent; + } + 66% { + background-color: var(--color-primary-light); + } + 100% { + background-color: transparent; + } +} + +.anim-highlight { + animation-name: highlight; + animation-duration: 2s; + animation-delay: 0s; + animation-timing-function: linear; } \ No newline at end of file