mirror of
https://github.com/XFox111/PasswordGeneratorExtension.git
synced 2026-04-22 08:08:01 +03:00
Major 4.0 (#380)
- Migrated to WXT - Migrated to NPM - Added Insert & copy action - Added ESLint
This commit is contained in:
@@ -0,0 +1,46 @@
|
||||
import { GriffelStyle, makeStyles, tokens } from "@fluentui/react-components";
|
||||
|
||||
const random = (max: number): number => Math.floor(Math.random() * max);
|
||||
|
||||
export const SNOWFLAKES_NUM: number = 100;
|
||||
|
||||
export const useStyles = makeStyles({
|
||||
snow:
|
||||
{
|
||||
position: "absolute",
|
||||
overflow: "hidden",
|
||||
pointerEvents: "none",
|
||||
|
||||
top: 0,
|
||||
left: 0,
|
||||
bottom: 0,
|
||||
right: 0,
|
||||
},
|
||||
snowflake:
|
||||
{
|
||||
"--size": "1px",
|
||||
width: "var(--size)",
|
||||
height: "var(--size)",
|
||||
backgroundColor: tokens.colorScrollbarOverlay,
|
||||
borderRadius: tokens.borderRadiusCircular,
|
||||
position: "absolute",
|
||||
top: "-5px",
|
||||
},
|
||||
...[...Array(SNOWFLAKES_NUM)].reduce(
|
||||
(acc, _, i): Record<string, GriffelStyle> => ({
|
||||
...acc,
|
||||
[`snowflake-${i}`]: {
|
||||
"--size": `${random(5)}px`,
|
||||
"--left-start": `${random(20) - 10}vw`,
|
||||
"--left-end": `${random(20) - 10}vw`,
|
||||
left: `${random(100)}vw`,
|
||||
animationName: "snowfall",
|
||||
animationDuration: `${5 + random(10)}s`,
|
||||
animationTimingFunction: "linear",
|
||||
animationIterationCount: "infinite",
|
||||
animationDelay: `-${random(10)}s`,
|
||||
},
|
||||
}),
|
||||
{},
|
||||
),
|
||||
});
|
||||
Reference in New Issue
Block a user