ivandimitrov8080/idimitrov.dev
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Compare commits

base: ivandimitrov8080:nextjs
Branches Tags
ivandimitrov8080:nextjs
ivandimitrov8080:feature/stars
ivandimitrov8080:feature/otc-irs
..
compare: ivandimitrov8080:feature/stars
Branches Tags
ivandimitrov8080:nextjs
ivandimitrov8080:feature/stars
ivandimitrov8080:feature/otc-irs

No commits in common. "nextjs" and "feature/stars" have entirely different histories.
nextjs ... feature/st

2 changed files with 5 additions and 3 deletions
Show Stats Expand all files Collapse all files

BIN
bun.lockb Executable file
View File

Binary file not shown.

8
src/components/stars.tsx
View File

@ -1,6 +1,6 @@
"use client"; "use client";
import { CSSProperties, useEffect, useState } from "react"; import { CSSProperties, HTMLAttributes, useEffect, useState } from "react";
type Props = { type Props = {
count: number; count: number;
@ -24,6 +24,8 @@ const Stars = ({ count }: Props) => {
background: `radial-gradient(circle, ${randomRgba(0.6)} 0%, ${randomRgba(0)} 100%)`, background: `radial-gradient(circle, ${randomRgba(0.6)} 0%, ${randomRgba(0)} 100%)`,
width: radius, width: radius,
height: radius, height: radius,
transform: "translate(-50%)",
animation: "spinner 5s linear infinite"
}; };
if (key) { if (key) {
style = { style = {
@ -57,14 +59,14 @@ const Stars = ({ count }: Props) => {
height: containerRadius, height: containerRadius,
animation: `${animation} ${duration}s linear infinite` animation: `${animation} ${duration}s linear infinite`
}} }}
className="absolute z-10 max-w-full max-h-full"> className="absolute">
{star()} {star()}
</div> </div>
) )
} }
return ( return (
<div className="absolute w-screen h-screen overflow-hidden"> <div>
{Array.from({ length: count }).map((_it, i) => { {Array.from({ length: count }).map((_it, i) => {
return i % 4 === 0 ? spinningStar(i) : star(i) return i % 4 === 0 ? spinningStar(i) : star(i)
})} })}