Update items to latest version, replace png with webp and update conv…

…ert script
1e4 · Aug 25, 2022 · 19e7e90 · 19e7e90
1 parent 36800e8
commit 19e7e90
Show file tree

Hide file tree

Showing 7 changed files with 24,265 additions and 25,055 deletions.
diff --git a/InvSprite.webp b/InvSprite.webp
diff --git a/README.md b/README.md
@@ -9,14 +9,14 @@ Using Minecraft Wikis sprite and data returned [here](https://minecraft.fandom.c
 Import the stylesheet provided
 
 ```css
-@import "./minecraft-items-spritesheet.css"
+@import "./minecraft-items-spritesheet.css";
 ```
 
-Copy the spritesheet in the repository to the same place as the ``index.html` or you can override where the location is with
+Copy the spritesheet in the repository to the same place as the `index.html` or you can override where the location is with
 
 ```css
 .icon-32 {
-    background-image: url('./mcsprite.png');
+    background-image: url('./InvSprite.webp');
 }
 ```
 

diff --git a/convert.js b/convert.js
@@ -1,32 +1,31 @@
 const {items, sections} = require('./items');
 const fs = require('fs');
 
-let css = `
-  .icon-32 {
-    background-image: url('./mcsprite.png');
-    image-rendering: crisp-edges;
-    display:inline-block;
-    height:calc(32px / var(--n));
-    width:calc(32px / var(--n));
-    background-position:calc(var(--j)/var(--n) * 32px) calc(var(--i)/var(--n) * 32px);
-    background-size:calc(1024px / var(--n)) calc(3648px / var(--n));
-  }
-  
-  .icon-size-64 {
-    --n:0.5 !important;
-  }
-  
-  .icon-size-128 {
-    --n:0.25 !important;
-  }
-  
-  .icon-size-256 {
-    --n:0.125 !important;
-  }
-  
-  .icon-size-512 {
-    --n:0.0625 !important;
-  }
+let css = `.icon-32 {
+  background-image: url('./InvSprite.webp');
+  image-rendering: crisp-edges;
+  display:inline-block;
+  height:calc(32px / var(--n));
+  width:calc(32px / var(--n));
+  background-position:calc(var(--j)/var(--n) * 32px) calc(var(--i)/var(--n) * 32px);
+  background-size:calc(1024px / var(--n)) calc(3648px / var(--n));
+}
+
+.icon-size-64 {
+  --n:0.5 !important;
+}
+
+.icon-size-128 {
+  --n:0.25 !important;
+}
+
+.icon-size-256 {
+  --n:0.125 !important;
+}
+
+.icon-size-512 {
+  --n:0.0625 !important;
+}
 `;
 
 let html = `<head><title>Demo of Minecraft Items as CSS</title><link rel="stylesheet" href="./minecraft-items-spritesheet.css"></head><body>`;
@@ -46,15 +45,14 @@ for (const item in items) {
     className = remap[className];
   }
 
-  css += `
-    .${className} {
-    --n:1; /* scale */
-    
-    /* coordinates of the image */
-    --i:-${row + 1}; 
-    --j:-${column}; 
-    }
-  `
+  css += `.${className} {
+  --n:1; /* scale */
+  
+  /* coordinates of the image */
+  --i:-${row + 1}; 
+  --j:-${column}; 
+}
+`
 
   html += `<br>
 <br>
@@ -72,14 +70,14 @@ ${item}
 
 html += `</body>`;
 
-fs.writeFile("./minecraft-items-spritesheet.css", css, (err) => {
+fs.writeFile("minecraft-items-spritesheet.css", css, (err) => {
   if(!err)
     console.log("Style written")
   else
     console.log(err)
 })
 
-fs.writeFile("./index.html", html, (err) => {
+fs.writeFile("index.html", html, (err) => {
   if (!err)
     console.log("File saved")
   else