mirror of
https://github.com/XFox111/PasswordGeneratorExtension.git
synced 2026-07-02 19:52:43 +03:00
Compare commits
10 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 Eugene Fox
|
4a11ebbb45 | ||
|
Eugene Fox
|
86c4e0498b | ||
|
Eugene Fox
|
c7869010b6 | ||
|
Eugene Fox
|
6f9c13587d | ||
|
Eugene Fox
|
5d4088dd1a | ||
 Maison da Silva
|
917884b883 | ||
|
Eugene Fox
|
33b3df7433 | ||
|
Eugene Fox
|
408d417c3f | ||
|
Maison da Silva
|
f8a80d4a4c | ||
|
Eugene Fox
|
32bcdef7ec |
@@ -10,20 +10,22 @@ updates:
|
||||
|
||||
- package-ecosystem: "npm" # See documentation for possible values
|
||||
directory: "/" # Location of package manifests
|
||||
target-branch: "main"
|
||||
target-branch: "next"
|
||||
assignees:
|
||||
- "xfox111"
|
||||
reviewers:
|
||||
- "xfox111"
|
||||
schedule:
|
||||
interval: "weekly"
|
||||
interval: monthly
|
||||
rebase-strategy: disabled
|
||||
|
||||
- package-ecosystem: "github-actions"
|
||||
directory: "/"
|
||||
target-branch: "main"
|
||||
target-branch: "next"
|
||||
assignees:
|
||||
- "xfox111"
|
||||
reviewers:
|
||||
- "xfox111"
|
||||
schedule:
|
||||
interval: "weekly"
|
||||
interval: monthly
|
||||
rebase-strategy: disabled
|
||||
|
||||
@@ -1,9 +1,8 @@
|
||||
name: Release pipeline
|
||||
|
||||
on:
|
||||
|
||||
release:
|
||||
types: [published]
|
||||
types: [ released ]
|
||||
workflow_dispatch:
|
||||
|
||||
jobs:
|
||||
@@ -37,7 +36,7 @@ jobs:
|
||||
- run: yarn build
|
||||
|
||||
- name: Drop artifacts (build)
|
||||
uses: actions/upload-artifact@v3.1.0
|
||||
uses: actions/upload-artifact@v3.1.2
|
||||
with:
|
||||
name: build
|
||||
path: build
|
||||
@@ -57,12 +56,12 @@ jobs:
|
||||
script: Remove-Item "manifest.v2.json"
|
||||
|
||||
- name: Pack extension
|
||||
uses: TheDoctor0/zip-release@0.6.2
|
||||
uses: TheDoctor0/zip-release@0.7.1
|
||||
with:
|
||||
filename: PasswordGenerator-Chromium.zip
|
||||
|
||||
- name: Drop artifacts (Chromium)
|
||||
uses: actions/upload-artifact@v3.1.0
|
||||
uses: actions/upload-artifact@v3.1.2
|
||||
with:
|
||||
name: Chromium
|
||||
path: PasswordGenerator-Chromium.zip
|
||||
@@ -92,13 +91,20 @@ jobs:
|
||||
Remove-Item "manifest.json"
|
||||
Rename-Item "manifest.v2.json" "manifest.json"
|
||||
|
||||
- name: "web-ext lint"
|
||||
uses: kewisch/action-web-ext@e0ea88d527a8a90bc10d600f80ac667d219e6bf1
|
||||
with:
|
||||
cmd: lint
|
||||
source: .
|
||||
channel: listed
|
||||
|
||||
- name: Pack extension
|
||||
uses: TheDoctor0/zip-release@0.6.2
|
||||
uses: TheDoctor0/zip-release@0.7.1
|
||||
with:
|
||||
filename: PasswordGenerator-Firefox.zip
|
||||
|
||||
- name: Drop artifacts (Firefox)
|
||||
uses: actions/upload-artifact@v3.1.0
|
||||
uses: actions/upload-artifact@v3.1.2
|
||||
with:
|
||||
name: Firefox
|
||||
path: PasswordGenerator-Firefox.zip
|
||||
|
||||
@@ -13,7 +13,7 @@ name: "CodeQL"
|
||||
|
||||
on:
|
||||
push:
|
||||
branches: [ "main" ]
|
||||
branches: [ "main", "next" ]
|
||||
paths-ignore:
|
||||
- '**.md'
|
||||
- 'LICENSE'
|
||||
@@ -23,7 +23,7 @@ on:
|
||||
- '**/pr_pipeline.yaml'
|
||||
pull_request:
|
||||
# The branches below must be a subset of the branches above
|
||||
branches: [ "main" ]
|
||||
branches: [ "main", "next" ]
|
||||
paths-ignore:
|
||||
- '**.md'
|
||||
- 'LICENSE'
|
||||
|
||||
@@ -2,8 +2,7 @@ name: PR check pipeline
|
||||
|
||||
on:
|
||||
pull_request:
|
||||
branches:
|
||||
- main
|
||||
branches: [ "main", "next" ]
|
||||
paths-ignore:
|
||||
- '**.md'
|
||||
- 'LICENSE'
|
||||
@@ -42,7 +41,7 @@ jobs:
|
||||
- run: yarn build
|
||||
|
||||
- name: Drop artifacts (build)
|
||||
uses: actions/upload-artifact@v3.1.0
|
||||
uses: actions/upload-artifact@v3.1.2
|
||||
with:
|
||||
name: build
|
||||
path: build
|
||||
@@ -71,12 +70,12 @@ jobs:
|
||||
channel: listed
|
||||
|
||||
- name: Pack extension
|
||||
uses: TheDoctor0/zip-release@0.6.2
|
||||
uses: TheDoctor0/zip-release@0.7.1
|
||||
with:
|
||||
filename: PasswordGenerator-Firefox.zip
|
||||
|
||||
- name: Drop artifacts (Firefox)
|
||||
uses: actions/upload-artifact@v3.1.0
|
||||
uses: actions/upload-artifact@v3.1.2
|
||||
with:
|
||||
name: Firefox
|
||||
path: PasswordGenerator-Firefox.zip
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
# Password generator
|
||||
[](https://github.com/xfox111/PasswordGeneratorExtension/releases/latest)
|
||||
[](https://github.com/xfox111/PasswordGeneratorExtension/commits/master)
|
||||
[](https://github.com/XFox111/PasswordGeneratorExtension/commits/main)
|
||||
|
||||
[](https://twitter.com/xfox111)
|
||||
[](https://github.com/xfox111)
|
||||
@@ -21,6 +21,7 @@ Extension for web browsers which helps you to easily generate strong passwords i
|
||||
- Ukrainian
|
||||
- Polish
|
||||
- Russian
|
||||
- Portuguese (Brazil)
|
||||
|
||||
<img width="1136" alt="Password generator v2.0" src="https://user-images.githubusercontent.com/28831743/188680034-a673b1b4-3153-4054-bb0d-949568de1748.png">
|
||||
|
||||
@@ -55,6 +56,6 @@ If you are interested in fixing issues and contributing directly to the code bas
|
||||
This project has adopted the Contributor Covenant. For more information see the [Code of Conduct](https://github.com/XFox111/PasswordGeneratorExtension/blob/master/CODE_OF_CONDUCT.md)
|
||||
|
||||
## Copyrights
|
||||
> ©2022 Eugene Fox
|
||||
> ©2023 Eugene Fox
|
||||
|
||||
[](https://opensource.org/licenses/MIT)
|
||||
|
||||
+7
-6
@@ -1,4 +1,5 @@
|
||||
import { CracoConfig, CracoContext } from "@craco/craco";
|
||||
import { CracoConfig, WebpackContext } from "@craco/types";
|
||||
import { Configuration as WebpackConfig } from "webpack";
|
||||
import HtmlWebapckPlugin, { MinifyOptions } from "html-webpack-plugin";
|
||||
import { Configuration } from "webpack";
|
||||
|
||||
@@ -8,16 +9,16 @@ const cracoConfig: CracoConfig =
|
||||
{
|
||||
webpack:
|
||||
{
|
||||
configure: (webpackConfig: Configuration, { env, paths }: CracoContext): Configuration =>
|
||||
configure: ((webpackConfig: WebpackConfig, { env, paths }: WebpackContext): WebpackConfig =>
|
||||
{
|
||||
const isProduction: boolean = env === "production";
|
||||
|
||||
const config: Configuration =
|
||||
const config: WebpackConfig =
|
||||
{
|
||||
...webpackConfig,
|
||||
entry:
|
||||
{
|
||||
main: paths.appIndexJs,
|
||||
main: paths!.appIndexJs,
|
||||
background: "./src/Services/BackgroundService.ts",
|
||||
contentScript: "./src/Services/ContentService.ts",
|
||||
},
|
||||
@@ -53,13 +54,13 @@ const cracoConfig: CracoConfig =
|
||||
config.plugins.push(new HtmlWebapckPlugin({
|
||||
inject: true,
|
||||
chunks: ["main"],
|
||||
template: paths.appHtml,
|
||||
template: paths!.appHtml,
|
||||
filename: "index.html",
|
||||
minify: isProduction && minifyOptions
|
||||
}));
|
||||
|
||||
return config;
|
||||
}
|
||||
})
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
+23
-14
@@ -1,28 +1,31 @@
|
||||
{
|
||||
"name": "password-generator",
|
||||
"version": "2.0.2",
|
||||
"version": "2.2.5",
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"@craco/craco": "^6.4.5",
|
||||
"@fluentui/react-components": "^9.5.1",
|
||||
"@fluentui/react-icons": "^2.0.185",
|
||||
"@craco/craco": "^7.1.0",
|
||||
"@fluentui/react-components": "^9.19.1",
|
||||
"@fluentui/react-icons": "^2.0.199",
|
||||
"react": "^18.2.0",
|
||||
"react-device-detect": "^2.2.3",
|
||||
"react-dom": "^18.2.0",
|
||||
"sass": "^1.55.0",
|
||||
"typescript": "^4.8.4",
|
||||
"sass": "^1.60.0",
|
||||
"typescript": "^5.0.4",
|
||||
"webextension-polyfill": "^0.10.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@craco/types": "^7.1.0",
|
||||
"@testing-library/jest-dom": "^5.14.1",
|
||||
"@testing-library/react": "^13.4.0",
|
||||
"@testing-library/react": "^14.0.0",
|
||||
"@testing-library/user-event": "^14.4.3",
|
||||
"@types/craco__craco": "^6.4.0",
|
||||
"@types/jest": "^29.1.2",
|
||||
"@types/node": "^18.11.0",
|
||||
"@types/react": "^18.0.21",
|
||||
"@types/react-dom": "^18.0.0",
|
||||
"@types/webextension-polyfill": "^0.9.1",
|
||||
"react-scripts": "5.0.1"
|
||||
"@types/jest": "^29.5.2",
|
||||
"@types/node": "^20.2.5",
|
||||
"@types/react": "^18.2.0",
|
||||
"@types/react-dom": "^18.2.4",
|
||||
"@types/webextension-polyfill": "^0.10.0",
|
||||
"html-webpack-plugin": "^5.5.1",
|
||||
"react-scripts": "5.0.1",
|
||||
"webpack": "^5.85.0"
|
||||
},
|
||||
"scripts": {
|
||||
"start": "craco start",
|
||||
@@ -47,5 +50,11 @@
|
||||
"last 1 firefox version",
|
||||
"last 1 safari version"
|
||||
]
|
||||
},
|
||||
"resolutions": {
|
||||
"json5": "1.0.2",
|
||||
"loader-utils": "2.0.4",
|
||||
"minimatch": "3.0.5",
|
||||
"nth-check": "2.0.1"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,174 @@
|
||||
{
|
||||
"name": {
|
||||
"message": "Gerador de Senhas",
|
||||
"description": "manifest.json"
|
||||
},
|
||||
"description": {
|
||||
"message": "A extensão do gerador de senhas permite gerar facilmente uma senha longa e segura em um clique",
|
||||
"description": "manifest.json"
|
||||
},
|
||||
"author": {
|
||||
"message": "Eugene Fox",
|
||||
"description": "manifest.json"
|
||||
},
|
||||
"Password_generator": {
|
||||
"message": "Gerador de senhas",
|
||||
"description": "App.tsx"
|
||||
},
|
||||
"Copy": {
|
||||
"message": "Copiar",
|
||||
"description": "PasswordView.tsx"
|
||||
},
|
||||
"Generate_new": {
|
||||
"message": "Gerar nova",
|
||||
"description": "PasswordView.tsx"
|
||||
},
|
||||
"Exclude_special_symbols_one_time": {
|
||||
"message": "Gerar senha sem símbolos especiais",
|
||||
"description": "PasswordView.tsx"
|
||||
},
|
||||
"Include_special_symbols_one_time": {
|
||||
"message": "Gerar senha com símbolos especiais",
|
||||
"description": "PasswordView.tsx"
|
||||
},
|
||||
"Settings": {
|
||||
"message": "Configurações",
|
||||
"description": "SettingsSection.tsx"
|
||||
},
|
||||
"Password_length": {
|
||||
"message": "Comprimento da senha",
|
||||
"description": "SettingsSection.tsx"
|
||||
},
|
||||
"Recommended_password_length": {
|
||||
"message": "Comprimento recomendado da senha",
|
||||
"description": "SettingsSection.tsx"
|
||||
},
|
||||
"Character_options": {
|
||||
"message": "Opções de caracteres",
|
||||
"description": "SettingsSection.tsx"
|
||||
},
|
||||
"Include": {
|
||||
"message": "Incluir",
|
||||
"description": "SettingsSection.tsx"
|
||||
},
|
||||
"Special_symbols": {
|
||||
"message": "Símbolos especiais",
|
||||
"description": "SettingsSection.tsx"
|
||||
},
|
||||
"Numeric": {
|
||||
"message": "Numérico",
|
||||
"description": "SettingsSection.tsx"
|
||||
},
|
||||
"Uppercase": {
|
||||
"message": "Maiúsculas",
|
||||
"description": "SettingsSection.tsx"
|
||||
},
|
||||
"Lowercase": {
|
||||
"message": "Minúsculas",
|
||||
"description": "SettingsSection.tsx"
|
||||
},
|
||||
"Exclude": {
|
||||
"message": "Excluir",
|
||||
"description": "SettingsSection.tsx"
|
||||
},
|
||||
"Similar": {
|
||||
"message": "Semelhante",
|
||||
"description": "SettingsSection.tsx"
|
||||
},
|
||||
"Ambiguous": {
|
||||
"message": "Ambíguo",
|
||||
"description": "SettingsSection.tsx"
|
||||
},
|
||||
"Repeating": {
|
||||
"message": "Repetido",
|
||||
"description": "SettingsSection.tsx"
|
||||
},
|
||||
"Add_shortcut_to_context_menu": {
|
||||
"message": "Adicionar atalho ao menu de contexto",
|
||||
"description": "SettingsSection.tsx"
|
||||
},
|
||||
"Right_click_password_field_to_quickly_generate_password": {
|
||||
"message": "Clique com o botão direito do mouse no campo de senha para gerar a senha rapidamente",
|
||||
"description": "SettingsSection.tsx"
|
||||
},
|
||||
"Automatically_copy_to_clipboard": {
|
||||
"message": "Copiar automaticamente para a área de transferência",
|
||||
"description": "SettingsSection.tsx"
|
||||
},
|
||||
"About": {
|
||||
"message": "Sobre",
|
||||
"description": "AboutSection.tsx"
|
||||
},
|
||||
"Developed_by_Eugene_Fox": {
|
||||
"message": "Desenvolvido por Eugene Fox",
|
||||
"description": "AboutSection.tsx"
|
||||
},
|
||||
"Licensed_under": {
|
||||
"message": "Licenciado sob",
|
||||
"description": "AboutSection.tsx"
|
||||
},
|
||||
"MIT_license": {
|
||||
"message": "Licença MIT",
|
||||
"description": "AboutSection.tsx"
|
||||
},
|
||||
"Want_to_contribute_translation_for_your_language_": {
|
||||
"message": "Quer contribuir com a tradução para o seu idioma?",
|
||||
"description": "AboutSection.tsx"
|
||||
},
|
||||
"Read_this_to_get_started": {
|
||||
"message": "Leia isto para começar",
|
||||
"description": "AboutSection.tsx"
|
||||
},
|
||||
"My_website": {
|
||||
"message": "Meu website",
|
||||
"description": "AboutSection.tsx"
|
||||
},
|
||||
"Source_code": {
|
||||
"message": "Código fonte",
|
||||
"description": "AboutSection.tsx"
|
||||
},
|
||||
"Changelog": {
|
||||
"message": "Registro de alterações",
|
||||
"description": "AboutSection.tsx"
|
||||
},
|
||||
"Leave_feedback": {
|
||||
"message": "Deixar feedback",
|
||||
"description": "AboutSection.tsx"
|
||||
},
|
||||
"Buy_me_a_coffee": {
|
||||
"message": "Compre-me um café",
|
||||
"description": "AboutSection.tsx"
|
||||
},
|
||||
"Set_name": {
|
||||
"message": "Nome",
|
||||
"description": "CharacterHelpDialog.tsx"
|
||||
},
|
||||
"Characters": {
|
||||
"message": "Caracteres",
|
||||
"description": "CharacterHelpDialog.tsx"
|
||||
},
|
||||
"__etc_": {
|
||||
"message": ", etc.",
|
||||
"description": "CharacterHelpDialog.tsx"
|
||||
},
|
||||
"OK": {
|
||||
"message": "OK",
|
||||
"description": "CharacterHelpDialog.tsx"
|
||||
},
|
||||
"Either_lowercase_or_uppercase_characters_must_be_included": {
|
||||
"message": "Caracteres minúsculos ou maiúsculos devem ser incluídos",
|
||||
"description": "Generator.tsx"
|
||||
},
|
||||
"Selected_length_is_too_long_to_exclude_repeating_characters": {
|
||||
"message": "O comprimento selecionado é muito longo para excluir caracteres repetidos",
|
||||
"description": "Generator.tsx"
|
||||
},
|
||||
"Quick_generator_is_only_available_on_password_fields": {
|
||||
"message": "O gerador rápido está disponível apenas em campos de senha",
|
||||
"description": "ContentService.tsx"
|
||||
},
|
||||
"Quick_generate_password": {
|
||||
"message": "Gerar senha rápida",
|
||||
"description": "BackgroundService.tsx"
|
||||
}
|
||||
}
|
||||
@@ -1,6 +1,14 @@
|
||||
body
|
||||
{
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
main
|
||||
{
|
||||
width: 400px;
|
||||
padding: 8px;
|
||||
-webkit-user-select: none;
|
||||
user-select: none;
|
||||
|
||||
h1, h2, h3, h4, h5, h6, p
|
||||
{
|
||||
@@ -43,6 +51,12 @@ main
|
||||
}
|
||||
}
|
||||
|
||||
button.fui-Link
|
||||
{
|
||||
-webkit-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.scaleUpIn
|
||||
{
|
||||
animation-name: scaleUpInAnim;
|
||||
|
||||
@@ -8,6 +8,7 @@ import PasswordView from "./Components/PasswordView";
|
||||
import Settings from "./Utils/Settings";
|
||||
import GeneratorOptions from "./Utils/GeneratorOptions";
|
||||
import { loc } from "./Utils/Localization";
|
||||
import Snow from "./Holidays/Snow";
|
||||
|
||||
interface IStates
|
||||
{
|
||||
@@ -63,6 +64,8 @@ export default class App extends React.Component<IProps, IStates>
|
||||
return (
|
||||
<FluentProvider theme={ this.state.theme }>
|
||||
<main className="stack gap">
|
||||
<Snow />
|
||||
|
||||
<header className="stack horizontal gap">
|
||||
<Title2 as="h1">{ loc("Password generator") }</Title2>
|
||||
<Text as="span">v{ Package.version }</Text>
|
||||
|
||||
@@ -3,7 +3,7 @@ import { InfoRegular, PersonFeedbackRegular } from "@fluentui/react-icons";
|
||||
import { ReactComponent as BuyMeACoffee } from "../Assets/BuyMeACoffee.svg";
|
||||
import React from "react";
|
||||
import { loc } from "../Utils/Localization";
|
||||
import browser from "../Utils/Browser";
|
||||
import * as Platform from "react-device-detect";
|
||||
|
||||
export default class AboutSection extends React.Component
|
||||
{
|
||||
@@ -55,25 +55,13 @@ export default class AboutSection extends React.Component
|
||||
|
||||
private GetFeedbackLink(): string
|
||||
{
|
||||
let manifest: { [key: string]: string | any } = browser?.runtime?.getManifest();
|
||||
|
||||
if (!manifest)
|
||||
return "mailto:feedback@xfox111.net";
|
||||
else
|
||||
{
|
||||
if (manifest.update_url)
|
||||
{
|
||||
let host: string = new URL(manifest.update_url).host;
|
||||
|
||||
if (host.endsWith("edge.microsoft.com"))
|
||||
if (Platform.isEdgeChromium)
|
||||
return "https://microsoftedge.microsoft.com/addons/detail/password-generator/manimdhobjbkfpeeehlhhneookiokpbj";
|
||||
else if (host.endsWith("google.com"))
|
||||
else if (Platform.isChrome)
|
||||
return "https://chrome.google.com/webstore/detail/password-generator/jnjobgjobffgmgfnkpkjfjkkfhfikmfl";
|
||||
else
|
||||
return "mailto:feedback@xfox111.net";
|
||||
}
|
||||
else if (Platform.isFirefox)
|
||||
return "https://addons.mozilla.org/en-US/firefox/addon/easy-password-generator";
|
||||
else
|
||||
return "mailto:feedback@xfox111.net";
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
import { Button, Text, Dialog, DialogTrigger, DialogSurface, DialogTitle, DialogBody, DialogActions, DialogContent } from "@fluentui/react-components";
|
||||
import { Table, TableHeader, TableRow, TableHeaderCell, TableBody, TableCell } from "@fluentui/react-components/unstable";
|
||||
import { Button, Text, Dialog, DialogTrigger, DialogSurface, DialogTitle, DialogBody, DialogActions, DialogContent, Table, TableHeader, TableRow, TableHeaderCell, TableBody, TableCell } from "@fluentui/react-components";
|
||||
import { QuestionCircleRegular } from "@fluentui/react-icons";
|
||||
import React from "react";
|
||||
import Generator from "../Utils/Generator";
|
||||
|
||||
@@ -64,12 +64,14 @@ export default class SettingsSection extends React.Component<IProps>
|
||||
</div>
|
||||
<Divider />
|
||||
<div className="stack">
|
||||
<div>
|
||||
<Checkbox
|
||||
checked={ settings.AddContext }
|
||||
onChange={ (_, e) => Settings.Update({ AddContext: e.checked as boolean }) }
|
||||
label={
|
||||
<Tooltip content={ loc("Right-click password field to quickly generate password") } relationship="description">
|
||||
<Checkbox label={ <Text>{ loc("Add shortcut to context menu") } <QuestionCircleRegular /></Text> }
|
||||
checked={ settings.AddContext } onChange={ (_, e) => Settings.Update({ AddContext: e.checked as boolean }) } />
|
||||
<Text>{ loc("Add shortcut to context menu") } <QuestionCircleRegular /></Text>
|
||||
</Tooltip>
|
||||
</div>
|
||||
} />
|
||||
<Checkbox label={ loc("Automatically copy to clipboard") }
|
||||
checked={ settings.Autocopy } onChange={ (_, e) => Settings.Update({ Autocopy: e.checked as boolean }) } />
|
||||
</div>
|
||||
|
||||
@@ -0,0 +1,55 @@
|
||||
.snowflakeContainer
|
||||
{
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
pointer-events: none;
|
||||
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.snowflake
|
||||
{
|
||||
--size: 1px;
|
||||
width: var(--size);
|
||||
height: var(--size);
|
||||
background: white;
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
top: -5px;
|
||||
|
||||
@media (prefers-color-scheme: light)
|
||||
{
|
||||
background: var(--colorPalettePlatinumBorderActive);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes snowfall
|
||||
{
|
||||
0%
|
||||
{
|
||||
transform: translate3d(var(--left-ini), 0, 0);
|
||||
opacity: .6;
|
||||
}
|
||||
|
||||
100%
|
||||
{
|
||||
transform: translate3d(var(--left-end), 610px, 0);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@for $i from 1 through 50
|
||||
{
|
||||
.snowflake:nth-child(#{$i})
|
||||
{
|
||||
--size: #{random(5)}px;
|
||||
--left-ini: #{random(20) - 10}vw;
|
||||
--left-end: #{random(20) - 10}vw;
|
||||
left: #{random(100)}vw;
|
||||
animation: snowfall #{5 + random(10)}s linear infinite;
|
||||
animation-delay: -#{random(10)}s;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,23 @@
|
||||
import React from "react";
|
||||
import "./Snow.scss";
|
||||
|
||||
export default class Snow extends React.Component
|
||||
{
|
||||
public render(): JSX.Element
|
||||
{
|
||||
// Show snowflakes only from 15th of December till 10th of January
|
||||
let now = new Date();
|
||||
|
||||
if (
|
||||
(now.getMonth() !== 11 || now.getDate() < 15) &&
|
||||
(now.getMonth() !== 0 || now.getDate() > 10)
|
||||
)
|
||||
return <></>;
|
||||
|
||||
return (
|
||||
<div className="snowflakeContainer">
|
||||
{ [...Array(50)].map((_, i) => <div key={i} className="snowflake" />) }
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -108,7 +108,9 @@ export default class Generator
|
||||
// min is inclusive, max is exclusive
|
||||
private static GetRandomInt(min: number, max: number): number
|
||||
{
|
||||
return Math.floor(Math.random() * (max - min)) + min;
|
||||
let arr = new Uint8Array(1);
|
||||
crypto.getRandomValues(arr);
|
||||
return Math.floor((arr[0] / 255) * (max - min)) + min;
|
||||
}
|
||||
|
||||
private static PickRandomFromArray(array: string): string
|
||||
|
||||
Reference in New Issue
Block a user