diff --git a/package-lock.json b/package-lock.json index d37a6a9..38a1a77 100644 --- a/package-lock.json +++ b/package-lock.json @@ -13,7 +13,9 @@ "@testing-library/user-event": "^13.5.0", "react": "^18.2.0", "react-dom": "^18.2.0", + "react-particles": "^2.9.3", "react-scripts": "5.0.1", + "tsparticles": "^2.9.3", "web-vitals": "^2.1.4" } }, @@ -14314,6 +14316,29 @@ "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==" }, + "node_modules/react-particles": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/react-particles/-/react-particles-2.9.3.tgz", + "integrity": "sha512-MptmCrrBeugweBWLx7IZyxMc8t8Ok128ygzQA5uLIPPGfH+ecVz033fd8V8ktv/YOBMLof7asjA9m5XSm1iu6A==", + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/matteobruni" + }, + { + "type": "buymeacoffee", + "url": "https://www.buymeacoffee.com/matteobruni" + } + ], + "hasInstallScript": true, + "dependencies": { + "fast-deep-equal": "^3.1.3", + "tsparticles-engine": "^2.9.3" + }, + "peerDependencies": { + "react": ">=16" + } + }, "node_modules/react-refresh": { "version": "0.11.0", "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.11.0.tgz", @@ -15947,6 +15972,412 @@ "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz", "integrity": "sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==" }, + "node_modules/tsparticles": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles/-/tsparticles-2.9.3.tgz", + "integrity": "sha512-9NB+zrmR3uaj/k0RZ8Awa4lhpq2PqYFR/jUhia/Z4tKwvNdIR4xkpd4NkkGn/xmqRFeN658xHxOE+yVU+y+XFA==", + "dependencies": { + "tsparticles-engine": "^2.9.3", + "tsparticles-interaction-external-trail": "^2.9.3", + "tsparticles-plugin-absorbers": "^2.9.3", + "tsparticles-plugin-emitters": "^2.9.3", + "tsparticles-slim": "^2.9.3", + "tsparticles-updater-destroy": "^2.9.3", + "tsparticles-updater-roll": "^2.9.3", + "tsparticles-updater-tilt": "^2.9.3", + "tsparticles-updater-twinkle": "^2.9.3", + "tsparticles-updater-wobble": "^2.9.3" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/matteobruni" + } + }, + "node_modules/tsparticles-engine": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-engine/-/tsparticles-engine-2.9.3.tgz", + "integrity": "sha512-iAD8LyRH//kx10fDMm6AfQV6dRHs1ZacUUHqVwfutcqM4x1IV2ygpjk0X87LKCnBxYeIMG78+tlxXpnpwUccOg==", + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/matteobruni" + }, + { + "type": "buymeacoffee", + "url": "https://www.buymeacoffee.com/matteobruni" + } + ], + "hasInstallScript": true + }, + "node_modules/tsparticles-interaction-external-attract": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-interaction-external-attract/-/tsparticles-interaction-external-attract-2.9.3.tgz", + "integrity": "sha512-iNAu0ECKLpUXQYJ84slBJjQVvvTW4S/8pqDylB+WCj52xh4xbhj0TxaaM4zpId9TUDCPd8F7GoTi2ZCDJKlodQ==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-interaction-external-bounce": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-interaction-external-bounce/-/tsparticles-interaction-external-bounce-2.9.3.tgz", + "integrity": "sha512-RuZaqSXpanEpA0ETXArIzKAhR3E1fKOpLEJkUeDeZRNMYEmMZfh0JR/vQ2qSIR6r24z+DuIbhz0h+K6zu0lmvg==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-interaction-external-bubble": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-interaction-external-bubble/-/tsparticles-interaction-external-bubble-2.9.3.tgz", + "integrity": "sha512-jMgCViRTydEm2Gks5BeJH4z7Qetnmideheipw5UKDlKghGSTHhm7R7LeOkcOWqJI5ul8yoSFi+uQfL85aIUFZw==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-interaction-external-connect": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-interaction-external-connect/-/tsparticles-interaction-external-connect-2.9.3.tgz", + "integrity": "sha512-SCtYe29pDKUxxjyp0n6l1YrayynHyvDrnygGWGIYrAp/oUXtIUHjEotu3M5JkwnUMxHyGkMB1cK8wtmY3dIiUA==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-interaction-external-grab": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-interaction-external-grab/-/tsparticles-interaction-external-grab-2.9.3.tgz", + "integrity": "sha512-424WCIR7guHPuSVzhqYXbUM4YS5cR/Tv6qpi5EeX/bSIdajZDSjmhin9HjBK219T9sedfdJnhioOsy42Wt1YbA==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-interaction-external-pause": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-interaction-external-pause/-/tsparticles-interaction-external-pause-2.9.3.tgz", + "integrity": "sha512-idVup6nQ59W8FSyq+zg2zUlW5RKnq5cWua/mAKEZuQFrYV01HA22I9T8UyPcquxgtlPJX+0L/PfZlBjmr3qayw==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-interaction-external-push": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-interaction-external-push/-/tsparticles-interaction-external-push-2.9.3.tgz", + "integrity": "sha512-KNWHJmAxFUpw2is6E3gMXNZ6VghEVxZEFx0if/PLALgGOTKVWiEyh/lyJ660Ftfec1m4oW/SI7gCR2r0BXjnpQ==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-interaction-external-remove": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-interaction-external-remove/-/tsparticles-interaction-external-remove-2.9.3.tgz", + "integrity": "sha512-35XRqQe4cCCjRIFkvRvjsIVeUI7+i9nqUsX4bkxK9H6kv+GbC4lS98peGk6PNPetJn6yeJivkrP64VjPVGFEFQ==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-interaction-external-repulse": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-interaction-external-repulse/-/tsparticles-interaction-external-repulse-2.9.3.tgz", + "integrity": "sha512-Q4A4n0Sl6tEWJVGvXhEr/x5PwsHfjCZfwfHhEF9CmzgSnVr75pQfNi09GlLvpjN63dPL4OAQVjBbceCkjcLtUw==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-interaction-external-slow": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-interaction-external-slow/-/tsparticles-interaction-external-slow-2.9.3.tgz", + "integrity": "sha512-7mj2Yi8menOnr4FwkcZvjzffco71P+lmH+NkIuXyuLQmmYURloCpUQ03pONqSfdYF+DSnreanXtiM0N7dc9sfw==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-interaction-external-trail": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-interaction-external-trail/-/tsparticles-interaction-external-trail-2.9.3.tgz", + "integrity": "sha512-BxmxfKxx7giWpp8ZWgfcO9MBI/BAYkhwr2QY3BGdk59jpp90Zxe7jNRSU5kMyhxOmD088F0B9lBEsu3L2G+VaQ==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-interaction-particles-attract": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-interaction-particles-attract/-/tsparticles-interaction-particles-attract-2.9.3.tgz", + "integrity": "sha512-ceWxtHxKLvB2IGtCzvunmjVaUeHXUT8tVtHDlxz72M87ZngcFsBoGy69ZjFS+U1EC5BZHQDYOC6Eknvazd2UuQ==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-interaction-particles-collisions": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-interaction-particles-collisions/-/tsparticles-interaction-particles-collisions-2.9.3.tgz", + "integrity": "sha512-7Wyf/XpgsklYgoB0dh+OHgY7IYhlgLRtHYryFMTodd36N6kWMwKo+6Mg5OvmbEeLQqU+hTUXiD2fjjzLMebKXw==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-interaction-particles-links": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-interaction-particles-links/-/tsparticles-interaction-particles-links-2.9.3.tgz", + "integrity": "sha512-ZcsgvpNNi4ma6yy4XIubuBaLd9hI6J2SgIi7Pz3I2QfkSsGmJPDNdRoN1AuLLwbb5T80X2mVw0bomPFuW6zSMg==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-move-base": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-move-base/-/tsparticles-move-base-2.9.3.tgz", + "integrity": "sha512-6/uO7N9HbVJokG8sjPF8YjJzkcnwELoZEkaiABX0mGxdICYCyjpjOdOfwF7UCf8Ctqh2/kxQjv4fk0Aj2Z3nag==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-move-parallax": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-move-parallax/-/tsparticles-move-parallax-2.9.3.tgz", + "integrity": "sha512-uFqtEtCWabC7XZLZ7icIYYF9XB2XfedT8rjcLtyuBymQX8pfMJ5HUtd3ONI6Cik7I+BtqOfAkuZqTDcBTs7zlA==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-particles.js": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-particles.js/-/tsparticles-particles.js-2.9.3.tgz", + "integrity": "sha512-UyAEoz3ZkjBXIwC4NRJWnD4KdntuZyIKlPDZOKWz8ZL9I8jEvlle9XdonDj5IsLAwySqIq7vom5OUeIrqXdxjQ==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/matteobruni" + } + }, + "node_modules/tsparticles-plugin-absorbers": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-plugin-absorbers/-/tsparticles-plugin-absorbers-2.9.3.tgz", + "integrity": "sha512-K4AmBqEWqcC8aXc+TEmv2GHIlZ+b1jAPtuYr30j1rZbaMK7kbvjvVmZbDNM2RJyuBqkuAoV/e3DAOuH5YpBs7g==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-plugin-easing-quad": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-plugin-easing-quad/-/tsparticles-plugin-easing-quad-2.9.3.tgz", + "integrity": "sha512-rttpIJSwhPFys/sAYuZSsw9rWCvnUZdX1ePU12eTgqcyIelBdiySs4LndCLIXnkuS+jMMSYw9BzTSGfNz+sZcQ==", + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/matteobruni" + }, + { + "type": "buymeacoffee", + "url": "https://www.buymeacoffee.com/matteobruni" + } + ], + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-plugin-emitters": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-plugin-emitters/-/tsparticles-plugin-emitters-2.9.3.tgz", + "integrity": "sha512-G0rs7lL9xjbFGkWr+XDsDpyghTjiHq7oPAZyUe0c/3p0JETwQgZ63/egluYU1p3uWJj34KjgjHD3GZqjyfI95Q==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-shape-circle": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-shape-circle/-/tsparticles-shape-circle-2.9.3.tgz", + "integrity": "sha512-d+PjFELhoCzPf2G+XKIew3Ho/Ql2fHzY0TrrIKVHzHufqWdQCWrhxNri2v0POLJFkcIYqvFThxM23I/cyKPgQw==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-shape-image": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-shape-image/-/tsparticles-shape-image-2.9.3.tgz", + "integrity": "sha512-yV3FAcqJ91EYG59OJ1SmShbogVs/uyk12u6LFTJnD2pmfdNwTeGpKMr3Cus5xJHQwJnFWufwkpOlBUxw55J/5g==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-shape-line": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-shape-line/-/tsparticles-shape-line-2.9.3.tgz", + "integrity": "sha512-uREd1nJYTUzHrXh1FcdhCx5jA0hYtuJXyUiG3es9p3VyFM/f8ookGj8Ke/C48p90IOQMWuT9DyaEDnGs+hbcVQ==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-shape-polygon": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-shape-polygon/-/tsparticles-shape-polygon-2.9.3.tgz", + "integrity": "sha512-qw580qr2VQveN1Q3kllhieW4GzB3t8fjlIRKZ0QG05npCG+ewBdXbD5G/9yfjGa1fTwCbHCfLoAFojjV15MBmg==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-shape-square": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-shape-square/-/tsparticles-shape-square-2.9.3.tgz", + "integrity": "sha512-VjRNALTt34arsN2UAxaWa43gvdaQQbk7OluLB912u1UzLFbdCccE/sr7pjyLqYaf6F+ndnjnzVygNb/kRxX1uQ==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-shape-star": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-shape-star/-/tsparticles-shape-star-2.9.3.tgz", + "integrity": "sha512-/nJdrHEq05dcVwLK+8i+QD3do+RNWrSvU1efVsOMzgLajH5s2mlSfyFcUSCQrmnmP7d6MpYZpbxa2KnpDSfW8g==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-shape-text": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-shape-text/-/tsparticles-shape-text-2.9.3.tgz", + "integrity": "sha512-V9U8VE2am1JWabiHAhTzAg0uG8j92BnfwmgRfWjg/w4eMFF2uyyBHQDHIFzhZFDbDbqIxttXngkfivAqRdUzhw==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-slim": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-slim/-/tsparticles-slim-2.9.3.tgz", + "integrity": "sha512-lq8qePcf/lQ5HezR/gpIDn4UJUp8G+33MB7GkhpwmpQpJyoteT5nlXkLxgaedGZFkZAoTKINuU9NUW1Ci6MX4w==", + "dependencies": { + "tsparticles-engine": "^2.9.3", + "tsparticles-interaction-external-attract": "^2.9.3", + "tsparticles-interaction-external-bounce": "^2.9.3", + "tsparticles-interaction-external-bubble": "^2.9.3", + "tsparticles-interaction-external-connect": "^2.9.3", + "tsparticles-interaction-external-grab": "^2.9.3", + "tsparticles-interaction-external-pause": "^2.9.3", + "tsparticles-interaction-external-push": "^2.9.3", + "tsparticles-interaction-external-remove": "^2.9.3", + "tsparticles-interaction-external-repulse": "^2.9.3", + "tsparticles-interaction-external-slow": "^2.9.3", + "tsparticles-interaction-particles-attract": "^2.9.3", + "tsparticles-interaction-particles-collisions": "^2.9.3", + "tsparticles-interaction-particles-links": "^2.9.3", + "tsparticles-move-base": "^2.9.3", + "tsparticles-move-parallax": "^2.9.3", + "tsparticles-particles.js": "^2.9.3", + "tsparticles-plugin-easing-quad": "^2.9.3", + "tsparticles-shape-circle": "^2.9.3", + "tsparticles-shape-image": "^2.9.3", + "tsparticles-shape-line": "^2.9.3", + "tsparticles-shape-polygon": "^2.9.3", + "tsparticles-shape-square": "^2.9.3", + "tsparticles-shape-star": "^2.9.3", + "tsparticles-shape-text": "^2.9.3", + "tsparticles-updater-angle": "^2.9.3", + "tsparticles-updater-color": "^2.9.3", + "tsparticles-updater-life": "^2.9.3", + "tsparticles-updater-opacity": "^2.9.3", + "tsparticles-updater-out-modes": "^2.9.3", + "tsparticles-updater-size": "^2.9.3", + "tsparticles-updater-stroke-color": "^2.9.3" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/matteobruni" + } + }, + "node_modules/tsparticles-updater-angle": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-updater-angle/-/tsparticles-updater-angle-2.9.3.tgz", + "integrity": "sha512-Z8VLOw2UUxrvV3YH44My5kmeBUcJUHTSCMRUIqFvgvxDs0Q/g2eVWkr1L+Crpw6PE5FJMdDGWRjWwxMwNdVfuQ==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-updater-color": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-updater-color/-/tsparticles-updater-color-2.9.3.tgz", + "integrity": "sha512-eBJ7ZNsG3uCQlpfEf2FocsHLlMnd/vgWPZtOr2Iu7KA2OR3zy7u62D/oiRZkZEWtjhh5GlPrsy7njo6oToRBNQ==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-updater-destroy": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-updater-destroy/-/tsparticles-updater-destroy-2.9.3.tgz", + "integrity": "sha512-SRgFISarsLpNz/gnMvkCFV2uITpwkUX5Fva34DVWHK6glY0053x2uvtUQluwHfp6DIJAueRMRhZ0dmzVltdOLw==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-updater-life": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-updater-life/-/tsparticles-updater-life-2.9.3.tgz", + "integrity": "sha512-VUeWBCLKoLd69+C9CFHjVG0SaqCbMgQqag6NIGMqTmaaZNFcn1H8rheIG9NU70UOTsYRMPfwmZK1SKnqAK6jQQ==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-updater-opacity": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-updater-opacity/-/tsparticles-updater-opacity-2.9.3.tgz", + "integrity": "sha512-ON5t2qeegnm+MsmaF6ZvhUmKLzk/zXozsw9Dsgw8iJYX8WmQmp2VC72COTzADW495ovwGjBiR1KFelM/GVfHgg==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-updater-out-modes": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-updater-out-modes/-/tsparticles-updater-out-modes-2.9.3.tgz", + "integrity": "sha512-LEcAIeK8b3ovLGuuTob1L3o57XodqRuvDjtUT2TiNIC6cf3QMAnqujwAyvBLJrYAuwr7rG1fXEEt9tovFYg+tw==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-updater-roll": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-updater-roll/-/tsparticles-updater-roll-2.9.3.tgz", + "integrity": "sha512-I/9vB1wA3RKwfeRPlw7nrxUW8uxcajwba+gxFEcIDx2C+OA2UVIuGzOQE59O2sppqLqwrcLOm3ayTt5se1qbpw==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-updater-size": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-updater-size/-/tsparticles-updater-size-2.9.3.tgz", + "integrity": "sha512-6qQ8T+7wt/B4BD5K1LWEXrfan+h2utSY1zNhE1cTcAQUDrrU06g/tfMkbrpMdduu6RWwGtoC4OsciCnBuiLEYQ==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-updater-stroke-color": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-updater-stroke-color/-/tsparticles-updater-stroke-color-2.9.3.tgz", + "integrity": "sha512-zEjn8vLeoGsP0kPEg0L65wwhm7c5s7QD5cWeSz0mJVibwpV+C16K20kcSjkI57QUMAFQXwgGJ9M0grgCQsiawA==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-updater-tilt": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-updater-tilt/-/tsparticles-updater-tilt-2.9.3.tgz", + "integrity": "sha512-x1EDyvBfqgBh1021lohf2shn+V6U9WhMasGD+fKugwRxNZ0nAe5DK0wop/26L2MUIb+AbIg2sXPdxuv1zE7G7w==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-updater-twinkle": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-updater-twinkle/-/tsparticles-updater-twinkle-2.9.3.tgz", + "integrity": "sha512-IHxKAYBRpBiOBtU/8Wh1wv8wCQa2dC5K+LPjDw3JTyzPmPnskjGiHXiPyZTbHPdAqrSQ29jJCfJwn0HAIqEjwQ==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, + "node_modules/tsparticles-updater-wobble": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/tsparticles-updater-wobble/-/tsparticles-updater-wobble-2.9.3.tgz", + "integrity": "sha512-/Doid0P/OjaO9cUzD/Z3j0GNA+8X3DUvVsOo/5mPt914PJBbcWYGpweE8u75ZPcHe9OM5u6CHFMf3PMurCEBCw==", + "dependencies": { + "tsparticles-engine": "^2.9.3" + } + }, "node_modules/tsutils": { "version": "3.21.0", "resolved": "https://registry.npmjs.org/tsutils/-/tsutils-3.21.0.tgz", diff --git a/package.json b/package.json index a7abb88..3acb8f2 100644 --- a/package.json +++ b/package.json @@ -8,7 +8,9 @@ "@testing-library/user-event": "^13.5.0", "react": "^18.2.0", "react-dom": "^18.2.0", + "react-particles": "^2.9.3", "react-scripts": "5.0.1", + "tsparticles": "^2.9.3", "web-vitals": "^2.1.4" }, "scripts": { diff --git a/public/favicon.ico b/public/favicon.ico index a11777c..0d5db4d 100644 Binary files a/public/favicon.ico and b/public/favicon.ico differ diff --git a/public/index.html b/public/index.html index aa069f2..1fd152c 100644 --- a/public/index.html +++ b/public/index.html @@ -7,37 +7,13 @@ - - - - - React App + + Welcome to Docker
- diff --git a/public/logo192.png b/public/logo192.png deleted file mode 100644 index fc44b0a..0000000 Binary files a/public/logo192.png and /dev/null differ diff --git a/public/logo512.png b/public/logo512.png deleted file mode 100644 index a4e47a6..0000000 Binary files a/public/logo512.png and /dev/null differ diff --git a/public/manifest.json b/public/manifest.json deleted file mode 100644 index 080d6c7..0000000 --- a/public/manifest.json +++ /dev/null @@ -1,25 +0,0 @@ -{ - "short_name": "React App", - "name": "Create React App Sample", - "icons": [ - { - "src": "favicon.ico", - "sizes": "64x64 32x32 24x24 16x16", - "type": "image/x-icon" - }, - { - "src": "logo192.png", - "type": "image/png", - "sizes": "192x192" - }, - { - "src": "logo512.png", - "type": "image/png", - "sizes": "512x512" - } - ], - "start_url": ".", - "display": "standalone", - "theme_color": "#000000", - "background_color": "#ffffff" -} diff --git a/src/App.css b/src/App.css index 74b5e05..06c54d2 100644 --- a/src/App.css +++ b/src/App.css @@ -7,14 +7,8 @@ pointer-events: none; } -@media (prefers-reduced-motion: no-preference) { - .App-logo { - animation: App-logo-spin infinite 20s linear; - } -} - .App-header { - background-color: #282c34; + background-color: #003f8c; min-height: 100vh; display: flex; flex-direction: column; @@ -28,11 +22,35 @@ color: #61dafb; } -@keyframes App-logo-spin { - from { - transform: rotate(0deg); - } - to { - transform: rotate(360deg); - } + +.fa { + padding: 20px; + font-size: 30px; + width: 50px; + margin: 10px; + text-align: center; + text-decoration: none; +} + +.fa:hover { + opacity: 0.7; } + + +/* Twitter */ +.fa-twitter { + background: #55ACEE; + color: white; +} + +/* Linkedin */ +.fa-linkedin { + background: #55ACEE; + color: white; +} + +/* Reddit */ +.fa-reddit { + background: #55ACEE; + color: white; +} \ No newline at end of file diff --git a/src/App.js b/src/App.js index 3784575..1f80b6d 100644 --- a/src/App.js +++ b/src/App.js @@ -1,22 +1,27 @@ -import logo from './logo.svg'; +import logo from './baby_moby.png'; import './App.css'; +import Confetti from './Confetti'; -function App() { +const shareMessage = 'I just published an article on how you can share content to Twitter from the client website' +const shareLink = 'https://docker.com/' + +const App = () => { return (
+
logo -

- Edit src/App.js and save to reload. +

+ Congratulations!!! +

+

+ You just run your first container.

- - Learn React - +
+ + + +
); diff --git a/src/Confetti.js b/src/Confetti.js new file mode 100644 index 0000000..48d7005 --- /dev/null +++ b/src/Confetti.js @@ -0,0 +1,177 @@ +import Particles from "react-particles"; +import { useCallback } from "react"; +import { loadFull } from "tsparticles"; + +const Confetti = () => { + + const particlesInit = useCallback(async engine => { + console.log(engine); + // you can initiate the tsParticles instance (engine) here, adding custom shapes or presets + // this loads the tsparticles package bundle, it's the easiest method for getting everything ready + // starting from v2 you can add only the features you need reducing the bundle size + await loadFull(engine); + }, []); + + const particlesLoaded = useCallback(async container => { + await console.log(container); + }, []); + + return ( + + ); +} + +export default Confetti; diff --git a/src/baby_moby.png b/src/baby_moby.png new file mode 100644 index 0000000..fbe5b00 Binary files /dev/null and b/src/baby_moby.png differ diff --git a/src/index.css b/src/index.css index ec2585e..104913f 100644 --- a/src/index.css +++ b/src/index.css @@ -8,6 +8,6 @@ body { } code { - font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', + font-family: source-code-pro, Menlo, Monaco, Consolas, 'Roboto', monospace; } diff --git a/src/logo.svg b/src/logo.svg deleted file mode 100644 index 9dfc1c0..0000000 --- a/src/logo.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file