tabler-ui/src/_includes/cards/teammates.html

Premium and Open Source dashboard template with responsive and high quality UI. For Free!

<div class="card">
    <table class="table card-table table-vcenter table-responsive">
        <thead>
        <tr>
            <th colspan="2">User</th>
            <th>Permissions</th>
            <th>Role</th>
            <th></th>
        </tr>
        </thead>
        <tbody>
        <tr>
            <td style="width: 1%">
                <span class="avatar avatar-md" style="background-image: url({{ site.data.users[12].photo }})">
                    <span class="avatar-status bg-green"></span>
                </span>
            </td>
            <td>
                <div>Frederick Bannatyne</div>
                <div class="text-muted small">Member since 13 july 2016</div>
            </td>
            <td>
                <div>Permissions</div>
                <div class="text-muted small">Full Access</div>
            </td>
            <td>
                <div>Role</div>
                <div class="text-muted small">Product Developer</div>
            </td>
            <td style="width: 1%">
                <button class="btn btn-secondary">Send email</button>
            </td>
        <tr>

        <tr>
            <td>
                <span class="avatar avatar-md" style="background-image: url({{ site.data.users[30].photo }})"></span>
            </td>
            <td>
                <div>Frederick Bannatyne</div>
                <div class="text-muted small">Member since 13 july 2016</div>
            </td>
            <td>
                <div>Permissions</div>
                <div class="text-muted small">Full Access</div>
            </td>
            <td>
                <div>Role</div>
                <div class="text-muted small">Product Developer</div>
            </td>
            <td>
                <button class="btn btn-secondary">Send email</button>
            </td>
        <tr>

        <tr>
            <td>
                <span class="avatar avatar-md" style="background-image: url({{ site.data.users[15].photo }})"></span>
            </td>
            <td>
                <div>Frederick Bannatyne</div>
                <div class="text-muted small">Member since 13 july 2016</div>
            </td>
            <td>
                <div>Permissions</div>
                <div class="text-muted small">Full Access</div>
            </td>
            <td>
                <div>Role</div>
                <div class="text-muted small">Product Developer</div>
            </td>
            <td>
                <button class="btn btn-secondary">Send email</button>
            </td>
        <tr>

        <tr>
            <td>
                <span class="avatar avatar-md" style="background-image: url({{ site.data.users[13].photo }})"></span>
            </td>
            <td>
                <div>Frederick Bannatyne</div>
                <div class="text-muted small">Member since 13 july 2016</div>
            </td>
            <td>
                <div>Permissions</div>
                <div class="text-muted small">Full Access</div>
            </td>
            <td>
                <div>Role</div>
                <div class="text-muted small">Product Developer</div>
            </td>
            <td>
                <button class="btn btn-secondary">Send email</button>
            </td>
        <tr>
        </tbody>
    </table>
</div>