<header class="devcm-topbar header" th:fragment="header (pageType)" th:with="menu = ${menuFinder.getPrimary()}">
  <div class="devcm-topbar__main header__inner">
    <a class="devcm-brand logo" href="/" th:aria-label="#{devcm.explorer.home}">
      <img
        class="devcm-brand__image icon"
        th:if="${not #strings.isEmpty(theme.config.basic.logo)}"
        th:src="${theme.config.basic.logo}"
        alt="Logo"
      />
      <span class="devcm-brand__mark" th:unless="${not #strings.isEmpty(theme.config.basic.logo)}">DEV<br />CM</span>
      <span class="devcm-brand__name">DevCM</span>
    </a>

    <div class="devcm-prompt-stream header__center">
      <span class="devcm-prompt-stream__name" th:text="|${terminalUser}@devcm:~$|">admin@devcm:~$</span>
      <span class="devcm-prompt-stream__line dividing" aria-hidden="true"></span>
    </div>

    <div class="devcm-topbar__actions">
      <button
        type="button"
        class="devcm-icon-button button"
        x-data="themeMode()"
        @click="handleToggleThemeMode()"
        th:aria-label="#{devcm.action.toggleTheme}"
        th:title="#{devcm.action.toggleTheme}"
      >
        <i class="i-pixelarticons-sun-alt"></i>
      </button>
    </div>
  </div>
</header>
