diff options
| author | 2023-04-22 19:52:26 +0800 | |
|---|---|---|
| committer | 2023-04-22 19:52:26 +0800 | |
| commit | 4838df315931bb883f704ec3e1abe2685f296cdf (patch) | |
| tree | 57a8550c4cd5338f1126364bb518c6cde8d96e7d /docs/components/pages/home-shared/Gradient.tsx | |
| parent | db74ade0234a40c2120ad5f2a41bee50ce13de02 (diff) | |
| download | HydroRoll-4838df315931bb883f704ec3e1abe2685f296cdf.tar.gz HydroRoll-4838df315931bb883f704ec3e1abe2685f296cdf.zip | |
😀
Diffstat (limited to 'docs/components/pages/home-shared/Gradient.tsx')
| -rw-r--r-- | docs/components/pages/home-shared/Gradient.tsx | 47 |
1 files changed, 47 insertions, 0 deletions
diff --git a/docs/components/pages/home-shared/Gradient.tsx b/docs/components/pages/home-shared/Gradient.tsx new file mode 100644 index 0000000..9a03a99 --- /dev/null +++ b/docs/components/pages/home-shared/Gradient.tsx @@ -0,0 +1,47 @@ +import cn from "classnames"; +import gradients from "./gradients.module.css"; + +export function Gradient({ + width = 1000, + height = 200, + opacity, + pink, + blue, + conic, + gray, + className, + small, +}: { + width?: number | string; + height?: number | string; + opacity?: number; + pink?: boolean; + blue?: boolean; + conic?: boolean; + gray?: boolean; + className?: string; + small?: boolean; +}) { + return ( + <span + className={cn( + "absolute", + gradients.glow, + { + [gradients.glowPink]: pink, + [gradients.glowBlue]: blue, + [gradients.glowConic]: conic, + [gradients.glowSmall]: small, + [gradients.glowGray]: gray, + }, + className + )} + style={{ + width, + height, + opacity, + borderRadius: "100%", + }} + /> + ); +} |
