哪吒监控 V1---自定义代码分享

<script>
window.CustomBackgroundImage="图片URL"; /* 页面背景图 */
</script>

<script src="https://cdn.jsdelivr.net/gh/mocchen/cssmeihua/js/aixin.js"></script>/* 点击爱心特效 */

<script src="https://cdn.jsdelivr.net/gh/mocchen/cssmeihua/js/yinghua.js"></script>/* 页面樱花效果 */

<span class="js-cursor-container"></span>
<script src="https://fastly.jsdelivr.net/gh/stevenjoezhang/live2d-widget@latest/autoload.js"></script>
<script src="https://cdn.jsdelivr.net/gh/mocchen/cssmeihua/js/xiaoxingxing.js"></script>
/* 以上鼠标特效 */

<script>
var observer = new MutationObserver(function(mutationsList, observer) {
    var xpath = "/html/body/div/div/main/div[2]/section[1]/div[4]/div";
    var container = document.evaluate(xpath, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;

    if (container) {
        observer.disconnect();
        var existingImg = container.querySelector("img");
        if (existingImg) {
            container.removeChild(existingImg);
        }
        var imgElement = document.createElement("img");
        imgElement.src = "图片URL";
        imgElement.style.position = "absolute";
        imgElement.style.right = "8px";
        imgElement.style.top = "-80px";
        imgElement.style.zIndex = "10";
        imgElement.style.width = "90px";
        container.appendChild(imgElement);
    }
});
var config = { childList: true, subtree: true };
observer.observe(document.body, config);
</script>

以上是换卡通小人，出处是 https://www.nodeseek.com/post-221811-1
当然也可以用哪吒官方的https://nezhadash-docs.buycoffee.top/custom-code 不过我觉得论坛佬的更好，可以随意调整大小

<script>
    window.CustomLogo = "图片URL"; /* 自定义Logo */
    window.ShowNetTransfer  = "true"; /* 卡片显示上下行流量 */
    window.DisableAnimatedMan  = "true"; /* 关掉动画人物插图 */
    window.CustomDesc ="MJJ：白嫖至上，技术先行"; /* 自定义描述 */
</script>

<style> 
  .dark .bg-card {
   font-family: "Roboto", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #ffffff; /* 白色，高对比度 */
    position: relative; /* 设置元素为相对定位 */
    background-color: rgba(0, 0, 0, 0.3); /* 设置背景颜色为半透明的黑色 */
    backdrop-filter: blur(5px); /* 应用毛玻璃效果，模糊度为5像素 */
    border-radius: 15px; /* 设置边框圆角为15像素 */
    //box-shadow: 0 6px 8px rgba(0, 0, 0, 0.1); /* 添加阴影效果 */
    //overflow: hidden;  /* 确保内容不会溢出容器 */
    }
  .dark .bg-card h1, .dark .bg-card h2, .dark .bg-card h3 {
    color: #ffffff; /* 保持标题的高对比度 */
  }
  .dark .bg-card p {
    color: #eeeeee; /* 段落文本稍微柔和一些 */
  }
</style>

以上是调整毛玻璃效果”//”是不喜欢的所以注释掉 默认黑色主题，白色主题把所有 .dark .bg-card 改成 .light .bg-card

{
   "billingDataMod": {
       "startDate": "2024-11-05T00:00:00+08:00",
       "endDate": "2025-05-05T00:00:00+08:00",
       "autoRenewal": "1",
       "cycle": "半年",
       "amount": "$10.5"
   },
   "planDataMod": {
       "bandwidth": "1000Mbps",
       "trafficVol": "500GB/月",
       "trafficType": "1",
       "IPv4": "1",
       "IPv6": "0",
       "networkRoute": "电信163,移动CMI,联通4837",
       "extra": "传家宝"
   }
}

以上是关于一些公开备注

更新动态版，原贴出至论坛大佬 https://www.nodeseek.com/post-224199-1

<meta name="referrer" content="no-referrer">
<div class="video-box">
  <video id="myVideo" muted
    src="https://img.028029.xyz/1734966841908.mp4"
    autoplay playsinline loop>
  </video>
</div>
<style>
  :root {
    --custom-border-color: rgba(13, 11, 9, 0.1);
    --custom-background-color: rgba(13, 11, 9, 0.4);
    --custom-background-image: unset;
  }

  .dark #root {
    background-color: unset !important;
  }

  .dark .bg-card {
    background-color: var(--custom-background-color);
    backdrop-filter: blur(4px);
    border: 1px solid rgba(13, 11, 9, 0.1);
    box-shadow: 0 4px 6px rgba(13, 11, 9, 0.2);
    /* 阴影效果 */
  }

  .focus\:text-accent-foreground:focus {
    background-color: rgba(13, 11, 9, 0.5);
  }

  .dark .text-muted-foreground {
    color: #fff;
  }

  .dark\:bg-stone-700:is(.dark *) {
    --tw-bg-opacity: 0.5;
  }

  html.dark * {
    border-color: var(--custom-border-color);
  }

  html.dark body {
    color: #f4f5f6;
    background: unset;
    position: relative;
  }

  img {
    border: none;
  }

  .dark\:border-neutral-800:is(.dark *) {
    border-color: var(--custom-border-color);
  }

  .dark\:bg-stone-800:is(.dark *) {
    --tw-bg-opacity: 0.5;
    background-color: rgb(41 37 36 / var(--tw-bg-opacity, 1));
  }

  .dark\:text-stone-500:is(.dark *) {
    color: #f4f5f6;
  }

  .dark .bg-secondary {
    background-color: unset;
  }

  .dark .bg-popover {
    background-color: unset;
  }

  .dark .bg-muted {
    background-color: var(--custom-border-color);
  }

  .dark\:bg-black:is(.dark *) {
    background-color: rgba(13, 11, 9, 0.1);
  }

  .dark .bg-border {
    background-color: var(--custom-border-color);
  }

  .dark .border-input {
    border-color: var(--custom-border-color);
  }

  .dark\:text-neutral-300\/50:is(.dark *) {
    color: #999;
  }

  .dark\:text-stone-400:is(.dark *) {
    color: #fff;
  }

  div#radix-\:r4\: {
    background: rgba(0, 0, 0, 0.7);
  }

  .dark .bg-stone-800 {
    background: var(--custom-background-color);
  }

  .text-green-600 {
    color: rgb(34, 197, 94);
  }

  .bg-green-600 {
    background-color: rgb(34, 197, 94);
  }

  .dark .vps-info {
    border-radius: 12px;
    padding: 12px;
  }

  .dark .font-medium.opacity-40 {
    opacity: unset;
  }

  .dark .font-medium.opacity-50 {
    opacity: unset;
  }

  .dark .max-w-5xl.gap-4>div:first-child {
    background-color: var(--custom-background-color);
    backdrop-filter: blur(2px);
    border: 1px solid rgba(13, 11, 9, 0.2);
    box-shadow: 0 4px 6px rgba(13, 11, 9, 0.2);
    border-radius: 12px;
    padding: 12px;
  }

  img[alt="BackIcon"] {
    /* 样式规则 */
    margin-right: 12px;
  }

  .flex.items-center.gap-1.rounded-\[50px\].bg-stone-100.p-\[3px\].dark\:bg-stone-800 {
    backdrop-filter: blur(2px);
  }

  .\[\&_\.recharts-cartesian-axis-tick_text\]\:fill-muted-foreground .recharts-cartesian-axis-tick text {
    fill: #fff;
  }

  .dark\:fill-neutral-800:is(.dark *) {
    fill: #fff;
  }

  .data-\[state\=unchecked\]\:bg-input[data-state=unchecked] {
    background-color: unset;
  }

  .data-\[state\=checked\]\:bg-primary[data-state=checked] {
    background-color: var(--custom-background-color);
  }

  .video-box {
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
  }

  .video-box video {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
</style>

<script>

    window.CustomMobileBackgroundImage="https://img.028029.xyz/1734664417905.png";
    window.CustomLogo = "https://img.028029.xyz/1734533172211.png";
    window.ShowNetTransfer  = "true";
    window.CustomDesc ="MJJ：白嫖至上，技术先行"; 

    window.CustomIllustration = "https://img.028029.xyz/1734664224123.png";
    window.ForceTheme = "dark";

    var observer = new MutationObserver(function(mutationsList, observer) {
    var xpath = "/html/body/div/div/main/div[2]/section[1]/div[4]/div";
    var container = document.evaluate(xpath, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;

    if (container) {
        observer.disconnect();
        var existingImg = container.querySelector("img");
        if (existingImg) {
            container.removeChild(existingImg);
        }
        var imgElement = document.createElement("img");
        imgElement.src = "https://img.028029.xyz/1734664224123.png";
        imgElement.style.position = "absolute";
        imgElement.style.right = "0px";
        imgElement.style.top = "-60px";
        imgElement.style.zIndex = "10";
        imgElement.style.width = "90px";
        container.appendChild(imgElement);
    }
});
var config = { childList: true, subtree: true };
observer.observe(document.body, config);
</script>

<script src="https://cdn.jsdelivr.net/gh/mocchen/cssmeihua/js/aixin.js"></script>
<span class="js-cursor-container"></span>
<script src="https://cdn.jsdelivr.net/gh/mocchen/cssmeihua/js/xiaoxingxing.js"></script>