Komari 面板增加顶部链接

给你的Komari面板增加顶部超链接，简单，支持黑夜白天模式

效果

怎么做

1. 进入komari后台
2. 设置 - 站点

3. 自定义 Body - 填写(改成自己想要的链接)：

   <div class="top-info">
     <div class="top-info-container">
    <a href="https://www.lsp.pw" target="_blank" class="top-info-link text-primary">梁山泊</a>
    <a href="https://www.buyao.de" target="_blank" class="top-info-link text-primary">BuYao.De</a>
    <a href="https://github.com/awinds" target="_blank" class="top-info-link text-primary">GitHub</a>
     </div>
   </div>
   
   <style>
     .top-info {
    position: fixed;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1000;
     }
   
     .top-info-container {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    gap: 10px; /* 减小间距 */
    padding: 5px 12px; /* 减小高度 */
    background: rgba(255, 255, 255, 0.2);
    border-radius: 12px;
    backdrop-filter: blur(4px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
     }
   
     .top-info-link {
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    padding: 4px 8px;
    border-radius: 6px;
    transition: all 0.3s ease;
    white-space: nowrap;
     }
   
     .top-info-link:hover {
    background: rgba(255, 255, 255, 0.3);
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
     }
   
     /* 小屏幕适配 */
     @media (max-width: 600px) {
    .top-info-container {
      gap: 8px;
      padding: 5px 10px;
    }
    .top-info-link {
      font-size: 13px;
      padding: 3px 6px;
    }
     }
   </style>