New Featured Skins/Heads,

FA,

Author: RepGraphics

images/faces/84a709f7579c950c8f0c2b8382ca7a02f2ee7dac97c15c3986c5462f85fc8ad4.png

@@ -1,6 +1,6 @@
 {
   "name": "nitrocraft",
-  "version": "1.1.6",
+  "version": "1.1.8",
   "private": false,
   "type": "module",
   "scripts": {

images/skins/84a709f7579c950c8f0c2b8382ca7a02f2ee7dac97c15c3986c5462f85fc8ad4.png

@@ -535,6 +535,59 @@ document.addEventListener("DOMContentLoaded", function() {
     sdkSnippetCode.textContent = snippet;
   }
 
+  function setCodeCopyButtonState(button, state) {
+    if (!button) {
+      return;
+    }
+
+    var icon = button.querySelector(".fa-solid");
+    button.classList.remove("is-copied");
+    button.classList.remove("is-error");
+
+    if (state === "copied") {
+      button.classList.add("is-copied");
+      button.setAttribute("aria-label", "Copied endpoint");
+      if (icon) {
+        icon.className = "fa-solid fa-check";
+      }
+      return;
+    }
+
+    if (state === "error") {
+      button.classList.add("is-error");
+      button.setAttribute("aria-label", "Copy failed");
+      if (icon) {
+        icon.className = "fa-solid fa-clipboard";
+      }
+      return;
+    }
+
+    button.setAttribute("aria-label", "Copy endpoint");
+    if (icon) {
+      icon.className = "fa-solid fa-clipboard";
+    }
+  }
+
+  function clearCodeCopyButtonReset(button) {
+    if (!button || !button.dataset) {
+      return;
+    }
+    var existingTimer = Number(button.dataset.resetTimer || "0");
+    if (existingTimer) {
+      window.clearTimeout(existingTimer);
+    }
+    delete button.dataset.resetTimer;
+  }
+
+  function scheduleCodeCopyButtonReset(button) {
+    clearCodeCopyButtonReset(button);
+    var timer = window.setTimeout(function() {
+      setCodeCopyButtonState(button, "idle");
+      clearCodeCopyButtonReset(button);
+    }, 1200);
+    button.dataset.resetTimer = String(timer);
+  }
+
   function setupCodeCopyButtons() {
     for (var c = 0; c < codeBlocks.length; c++) {
       var block = codeBlocks[c];
@@ -547,12 +600,20 @@ document.addEventListener("DOMContentLoaded", function() {
       button.type = "button";
       button.className = "code-copy";
       button.setAttribute("aria-label", "Copy endpoint");
-      button.textContent = "Copy";
+
+      var icon = document.createElement("i");
+      icon.className = "fa-solid fa-clipboard";
+      icon.setAttribute("aria-hidden", "true");
+      button.appendChild(icon);
+
+      setCodeCopyButtonState(button, "idle");
       block.appendChild(button);
 
       button.addEventListener("click", function(e) {
         e.preventDefault();
         var currentButton = this;
+        clearCodeCopyButtonReset(currentButton);
+        setCodeCopyButtonState(currentButton, "idle");
         var source = currentButton.parentNode;
         if (!source) {
           return;
@@ -567,15 +628,11 @@ document.addEventListener("DOMContentLoaded", function() {
           return;
         }
         copyToClipboard(text).then(function() {
-          currentButton.textContent = "Copied";
-          window.setTimeout(function() {
-            currentButton.textContent = "Copy";
-          }, 1200);
+          setCodeCopyButtonState(currentButton, "copied");
+          scheduleCodeCopyButtonReset(currentButton);
         }).catch(function() {
-          currentButton.textContent = "Error";
-          window.setTimeout(function() {
-            currentButton.textContent = "Copy";
-          }, 1200);
+          setCodeCopyButtonState(currentButton, "error");
+          scheduleCodeCopyButtonReset(currentButton);
         });
       });
     }

package.json

@@ -0,0 +1,27 @@
+@font-face {
+  font-family: "Font Awesome 6 Free";
+  font-style: normal;
+  font-weight: 900;
+  font-display: block;
+  src: url("/vendor/fontawesome/webfonts/fa-solid-900.woff2") format("woff2");
+}
+
+.fa-solid {
+  display: inline-block;
+  font-family: "Font Awesome 6 Free";
+  font-style: normal;
+  font-variant: normal;
+  font-weight: 900;
+  line-height: 1;
+  text-rendering: auto;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.fa-clipboard::before {
+  content: "\f0ea";
+}
+
+.fa-check::before {
+  content: "\f00c";
+}

public/javascript/nitrocraft.js

@@ -309,21 +309,27 @@ code {
 }
 
 .code.with-copy {
-  padding-right: 4.8rem;
+  padding-right: 3.1rem;
 }
 
 .code-copy {
   position: absolute;
-  top: 0.44rem;
-  right: 0.45rem;
+  top: 0.42rem;
+  right: 0.42rem;
+  width: 2rem;
+  height: 2rem;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
   border: 1px solid rgba(var(--docs-accent-rgb), 0.42);
   border-radius: 999px;
   background: rgba(8, 14, 27, 0.92);
   color: var(--docs-text);
-  font-size: 0.74rem;
+  font-size: 0.86rem;
   line-height: 1;
-  padding: 0.3rem 0.55rem;
+  padding: 0;
   cursor: pointer;
+  transition: border-color 120ms ease, background-color 120ms ease, color 120ms ease;
 }
 
 .code-copy:hover {
@@ -336,6 +342,22 @@ code {
   outline-offset: 2px;
 }
 
+.code-copy .fa-solid {
+  pointer-events: none;
+}
+
+.code-copy.is-copied {
+  border-color: rgba(34, 197, 94, 0.72);
+  background: rgba(6, 33, 17, 0.92);
+  color: #4ade80;
+}
+
+.code-copy.is-error {
+  border-color: rgba(248, 113, 113, 0.7);
+  background: rgba(38, 11, 11, 0.92);
+  color: #fca5a5;
+}
+
 .jumbotron {
   width: min(1380px, calc(100% - 2rem));
   margin: 1rem auto 0;
@@ -903,6 +925,9 @@ footer#footer .container.row {
 .avatar.u26bz {background-image: url("/avatars/15851079f1d24d418207ce9f914e966d?size=64")}
 .avatar.u26bz:hover {background-image: url("/avatars/15851079f1d24d418207ce9f914e966d?size=64&overlay")}
 
+.avatar.connols {background-image: url("/avatars/5e23737cc1994b7ab18512ca6bd7da94?size=64")}
+.avatar.connols:hover {background-image: url("/avatars/5e23737cc1994b7ab18512ca6bd7da94?size=64&overlay")}
+
 .avatar.jake_0 {background-image: url("/avatars/2d5aa9cdaeb049189930461fc9b91cc5?size=64")}
 .avatar.jake_0:hover {background-image: url("/avatars/2d5aa9cdaeb049189930461fc9b91cc5?size=64&overlay")}
 

public/stylesheets/fontawesome-local.css

@@ -142,6 +142,7 @@ export default defineEventHandler((event) => {
     <link rel="icon" type="image/x-icon" href="/NitroCraft.ico">
     <link rel="apple-touch-icon" href="/NitroCraft.png">
     <link rel="manifest" href="/site.webmanifest">
+    <link rel="stylesheet" href="/stylesheets/fontawesome-local.css">
     <link rel="stylesheet" href="/stylesheets/style.css">
     <meta name="description" content="${metaDescription}">
     <meta name="keywords" content="minecraft, avatar, renders, skins, uuid, nitrocraft">
@@ -194,6 +195,7 @@ export default defineEventHandler((event) => {
           <button type="button" class="avatar-picker is-active" data-uuid="ae795aa86327408e92ab25c8a59f3ba1" title="jomo" aria-label="Use jomo UUID"><span class="avatar jomo"></span></button>
           <button type="button" class="avatar-picker" data-pinned="true" data-uuid="d634462bd663401d9788a8596307bc4d" title="RepGraphics" aria-label="Use RepGraphics UUID"><span class="avatar repgraphics"></span></button>
           <button type="button" class="avatar-picker" data-pinned="true" data-uuid="15851079f1d24d418207ce9f914e966d" title="26bz" aria-label="Use 26bz UUID"><span class="avatar u26bz"></span></button>
+          <button type="button" class="avatar-picker" data-pinned="true" data-uuid="5e23737cc1994b7ab18512ca6bd7da94" title="Connols" aria-label="Use Connols UUID"><span class="avatar connols"></span></button>
           <button type="button" class="avatar-picker" data-uuid="2d5aa9cdaeb049189930461fc9b91cc5" title="jake_0" aria-label="Use jake_0 UUID"><span class="avatar jake_0"></span></button>
           <button type="button" class="avatar-picker" data-uuid="0ea8eca3dbf647cc9d1ac64551ca975c" title="sk89q" aria-label="Use sk89q UUID"><span class="avatar sk89q"></span></button>
           <button type="button" class="avatar-picker" data-uuid="af74a02d19cb445bb07f6866a861f783" title="md_5" aria-label="Use md_5 UUID"><span class="avatar md_5"></span></button>