{# A section of profile's edit page (profile.edit.sections), below the
   profile form. The login links to the account on GitHub. The disconnect
   button opens identities' modal, which posts the provider and account id
   it carries. The colours are in assets/css/github.css, and the mark is
   drawn in currentColor. #}
{% if identity %}
<div class="mb-4 profile-identity" data-identity="github">
    <label class="form-label fw-semibold">GitHub</label>
    <div class="form-control d-flex align-items-center gap-2 github-identity__field">
        <svg class="github-mark" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
            <path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v 3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/>
        </svg>
        {% if github_url %}
        <a class="github-identity__value" href="{{ github_url }}" target="_blank" rel="noopener noreferrer">{{ identity.provider_username }}</a>
        {% else %}
        <span class="github-identity__value">{{ identity.provider_id }}</span>
        {% endif %}
        <button type="button" class="btn btn-sm p-0 github-identity__disconnect" title="{{ _('Disconnect') }}" aria-label="{{ _('Disconnect') }}" data-bs-toggle="modal" data-bs-target="#disconnectModal" data-provider="github" data-provider-id="{{ identity.provider_id }}">
            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
                <line x1="18" y1="6" x2="6" y2="18"></line>
                <line x1="6" y1="6" x2="18" y2="18"></line>
            </svg>
        </button>
    </div>
</div>
{% else %}
<div class="mb-4 profile-identity" data-identity="github">
    <label class="form-label fw-semibold">GitHub</label>
    <a href="{{ url_for('github.connect_github') }}" class="form-control text-decoration-none d-flex align-items-center gap-2 github-identity__field github-identity__connect">
        <svg class="github-mark" width="16" height="16" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
            <path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v 3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/>
        </svg>
        <span>{{ _('Connect GitHub') }}</span>
    </a>
</div>
{% endif %}