-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathusers.html
172 lines (165 loc) · 11 KB
/
users.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
<div id="app">
<div class="bg-white py-10">
<div class="mx-auto max-w-7xl">
<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 leading-6 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:ml-16 sm:mt-0 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-sm hover:bg-indigo-500 focus-visible:outline 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 overflow-x-auto sm:-mx-6 lg:-mx-8">
<div class="inline-block min-w-full py-2 align-middle sm:px-6 lg:px-8">
<div class="overflow-hidden shadow ring-1 ring-black ring-opacity-5 sm:rounded-lg">
<table class="min-w-full divide-y divide-gray-300">
<thead class="bg-gray-50">
<tr>
<th scope="col" class="py-3.5 pl-4 pr-3 text-left text-sm font-semibold text-gray-900 sm:pl-0">
<a href="#" class="group inline-flex">
Name
<span
class="invisible ml-2 flex-none rounded text-gray-400 group-hover:visible group-focus:visible"
x-description="Active: "bg-gray-200 text-gray-900 group-hover:bg-gray-300", Not Active: "invisible text-gray-400 group-hover:visible group-focus:visible"">
<svg class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
<path fill-rule="evenodd"
d="M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z"
clip-rule="evenodd"></path>
</svg>
</span>
</a>
</th>
<th scope="col" class="px-3 py-3.5 text-left text-sm font-semibold text-gray-900">
<a href="#" class="group inline-flex">
Title
<span class="ml-2 flex-none rounded bg-gray-100 text-gray-900 group-hover:bg-gray-200"
x-description="Active: "bg-gray-200 text-gray-900 group-hover:bg-gray-300", Not Active: "invisible text-gray-400 group-hover:visible group-focus:visible"">
<svg class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
<path fill-rule="evenodd"
d="M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z"
clip-rule="evenodd"></path>
</svg>
</span>
</a>
</th>
<th scope="col" class="px-3 py-3.5 text-left text-sm font-semibold text-gray-900">
<a href="#" class="group inline-flex">
Email
<span
class="invisible ml-2 flex-none rounded text-gray-400 group-hover:visible group-focus:visible"
x-description="Active: "bg-gray-200 text-gray-900 group-hover:bg-gray-300", Not Active: "invisible text-gray-400 group-hover:visible group-focus:visible"">
<svg
class="invisible ml-2 h-5 w-5 flex-none rounded text-gray-400 group-hover:visible group-focus:visible"
viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
<path fill-rule="evenodd"
d="M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z"
clip-rule="evenodd"></path>
</svg>
</span>
</a>
</th>
<th scope="col" class="px-3 py-3.5 text-left text-sm font-semibold text-gray-900">
<a href="#" class="group inline-flex">
Role
<span
class="invisible ml-2 flex-none rounded text-gray-400 group-hover:visible group-focus:visible"
x-description="Active: "bg-gray-200 text-gray-900 group-hover:bg-gray-300", Not Active: "invisible text-gray-400 group-hover:visible group-focus:visible"">
<svg
class="invisible ml-2 h-5 w-5 flex-none rounded text-gray-400 group-hover:visible group-focus:visible"
viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
<path fill-rule="evenodd"
d="M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z"
clip-rule="evenodd"></path>
</svg>
</span>
</a>
</th>
<th scope="col" class="relative py-3.5 pl-3 pr-0">
<span class="sr-only">Edit</span>
</th>
</tr>
</thead>
<tbody class="divide-y divide-gray-200 bg-white">
<tr>
<td class="whitespace-nowrap py-4 pl-4 pr-3 text-sm font-medium text-gray-900 sm:pl-0">Lindsay
Walton</td>
<td class="whitespace-nowrap px-3 py-4 text-sm text-gray-500">Front-end Developer</td>
<td class="whitespace-nowrap px-3 py-4 text-sm text-gray-500">lindsay.walton@example.com</td>
<td class="whitespace-nowrap px-3 py-4 text-sm text-gray-500">Member</td>
<td class="relative whitespace-nowrap py-4 pl-3 pr-4 text-right text-sm sm:pr-0">
<a href="#" class="text-indigo-600 hover:text-indigo-900">Edit<span class="sr-only">, Lindsay
Walton</span></a>
</td>
</tr>
<tr>
<td class="whitespace-nowrap py-4 pl-4 pr-3 text-sm font-medium text-gray-900 sm:pl-0">Courtney
Henry</td>
<td class="whitespace-nowrap px-3 py-4 text-sm text-gray-500">Designer</td>
<td class="whitespace-nowrap px-3 py-4 text-sm text-gray-500">courtney.henry@example.com</td>
<td class="whitespace-nowrap px-3 py-4 text-sm text-gray-500">Admin</td>
<td class="relative whitespace-nowrap py-4 pl-3 pr-4 text-right text-sm sm:pr-0">
<a href="#" class="text-indigo-600 hover:text-indigo-900">Edit<span class="sr-only">, Courtney
Henry</span></a>
</td>
</tr>
<tr>
<td class="whitespace-nowrap py-4 pl-4 pr-3 text-sm font-medium text-gray-900 sm:pl-0">Tom Cook
</td>
<td class="whitespace-nowrap px-3 py-4 text-sm text-gray-500">Director of Product</td>
<td class="whitespace-nowrap px-3 py-4 text-sm text-gray-500">tom.cook@example.com</td>
<td class="whitespace-nowrap px-3 py-4 text-sm text-gray-500">Member</td>
<td class="relative whitespace-nowrap py-4 pl-3 pr-4 text-right text-sm sm:pr-0">
<a href="#" class="text-indigo-600 hover:text-indigo-900">Edit<span class="sr-only">, Tom
Cook</span></a>
</td>
</tr>
<tr>
<td class="whitespace-nowrap py-4 pl-4 pr-3 text-sm font-medium text-gray-900 sm:pl-0">Whitney
Francis</td>
<td class="whitespace-nowrap px-3 py-4 text-sm text-gray-500">Copywriter</td>
<td class="whitespace-nowrap px-3 py-4 text-sm text-gray-500">whitney.francis@example.com</td>
<td class="whitespace-nowrap px-3 py-4 text-sm text-gray-500">Admin</td>
<td class="relative whitespace-nowrap py-4 pl-3 pr-4 text-right text-sm sm:pr-0">
<a href="#" class="text-indigo-600 hover:text-indigo-900">Edit<span class="sr-only">, Whitney
Francis</span></a>
</td>
</tr>
<tr>
<td class="whitespace-nowrap py-4 pl-4 pr-3 text-sm font-medium text-gray-900 sm:pl-0">Leonard
Krasner</td>
<td class="whitespace-nowrap px-3 py-4 text-sm text-gray-500">Senior Designer</td>
<td class="whitespace-nowrap px-3 py-4 text-sm text-gray-500">leonard.krasner@example.com</td>
<td class="whitespace-nowrap px-3 py-4 text-sm text-gray-500">Owner</td>
<td class="relative whitespace-nowrap py-4 pl-3 pr-4 text-right text-sm sm:pr-0">
<a href="#" class="text-indigo-600 hover:text-indigo-900">Edit<span class="sr-only">, Leonard
Krasner</span></a>
</td>
</tr>
<tr>
<td class="whitespace-nowrap py-4 pl-4 pr-3 text-sm font-medium text-gray-900 sm:pl-0">Floyd
Miles
</td>
<td class="whitespace-nowrap px-3 py-4 text-sm text-gray-500">Principal Designer</td>
<td class="whitespace-nowrap px-3 py-4 text-sm text-gray-500">floyd.miles@example.com</td>
<td class="whitespace-nowrap px-3 py-4 text-sm text-gray-500">Member</td>
<td class="relative whitespace-nowrap py-4 pl-3 pr-4 text-right text-sm sm:pr-0">
<a href="#" class="text-indigo-600 hover:text-indigo-900">Edit<span class="sr-only">, Floyd
Miles</span></a>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>