js-object-to-css - npm Package Compare versions

Comparing version 1.0.1 to 1.1.0

package.json

 {
   "name": "js-object-to-css",
-  "version": "1.0.1",
+  "version": "1.1.0",
   "description": "convert JavaScript objects to CSS",
   "main": "index.js",
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "test": "node test/Test.js",
+    "build": "npx rollup --config rollup.config.mjs"
   },
@@ -17,3 +18,9 @@ "author": "",
     "url": "https://github.com/RoryVelthuis/JS-Object-To-CSS.git"
+  },
+  "devDependencies": {
+    "@rollup/plugin-commonjs": "^25.0.1",
+    "@rollup/plugin-node-resolve": "^15.1.0",
+    "@rollup/plugin-terser": "^0.4.3",
+    "rollup-plugin-terser": "^7.0.2"
   }
 }

README.md

@@ -5,16 +5,33 @@ # JS-Object-To-CSS
 
+### Features
+
+The JS Object to CSS library provides the following features:
+
+1. Conversion of JavaScript objects to CSS.
+2. Support for nested selectors.
+3. The library includes a ObjectToCSS function that takes a JavaScript object representing CSS styles and converts it to a CSS string. Nested selectors are supported, allowing you to create hierarchical CSS structures easily.
+
 ## Installation
 
-To use the Object to CSS library in your project, follow these steps:
+Install the library into your project directory using npm:
 
-1. Clone or download the repository to your local machine.
+```npm install js-object-to-css```
 
-2. Copy the files into your projects directory.
+### Node.js Environment
 
-or:
+Import the ObjectToCSS function from the library in a Node.js environment,
 
-1. Clone the repository into your project directory with the following command:
+``` const { ObjectToCSS } = require('js-object-to-css'); ```
 
-```git clone https://github.com/RoryVelthuis/JS-Object-To-CSS.git```
+### Browser/Framework Environment
 
+Import the ObjectToCSS function from the library in a Browser/Framework environment:
+
+``` import { ObjectToCSS } from 'js-object-to-css'; ```
+
+Alternatively, you can choose to import the package through an HTML script tag using the unpkg CDN:
+
+``` <script src="https://unpkg.com/js-object-to-css@1.1.0/dist/bundle.js"></script> ```
+
+
 ## Usage
@@ -54,1 +71,62 @@
 ```
+
+The output CSS will be:
+
+```
+h1 {
+  color: blue;
+  font-size: 24px;
+}
+
+.container {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+```
+
+Example with nested selectors:
+
+```
+const { ObjectToCSS } = require('js-object-to-css');
+
+const obj = {
+  '.container': {
+    'display': 'flex',
+    'justify-content': 'center',
+    'align-items': 'center',
+    '.nested': {
+      'background-color': 'red',
+      'color': 'white',
+    },
+  },
+  'h1': {
+    'color': 'blue',
+    'font-size': '24px',
+  },
+};
+
+const style = ObjectToCSS(obj);
+
+console.log(style);
+```
+
+The output CSS will be:
+
+```
+.container {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.container .nested {
+  background-color: red;
+  color: white;
+}
+
+h1 {
+  color: blue;
+  font-size: 24px;
+}
+```

Fixed alerts

No tests

Quality

Package does not have any tests. This is a strong signal of a poorly maintained or low quality package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

7220

199.21%

Number of package files

5

25%

Lines of code

132

277.14%

Number of low quality alerts

1

-50%

Number of lines in readme file

130

145.28%

Worsened metrics

Dev dependency count

4

Infinity%

No dependency changes