ComfyUI-Lora-Manager/templates/components/header.html

<header class="app-header">
  <div class="header-container">
    <div class="header-branding">
      <a href="/loras" class="logo-link">
        <img src="/loras_static/images/favicon-32x32.png" alt="LoRA Manager" class="app-logo">
        <span class="app-title">LoRA Manager</span>
      </a>
    </div>
    <nav class="main-nav">
      <a href="/loras" class="nav-item {% if current_page == 'loras' %}active{% endif %}">
        <i class="fas fa-layer-group"></i> LoRAs
      </a>
      <a href="/loras/recipes" class="nav-item {% if current_page == 'recipes' %}active{% endif %}">
        <i class="fas fa-book-open"></i> Recipes
      </a>
      <a href="/checkpoints" class="nav-item {% if current_page == 'checkpoints' %}active{% endif %}">
        <i class="fas fa-check-circle"></i> Checkpoints
      </a>
    </nav>
    <div class="header-actions">
      <!-- Integrated corner controls -->
      <div class="header-controls">
        <div class="theme-toggle" onclick="toggleTheme()" title="Toggle theme">
          <i class="fas fa-moon dark-icon"></i>
          <i class="fas fa-sun light-icon"></i>
        </div>
        <div class="settings-toggle" onclick="settingsManager.toggleSettings()" title="Settings">
          <i class="fas fa-cog"></i>
        </div>
        <div class="update-toggle" id="updateToggleBtn" title="Check Updates">
          <i class="fas fa-bell"></i>
          <span class="update-badge hidden"></span>
        </div>
        <div class="support-toggle" id="supportToggleBtn" title="Support">
          <i class="fas fa-heart"></i>
        </div>
      </div>
    </div>
  </div>
</header>