Komari牛头人哪吒主题

Komari牛头人哪吒主题

 次点击
16 分钟阅读

主题下载

Nezha Dash V1

项目地址: Github

可直接在Komari主题管理中点击导入主题,使用链接导入

https://github.com/Akizon77/nezha-dash-v1

自定义代码

使用自定义代码对主题进一步的修改没法

下列代码是我使用的,可以点击探针查看效果

头部代码

<style>
/* 隐藏包含IPv4/IPv6标签的整个section容器 */
  section.flex.gap-1.items-center.flex-wrap {
      display: none !important;
  }
</style>

<script>
window.ShowNetTransfer = true;
window.FixedTopServerName = true;
window.DisableAnimatedMan = true;
window.ForcePeakCutEnabled = true;


window.CustomDesc ="ᓚᘏᗢ"; /* 自定义描述 */

document.title = document.title.replace(/ - Komari Monitor$/, '');

// === 注入自定义 CSS 样式 ===
const customStyle = document.createElement('style');
customStyle.textContent = `
    /* 自定义字体 */
    * {
        font-family: "Helvetica Neue", "Segoe UI", Arial, sans-serif;
    }

    h1, h2, h3, h4, h5 {
        font-family: "Helvetica Neue", "Segoe UI", Arial, sans-serif;
    }

    /* 隐藏文本 */
    p.text-base.font-semibold, /* overview */
    p.text-sm.font-medium.opacity-50 { /* 时间下方的小字 */
        display: none !important;
    }

    /* 调整时钟整体样式(中等字号 + 自适应颜色) */
    .flex.text-sm.font-medium.mt-0\\.5 {
        font-size: 2.0rem !important;
        font-weight: bold;
        opacity: 0.9 !important;
        justify-content: center !important;
        align-items: baseline !important;
        color: #333 !important; /* 浅色模式 */
    }
    html.dark .flex.text-sm.font-medium.mt-0\\.5 {
        color: #fff !important; /* 深色模式 */
    }

    /* 数字居中 */
    .number__inner {
        display: inline-block !important;
        width: 2ch !important;
        text-align: center !important;
    }

    /* 冒号对齐 */
    .number-flow-react svg {
        height: 2.0rem !important;
        vertical-align: middle !important;
    }

    /* 隐藏右上角语言与主题切换按钮 */
    [id="radix-:r0:"],
    [id="radix-:r2:"] {
        display: none !important;
    }

    /* 隐藏右下角图片按钮 */
    button:has(.lucide-image-minus),
    button.rounded-\$begin:math:display$50px\\$end:math:display$[aria-haspopup="dialog"] {
        display: none !important;
    }

    /* 隐藏 server-overview-controls */
    .server-overview-controls {
        display: none !important;
    }
`;
document.head.appendChild(customStyle);


</script>

自定义Body

<script>
const selectorButton = '#root > div > main > div.mx-auto.w-full.max-w-5xl.px-0.flex.flex-col.gap-4.server-info > section > div.flex.justify-center.w-full.max-w-\\[200px\\] > div > div > div.relative.cursor-pointer.rounded-3xl.px-2\\.5.py-\\[8px\\].text-\\[13px\\].font-\\[600\\].transition-all.duration-500.text-stone-400.dark\\:text-stone-500';
const selectorSection = '#root > div > main > div.mx-auto.w-full.max-w-5xl.px-0.flex.flex-col.gap-4.server-info > section';
const selector3 = '#root > div > main > div.mx-auto.w-full.max-w-5xl.px-0.flex.flex-col.gap-4.server-info > div:nth-child(3)';
const selector4 = '#root > div > main > div.mx-auto.w-full.max-w-5xl.px-0.flex.flex-col.gap-4.server-info > div:nth-child(4)';

let hasClicked = false;
let divVisible = false;
let swapping = false;

function forceBothVisible() {
  const div3 = document.querySelector(selector3);
  const div4 = document.querySelector(selector4);
  if (div3 && div4) {
    div3.style.display = 'block';
    div4.style.display = 'block';
  }
}

function hideSection() {
  const section = document.querySelector(selectorSection);
  if (section) {
    section.style.display = 'none';
  }
}

function tryClickButton() {
  const btn = document.querySelector(selectorButton);
  if (btn && !hasClicked) {
    btn.click();
    hasClicked = true;
    setTimeout(forceBothVisible, 500);
  }
}

function swapDiv3AndDiv4() {
  if (swapping) return;
  swapping = true;

  const div3 = document.querySelector(selector3);
  const div4 = document.querySelector(selector4);
  if (!div3 || !div4) {
    swapping = false;
    return;
  }
  const parent = div3.parentNode;
  if (parent !== div4.parentNode) {
    swapping = false;
    return;
  }

  // 交换 div3 和 div4 的位置
  parent.insertBefore(div4, div3);
  parent.insertBefore(div3, div4.nextSibling);

  swapping = false;
}

const observer = new MutationObserver(() => {
  const div3 = document.querySelector(selector3);
  const div4 = document.querySelector(selector4);

  const isDiv3Visible = div3 && getComputedStyle(div3).display !== 'none';
  const isDiv4Visible = div4 && getComputedStyle(div4).display !== 'none';

  const isAnyDivVisible = isDiv3Visible || isDiv4Visible;

  if (isAnyDivVisible && !divVisible) {
    hideSection();
    tryClickButton();
    setTimeout(swapDiv3AndDiv4, 100); 
  } else if (!isAnyDivVisible && divVisible) {
    hasClicked = false;
  }

  divVisible = isAnyDivVisible;

  if (div3 && div4) {
    if (!isDiv3Visible || !isDiv4Visible) {
      forceBothVisible();
    }
  }
});

const root = document.querySelector('#root');
if (root) {
  observer.observe(root, {
    childList: true,
    attributes: true,
    subtree: true,
    attributeFilter: ['style', 'class']
  });
}
</script>
<script>
(()=>{const kill=()=>{const n=[...document.querySelectorAll('div.p-6.px-6.py-3')].find(e=>/GPU[::]?/i.test(e.textContent)); n?.closest('div.rounded-lg.border.text-card-foreground.shadow-lg')?.remove();}; new MutationObserver(kill).observe(document.documentElement,{childList:true,subtree:true}); kill();})();
</script>

© 本文著作权归作者所有,未经许可不得转载使用。