anonymous_github/public/partials/header.htm

<nav class="navbar navbar-expand-lg" :class="{&#x27;navbar-dark&#x27;: isDarkMode}">
  <a class="navbar-brand" href="/">Anonymous <em>GitHub</em></a>
  <a class="nav-support" href="https://ko-fi.com/tdurieux" target="_blank" rel="noopener" title="Donate on Ko-fi to help cover hosting costs" aria-label="Donate on Ko-fi to help cover hosting costs">
    <svg class="ui-icon" aria-hidden="true"><use href="#ui-icon-heart"></use></svg>
    <span class="nav-support-label">Support</span>
  </a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>

  <div class="collapse navbar-collapse" id="navbarSupportedContent">
    <ul class="navbar-nav mr-auto smooth-scroll">
      <li class="nav-item" v-if="!user">
        <a class="nav-link" href="/" :class="{&#x27;active&#x27;: path == &#x27;/&#x27;}">
          Home
        </a>
      </li>
      <li class="nav-item" v-if="user">
        <a class="nav-link" href="/dashboard" :class="{&#x27;active&#x27;: path == &#x27;/dashboard&#x27;}">
          <svg class="ui-icon d-lg-none mr-1" aria-hidden="true"><use href="#ui-icon-grid"></use></svg>
          My work
        </a>
      </li>
      <li class="nav-item" v-if="user">
        <a class="nav-link" href="/anonymize" :class="{&#x27;active&#x27;:path == &#x27;/anonymize&#x27; || path == &#x27;/pull-request-anonymize&#x27;}">
          <svg class="ui-icon d-lg-none mr-1" aria-hidden="true"><use href="#ui-icon-shield"></use></svg>
          Anonymize
        </a>
      </li>
      <li class="nav-item" v-if="user">
        <a class="nav-link" href="/conferences" :class="{&#x27;active&#x27;:path == &#x27;/conferences&#x27;}">
          <svg class="ui-icon d-lg-none mr-1" aria-hidden="true"><use href="#project-icon-conference"></use></svg>
          Conferences
        </a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="/faq" :class="{&#x27;active&#x27;:path == &#x27;/faq&#x27;}"><svg class="ui-icon d-lg-none mr-1" aria-hidden="true"><use href="#ui-icon-help"></use></svg>FAQ</a>
      </li>
      <li class="nav-item" v-if="user &amp;&amp; user?.isAdmin">
        <a class="nav-link" href="/admin/" :class="{&#x27;active&#x27;:path?.indexOf(&#x27;/admin&#x27;) === 0}">
          <svg class="ui-icon d-lg-none mr-1" aria-hidden="true"><use href="#project-icon-filter"></use></svg>
          Admin
        </a>
      </li>
    </ul>
    <ul class="navbar-nav">
      <li class="nav-item" v-if="user || !isReviewerRoute">
        <a class="nav-link nav-icon" target="_blank" href="https://github.com/tdurieux/anonymous_github/" title="Anonymous GitHub source code" aria-label="Anonymous GitHub source code on GitHub" rel="noopener" data-offset="30"><i class="fab fa-github" aria-hidden="true"></i></a>
      </li>
      <!-- "Report a bug" is about this service. Reviewers who land on an
           anonymized repository often think it is about the paper, so the
           label names the service and the tooltip says who to contact. -->
      <li class="nav-item d-none d-lg-block">
        <a class="nav-link" target="_blank" rel="noopener" href="https://github.com/tdurieux/anonymous_github/issues/new?template=issue_report.yml" title="Report a problem with the Anonymous GitHub service. Questions about an anonymized repository or paper go to its authors." data-offset="30"><svg class="ui-icon d-lg-none mr-1" aria-hidden="true"><use href="#ui-icon-bug"></use></svg>Report a bug
        </a>
      </li>

      <li class="nav-item" v-if="!isDarkMode">
        <a class="nav-link nav-icon" href="#" title="Switch to dark mode" aria-label="Switch to dark mode" role="button" @click.prevent="darkMode(true);">
          <svg class="ui-icon" aria-hidden="true"><use href="#ui-icon-moon"></use></svg>
        </a>
      </li>

      <li class="nav-item" v-if="isDarkMode">
        <a class="nav-link nav-icon" href="#" title="Switch to light mode" aria-label="Switch to light mode" role="button" @click.prevent="darkMode(false);">
          <svg class="ui-icon" aria-hidden="true"><use href="#ui-icon-sun"></use></svg>
        </a>
      </li>

      <li class="nav-item" v-if="!user &amp;&amp; !isReviewerRoute">
        <a class="nav-link btn-signin" target="_self" href="/signin" data-offset="30"><i class="fab fa-github mr-1"></i>
          Sign in
        </a>
      </li>
      <li class="nav-item dropdown user-chip-wrap" v-if="user">
        <a class="nav-link user-chip dropdown-toggle" href="#" id="navbarDropdownMenuLink" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
          <img width="22" height="22" class="rounded-circle" v-if="user?.photo" :src="safeUrl((user?.photo))">
          <span class="user-chip-name">{{ user?.username }}</span>
        </a>
        <div class="dropdown-menu dropdown-menu-right user-menu" aria-labelledby="navbarDropdownMenuLink">
          <h6 class="dropdown-header">Signed in as @{{ user?.username }}</h6>
          <a class="dropdown-item" href="/profile">
            <svg class="ui-icon" aria-hidden="true"><use href="#project-icon-filter"></use></svg>
            <span>Settings<small>Defaults, quotas, account</small></span>
          </a>
          <a class="dropdown-item" href="/connections">
            <i class="fab fa-github" aria-hidden="true"></i>
            <span>GitHub connections<small>Repository access and OAuth</small></span>
          </a>
          <a class="dropdown-item" href="/claim">
            <svg class="ui-icon" aria-hidden="true"><use href="#ui-icon-link"></use></svg>
            <span>Claim an anonymization<small>Attach an existing mirror to your account</small></span>
          </a>
          <div class="dropdown-divider"></div>
          <a class="dropdown-item" href="https://github.com/tdurieux/anonymous_github/issues/new?template=issue_report.yml" target="_blank" rel="noopener">
            <svg class="ui-icon" aria-hidden="true"><use href="#ui-icon-bug"></use></svg>
            <span>Report a bug<small>About this service, not a paper</small></span>
          </a>
          <a class="dropdown-item" href="https://github.com/tdurieux/anonymous_github/" target="_blank" rel="noopener">
            <i class="fab fa-github" aria-hidden="true"></i>
            <span>Source code</span>
          </a>
          <a class="dropdown-item" href="https://ko-fi.com/tdurieux" target="_blank" rel="noopener">
            <svg class="ui-icon" aria-hidden="true"><use href="#ui-icon-heart"></use></svg>
            <span>Support the project</span>
          </a>
          <div class="dropdown-divider"></div>
          <a class="dropdown-item" href="/api/user/logout" target="_self">
            <svg class="ui-icon" aria-hidden="true"><use href="#ui-icon-logout"></use></svg>
            <span>Sign out</span>
          </a>
        </div>
      </li>
    </ul>
  </div>
</nav>
<div class="navbar shadow generalMessage" v-if="generalMessage" v-html="sanitize(generalMessage)"></div>

<dialog id="email-prompt" class="email-prompt" v-if="emailPromptOpen" aria-labelledby="email-prompt-title" aria-describedby="email-prompt-reason" @cancel.prevent="respondToEmailPrompt('later')">
  <form @submit.prevent="respondToEmailPrompt('save')">
    <h2 id="email-prompt-title">Stay informed about access problems</h2>
    <p id="email-prompt-reason">Get email alerts when your GitHub token or repository access fails.</p>
    <label for="email-prompt-address">Email address</label>
    <input id="email-prompt-address" class="form-control" type="email" autocomplete="email" maxlength="254" required v-model="emailPromptAddress" :disabled="emailPromptBusy" />
    <p class="paper-inline-alert paper-inline-alert-error" role="alert" v-if="emailPromptError">{{ emailPromptError }}</p>
    <div class="email-prompt-actions">
      <button type="button" class="btn btn-outline-ink" :disabled="emailPromptBusy" @click="respondToEmailPrompt('later')">Remind me later</button>
      <button type="button" class="btn btn-outline-ink" :disabled="emailPromptBusy" @click="respondToEmailPrompt('never')">Never</button>
      <button type="submit" class="btn btn-ink" :disabled="emailPromptBusy">{{ emailPromptBusy ? 'Saving…' : 'Save' }}</button>
    </div>
  </form>
</dialog>