diff --git a/web/default/src/components/layout/components/header.tsx b/web/default/src/components/layout/components/header.tsx index b6011644c..6b2d6503e 100644 --- a/web/default/src/components/layout/components/header.tsx +++ b/web/default/src/components/layout/components/header.tsx @@ -31,8 +31,8 @@ export function Header({ className, children, ...props }: HeaderProps) { {...props} >
- {children} +
) diff --git a/web/default/src/features/doc-categories/index.tsx b/web/default/src/features/doc-categories/index.tsx index be2b3402c..6383d7b4a 100644 --- a/web/default/src/features/doc-categories/index.tsx +++ b/web/default/src/features/doc-categories/index.tsx @@ -116,6 +116,7 @@ export function DocCategories() { } return ( + <> {t('Document Categories')} @@ -217,5 +218,6 @@ export function DocCategories() { + ) } diff --git a/web/default/src/features/docs-management/index.tsx b/web/default/src/features/docs-management/index.tsx index 126993739..5f5ff242c 100644 --- a/web/default/src/features/docs-management/index.tsx +++ b/web/default/src/features/docs-management/index.tsx @@ -160,6 +160,7 @@ export function DocsManagement() { } return ( + <> {t('Document Management')} @@ -290,5 +291,6 @@ export function DocsManagement() { + ) } diff --git a/web/default/src/features/docs/index.tsx b/web/default/src/features/docs/index.tsx index 1fb43bf41..de096192c 100644 --- a/web/default/src/features/docs/index.tsx +++ b/web/default/src/features/docs/index.tsx @@ -477,11 +477,11 @@ export function Docs() { .meteor { position: absolute; width: 1.5px; - height: 0; + height: 150px; border-radius: 999px; animation: meteor-fall linear infinite; opacity: 0; - will-change: transform, opacity, height; + will-change: transform, opacity; } .meteor::before { content: ''; @@ -518,12 +518,10 @@ export function Docs() { .meteor-7 { left: 88%; top: -2%; animation-duration: 1.9s; animation-delay: 25s; } .meteor-8 { left: 95%; top: -2%; animation-duration: 2.3s; animation-delay: 29s; } @keyframes meteor-fall { - 0% { height: 0; opacity: 0; transform: translateY(0) translateX(0) rotate(220deg); } - 8% { opacity: 1; } - 20% { height: 120px; opacity: 0.9; } - 50% { height: 180px; opacity: 0.5; } - 80% { height: 60px; opacity: 0.15; } - 100% { height: 0; opacity: 0; transform: translateY(800px) translateX(-120px) rotate(220deg); } + 0% { opacity: 0; transform: translateY(-150px) translateX(0) rotate(220deg); } + 5% { opacity: 1; } + 60% { opacity: 0.6; } + 100% { opacity: 0; transform: translateY(800px) translateX(-120px) rotate(220deg); } } @media (prefers-reduced-motion: reduce) { .nebula-cloud, .meteor { animation: none !important; opacity: 0 !important; } diff --git a/web/default/src/features/home/components/sections/hero.tsx b/web/default/src/features/home/components/sections/hero.tsx index fb6dd6b8b..de65c53da 100644 --- a/web/default/src/features/home/components/sections/hero.tsx +++ b/web/default/src/features/home/components/sections/hero.tsx @@ -420,11 +420,11 @@ export function Hero(props: HeroProps) { .meteor { position: absolute; width: 1.5px; - height: 0; + height: 150px; border-radius: 999px; animation: meteor-fall linear infinite; opacity: 0; - will-change: transform, opacity, height; + will-change: transform, opacity; } .meteor::before { content: ''; @@ -485,27 +485,16 @@ export function Hero(props: HeroProps) { .meteor-10 { left: 95%; top: -2%; animation-duration: 2.0s; animation-delay: 27s; } @keyframes meteor-fall { 0% { - height: 0; opacity: 0; - transform: translateY(0) translateX(0) rotate(220deg); + transform: translateY(-150px) translateX(0) rotate(220deg); } - 8% { + 5% { opacity: 1; } - 20% { - height: 120px; - opacity: 0.9; - } - 50% { - height: 180px; - opacity: 0.5; - } - 80% { - height: 60px; - opacity: 0.15; + 60% { + opacity: 0.6; } 100% { - height: 0; opacity: 0; transform: translateY(800px) translateX(-120px) rotate(220deg); } diff --git a/web/default/src/features/pricing/index.tsx b/web/default/src/features/pricing/index.tsx index 20a897439..2777fca07 100644 --- a/web/default/src/features/pricing/index.tsx +++ b/web/default/src/features/pricing/index.tsx @@ -361,11 +361,11 @@ export function Pricing() { .meteor { position: absolute; width: 1.5px; - height: 0; + height: 150px; border-radius: 999px; animation: meteor-fall linear infinite; opacity: 0; - will-change: transform, opacity, height; + will-change: transform, opacity; } .meteor::before { content: ''; @@ -402,12 +402,10 @@ export function Pricing() { .meteor-7 { left: 88%; top: -2%; animation-duration: 1.9s; animation-delay: 24s; } .meteor-8 { left: 95%; top: -2%; animation-duration: 2.3s; animation-delay: 28s; } @keyframes meteor-fall { - 0% { height: 0; opacity: 0; transform: translateY(0) translateX(0) rotate(220deg); } - 8% { opacity: 1; } - 20% { height: 120px; opacity: 0.9; } - 50% { height: 180px; opacity: 0.5; } - 80% { height: 60px; opacity: 0.15; } - 100% { height: 0; opacity: 0; transform: translateY(800px) translateX(-120px) rotate(220deg); } + 0% { opacity: 0; transform: translateY(-150px) translateX(0) rotate(220deg); } + 5% { opacity: 1; } + 60% { opacity: 0.6; } + 100% { opacity: 0; transform: translateY(800px) translateX(-120px) rotate(220deg); } } @media (prefers-reduced-motion: reduce) { .nebula-cloud, .meteor { animation: none !important; opacity: 0 !important; }