You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
559 lines
29 KiB
HTML
559 lines
29 KiB
HTML
<div class="px-4 sm:px-6 lg:px-8">
|
|
<div class="sm:flex sm:items-center">
|
|
<div class="sm:flex-auto">
|
|
<h1 class="text-base font-semibold text-gray-900">Users</h1>
|
|
<p class="mt-2 text-sm text-gray-700">
|
|
A list of all the users in your account including their name,
|
|
title, email and role.
|
|
</p>
|
|
</div>
|
|
<div class="mt-4 sm:mt-0 sm:ml-16 sm:flex-none">
|
|
<button
|
|
type="button"
|
|
class="block rounded-md bg-indigo-600 px-3 py-2 text-center text-sm font-semibold text-white shadow-xs hover:bg-indigo-500 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600"
|
|
>
|
|
Add user
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div class="mt-8 flow-root">
|
|
<div class="-mx-4 -my-2 sm:-mx-6 lg:-mx-8">
|
|
<div class="inline-block min-w-full py-2 align-middle">
|
|
<table class="min-w-full border-separate border-spacing-0">
|
|
<thead>
|
|
<tr>
|
|
<th
|
|
scope="col"
|
|
class="sticky top-0 z-10 border-b border-gray-300 bg-white/75 py-3.5 pr-3 pl-4 text-left text-sm font-semibold text-gray-900 backdrop-blur-sm backdrop-filter sm:pl-6 lg:pl-8"
|
|
>
|
|
Name
|
|
</th>
|
|
<th
|
|
scope="col"
|
|
class="sticky top-0 z-10 hidden border-b border-gray-300 bg-white/75 px-3 py-3.5 text-left text-sm font-semibold text-gray-900 backdrop-blur-sm backdrop-filter sm:table-cell"
|
|
>
|
|
Title
|
|
</th>
|
|
<th
|
|
scope="col"
|
|
class="sticky top-0 z-10 hidden border-b border-gray-300 bg-white/75 px-3 py-3.5 text-left text-sm font-semibold text-gray-900 backdrop-blur-sm backdrop-filter lg:table-cell"
|
|
>
|
|
Email
|
|
</th>
|
|
<th
|
|
scope="col"
|
|
class="sticky top-0 z-10 border-b border-gray-300 bg-white/75 px-3 py-3.5 text-left text-sm font-semibold text-gray-900 backdrop-blur-sm backdrop-filter"
|
|
>
|
|
Role
|
|
</th>
|
|
<th
|
|
scope="col"
|
|
class="sticky top-0 z-10 border-b border-gray-300 bg-white/75 py-3.5 pr-4 pl-3 backdrop-blur-sm backdrop-filter sm:pr-6 lg:pr-8"
|
|
>
|
|
<span class="sr-only">Edit</span>
|
|
</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td
|
|
class="border-b border-gray-200 py-4 pr-3 pl-4 text-sm font-medium whitespace-nowrap text-gray-900 sm:pl-6 lg:pl-8"
|
|
>
|
|
Lindsay Walton
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 sm:table-cell"
|
|
>
|
|
Front-end Developer
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 lg:table-cell"
|
|
>
|
|
lindsay.walton@example.com
|
|
</td>
|
|
<td
|
|
class="border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500"
|
|
>
|
|
Member
|
|
</td>
|
|
<td
|
|
class="relative border-b border-gray-200 py-4 pr-4 pl-3 text-right text-sm font-medium whitespace-nowrap sm:pr-8 lg:pr-8"
|
|
>
|
|
<a
|
|
href="#"
|
|
class="text-indigo-600 hover:text-indigo-900"
|
|
>Edit<span class="sr-only"
|
|
>, Lindsay Walton</span
|
|
></a
|
|
>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td
|
|
class="border-b border-gray-200 py-4 pr-3 pl-4 text-sm font-medium whitespace-nowrap text-gray-900 sm:pl-6 lg:pl-8"
|
|
>
|
|
Courtney Henry
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 sm:table-cell"
|
|
>
|
|
Designer
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 lg:table-cell"
|
|
>
|
|
courtney.henry@example.com
|
|
</td>
|
|
<td
|
|
class="border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500"
|
|
>
|
|
Admin
|
|
</td>
|
|
<td
|
|
class="relative border-b border-gray-200 py-4 pr-4 pl-3 text-right text-sm font-medium whitespace-nowrap sm:pr-8 lg:pr-8"
|
|
>
|
|
<a
|
|
href="#"
|
|
class="text-indigo-600 hover:text-indigo-900"
|
|
>Edit<span class="sr-only"
|
|
>, Courtney Henry</span
|
|
></a
|
|
>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td
|
|
class="border-b border-gray-200 py-4 pr-3 pl-4 text-sm font-medium whitespace-nowrap text-gray-900 sm:pl-6 lg:pl-8"
|
|
>
|
|
Tom Cook
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 sm:table-cell"
|
|
>
|
|
Director of Product
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 lg:table-cell"
|
|
>
|
|
tom.cook@example.com
|
|
</td>
|
|
<td
|
|
class="border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500"
|
|
>
|
|
Member
|
|
</td>
|
|
<td
|
|
class="relative border-b border-gray-200 py-4 pr-4 pl-3 text-right text-sm font-medium whitespace-nowrap sm:pr-8 lg:pr-8"
|
|
>
|
|
<a
|
|
href="#"
|
|
class="text-indigo-600 hover:text-indigo-900"
|
|
>Edit<span class="sr-only"
|
|
>, Tom Cook</span
|
|
></a
|
|
>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td
|
|
class="border-b border-gray-200 py-4 pr-3 pl-4 text-sm font-medium whitespace-nowrap text-gray-900 sm:pl-6 lg:pl-8"
|
|
>
|
|
Whitney Francis
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 sm:table-cell"
|
|
>
|
|
Copywriter
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 lg:table-cell"
|
|
>
|
|
whitney.francis@example.com
|
|
</td>
|
|
<td
|
|
class="border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500"
|
|
>
|
|
Admin
|
|
</td>
|
|
<td
|
|
class="relative border-b border-gray-200 py-4 pr-4 pl-3 text-right text-sm font-medium whitespace-nowrap sm:pr-8 lg:pr-8"
|
|
>
|
|
<a
|
|
href="#"
|
|
class="text-indigo-600 hover:text-indigo-900"
|
|
>Edit<span class="sr-only"
|
|
>, Whitney Francis</span
|
|
></a
|
|
>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td
|
|
class="border-b border-gray-200 py-4 pr-3 pl-4 text-sm font-medium whitespace-nowrap text-gray-900 sm:pl-6 lg:pl-8"
|
|
>
|
|
Leonard Krasner
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 sm:table-cell"
|
|
>
|
|
Senior Designer
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 lg:table-cell"
|
|
>
|
|
leonard.krasner@example.com
|
|
</td>
|
|
<td
|
|
class="border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500"
|
|
>
|
|
Owner
|
|
</td>
|
|
<td
|
|
class="relative border-b border-gray-200 py-4 pr-4 pl-3 text-right text-sm font-medium whitespace-nowrap sm:pr-8 lg:pr-8"
|
|
>
|
|
<a
|
|
href="#"
|
|
class="text-indigo-600 hover:text-indigo-900"
|
|
>Edit<span class="sr-only"
|
|
>, Leonard Krasner</span
|
|
></a
|
|
>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td
|
|
class="border-b border-gray-200 py-4 pr-3 pl-4 text-sm font-medium whitespace-nowrap text-gray-900 sm:pl-6 lg:pl-8"
|
|
>
|
|
Floyd Miles
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 sm:table-cell"
|
|
>
|
|
Principal Designer
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 lg:table-cell"
|
|
>
|
|
floyd.miles@example.com
|
|
</td>
|
|
<td
|
|
class="border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500"
|
|
>
|
|
Member
|
|
</td>
|
|
<td
|
|
class="relative border-b border-gray-200 py-4 pr-4 pl-3 text-right text-sm font-medium whitespace-nowrap sm:pr-8 lg:pr-8"
|
|
>
|
|
<a
|
|
href="#"
|
|
class="text-indigo-600 hover:text-indigo-900"
|
|
>Edit<span class="sr-only"
|
|
>, Floyd Miles</span
|
|
></a
|
|
>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td
|
|
class="border-b border-gray-200 py-4 pr-3 pl-4 text-sm font-medium whitespace-nowrap text-gray-900 sm:pl-6 lg:pl-8"
|
|
>
|
|
Emily Selman
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 sm:table-cell"
|
|
>
|
|
VP, User Experience
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 lg:table-cell"
|
|
>
|
|
emily.selman@example.com
|
|
</td>
|
|
<td
|
|
class="border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500"
|
|
>
|
|
Member
|
|
</td>
|
|
<td
|
|
class="relative border-b border-gray-200 py-4 pr-4 pl-3 text-right text-sm font-medium whitespace-nowrap sm:pr-8 lg:pr-8"
|
|
>
|
|
<a
|
|
href="#"
|
|
class="text-indigo-600 hover:text-indigo-900"
|
|
>Edit<span class="sr-only"
|
|
>, Emily Selman</span
|
|
></a
|
|
>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td
|
|
class="border-b border-gray-200 py-4 pr-3 pl-4 text-sm font-medium whitespace-nowrap text-gray-900 sm:pl-6 lg:pl-8"
|
|
>
|
|
Kristin Watson
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 sm:table-cell"
|
|
>
|
|
VP, Human Resources
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 lg:table-cell"
|
|
>
|
|
kristin.watson@example.com
|
|
</td>
|
|
<td
|
|
class="border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500"
|
|
>
|
|
Admin
|
|
</td>
|
|
<td
|
|
class="relative border-b border-gray-200 py-4 pr-4 pl-3 text-right text-sm font-medium whitespace-nowrap sm:pr-8 lg:pr-8"
|
|
>
|
|
<a
|
|
href="#"
|
|
class="text-indigo-600 hover:text-indigo-900"
|
|
>Edit<span class="sr-only"
|
|
>, Kristin Watson</span
|
|
></a
|
|
>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td
|
|
class="border-b border-gray-200 py-4 pr-3 pl-4 text-sm font-medium whitespace-nowrap text-gray-900 sm:pl-6 lg:pl-8"
|
|
>
|
|
Emma Dorsey
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 sm:table-cell"
|
|
>
|
|
Senior Developer
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 lg:table-cell"
|
|
>
|
|
emma.dorsey@example.com
|
|
</td>
|
|
<td
|
|
class="border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500"
|
|
>
|
|
Member
|
|
</td>
|
|
<td
|
|
class="relative border-b border-gray-200 py-4 pr-4 pl-3 text-right text-sm font-medium whitespace-nowrap sm:pr-8 lg:pr-8"
|
|
>
|
|
<a
|
|
href="#"
|
|
class="text-indigo-600 hover:text-indigo-900"
|
|
>Edit<span class="sr-only"
|
|
>, Emma Dorsey</span
|
|
></a
|
|
>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td
|
|
class="border-b border-gray-200 py-4 pr-3 pl-4 text-sm font-medium whitespace-nowrap text-gray-900 sm:pl-6 lg:pl-8"
|
|
>
|
|
Alicia Bell
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 sm:table-cell"
|
|
>
|
|
Junior Copywriter
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 lg:table-cell"
|
|
>
|
|
alicia.bell@example.com
|
|
</td>
|
|
<td
|
|
class="border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500"
|
|
>
|
|
Admin
|
|
</td>
|
|
<td
|
|
class="relative border-b border-gray-200 py-4 pr-4 pl-3 text-right text-sm font-medium whitespace-nowrap sm:pr-8 lg:pr-8"
|
|
>
|
|
<a
|
|
href="#"
|
|
class="text-indigo-600 hover:text-indigo-900"
|
|
>Edit<span class="sr-only"
|
|
>, Alicia Bell</span
|
|
></a
|
|
>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td
|
|
class="border-b border-gray-200 py-4 pr-3 pl-4 text-sm font-medium whitespace-nowrap text-gray-900 sm:pl-6 lg:pl-8"
|
|
>
|
|
Jenny Wilson
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 sm:table-cell"
|
|
>
|
|
Studio Artist
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 lg:table-cell"
|
|
>
|
|
jenny.wilson@example.com
|
|
</td>
|
|
<td
|
|
class="border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500"
|
|
>
|
|
Owner
|
|
</td>
|
|
<td
|
|
class="relative border-b border-gray-200 py-4 pr-4 pl-3 text-right text-sm font-medium whitespace-nowrap sm:pr-8 lg:pr-8"
|
|
>
|
|
<a
|
|
href="#"
|
|
class="text-indigo-600 hover:text-indigo-900"
|
|
>Edit<span class="sr-only"
|
|
>, Jenny Wilson</span
|
|
></a
|
|
>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td
|
|
class="border-b border-gray-200 py-4 pr-3 pl-4 text-sm font-medium whitespace-nowrap text-gray-900 sm:pl-6 lg:pl-8"
|
|
>
|
|
Anna Roberts
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 sm:table-cell"
|
|
>
|
|
Partner, Creative
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 lg:table-cell"
|
|
>
|
|
anna.roberts@example.com
|
|
</td>
|
|
<td
|
|
class="border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500"
|
|
>
|
|
Member
|
|
</td>
|
|
<td
|
|
class="relative border-b border-gray-200 py-4 pr-4 pl-3 text-right text-sm font-medium whitespace-nowrap sm:pr-8 lg:pr-8"
|
|
>
|
|
<a
|
|
href="#"
|
|
class="text-indigo-600 hover:text-indigo-900"
|
|
>Edit<span class="sr-only"
|
|
>, Anna Roberts</span
|
|
></a
|
|
>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td
|
|
class="border-b border-gray-200 py-4 pr-3 pl-4 text-sm font-medium whitespace-nowrap text-gray-900 sm:pl-6 lg:pl-8"
|
|
>
|
|
Benjamin Russel
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 sm:table-cell"
|
|
>
|
|
Director, Print Operations
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 lg:table-cell"
|
|
>
|
|
benjamin.russel@example.com
|
|
</td>
|
|
<td
|
|
class="border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500"
|
|
>
|
|
Member
|
|
</td>
|
|
<td
|
|
class="relative border-b border-gray-200 py-4 pr-4 pl-3 text-right text-sm font-medium whitespace-nowrap sm:pr-8 lg:pr-8"
|
|
>
|
|
<a
|
|
href="#"
|
|
class="text-indigo-600 hover:text-indigo-900"
|
|
>Edit<span class="sr-only"
|
|
>, Benjamin Russel</span
|
|
></a
|
|
>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td
|
|
class="border-b border-gray-200 py-4 pr-3 pl-4 text-sm font-medium whitespace-nowrap text-gray-900 sm:pl-6 lg:pl-8"
|
|
>
|
|
Jeffrey Webb
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 sm:table-cell"
|
|
>
|
|
Senior Art Director
|
|
</td>
|
|
<td
|
|
class="hidden border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500 lg:table-cell"
|
|
>
|
|
jeffrey.webb@example.com
|
|
</td>
|
|
<td
|
|
class="border-b border-gray-200 px-3 py-4 text-sm whitespace-nowrap text-gray-500"
|
|
>
|
|
Admin
|
|
</td>
|
|
<td
|
|
class="relative border-b border-gray-200 py-4 pr-4 pl-3 text-right text-sm font-medium whitespace-nowrap sm:pr-8 lg:pr-8"
|
|
>
|
|
<a
|
|
href="#"
|
|
class="text-indigo-600 hover:text-indigo-900"
|
|
>Edit<span class="sr-only"
|
|
>, Jeffrey Webb</span
|
|
></a
|
|
>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td
|
|
class="py-4 pr-3 pl-4 text-sm font-medium whitespace-nowrap text-gray-900 sm:pl-6 lg:pl-8"
|
|
>
|
|
Kathryn Murphy
|
|
</td>
|
|
<td
|
|
class="hidden px-3 py-4 text-sm whitespace-nowrap text-gray-500 sm:table-cell"
|
|
>
|
|
Associate Creative Director
|
|
</td>
|
|
<td
|
|
class="hidden px-3 py-4 text-sm whitespace-nowrap text-gray-500 lg:table-cell"
|
|
>
|
|
kathryn.murphy@example.com
|
|
</td>
|
|
<td
|
|
class="px-3 py-4 text-sm whitespace-nowrap text-gray-500"
|
|
>
|
|
Member
|
|
</td>
|
|
<td
|
|
class="relative py-4 pr-4 pl-3 text-right text-sm font-medium whitespace-nowrap sm:pr-8 lg:pr-8"
|
|
>
|
|
<a
|
|
href="#"
|
|
class="text-indigo-600 hover:text-indigo-900"
|
|
>Edit<span class="sr-only"
|
|
>, Kathryn Murphy</span
|
|
></a
|
|
>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|