refactor: Fix formatting using prettier

This commit is contained in:
Bart van der Braak 2023-06-08 09:23:26 +02:00
parent d90b2a338f
commit 7ce405fbef
27 changed files with 406 additions and 206 deletions

View file

@ -29,7 +29,9 @@ export const Cta: React.FC = () => {
<h2 className="pb-4 text-4xl font-extrabold text-transparent bg-clip-text bg-gradient-to-r from-zinc-200/60 via-zinc-200 to-zinc-200/60">
Simplify your workflows
</h2>
<p className="mb-8 text-lg text-zinc-400">A consolidated ticket dashboard within 60 seconds.</p>
<p className="mb-8 text-lg text-zinc-400">
A consolidated ticket dashboard within 60 seconds.
</p>
<div>
<Link
className=" justify-center flex sm:inline-flex items-center whitespace-nowrap transition duration-150 ease-in-out font-medium rounded px-4 py-1.5 text-zinc-900 bg-gradient-to-r from-white/80 via-white to-white/80 hover:bg-white group"

View file

@ -7,22 +7,26 @@ export const Features: React.FC = () => {
{
icon: Unplug,
name: "Effortless Consolidation",
description: "Consolidate all tickets from multiple platforms and clients effortlessly",
description:
"Consolidate all tickets from multiple platforms and clients effortlessly",
},
{
icon: Eye,
name: "Unparalleled Visibility",
description: "Gain complete control and visibility over your ticketing operations",
description:
"Gain complete control and visibility over your ticketing operations",
},
{
icon: Compass,
name: "Intuitive Navigation",
description: "Seamlessly navigate and find tickets with smart filters and advanced search",
description:
"Seamlessly navigate and find tickets with smart filters and advanced search",
},
{
icon: Zap,
name: "Enhanced Efficiency",
description: "Maximize productivity and resource allocation in ticket management",
description:
"Maximize productivity and resource allocation in ticket management",
},
];
return (
@ -62,7 +66,9 @@ export const Features: React.FC = () => {
Reduce Context Switching
</h3>
<p className="mb-8 text-lg text-zinc-400">
Empower your operations teams with by consolidating all ticket information in one place. Seamlessly filter, sort, and customize ticket views to meet their unique needs.
Empower your operations teams with by consolidating all ticket
information in one place. Seamlessly filter, sort, and
customize ticket views to meet their unique needs.
</p>
<dl className="max-w-xl grid grid-cols-1 gap-4 lg:max-w-none">
{features.map((feature) => (

View file

@ -32,9 +32,15 @@ export const Hero: React.FC = () => {
className="pb-4 font-extrabold tracking-tight text-transparent text-6xl lg:text-8xl bg-clip-text bg-gradient-to-r from-zinc-200/60 via-zinc-200 to-zinc-200/60"
data-aos="fade-down"
>
<ReactWrapBalancer>One Dashboard, Countless Solutions</ReactWrapBalancer>
<ReactWrapBalancer>
One Dashboard, Countless Solutions
</ReactWrapBalancer>
</h1>
<p className="mb-8 text-lg text-zinc-300" data-aos="fade-down" data-aos-delay="200">
<p
className="mb-8 text-lg text-zinc-300"
data-aos="fade-down"
data-aos-delay="200"
>
Tame ticket overload and keep your operation teams sane
</p>
<div

View file

@ -126,7 +126,18 @@ export const Particles: React.FC<ParticlesProps> = ({
const dx = (Math.random() - 0.5) * 0.2;
const dy = (Math.random() - 0.5) * 0.2;
const magnetism = 0.1 + Math.random() * 4;
return { x, y, translateX, translateY, size, alpha, targetAlpha, dx, dy, magnetism };
return {
x,
y,
translateX,
translateY,
size,
alpha,
targetAlpha,
dx,
dy,
magnetism,
};
};
const rgb = hexToRgb(color);
@ -149,7 +160,12 @@ export const Particles: React.FC<ParticlesProps> = ({
const clearContext = () => {
if (context.current) {
context.current.clearRect(0, 0, canvasSize.current.w, canvasSize.current.h);
context.current.clearRect(
0,
0,
canvasSize.current.w,
canvasSize.current.h
);
}
};
@ -167,9 +183,10 @@ export const Particles: React.FC<ParticlesProps> = ({
start1: number,
end1: number,
start2: number,
end2: number,
end2: number
): number => {
const remapped = ((value - start1) * (end2 - start2)) / (end1 - start1) + start2;
const remapped =
((value - start1) * (end2 - start2)) / (end1 - start1) + start2;
return remapped > 0 ? remapped : 0;
};
@ -184,7 +201,9 @@ export const Particles: React.FC<ParticlesProps> = ({
canvasSize.current.h - circle.y - circle.translateY - circle.size, // distance from bottom edge
];
const closestEdge = edge.reduce((a, b) => Math.min(a, b));
const remapClosestEdge = parseFloat(remapValue(closestEdge, 0, 20, 0, 1).toFixed(2));
const remapClosestEdge = parseFloat(
remapValue(closestEdge, 0, 20, 0, 1).toFixed(2)
);
if (remapClosestEdge > 1) {
circle.alpha += 0.02;
if (circle.alpha > circle.targetAlpha) {
@ -196,9 +215,11 @@ export const Particles: React.FC<ParticlesProps> = ({
circle.x += circle.dx + vx;
circle.y += circle.dy + vy;
circle.translateX +=
(mouse.current.x / (staticity / circle.magnetism) - circle.translateX) / ease;
(mouse.current.x / (staticity / circle.magnetism) - circle.translateX) /
ease;
circle.translateY +=
(mouse.current.y / (staticity / circle.magnetism) - circle.translateY) / ease;
(mouse.current.y / (staticity / circle.magnetism) - circle.translateY) /
ease;
// circle gets out of the canvas
if (
circle.x < -circle.size ||
@ -222,7 +243,7 @@ export const Particles: React.FC<ParticlesProps> = ({
translateY: circle.translateY,
alpha: circle.alpha,
},
true,
true
);
}
});

View file

@ -6,7 +6,10 @@ interface MousePosition {
}
export default function useMousePosition(): MousePosition {
const [mousePosition, setMousePosition] = useState<MousePosition>({ x: 0, y: 0 });
const [mousePosition, setMousePosition] = useState<MousePosition>({
x: 0,
y: 0,
});
useEffect(() => {
const handleMouseMove = (event: MouseEvent) => {