RageStudio/comty
1
0
Fork 0
mirror of https://github.com/ragestudio/comty.git synced 2025-07-08 08:44:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

Improve exit animation

Browse Source
This commit is contained in:
srgooglo 2025-07-04 14:12:48 +02:00
parent 28bdb0f9d4
commit 993f454fab
1 changed files with 14 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
packages/app/src/layouts/components/header/index.jsx
View File

@ -5,7 +5,7 @@ import useLayoutInterface from "@hooks/useLayoutInterface"
import "./index.less" import "./index.less"
export default (props) => { const HeaderBar = (props) => {
const [render, setRender] = React.useState(null) const [render, setRender] = React.useState(null)
useLayoutInterface("header", { useLayoutInterface("header", {
@ -33,15 +33,23 @@ export default (props) => {
<AnimatePresence> <AnimatePresence>
{render && ( {render && (
<motion.div <motion.div
layoutRoot
className="page_header_wrapper" className="page_header_wrapper"
animate={{
y: 0,
}}
initial={{ initial={{
y: -100, y: -100,
width: "100%",
}}
animate={{
y: 0,
position: "sticky",
width: "100%",
}} }}
exit={{ exit={{
y: -100, y: -100,
position: "absolute",
width: "100%",
top: 0,
left: 0,
}} }}
transition={{ transition={{
type: "spring", type: "spring",
@ -61,3 +69,5 @@ export default (props) => {
</AnimatePresence> </AnimatePresence>
) )
} }
export default HeaderBar