aboutsummaryrefslogtreecommitdiffstatshomepage
path: root/docs/components/pages/home-shared/GradientSectionBorder.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'docs/components/pages/home-shared/GradientSectionBorder.tsx')
-rw-r--r--docs/components/pages/home-shared/GradientSectionBorder.tsx37
1 files changed, 37 insertions, 0 deletions
diff --git a/docs/components/pages/home-shared/GradientSectionBorder.tsx b/docs/components/pages/home-shared/GradientSectionBorder.tsx
new file mode 100644
index 0000000..ef1e824
--- /dev/null
+++ b/docs/components/pages/home-shared/GradientSectionBorder.tsx
@@ -0,0 +1,37 @@
+import cn from "classnames";
+import { FadeIn } from "./FadeIn";
+import gradients from "../home-shared/gradients.module.css";
+
+export function GradientSectionBorder({
+ children,
+}: {
+ children: React.ReactNode;
+}) {
+ return (
+ <section className={cn("relative overflow-hidden")}>
+ <FadeIn noVertical viewTriggerOffset>
+ <span
+ className={cn(
+ "w-full absolute white h-[1px] top-0 opacity-25",
+ gradients.gradientSectionBorderDivider
+ )}
+ />
+ <span
+ className={cn(
+ gradients.gradientSectionBorder,
+ gradients.gradientSectionBorderLeft,
+ "dark:opacity-35 opacity-[0.15]"
+ )}
+ />
+ <span
+ className={cn(
+ gradients.gradientSectionBorder,
+ gradients.gradientSectionBorderRight,
+ "dark:opacity-35 opacity-[0.15]"
+ )}
+ />
+ </FadeIn>
+ {children}
+ </section>
+ );
+}