circle-mesh - npm Package Compare versions

Comparing version 1.0.2 to 1.0.3

index.jsx

 import React from "react";
 import * as THREE from "three";
 import TweenMax from "gsap/TweenMax";
-import "./styles.css";
-import dot from "./dot.png";
 
@@ -48,3 +46,5 @@ class CircleMesh extends React.Component {
     loader.crossOrigin = "";
-    var dotTexture = loader.load(dot);
+    var dotTexture = loader.load(
+      "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAMAAACdt4HsAAAAz1BMVEX////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////LRjS1AAAARHRSTlMAAXQGVQ0Qf+1UxKXMkNth67fqI6StG/IzjPCE8e7XYFbVJI0dfcvjgMPY7Pnlpjsi4DrW2hweiQyPEoqLgdmI5PX63dUi/vUAAAFvSURBVHhepddnU/JAAATgvUgSUkFBqhQFewd7e9v+/9/0jiPjiIaQ3D7f72aSa7tYpRXsRweHbbJ9eBDtBy2U0pkM+c1w0kFBrrPLTLuOi/U8v8qVqr6HfGZUZ676yCDHXsi1wgZWquywgJ0KspkuC+oaZNiIWFi0kTF+kyVs/pjBNFlK02DZL5Z0jyUBS1tai6seS+td4ZM5poVjgwWMaKWGBW+LVrY8fPBpycc7PFRpqerinUNrDgCYG1pLDYAZBTMAjxQkAIYUnAC3lEwRUDJGn5I+tinZRkxJjHNKrtGm5BTUnMkTyJ8g/0R5GeWNpG/lsXqYppTcAScUvAFI1CvtkoJLACbVrnX9YYE7oKWBKz6uR+rz/oSFmhgwYEJaCA0+NWxCVgNfVMSYBzyzpBc56qphW437auEQK49cunKY2rraVzPI5x3lFc9Xr1D1nTPT3HFRUCdJ+U2adFBKK/Av4t9/+HfwL77wV9f//7ErSpBKzt70AAAAAElFTkSuQmCC"
+    );
     var dotsAmount = 3000;
@@ -240,3 +240,15 @@ var dotsGeometry = new THREE.Geometry();
   render() {
-    return <canvas className="scene scene--full" id="mesh-circle-canvas" />;
+    return (
+      <React.Fragment>
+        <style>
+          {`.mesh-circle-scene {
+              position: absolute;
+              z-index: -99;
+              width: 100%;
+              height: 100vh;
+            }`}
+        </style>
+        <canvas className="mesh-circle-scene" id="mesh-circle-canvas" />
+      </React.Fragment>
+    );
   }
@@ -243,0 +255,0 @@ }

package.json

 {
   "name": "circle-mesh",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "description": "React component from Tympanus demo",
@@ -9,4 +9,4 @@ "main": "dist/index.js",
     "clean": "rimraf -rf ./dist",
-    "build": "parcel build index.jsx",
-    "start": "parcel index.html"
+    "build": "parcel build index.jsx --global circle-mesh",
+    "start-demo": "npm run build && parcel example/src/index.html --out-dir example/dist --open"
   },
@@ -13,0 +13,0 @@ "repository": {

README.md

@@ -25,4 +25,3 @@ # React Component for [This Demo](https://tympanus.net/Development/DecorativeBackgrounds/index.html)
 $ npm install
-$ npm run build
-$ npm start
+$ npm run start-demo
 ```
@@ -29,0 +28,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

10434858

increased by0.02%

Lines of code

2978

increased by0.27%

Worsened metrics

Number of package files

10

decreased by-23.08%

Number of lines in readme file

35

decreased by-2.78%

No dependency changes