@inactiveUser = {
    <li class="collection-item avatar">
        <i class="material-icons circle large-icon white purple-text">watch_later</i>
        <span class="title">Inactive user</span>
        <p>These credentials have not been used in over a year, can they be deleted?</p>
        <a href="https://docs.aws.amazon.com/IAM/latest/UserGuide/id_credentials_finding-unused.html" class="secondary-content">Read more in the AWS docs</a>
    </li>
}

<div id="credentials-help--human" class="modal bottom-sheet iam-modal">
    <div class="modal-content">
        <h4><i class="material-icons large-icon left">person</i>Credentials Help</h4>
        <p>This user has a password therefore is assumed to be associated with a human. The following issues may apply:</p>
        <ul class="collection">
            <li class="collection-item avatar">
                <i class="material-icons circle large-icon white red-text">error</i>
                <span class="title">MFA not enabled</span>
                <p>AWS Multi-Factor Authentication is a simple best practice that adds an extra layer of protection on top of a user name and password</p>
                <a href="https://docs.aws.amazon.com/IAM/latest/UserGuide/id_credentials_mfa.html" class="secondary-content">Read more in the AWS docs</a>
            </li>
            <li class="collection-item avatar">
                <i class="material-icons circle large-icon white red-text">error</i>
                <span class="title">Outdated access key(s)</span>
                <p>It is recommended not to enable username/password and permanent access key(s) on the same IAM user. If this is required then programmatic access should be short-lived or the key should be rotated frequently, every 90 days</p>
            </li>
            <li class="collection-item avatar">
                <i class="material-icons circle large-icon white amber-text">warning</i>
                <span class="title">Has active access keys</span>
                <p>Access keys are generally intended for programmatic access, does this user really need them?</p>
            </li>
            <li class="collection-item avatar">
                <i class="material-icons circle large-icon white amber-text">warning</i>
                <span class="title">Missing Google username tag</span>
                <p>This human credential is missing an IAM tag with key "GoogleUsername". The value for this tag should be the same prefix as Guardian email addresses, for example "ada.lovelace" or "ada.lovelace.freelancer". This is important, because Security HQ will use this to disable the credentials of former staff.</p>
            </li>

            @inactiveUser

        </ul>
    </div>
</div>

<div id="credentials-help--machine" class="modal bottom-sheet iam-modal">
    <div class="modal-content">
        <h4><i class="material-icons large-icon left">computer</i>Credentials Help</h4>
        <p>This user does not have a password therefore is assumed to be intended for programmatic access. The following issues may apply:</p>
        <ul class="collection">
            <li class="collection-item avatar">
                <i class="material-icons circle large-icon white red-text">error</i>
                <span class="title">Outdated access key(s)</span>
                <p>Regular access key rotation is an established security best practice and our policy is to rotate keys for programmatic access at least once a year</p>
            </li>
            <li class="collection-item avatar">
                <i class="material-icons circle large-icon white amber-text">warning</i>
                <span class="title">No active access keys</span>
                <p>This user currently has no way of accessing AWS, is this user still required or can it be deleted?</p>
                <a href="https://docs.aws.amazon.com/IAM/latest/UserGuide/best-practices.html#remove-credentials" class="secondary-content">Read more in the AWS docs</a>
            </li>

            @inactiveUser

        </ul>
    </div>
</div>