plutonium 0.8.0 → 0.9.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/README.md +6 -0
- data/app/assets/js/controllers/application.js +1 -0
- data/app/assets/js/controllers/index.js +9 -0
- data/app/assets/js/controllers/resource_dismiss_controller.js +37 -0
- data/app/assets/js/controllers/resource_drop_down_controller.js +29 -0
- data/app/assets/js/turbo/index.js +1 -1
- data/app/views/application/_flash.html.erb +1 -1
- data/app/views/application/_flash_alerts.html.erb +51 -7
- data/app/views/application/_flash_toasts.html.erb +53 -23
- data/app/views/application/_resource_header.html.erb +563 -561
- data/app/views/components/form/form_builder.rb +2 -2
- data/app/views/components/form/form_component.html.erb +5 -6
- data/app/views/components/interactive_action_form/interactive_action_form_component.html.erb +1 -1
- data/app/views/components/nested_resource_form_fields/nested_resource_form_fields_component.html.erb +66 -0
- data/app/views/components/nested_resource_form_fields/nested_resource_form_fields_component.rb +23 -0
- data/app/views/components/nested_resource_form_fields/nested_resource_form_fields_controller.js +64 -0
- data/app/views/components/sidebar/sidebar_component.html.erb +61 -63
- data/app/views/components/table_search_input/table_search_input_component.html.erb +1 -1
- data/app/views/layouts/resource.html copy.erb +0 -2
- data/app/views/layouts/resource.html.erb +1 -3
- data/app/views/layouts/rodauth.html.erb +0 -1
- data/app/views/resource/_interactive_resource_action_form.html.erb +1 -1
- data/exe/pug +6 -0
- data/lib/generators/pu/gen/component/component_generator.rb +1 -1
- data/lib/generators/pu/gen/pug/pug_generator.rb +1 -1
- data/lib/generators/pu/lib/plutonium_generators/cli.rb +42 -0
- data/lib/generators/pu/lib/plutonium_generators/generator.rb +1 -5
- data/lib/generators/pu/lib/plutonium_generators/model_generator.rb +1 -1
- data/lib/generators/pu/lib/plutonium_generators.rb +8 -0
- data/lib/plutonium/core/actions/collection.rb +1 -1
- data/lib/plutonium/core/controllers/authorizable.rb +4 -4
- data/lib/plutonium/core/fields/inputs/base.rb +1 -1
- data/lib/plutonium/core/fields/inputs/nested_input.rb +57 -0
- data/lib/plutonium/core/fields/inputs/noop_input.rb +1 -1
- data/lib/plutonium/core/fields/inputs/phone_input.rb +1 -1
- data/lib/plutonium/core/fields/inputs/polymorphic_belongs_to_association_input.rb +1 -1
- data/lib/plutonium/core/fields/inputs/simple_form_association_input.rb +1 -1
- data/lib/plutonium/core/fields/inputs/simple_form_input.rb +1 -1
- data/lib/plutonium/core/fields/renderers/factory.rb +1 -0
- data/lib/plutonium/core/fields/renderers/map_renderer.rb +19 -0
- data/lib/plutonium/resource/policy.rb +6 -0
- data/lib/plutonium/resource/presenter.rb +35 -0
- data/lib/plutonium/resource/record.rb +40 -7
- data/lib/plutonium/version.rb +1 -1
- data/package-lock.json +7 -0
- data/package.json +5 -4
- data/templates/base.rb +8 -0
- metadata +14 -4
- data/app/assets/js/controllers/dropdown_controller.js +0 -12
@@ -74,647 +74,649 @@
|
|
74
74
|
</div>
|
75
75
|
<div class="flex items-center lg:order-2">
|
76
76
|
<!-- Notifications -->
|
77
|
-
<
|
78
|
-
|
79
|
-
|
80
|
-
|
81
|
-
|
82
|
-
|
83
|
-
|
84
|
-
|
85
|
-
|
86
|
-
|
87
|
-
|
88
|
-
|
89
|
-
|
90
|
-
|
91
|
-
|
92
|
-
|
93
|
-
|
94
|
-
|
95
|
-
|
96
|
-
|
97
|
-
<div
|
98
|
-
class="hidden overflow-hidden z-50 my-4 max-w-sm text-base list-none bg-white rounded divide-y divide-gray-100 shadow-lg dark:divide-gray-600 dark:bg-gray-700 rounded-xl"
|
99
|
-
id="notification-dropdown"
|
100
|
-
>
|
77
|
+
<div data-controller="resource-drop-down">
|
78
|
+
<button
|
79
|
+
type="button"
|
80
|
+
data-resource-drop-down-target="trigger"
|
81
|
+
class="p-2 mr-1 text-gray-500 rounded-lg hover:text-gray-900 hover:bg-gray-100 dark:text-gray-200 dark:hover:text-white dark:hover:bg-gray-700 focus:ring-4 focus:ring-gray-300 dark:focus:ring-gray-600">
|
82
|
+
<span class="sr-only">View notifications</span>
|
83
|
+
<!-- Bell icon -->
|
84
|
+
<svg
|
85
|
+
aria-hidden="true"
|
86
|
+
class="w-6 h-6"
|
87
|
+
fill="currentColor"
|
88
|
+
viewBox="0 0 20 20"
|
89
|
+
xmlns="http://www.w3.org/2000/svg"
|
90
|
+
>
|
91
|
+
<path
|
92
|
+
d="M10 2a6 6 0 00-6 6v3.586l-.707.707A1 1 0 004 14h12a1 1 0 00.707-1.707L16 11.586V8a6 6 0 00-6-6zM10 18a3 3 0 01-3-3h6a3 3 0 01-3 3z"
|
93
|
+
></path>
|
94
|
+
</svg>
|
95
|
+
</button>
|
96
|
+
<!-- Dropdown menu -->
|
101
97
|
<div
|
102
|
-
|
103
|
-
|
104
|
-
|
105
|
-
|
106
|
-
<div>
|
107
|
-
<a
|
108
|
-
href="#"
|
109
|
-
class="flex py-3 px-4 border-b hover:bg-gray-100 dark:hover:bg-gray-600 dark:border-gray-600"
|
98
|
+
data-resource-drop-down-target="menu"
|
99
|
+
class="hidden overflow-hidden z-50 my-4 max-w-sm text-base list-none bg-white divide-y divide-gray-100 shadow-lg dark:divide-gray-600 dark:bg-gray-700 rounded-xl">
|
100
|
+
<div
|
101
|
+
class="block py-2 px-4 text-base font-medium text-center text-gray-700 bg-gray-50 dark:bg-gray-600 dark:text-gray-300"
|
110
102
|
>
|
111
|
-
|
112
|
-
|
113
|
-
|
114
|
-
|
115
|
-
|
116
|
-
|
117
|
-
|
118
|
-
|
119
|
-
|
120
|
-
|
121
|
-
|
122
|
-
|
123
|
-
|
124
|
-
|
125
|
-
|
103
|
+
Notifications
|
104
|
+
</div>
|
105
|
+
<div>
|
106
|
+
<a
|
107
|
+
href="#"
|
108
|
+
class="flex py-3 px-4 border-b hover:bg-gray-100 dark:hover:bg-gray-600 dark:border-gray-600"
|
109
|
+
>
|
110
|
+
<div class="shrink-0">
|
111
|
+
<img
|
112
|
+
class="w-11 h-11 rounded-full"
|
113
|
+
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/avatars/bonnie-green.png"
|
114
|
+
alt="Bonnie Green avatar"
|
115
|
+
/>
|
116
|
+
<div
|
117
|
+
class="flex absolute justify-center items-center ml-6 -mt-5 w-5 h-5 rounded-full border border-white bg-primary-700 dark:border-gray-700"
|
126
118
|
>
|
127
|
-
<
|
128
|
-
|
129
|
-
|
130
|
-
|
131
|
-
|
132
|
-
|
133
|
-
|
119
|
+
<svg
|
120
|
+
aria-hidden="true"
|
121
|
+
class="w-3 h-3 text-white"
|
122
|
+
fill="currentColor"
|
123
|
+
viewBox="0 0 20 20"
|
124
|
+
xmlns="http://www.w3.org/2000/svg"
|
125
|
+
>
|
126
|
+
<path
|
127
|
+
d="M8.707 7.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l2-2a1 1 0 00-1.414-1.414L11 7.586V3a1 1 0 10-2 0v4.586l-.293-.293z"
|
128
|
+
></path>
|
129
|
+
<path
|
130
|
+
d="M3 5a2 2 0 012-2h1a1 1 0 010 2H5v7h2l1 2h4l1-2h2V5h-1a1 1 0 110-2h1a2 2 0 012 2v10a2 2 0 01-2 2H5a2 2 0 01-2-2V5z"
|
131
|
+
></path>
|
132
|
+
</svg>
|
133
|
+
</div>
|
134
134
|
</div>
|
135
|
-
|
136
|
-
|
137
|
-
|
138
|
-
|
139
|
-
|
140
|
-
|
141
|
-
|
142
|
-
|
143
|
-
|
144
|
-
|
145
|
-
|
146
|
-
|
147
|
-
|
148
|
-
|
135
|
+
<div class="pl-3 w-full">
|
136
|
+
<div
|
137
|
+
class="text-gray-500 font-normal text-sm mb-1.5 dark:text-gray-200"
|
138
|
+
>
|
139
|
+
New message from
|
140
|
+
<span class="font-semibold text-gray-900 dark:text-white"
|
141
|
+
>Bonnie Green</span
|
142
|
+
>: "Hey, what's up? All set for the presentation?"
|
143
|
+
</div>
|
144
|
+
<div
|
145
|
+
class="text-xs font-medium text-primary-600 dark:text-primary-500"
|
146
|
+
>
|
147
|
+
a few moments ago
|
148
|
+
</div>
|
149
149
|
</div>
|
150
|
-
</
|
151
|
-
|
152
|
-
|
153
|
-
|
154
|
-
|
155
|
-
|
156
|
-
|
157
|
-
|
158
|
-
|
159
|
-
|
160
|
-
|
161
|
-
|
162
|
-
|
163
|
-
class="flex absolute justify-center items-center ml-6 -mt-5 w-5 h-5 bg-gray-900 rounded-full border border-white dark:border-gray-700"
|
164
|
-
>
|
165
|
-
<svg
|
166
|
-
aria-hidden="true"
|
167
|
-
class="w-3 h-3 text-white"
|
168
|
-
fill="currentColor"
|
169
|
-
viewBox="0 0 20 20"
|
170
|
-
xmlns="http://www.w3.org/2000/svg"
|
150
|
+
</a>
|
151
|
+
<a
|
152
|
+
href="#"
|
153
|
+
class="flex py-3 px-4 border-b hover:bg-gray-100 dark:hover:bg-gray-600 dark:border-gray-600"
|
154
|
+
>
|
155
|
+
<div class="shrink-0">
|
156
|
+
<img
|
157
|
+
class="w-11 h-11 rounded-full"
|
158
|
+
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/avatars/jese-leos.png"
|
159
|
+
alt="Jese Leos avatar"
|
160
|
+
/>
|
161
|
+
<div
|
162
|
+
class="flex absolute justify-center items-center ml-6 -mt-5 w-5 h-5 bg-gray-900 rounded-full border border-white dark:border-gray-700"
|
171
163
|
>
|
172
|
-
<
|
173
|
-
|
174
|
-
|
175
|
-
|
164
|
+
<svg
|
165
|
+
aria-hidden="true"
|
166
|
+
class="w-3 h-3 text-white"
|
167
|
+
fill="currentColor"
|
168
|
+
viewBox="0 0 20 20"
|
169
|
+
xmlns="http://www.w3.org/2000/svg"
|
170
|
+
>
|
171
|
+
<path
|
172
|
+
d="M8 9a3 3 0 100-6 3 3 0 000 6zM8 11a6 6 0 016 6H2a6 6 0 016-6zM16 7a1 1 0 10-2 0v1h-1a1 1 0 100 2h1v1a1 1 0 102 0v-1h1a1 1 0 100-2h-1V7z"
|
173
|
+
></path>
|
174
|
+
</svg>
|
175
|
+
</div>
|
176
176
|
</div>
|
177
|
-
|
178
|
-
|
179
|
-
|
180
|
-
class="text-gray-500 font-normal text-sm mb-1.5 dark:text-gray-200"
|
181
|
-
>
|
182
|
-
<span class="font-semibold text-gray-900 dark:text-white"
|
183
|
-
>Jese leos</span
|
177
|
+
<div class="pl-3 w-full">
|
178
|
+
<div
|
179
|
+
class="text-gray-500 font-normal text-sm mb-1.5 dark:text-gray-200"
|
184
180
|
>
|
185
|
-
|
186
|
-
|
187
|
-
>
|
181
|
+
<span class="font-semibold text-gray-900 dark:text-white"
|
182
|
+
>Jese leos</span
|
183
|
+
>
|
184
|
+
and
|
185
|
+
<span class="font-medium text-gray-900 dark:text-white"
|
186
|
+
>5 others</span
|
187
|
+
>
|
188
|
+
started following you.
|
189
|
+
</div>
|
190
|
+
<div
|
191
|
+
class="text-xs font-medium text-primary-600 dark:text-primary-500"
|
188
192
|
>
|
189
|
-
|
190
|
-
|
191
|
-
<div
|
192
|
-
class="text-xs font-medium text-primary-600 dark:text-primary-500"
|
193
|
-
>
|
194
|
-
10 minutes ago
|
193
|
+
10 minutes ago
|
194
|
+
</div>
|
195
195
|
</div>
|
196
|
-
</
|
197
|
-
|
198
|
-
|
199
|
-
|
200
|
-
|
201
|
-
|
202
|
-
|
203
|
-
|
204
|
-
|
205
|
-
|
206
|
-
|
207
|
-
|
208
|
-
|
209
|
-
class="flex absolute justify-center items-center ml-6 -mt-5 w-5 h-5 bg-red-600 rounded-full border border-white dark:border-gray-700"
|
210
|
-
>
|
211
|
-
<svg
|
212
|
-
aria-hidden="true"
|
213
|
-
class="w-3 h-3 text-white"
|
214
|
-
fill="currentColor"
|
215
|
-
viewBox="0 0 20 20"
|
216
|
-
xmlns="http://www.w3.org/2000/svg"
|
196
|
+
</a>
|
197
|
+
<a
|
198
|
+
href="#"
|
199
|
+
class="flex py-3 px-4 border-b hover:bg-gray-100 dark:hover:bg-gray-600 dark:border-gray-600"
|
200
|
+
>
|
201
|
+
<div class="shrink-0">
|
202
|
+
<img
|
203
|
+
class="w-11 h-11 rounded-full"
|
204
|
+
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/avatars/joseph-mcfall.png"
|
205
|
+
alt="Joseph McFall avatar"
|
206
|
+
/>
|
207
|
+
<div
|
208
|
+
class="flex absolute justify-center items-center ml-6 -mt-5 w-5 h-5 bg-red-600 rounded-full border border-white dark:border-gray-700"
|
217
209
|
>
|
218
|
-
<
|
219
|
-
|
220
|
-
|
221
|
-
|
222
|
-
|
223
|
-
|
210
|
+
<svg
|
211
|
+
aria-hidden="true"
|
212
|
+
class="w-3 h-3 text-white"
|
213
|
+
fill="currentColor"
|
214
|
+
viewBox="0 0 20 20"
|
215
|
+
xmlns="http://www.w3.org/2000/svg"
|
216
|
+
>
|
217
|
+
<path
|
218
|
+
fill-rule="evenodd"
|
219
|
+
d="M3.172 5.172a4 4 0 015.656 0L10 6.343l1.172-1.171a4 4 0 115.656 5.656L10 17.657l-6.828-6.829a4 4 0 010-5.656z"
|
220
|
+
clip-rule="evenodd"
|
221
|
+
></path>
|
222
|
+
</svg>
|
223
|
+
</div>
|
224
224
|
</div>
|
225
|
-
|
226
|
-
|
227
|
-
|
228
|
-
class="text-gray-500 font-normal text-sm mb-1.5 dark:text-gray-200"
|
229
|
-
>
|
230
|
-
<span class="font-semibold text-gray-900 dark:text-white"
|
231
|
-
>Joseph Mcfall</span
|
225
|
+
<div class="pl-3 w-full">
|
226
|
+
<div
|
227
|
+
class="text-gray-500 font-normal text-sm mb-1.5 dark:text-gray-200"
|
232
228
|
>
|
233
|
-
|
234
|
-
|
235
|
-
>
|
229
|
+
<span class="font-semibold text-gray-900 dark:text-white"
|
230
|
+
>Joseph Mcfall</span
|
231
|
+
>
|
232
|
+
and
|
233
|
+
<span class="font-medium text-gray-900 dark:text-white"
|
234
|
+
>141 others</span
|
235
|
+
>
|
236
|
+
love your story. See it and view more stories.
|
237
|
+
</div>
|
238
|
+
<div
|
239
|
+
class="text-xs font-medium text-primary-600 dark:text-primary-500"
|
236
240
|
>
|
237
|
-
|
238
|
-
|
239
|
-
<div
|
240
|
-
class="text-xs font-medium text-primary-600 dark:text-primary-500"
|
241
|
-
>
|
242
|
-
44 minutes ago
|
241
|
+
44 minutes ago
|
242
|
+
</div>
|
243
243
|
</div>
|
244
|
-
</
|
245
|
-
|
246
|
-
|
247
|
-
|
248
|
-
|
249
|
-
|
250
|
-
|
251
|
-
|
252
|
-
|
253
|
-
|
254
|
-
|
255
|
-
|
256
|
-
|
257
|
-
class="flex absolute justify-center items-center ml-6 -mt-5 w-5 h-5 bg-green-400 rounded-full border border-white dark:border-gray-700"
|
258
|
-
>
|
259
|
-
<svg
|
260
|
-
aria-hidden="true"
|
261
|
-
class="w-3 h-3 text-white"
|
262
|
-
fill="currentColor"
|
263
|
-
viewBox="0 0 20 20"
|
264
|
-
xmlns="http://www.w3.org/2000/svg"
|
244
|
+
</a>
|
245
|
+
<a
|
246
|
+
href="#"
|
247
|
+
class="flex py-3 px-4 border-b hover:bg-gray-100 dark:hover:bg-gray-600 dark:border-gray-600"
|
248
|
+
>
|
249
|
+
<div class="shrink-0">
|
250
|
+
<img
|
251
|
+
class="w-11 h-11 rounded-full"
|
252
|
+
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/avatars/roberta-casas.png"
|
253
|
+
alt="Roberta Casas image"
|
254
|
+
/>
|
255
|
+
<div
|
256
|
+
class="flex absolute justify-center items-center ml-6 -mt-5 w-5 h-5 bg-green-400 rounded-full border border-white dark:border-gray-700"
|
265
257
|
>
|
266
|
-
<
|
267
|
-
|
268
|
-
|
269
|
-
|
270
|
-
|
271
|
-
|
258
|
+
<svg
|
259
|
+
aria-hidden="true"
|
260
|
+
class="w-3 h-3 text-white"
|
261
|
+
fill="currentColor"
|
262
|
+
viewBox="0 0 20 20"
|
263
|
+
xmlns="http://www.w3.org/2000/svg"
|
264
|
+
>
|
265
|
+
<path
|
266
|
+
fill-rule="evenodd"
|
267
|
+
d="M18 13V5a2 2 0 00-2-2H4a2 2 0 00-2 2v8a2 2 0 002 2h3l3 3 3-3h3a2 2 0 002-2zM5 7a1 1 0 011-1h8a1 1 0 110 2H6a1 1 0 01-1-1zm1 3a1 1 0 100 2h3a1 1 0 100-2H6z"
|
268
|
+
clip-rule="evenodd"
|
269
|
+
></path>
|
270
|
+
</svg>
|
271
|
+
</div>
|
272
272
|
</div>
|
273
|
-
|
274
|
-
|
275
|
-
|
276
|
-
class="text-gray-500 font-normal text-sm mb-1.5 dark:text-gray-200"
|
277
|
-
>
|
278
|
-
<span class="font-semibold text-gray-900 dark:text-white"
|
279
|
-
>Leslie Livingston</span
|
273
|
+
<div class="pl-3 w-full">
|
274
|
+
<div
|
275
|
+
class="text-gray-500 font-normal text-sm mb-1.5 dark:text-gray-200"
|
280
276
|
>
|
281
|
-
|
282
|
-
|
283
|
-
|
284
|
-
|
277
|
+
<span class="font-semibold text-gray-900 dark:text-white"
|
278
|
+
>Leslie Livingston</span
|
279
|
+
>
|
280
|
+
mentioned you in a comment:
|
281
|
+
<span
|
282
|
+
class="font-medium text-primary-600 dark:text-primary-500"
|
283
|
+
>@bonnie.green</span
|
284
|
+
>
|
285
|
+
what do you say?
|
286
|
+
</div>
|
287
|
+
<div
|
288
|
+
class="text-xs font-medium text-primary-600 dark:text-primary-500"
|
285
289
|
>
|
286
|
-
|
287
|
-
|
288
|
-
<div
|
289
|
-
class="text-xs font-medium text-primary-600 dark:text-primary-500"
|
290
|
-
>
|
291
|
-
1 hour ago
|
290
|
+
1 hour ago
|
291
|
+
</div>
|
292
292
|
</div>
|
293
|
-
</
|
294
|
-
|
295
|
-
|
296
|
-
|
297
|
-
|
298
|
-
|
299
|
-
|
300
|
-
|
301
|
-
|
302
|
-
|
303
|
-
|
304
|
-
|
305
|
-
|
306
|
-
class="flex absolute justify-center items-center ml-6 -mt-5 w-5 h-5 bg-purple-500 rounded-full border border-white dark:border-gray-700"
|
307
|
-
>
|
308
|
-
<svg
|
309
|
-
aria-hidden="true"
|
310
|
-
class="w-3 h-3 text-white"
|
311
|
-
fill="currentColor"
|
312
|
-
viewBox="0 0 20 20"
|
313
|
-
xmlns="http://www.w3.org/2000/svg"
|
293
|
+
</a>
|
294
|
+
<a
|
295
|
+
href="#"
|
296
|
+
class="flex py-3 px-4 hover:bg-gray-100 dark:hover:bg-gray-600"
|
297
|
+
>
|
298
|
+
<div class="shrink-0">
|
299
|
+
<img
|
300
|
+
class="w-11 h-11 rounded-full"
|
301
|
+
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/avatars/robert-brown.png"
|
302
|
+
alt="Robert image"
|
303
|
+
/>
|
304
|
+
<div
|
305
|
+
class="flex absolute justify-center items-center ml-6 -mt-5 w-5 h-5 bg-purple-500 rounded-full border border-white dark:border-gray-700"
|
314
306
|
>
|
315
|
-
<
|
316
|
-
|
317
|
-
|
318
|
-
|
307
|
+
<svg
|
308
|
+
aria-hidden="true"
|
309
|
+
class="w-3 h-3 text-white"
|
310
|
+
fill="currentColor"
|
311
|
+
viewBox="0 0 20 20"
|
312
|
+
xmlns="http://www.w3.org/2000/svg"
|
313
|
+
>
|
314
|
+
<path
|
315
|
+
d="M2 6a2 2 0 012-2h6a2 2 0 012 2v8a2 2 0 01-2 2H4a2 2 0 01-2-2V6zM14.553 7.106A1 1 0 0014 8v4a1 1 0 00.553.894l2 1A1 1 0 0018 13V7a1 1 0 00-1.447-.894l-2 1z"
|
316
|
+
></path>
|
317
|
+
</svg>
|
318
|
+
</div>
|
319
319
|
</div>
|
320
|
-
|
321
|
-
|
322
|
-
|
323
|
-
class="text-gray-500 font-normal text-sm mb-1.5 dark:text-gray-200"
|
324
|
-
>
|
325
|
-
<span class="font-semibold text-gray-900 dark:text-white"
|
326
|
-
>Robert Brown</span
|
320
|
+
<div class="pl-3 w-full">
|
321
|
+
<div
|
322
|
+
class="text-gray-500 font-normal text-sm mb-1.5 dark:text-gray-200"
|
327
323
|
>
|
328
|
-
|
329
|
-
|
330
|
-
|
331
|
-
|
332
|
-
|
333
|
-
|
334
|
-
|
324
|
+
<span class="font-semibold text-gray-900 dark:text-white"
|
325
|
+
>Robert Brown</span
|
326
|
+
>
|
327
|
+
posted a new video: Glassmorphism - learn how to implement
|
328
|
+
the new design trend.
|
329
|
+
</div>
|
330
|
+
<div
|
331
|
+
class="text-xs font-medium text-primary-600 dark:text-primary-500"
|
332
|
+
>
|
333
|
+
3 hours ago
|
334
|
+
</div>
|
335
335
|
</div>
|
336
|
-
</
|
337
|
-
</a>
|
338
|
-
</div>
|
339
|
-
<a
|
340
|
-
href="#"
|
341
|
-
class="block py-2 text-md font-medium text-center text-gray-900 bg-gray-50 hover:bg-gray-100 dark:bg-gray-600 dark:text-white dark:hover:underline"
|
342
|
-
>
|
343
|
-
<div class="inline-flex items-center">
|
344
|
-
<svg
|
345
|
-
aria-hidden="true"
|
346
|
-
class="mr-2 w-4 h-4 text-gray-500 dark:text-gray-200"
|
347
|
-
fill="currentColor"
|
348
|
-
viewBox="0 0 20 20"
|
349
|
-
xmlns="http://www.w3.org/2000/svg"
|
350
|
-
>
|
351
|
-
<path d="M10 12a2 2 0 100-4 2 2 0 000 4z"></path>
|
352
|
-
<path
|
353
|
-
fill-rule="evenodd"
|
354
|
-
d="M.458 10C1.732 5.943 5.522 3 10 3s8.268 2.943 9.542 7c-1.274 4.057-5.064 7-9.542 7S1.732 14.057.458 10zM14 10a4 4 0 11-8 0 4 4 0 018 0z"
|
355
|
-
clip-rule="evenodd"
|
356
|
-
></path>
|
357
|
-
</svg>
|
358
|
-
View all
|
336
|
+
</a>
|
359
337
|
</div>
|
360
|
-
</a>
|
361
|
-
</div>
|
362
|
-
<!-- Apps -->
|
363
|
-
<button
|
364
|
-
type="button"
|
365
|
-
data-dropdown-toggle="apps-dropdown"
|
366
|
-
class="p-2 text-gray-500 rounded-lg hover:text-gray-900 hover:bg-gray-100 dark:text-gray-200 dark:hover:text-white dark:hover:bg-gray-700 focus:ring-4 focus:ring-gray-300 dark:focus:ring-gray-600"
|
367
|
-
>
|
368
|
-
<span class="sr-only">View notifications</span>
|
369
|
-
<!-- Icon -->
|
370
|
-
<svg
|
371
|
-
class="w-6 h-6"
|
372
|
-
fill="currentColor"
|
373
|
-
viewBox="0 0 20 20"
|
374
|
-
xmlns="http://www.w3.org/2000/svg"
|
375
|
-
>
|
376
|
-
<path
|
377
|
-
d="M5 3a2 2 0 00-2 2v2a2 2 0 002 2h2a2 2 0 002-2V5a2 2 0 00-2-2H5zM5 11a2 2 0 00-2 2v2a2 2 0 002 2h2a2 2 0 002-2v-2a2 2 0 00-2-2H5zM11 5a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2V5zM11 13a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2v-2z"
|
378
|
-
></path>
|
379
|
-
</svg>
|
380
|
-
</button>
|
381
|
-
<!-- Dropdown menu -->
|
382
|
-
<div
|
383
|
-
class="hidden overflow-hidden z-50 my-4 max-w-sm text-base list-none bg-white rounded divide-y divide-gray-100 shadow-lg dark:bg-gray-700 dark:divide-gray-600 rounded-xl"
|
384
|
-
id="apps-dropdown"
|
385
|
-
>
|
386
|
-
<div
|
387
|
-
class="block py-2 px-4 text-base font-medium text-center text-gray-700 bg-gray-50 dark:bg-gray-600 dark:text-gray-300"
|
388
|
-
>
|
389
|
-
Apps
|
390
|
-
</div>
|
391
|
-
<div class="grid grid-cols-3 gap-4 p-4">
|
392
|
-
<a
|
393
|
-
href="#"
|
394
|
-
class="block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600 group"
|
395
|
-
>
|
396
|
-
<svg
|
397
|
-
aria-hidden="true"
|
398
|
-
class="mx-auto mb-1 w-7 h-7 text-gray-400 group-hover:text-gray-500 dark:text-gray-200 dark:group-hover:text-gray-400"
|
399
|
-
fill="currentColor"
|
400
|
-
viewBox="0 0 20 20"
|
401
|
-
xmlns="http://www.w3.org/2000/svg"
|
402
|
-
>
|
403
|
-
<path
|
404
|
-
fill-rule="evenodd"
|
405
|
-
d="M10 2a4 4 0 00-4 4v1H5a1 1 0 00-.994.89l-1 9A1 1 0 004 18h12a1 1 0 00.994-1.11l-1-9A1 1 0 0015 7h-1V6a4 4 0 00-4-4zm2 5V6a2 2 0 10-4 0v1h4zm-6 3a1 1 0 112 0 1 1 0 01-2 0zm7-1a1 1 0 100 2 1 1 0 000-2z"
|
406
|
-
clip-rule="evenodd"
|
407
|
-
></path>
|
408
|
-
</svg>
|
409
|
-
<div class="text-sm text-gray-900 dark:text-white">Sales</div>
|
410
|
-
</a>
|
411
|
-
<a
|
412
|
-
href="#"
|
413
|
-
class="block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600 group"
|
414
|
-
>
|
415
|
-
<svg
|
416
|
-
aria-hidden="true"
|
417
|
-
class="mx-auto mb-1 w-7 h-7 text-gray-400 group-hover:text-gray-500 dark:text-gray-200 dark:group-hover:text-gray-400"
|
418
|
-
fill="currentColor"
|
419
|
-
viewBox="0 0 20 20"
|
420
|
-
xmlns="http://www.w3.org/2000/svg"
|
421
|
-
>
|
422
|
-
<path
|
423
|
-
d="M13 6a3 3 0 11-6 0 3 3 0 016 0zM18 8a2 2 0 11-4 0 2 2 0 014 0zM14 15a4 4 0 00-8 0v3h8v-3zM6 8a2 2 0 11-4 0 2 2 0 014 0zM16 18v-3a5.972 5.972 0 00-.75-2.906A3.005 3.005 0 0119 15v3h-3zM4.75 12.094A5.973 5.973 0 004 15v3H1v-3a3 3 0 013.75-2.906z"
|
424
|
-
></path>
|
425
|
-
</svg>
|
426
|
-
<div class="text-sm text-gray-900 dark:text-white">Users</div>
|
427
|
-
</a>
|
428
|
-
<a
|
429
|
-
href="#"
|
430
|
-
class="block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600 group"
|
431
|
-
>
|
432
|
-
<svg
|
433
|
-
aria-hidden="true"
|
434
|
-
class="mx-auto mb-1 w-7 h-7 text-gray-400 group-hover:text-gray-500 dark:text-gray-200 dark:group-hover:text-gray-400"
|
435
|
-
fill="currentColor"
|
436
|
-
viewBox="0 0 20 20"
|
437
|
-
xmlns="http://www.w3.org/2000/svg"
|
438
|
-
>
|
439
|
-
<path
|
440
|
-
fill-rule="evenodd"
|
441
|
-
d="M5 3a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2V5a2 2 0 00-2-2H5zm0 2h10v7h-2l-1 2H8l-1-2H5V5z"
|
442
|
-
clip-rule="evenodd"
|
443
|
-
></path>
|
444
|
-
</svg>
|
445
|
-
<div class="text-sm text-gray-900 dark:text-white">Inbox</div>
|
446
|
-
</a>
|
447
|
-
<a
|
448
|
-
href="#"
|
449
|
-
class="block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600 group"
|
450
|
-
>
|
451
|
-
<svg
|
452
|
-
aria-hidden="true"
|
453
|
-
class="mx-auto mb-1 w-7 h-7 text-gray-400 group-hover:text-gray-500 dark:text-gray-200 dark:group-hover:text-gray-400"
|
454
|
-
fill="currentColor"
|
455
|
-
viewBox="0 0 20 20"
|
456
|
-
xmlns="http://www.w3.org/2000/svg"
|
457
|
-
>
|
458
|
-
<path
|
459
|
-
fill-rule="evenodd"
|
460
|
-
d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-6-3a2 2 0 11-4 0 2 2 0 014 0zm-2 4a5 5 0 00-4.546 2.916A5.986 5.986 0 0010 16a5.986 5.986 0 004.546-2.084A5 5 0 0010 11z"
|
461
|
-
clip-rule="evenodd"
|
462
|
-
></path>
|
463
|
-
</svg>
|
464
|
-
<div class="text-sm text-gray-900 dark:text-white">
|
465
|
-
Profile
|
466
|
-
</div>
|
467
|
-
</a>
|
468
|
-
<a
|
469
|
-
href="#"
|
470
|
-
class="block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600 group"
|
471
|
-
>
|
472
|
-
<svg
|
473
|
-
aria-hidden="true"
|
474
|
-
class="mx-auto mb-1 w-7 h-7 text-gray-400 group-hover:text-gray-500 dark:text-gray-200 dark:group-hover:text-gray-400"
|
475
|
-
fill="currentColor"
|
476
|
-
viewBox="0 0 20 20"
|
477
|
-
xmlns="http://www.w3.org/2000/svg"
|
478
|
-
>
|
479
|
-
<path
|
480
|
-
fill-rule="evenodd"
|
481
|
-
d="M11.49 3.17c-.38-1.56-2.6-1.56-2.98 0a1.532 1.532 0 01-2.286.948c-1.372-.836-2.942.734-2.106 2.106.54.886.061 2.042-.947 2.287-1.561.379-1.561 2.6 0 2.978a1.532 1.532 0 01.947 2.287c-.836 1.372.734 2.942 2.106 2.106a1.532 1.532 0 012.287.947c.379 1.561 2.6 1.561 2.978 0a1.533 1.533 0 012.287-.947c1.372.836 2.942-.734 2.106-2.106a1.533 1.533 0 01.947-2.287c1.561-.379 1.561-2.6 0-2.978a1.532 1.532 0 01-.947-2.287c.836-1.372-.734-2.942-2.106-2.106a1.532 1.532 0 01-2.287-.947zM10 13a3 3 0 100-6 3 3 0 000 6z"
|
482
|
-
clip-rule="evenodd"
|
483
|
-
></path>
|
484
|
-
</svg>
|
485
|
-
<div class="text-sm text-gray-900 dark:text-white">
|
486
|
-
Settings
|
487
|
-
</div>
|
488
|
-
</a>
|
489
|
-
<a
|
490
|
-
href="#"
|
491
|
-
class="block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600 group"
|
492
|
-
>
|
493
|
-
<svg
|
494
|
-
aria-hidden="true"
|
495
|
-
class="mx-auto mb-1 w-7 h-7 text-gray-400 group-hover:text-gray-500 dark:text-gray-200 dark:group-hover:text-gray-400"
|
496
|
-
fill="currentColor"
|
497
|
-
viewBox="0 0 20 20"
|
498
|
-
xmlns="http://www.w3.org/2000/svg"
|
499
|
-
>
|
500
|
-
<path d="M4 3a2 2 0 100 4h12a2 2 0 100-4H4z"></path>
|
501
|
-
<path
|
502
|
-
fill-rule="evenodd"
|
503
|
-
d="M3 8h14v7a2 2 0 01-2 2H5a2 2 0 01-2-2V8zm5 3a1 1 0 011-1h2a1 1 0 110 2H9a1 1 0 01-1-1z"
|
504
|
-
clip-rule="evenodd"
|
505
|
-
></path>
|
506
|
-
</svg>
|
507
|
-
<div class="text-sm text-gray-900 dark:text-white">
|
508
|
-
Products
|
509
|
-
</div>
|
510
|
-
</a>
|
511
|
-
<a
|
512
|
-
href="#"
|
513
|
-
class="block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600 group"
|
514
|
-
>
|
515
|
-
<svg
|
516
|
-
aria-hidden="true"
|
517
|
-
class="mx-auto mb-1 w-7 h-7 text-gray-400 group-hover:text-gray-500 dark:text-gray-200 dark:group-hover:text-gray-400"
|
518
|
-
fill="currentColor"
|
519
|
-
viewBox="0 0 20 20"
|
520
|
-
xmlns="http://www.w3.org/2000/svg"
|
521
|
-
>
|
522
|
-
<path
|
523
|
-
d="M8.433 7.418c.155-.103.346-.196.567-.267v1.698a2.305 2.305 0 01-.567-.267C8.07 8.34 8 8.114 8 8c0-.114.07-.34.433-.582zM11 12.849v-1.698c.22.071.412.164.567.267.364.243.433.468.433.582 0 .114-.07.34-.433.582a2.305 2.305 0 01-.567.267z"
|
524
|
-
></path>
|
525
|
-
<path
|
526
|
-
fill-rule="evenodd"
|
527
|
-
d="M10 18a8 8 0 100-16 8 8 0 000 16zm1-13a1 1 0 10-2 0v.092a4.535 4.535 0 00-1.676.662C6.602 6.234 6 7.009 6 8c0 .99.602 1.765 1.324 2.246.48.32 1.054.545 1.676.662v1.941c-.391-.127-.68-.317-.843-.504a1 1 0 10-1.51 1.31c.562.649 1.413 1.076 2.353 1.253V15a1 1 0 102 0v-.092a4.535 4.535 0 001.676-.662C13.398 13.766 14 12.991 14 12c0-.99-.602-1.765-1.324-2.246A4.535 4.535 0 0011 9.092V7.151c.391.127.68.317.843.504a1 1 0 101.511-1.31c-.563-.649-1.413-1.076-2.354-1.253V5z"
|
528
|
-
clip-rule="evenodd"
|
529
|
-
></path>
|
530
|
-
</svg>
|
531
|
-
<div class="text-sm text-gray-900 dark:text-white">
|
532
|
-
Pricing
|
533
|
-
</div>
|
534
|
-
</a>
|
535
338
|
<a
|
536
339
|
href="#"
|
537
|
-
class="block
|
340
|
+
class="block py-2 text-md font-medium text-center text-gray-900 bg-gray-50 hover:bg-gray-100 dark:bg-gray-600 dark:text-white dark:hover:underline"
|
538
341
|
>
|
539
|
-
<
|
540
|
-
|
541
|
-
|
542
|
-
|
543
|
-
|
544
|
-
|
545
|
-
|
546
|
-
|
547
|
-
|
548
|
-
|
549
|
-
|
550
|
-
|
551
|
-
|
552
|
-
|
553
|
-
|
554
|
-
|
555
|
-
</a>
|
556
|
-
<a
|
557
|
-
href="#"
|
558
|
-
class="block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600 group"
|
559
|
-
>
|
560
|
-
<svg
|
561
|
-
aria-hidden="true"
|
562
|
-
class="mx-auto mb-1 w-7 h-7 text-gray-400 group-hover:text-gray-500 dark:text-gray-200 dark:group-hover:text-gray-400"
|
563
|
-
fill="none"
|
564
|
-
stroke="currentColor"
|
565
|
-
viewBox="0 0 24 24"
|
566
|
-
xmlns="http://www.w3.org/2000/svg"
|
567
|
-
>
|
568
|
-
<path
|
569
|
-
stroke-linecap="round"
|
570
|
-
stroke-linejoin="round"
|
571
|
-
stroke-width="2"
|
572
|
-
d="M11 16l-4-4m0 0l4-4m-4 4h14m-5 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h7a3 3 0 013 3v1"
|
573
|
-
></path>
|
574
|
-
</svg>
|
575
|
-
<div class="text-sm text-gray-900 dark:text-white">
|
576
|
-
Logout
|
342
|
+
<div class="inline-flex items-center">
|
343
|
+
<svg
|
344
|
+
aria-hidden="true"
|
345
|
+
class="mr-2 w-4 h-4 text-gray-500 dark:text-gray-200"
|
346
|
+
fill="currentColor"
|
347
|
+
viewBox="0 0 20 20"
|
348
|
+
xmlns="http://www.w3.org/2000/svg"
|
349
|
+
>
|
350
|
+
<path d="M10 12a2 2 0 100-4 2 2 0 000 4z"></path>
|
351
|
+
<path
|
352
|
+
fill-rule="evenodd"
|
353
|
+
d="M.458 10C1.732 5.943 5.522 3 10 3s8.268 2.943 9.542 7c-1.274 4.057-5.064 7-9.542 7S1.732 14.057.458 10zM14 10a4 4 0 11-8 0 4 4 0 018 0z"
|
354
|
+
clip-rule="evenodd"
|
355
|
+
></path>
|
356
|
+
</svg>
|
357
|
+
View all
|
577
358
|
</div>
|
578
359
|
</a>
|
579
360
|
</div>
|
580
361
|
</div>
|
581
|
-
|
582
|
-
|
583
|
-
|
584
|
-
|
585
|
-
|
586
|
-
|
587
|
-
|
588
|
-
|
589
|
-
|
590
|
-
|
591
|
-
|
592
|
-
|
593
|
-
|
594
|
-
|
595
|
-
<!-- Dropdown menu -->
|
596
|
-
<div
|
597
|
-
class="hidden z-50 my-4 w-56 text-base list-none bg-white rounded divide-y divide-gray-100 shadow dark:bg-gray-700 dark:divide-gray-600 rounded-xl"
|
598
|
-
id="user-menu-dropdown"
|
599
|
-
>
|
600
|
-
<div class="py-3 px-4">
|
601
|
-
<span
|
602
|
-
class="block text-sm font-semibold text-gray-900 dark:text-white"
|
603
|
-
>Neil Sims</span
|
362
|
+
|
363
|
+
<!-- Apps -->
|
364
|
+
<div data-controller="resource-drop-down">
|
365
|
+
<button
|
366
|
+
type="button"
|
367
|
+
data-resource-drop-down-target="trigger"
|
368
|
+
class="p-2 text-gray-500 rounded-lg hover:text-gray-900 hover:bg-gray-100 dark:text-gray-200 dark:hover:text-white dark:hover:bg-gray-700 focus:ring-4 focus:ring-gray-300 dark:focus:ring-gray-600">
|
369
|
+
<span class="sr-only">View notifications</span>
|
370
|
+
<!-- Icon -->
|
371
|
+
<svg
|
372
|
+
class="w-6 h-6"
|
373
|
+
fill="currentColor"
|
374
|
+
viewBox="0 0 20 20"
|
375
|
+
xmlns="http://www.w3.org/2000/svg"
|
604
376
|
>
|
605
|
-
|
606
|
-
|
607
|
-
>
|
377
|
+
<path
|
378
|
+
d="M5 3a2 2 0 00-2 2v2a2 2 0 002 2h2a2 2 0 002-2V5a2 2 0 00-2-2H5zM5 11a2 2 0 00-2 2v2a2 2 0 002 2h2a2 2 0 002-2v-2a2 2 0 00-2-2H5zM11 5a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2V5zM11 13a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2v-2z"
|
379
|
+
></path>
|
380
|
+
</svg>
|
381
|
+
</button>
|
382
|
+
<!-- Dropdown menu -->
|
383
|
+
<div
|
384
|
+
class="hidden overflow-hidden z-50 my-4 max-w-sm text-base list-none bg-white divide-y divide-gray-100 shadow-lg dark:bg-gray-700 dark:divide-gray-600 rounded-xl"
|
385
|
+
data-resource-drop-down-target="menu">
|
386
|
+
<div
|
387
|
+
class="block py-2 px-4 text-base font-medium text-center text-gray-700 bg-gray-50 dark:bg-gray-600 dark:text-gray-300"
|
608
388
|
>
|
609
|
-
|
610
|
-
|
611
|
-
class="
|
612
|
-
|
613
|
-
|
614
|
-
|
389
|
+
Apps
|
390
|
+
</div>
|
391
|
+
<div class="grid grid-cols-3 gap-4 p-4">
|
392
|
+
<a
|
393
|
+
href="#"
|
394
|
+
class="block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600 group"
|
395
|
+
>
|
396
|
+
<svg
|
397
|
+
aria-hidden="true"
|
398
|
+
class="mx-auto mb-1 w-7 h-7 text-gray-400 group-hover:text-gray-500 dark:text-gray-200 dark:group-hover:text-gray-400"
|
399
|
+
fill="currentColor"
|
400
|
+
viewBox="0 0 20 20"
|
401
|
+
xmlns="http://www.w3.org/2000/svg"
|
402
|
+
>
|
403
|
+
<path
|
404
|
+
fill-rule="evenodd"
|
405
|
+
d="M10 2a4 4 0 00-4 4v1H5a1 1 0 00-.994.89l-1 9A1 1 0 004 18h12a1 1 0 00.994-1.11l-1-9A1 1 0 0015 7h-1V6a4 4 0 00-4-4zm2 5V6a2 2 0 10-4 0v1h4zm-6 3a1 1 0 112 0 1 1 0 01-2 0zm7-1a1 1 0 100 2 1 1 0 000-2z"
|
406
|
+
clip-rule="evenodd"
|
407
|
+
></path>
|
408
|
+
</svg>
|
409
|
+
<div class="text-sm text-gray-900 dark:text-white">Sales</div>
|
410
|
+
</a>
|
615
411
|
<a
|
616
412
|
href="#"
|
617
|
-
class="block
|
618
|
-
>My profile</a
|
413
|
+
class="block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600 group"
|
619
414
|
>
|
620
|
-
|
621
|
-
|
415
|
+
<svg
|
416
|
+
aria-hidden="true"
|
417
|
+
class="mx-auto mb-1 w-7 h-7 text-gray-400 group-hover:text-gray-500 dark:text-gray-200 dark:group-hover:text-gray-400"
|
418
|
+
fill="currentColor"
|
419
|
+
viewBox="0 0 20 20"
|
420
|
+
xmlns="http://www.w3.org/2000/svg"
|
421
|
+
>
|
422
|
+
<path
|
423
|
+
d="M13 6a3 3 0 11-6 0 3 3 0 016 0zM18 8a2 2 0 11-4 0 2 2 0 014 0zM14 15a4 4 0 00-8 0v3h8v-3zM6 8a2 2 0 11-4 0 2 2 0 014 0zM16 18v-3a5.972 5.972 0 00-.75-2.906A3.005 3.005 0 0119 15v3h-3zM4.75 12.094A5.973 5.973 0 004 15v3H1v-3a3 3 0 013.75-2.906z"
|
424
|
+
></path>
|
425
|
+
</svg>
|
426
|
+
<div class="text-sm text-gray-900 dark:text-white">Users</div>
|
427
|
+
</a>
|
622
428
|
<a
|
623
429
|
href="#"
|
624
|
-
class="block
|
625
|
-
>Account settings</a
|
430
|
+
class="block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600 group"
|
626
431
|
>
|
627
|
-
|
628
|
-
|
629
|
-
|
630
|
-
|
631
|
-
|
632
|
-
|
633
|
-
|
432
|
+
<svg
|
433
|
+
aria-hidden="true"
|
434
|
+
class="mx-auto mb-1 w-7 h-7 text-gray-400 group-hover:text-gray-500 dark:text-gray-200 dark:group-hover:text-gray-400"
|
435
|
+
fill="currentColor"
|
436
|
+
viewBox="0 0 20 20"
|
437
|
+
xmlns="http://www.w3.org/2000/svg"
|
438
|
+
>
|
439
|
+
<path
|
440
|
+
fill-rule="evenodd"
|
441
|
+
d="M5 3a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2V5a2 2 0 00-2-2H5zm0 2h10v7h-2l-1 2H8l-1-2H5V5z"
|
442
|
+
clip-rule="evenodd"
|
443
|
+
></path>
|
444
|
+
</svg>
|
445
|
+
<div class="text-sm text-gray-900 dark:text-white">Inbox</div>
|
446
|
+
</a>
|
634
447
|
<a
|
635
448
|
href="#"
|
636
|
-
class="
|
637
|
-
|
638
|
-
|
449
|
+
class="block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600 group"
|
450
|
+
>
|
451
|
+
<svg
|
452
|
+
aria-hidden="true"
|
453
|
+
class="mx-auto mb-1 w-7 h-7 text-gray-400 group-hover:text-gray-500 dark:text-gray-200 dark:group-hover:text-gray-400"
|
639
454
|
fill="currentColor"
|
640
455
|
viewBox="0 0 20 20"
|
641
456
|
xmlns="http://www.w3.org/2000/svg"
|
642
457
|
>
|
643
458
|
<path
|
644
459
|
fill-rule="evenodd"
|
645
|
-
d="
|
460
|
+
d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-6-3a2 2 0 11-4 0 2 2 0 014 0zm-2 4a5 5 0 00-4.546 2.916A5.986 5.986 0 0010 16a5.986 5.986 0 004.546-2.084A5 5 0 0010 11z"
|
646
461
|
clip-rule="evenodd"
|
647
462
|
></path>
|
648
463
|
</svg>
|
649
|
-
|
464
|
+
<div class="text-sm text-gray-900 dark:text-white">
|
465
|
+
Profile
|
466
|
+
</div>
|
467
|
+
</a>
|
468
|
+
<a
|
469
|
+
href="#"
|
470
|
+
class="block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600 group"
|
650
471
|
>
|
651
|
-
|
652
|
-
|
472
|
+
<svg
|
473
|
+
aria-hidden="true"
|
474
|
+
class="mx-auto mb-1 w-7 h-7 text-gray-400 group-hover:text-gray-500 dark:text-gray-200 dark:group-hover:text-gray-400"
|
475
|
+
fill="currentColor"
|
476
|
+
viewBox="0 0 20 20"
|
477
|
+
xmlns="http://www.w3.org/2000/svg"
|
478
|
+
>
|
479
|
+
<path
|
480
|
+
fill-rule="evenodd"
|
481
|
+
d="M11.49 3.17c-.38-1.56-2.6-1.56-2.98 0a1.532 1.532 0 01-2.286.948c-1.372-.836-2.942.734-2.106 2.106.54.886.061 2.042-.947 2.287-1.561.379-1.561 2.6 0 2.978a1.532 1.532 0 01.947 2.287c-.836 1.372.734 2.942 2.106 2.106a1.532 1.532 0 012.287.947c.379 1.561 2.6 1.561 2.978 0a1.533 1.533 0 012.287-.947c1.372.836 2.942-.734 2.106-2.106a1.533 1.533 0 01.947-2.287c1.561-.379 1.561-2.6 0-2.978a1.532 1.532 0 01-.947-2.287c.836-1.372-.734-2.942-2.106-2.106a1.532 1.532 0 01-2.287-.947zM10 13a3 3 0 100-6 3 3 0 000 6z"
|
482
|
+
clip-rule="evenodd"
|
483
|
+
></path>
|
484
|
+
</svg>
|
485
|
+
<div class="text-sm text-gray-900 dark:text-white">
|
486
|
+
Settings
|
487
|
+
</div>
|
488
|
+
</a>
|
653
489
|
<a
|
654
490
|
href="#"
|
655
|
-
class="
|
656
|
-
|
657
|
-
|
491
|
+
class="block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600 group"
|
492
|
+
>
|
493
|
+
<svg
|
494
|
+
aria-hidden="true"
|
495
|
+
class="mx-auto mb-1 w-7 h-7 text-gray-400 group-hover:text-gray-500 dark:text-gray-200 dark:group-hover:text-gray-400"
|
658
496
|
fill="currentColor"
|
659
497
|
viewBox="0 0 20 20"
|
660
498
|
xmlns="http://www.w3.org/2000/svg"
|
661
499
|
>
|
500
|
+
<path d="M4 3a2 2 0 100 4h12a2 2 0 100-4H4z"></path>
|
662
501
|
<path
|
663
|
-
|
502
|
+
fill-rule="evenodd"
|
503
|
+
d="M3 8h14v7a2 2 0 01-2 2H5a2 2 0 01-2-2V8zm5 3a1 1 0 011-1h2a1 1 0 110 2H9a1 1 0 01-1-1z"
|
504
|
+
clip-rule="evenodd"
|
664
505
|
></path>
|
665
506
|
</svg>
|
666
|
-
|
507
|
+
<div class="text-sm text-gray-900 dark:text-white">
|
508
|
+
Products
|
509
|
+
</div>
|
510
|
+
</a>
|
511
|
+
<a
|
512
|
+
href="#"
|
513
|
+
class="block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600 group"
|
667
514
|
>
|
668
|
-
|
669
|
-
|
515
|
+
<svg
|
516
|
+
aria-hidden="true"
|
517
|
+
class="mx-auto mb-1 w-7 h-7 text-gray-400 group-hover:text-gray-500 dark:text-gray-200 dark:group-hover:text-gray-400"
|
518
|
+
fill="currentColor"
|
519
|
+
viewBox="0 0 20 20"
|
520
|
+
xmlns="http://www.w3.org/2000/svg"
|
521
|
+
>
|
522
|
+
<path
|
523
|
+
d="M8.433 7.418c.155-.103.346-.196.567-.267v1.698a2.305 2.305 0 01-.567-.267C8.07 8.34 8 8.114 8 8c0-.114.07-.34.433-.582zM11 12.849v-1.698c.22.071.412.164.567.267.364.243.433.468.433.582 0 .114-.07.34-.433.582a2.305 2.305 0 01-.567.267z"
|
524
|
+
></path>
|
525
|
+
<path
|
526
|
+
fill-rule="evenodd"
|
527
|
+
d="M10 18a8 8 0 100-16 8 8 0 000 16zm1-13a1 1 0 10-2 0v.092a4.535 4.535 0 00-1.676.662C6.602 6.234 6 7.009 6 8c0 .99.602 1.765 1.324 2.246.48.32 1.054.545 1.676.662v1.941c-.391-.127-.68-.317-.843-.504a1 1 0 10-1.51 1.31c.562.649 1.413 1.076 2.353 1.253V15a1 1 0 102 0v-.092a4.535 4.535 0 001.676-.662C13.398 13.766 14 12.991 14 12c0-.99-.602-1.765-1.324-2.246A4.535 4.535 0 0011 9.092V7.151c.391.127.68.317.843.504a1 1 0 101.511-1.31c-.563-.649-1.413-1.076-2.354-1.253V5z"
|
528
|
+
clip-rule="evenodd"
|
529
|
+
></path>
|
530
|
+
</svg>
|
531
|
+
<div class="text-sm text-gray-900 dark:text-white">
|
532
|
+
Pricing
|
533
|
+
</div>
|
534
|
+
</a>
|
670
535
|
<a
|
671
536
|
href="#"
|
672
|
-
class="
|
537
|
+
class="block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600 group"
|
673
538
|
>
|
674
|
-
<span class="flex items-center">
|
675
|
-
<svg
|
676
|
-
aria-hidden="true"
|
677
|
-
class="mr-2 w-5 h-5 text-primary-600 dark:text-primary-500"
|
678
|
-
fill="currentColor"
|
679
|
-
viewBox="0 0 20 20"
|
680
|
-
xmlns="http://www.w3.org/2000/svg"
|
681
|
-
>
|
682
|
-
<path
|
683
|
-
fill-rule="evenodd"
|
684
|
-
d="M12.395 2.553a1 1 0 00-1.45-.385c-.345.23-.614.558-.822.88-.214.33-.403.713-.57 1.116-.334.804-.614 1.768-.84 2.734a31.365 31.365 0 00-.613 3.58 2.64 2.64 0 01-.945-1.067c-.328-.68-.398-1.534-.398-2.654A1 1 0 005.05 6.05 6.981 6.981 0 003 11a7 7 0 1011.95-4.95c-.592-.591-.98-.985-1.348-1.467-.363-.476-.724-1.063-1.207-2.03zM12.12 15.12A3 3 0 017 13s.879.5 2.5.5c0-1 .5-4 1.25-4.5.5 1 .786 1.293 1.371 1.879A2.99 2.99 0 0113 13a2.99 2.99 0 01-.879 2.121z"
|
685
|
-
clip-rule="evenodd"
|
686
|
-
></path>
|
687
|
-
</svg>
|
688
|
-
Pro version
|
689
|
-
</span>
|
690
539
|
<svg
|
691
540
|
aria-hidden="true"
|
692
|
-
class="w-
|
541
|
+
class="mx-auto mb-1 w-7 h-7 text-gray-400 group-hover:text-gray-500 dark:text-gray-200 dark:group-hover:text-gray-400"
|
693
542
|
fill="currentColor"
|
694
543
|
viewBox="0 0 20 20"
|
695
544
|
xmlns="http://www.w3.org/2000/svg"
|
696
545
|
>
|
697
546
|
<path
|
698
547
|
fill-rule="evenodd"
|
699
|
-
d="
|
548
|
+
d="M5 2a2 2 0 00-2 2v14l3.5-2 3.5 2 3.5-2 3.5 2V4a2 2 0 00-2-2H5zm2.5 3a1.5 1.5 0 100 3 1.5 1.5 0 000-3zm6.207.293a1 1 0 00-1.414 0l-6 6a1 1 0 101.414 1.414l6-6a1 1 0 000-1.414zM12.5 10a1.5 1.5 0 100 3 1.5 1.5 0 000-3z"
|
700
549
|
clip-rule="evenodd"
|
701
550
|
></path>
|
702
551
|
</svg>
|
552
|
+
<div class="text-sm text-gray-900 dark:text-white">
|
553
|
+
Billing
|
554
|
+
</div>
|
703
555
|
</a>
|
704
|
-
</li>
|
705
|
-
</ul>
|
706
|
-
<ul
|
707
|
-
class="py-1 text-gray-700 dark:text-gray-300"
|
708
|
-
aria-labelledby="dropdown"
|
709
|
-
>
|
710
|
-
<li>
|
711
556
|
<a
|
712
557
|
href="#"
|
713
|
-
class="block
|
714
|
-
>Sign out</a
|
558
|
+
class="block p-4 text-center rounded-lg hover:bg-gray-100 dark:hover:bg-gray-600 group"
|
715
559
|
>
|
716
|
-
|
717
|
-
|
560
|
+
<svg
|
561
|
+
aria-hidden="true"
|
562
|
+
class="mx-auto mb-1 w-7 h-7 text-gray-400 group-hover:text-gray-500 dark:text-gray-200 dark:group-hover:text-gray-400"
|
563
|
+
fill="none"
|
564
|
+
stroke="currentColor"
|
565
|
+
viewBox="0 0 24 24"
|
566
|
+
xmlns="http://www.w3.org/2000/svg"
|
567
|
+
>
|
568
|
+
<path
|
569
|
+
stroke-linecap="round"
|
570
|
+
stroke-linejoin="round"
|
571
|
+
stroke-width="2"
|
572
|
+
d="M11 16l-4-4m0 0l4-4m-4 4h14m-5 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h7a3 3 0 013 3v1"
|
573
|
+
></path>
|
574
|
+
</svg>
|
575
|
+
<div class="text-sm text-gray-900 dark:text-white">
|
576
|
+
Logout
|
577
|
+
</div>
|
578
|
+
</a>
|
579
|
+
</div>
|
580
|
+
</div>
|
581
|
+
</div>
|
582
|
+
|
583
|
+
<!-- User -->
|
584
|
+
<div data-controller="resource-drop-down">
|
585
|
+
<button
|
586
|
+
type="button"
|
587
|
+
class="flex mx-3 text-sm bg-gray-800 rounded-full md:mr-0 focus:ring-4 focus:ring-gray-300 dark:focus:ring-gray-600"
|
588
|
+
aria-expanded="false"
|
589
|
+
data-resource-drop-down-target="trigger">
|
590
|
+
<span class="sr-only">Open user menu</span>
|
591
|
+
<img
|
592
|
+
class="w-8 h-8 rounded-full"
|
593
|
+
src="https://flowbite.s3.amazonaws.com/blocks/marketing-ui/avatars/michael-gough.png"
|
594
|
+
alt="user photo"
|
595
|
+
/>
|
596
|
+
</button>
|
597
|
+
<!-- Dropdown menu -->
|
598
|
+
<div
|
599
|
+
class="hidden z-50 my-4 w-56 text-base list-none bg-white divide-y divide-gray-100 shadow dark:bg-gray-700 dark:divide-gray-600 rounded-xl"
|
600
|
+
data-resource-drop-down-target="menu">
|
601
|
+
<div class="py-3 px-4">
|
602
|
+
<span
|
603
|
+
class="block text-sm font-semibold text-gray-900 dark:text-white"
|
604
|
+
>Neil Sims</span
|
605
|
+
>
|
606
|
+
<span
|
607
|
+
class="block text-sm text-gray-900 truncate dark:text-white"
|
608
|
+
>name@flowbite.com</span
|
609
|
+
>
|
610
|
+
</div>
|
611
|
+
<ul
|
612
|
+
class="py-1 text-gray-700 dark:text-gray-300"
|
613
|
+
aria-labelledby="user-menu-dropdown-toggle"
|
614
|
+
>
|
615
|
+
<li>
|
616
|
+
<a
|
617
|
+
href="#"
|
618
|
+
class="block py-2 px-4 text-sm hover:bg-gray-100 dark:hover:bg-gray-600 dark:text-gray-200 dark:hover:text-white"
|
619
|
+
>My profile</a
|
620
|
+
>
|
621
|
+
</li>
|
622
|
+
<li>
|
623
|
+
<a
|
624
|
+
href="#"
|
625
|
+
class="block py-2 px-4 text-sm hover:bg-gray-100 dark:hover:bg-gray-600 dark:text-gray-200 dark:hover:text-white"
|
626
|
+
>Account settings</a
|
627
|
+
>
|
628
|
+
</li>
|
629
|
+
</ul>
|
630
|
+
<ul
|
631
|
+
class="py-1 text-gray-700 dark:text-gray-300"
|
632
|
+
aria-labelledby="dropdown"
|
633
|
+
>
|
634
|
+
<li>
|
635
|
+
<a
|
636
|
+
href="#"
|
637
|
+
class="flex items-center py-2 px-4 text-sm hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white"
|
638
|
+
><svg
|
639
|
+
class="mr-2 w-5 h-5 text-gray-400"
|
640
|
+
fill="currentColor"
|
641
|
+
viewBox="0 0 20 20"
|
642
|
+
xmlns="http://www.w3.org/2000/svg"
|
643
|
+
>
|
644
|
+
<path
|
645
|
+
fill-rule="evenodd"
|
646
|
+
d="M3.172 5.172a4 4 0 015.656 0L10 6.343l1.172-1.171a4 4 0 115.656 5.656L10 17.657l-6.828-6.829a4 4 0 010-5.656z"
|
647
|
+
clip-rule="evenodd"
|
648
|
+
></path>
|
649
|
+
</svg>
|
650
|
+
My likes</a
|
651
|
+
>
|
652
|
+
</li>
|
653
|
+
<li>
|
654
|
+
<a
|
655
|
+
href="#"
|
656
|
+
class="flex items-center py-2 px-4 text-sm hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white"
|
657
|
+
><svg
|
658
|
+
class="mr-2 w-5 h-5 text-gray-400"
|
659
|
+
fill="currentColor"
|
660
|
+
viewBox="0 0 20 20"
|
661
|
+
xmlns="http://www.w3.org/2000/svg"
|
662
|
+
>
|
663
|
+
<path
|
664
|
+
d="M7 3a1 1 0 000 2h6a1 1 0 100-2H7zM4 7a1 1 0 011-1h10a1 1 0 110 2H5a1 1 0 01-1-1zM2 11a2 2 0 012-2h12a2 2 0 012 2v4a2 2 0 01-2 2H4a2 2 0 01-2-2v-4z"
|
665
|
+
></path>
|
666
|
+
</svg>
|
667
|
+
Collections</a
|
668
|
+
>
|
669
|
+
</li>
|
670
|
+
<li>
|
671
|
+
<a
|
672
|
+
href="#"
|
673
|
+
class="flex justify-between items-center py-2 px-4 text-sm hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white"
|
674
|
+
>
|
675
|
+
<span class="flex items-center">
|
676
|
+
<svg
|
677
|
+
aria-hidden="true"
|
678
|
+
class="mr-2 w-5 h-5 text-primary-600 dark:text-primary-500"
|
679
|
+
fill="currentColor"
|
680
|
+
viewBox="0 0 20 20"
|
681
|
+
xmlns="http://www.w3.org/2000/svg"
|
682
|
+
>
|
683
|
+
<path
|
684
|
+
fill-rule="evenodd"
|
685
|
+
d="M12.395 2.553a1 1 0 00-1.45-.385c-.345.23-.614.558-.822.88-.214.33-.403.713-.57 1.116-.334.804-.614 1.768-.84 2.734a31.365 31.365 0 00-.613 3.58 2.64 2.64 0 01-.945-1.067c-.328-.68-.398-1.534-.398-2.654A1 1 0 005.05 6.05 6.981 6.981 0 003 11a7 7 0 1011.95-4.95c-.592-.591-.98-.985-1.348-1.467-.363-.476-.724-1.063-1.207-2.03zM12.12 15.12A3 3 0 017 13s.879.5 2.5.5c0-1 .5-4 1.25-4.5.5 1 .786 1.293 1.371 1.879A2.99 2.99 0 0113 13a2.99 2.99 0 01-.879 2.121z"
|
686
|
+
clip-rule="evenodd"
|
687
|
+
></path>
|
688
|
+
</svg>
|
689
|
+
Pro version
|
690
|
+
</span>
|
691
|
+
<svg
|
692
|
+
aria-hidden="true"
|
693
|
+
class="w-5 h-5 text-gray-400"
|
694
|
+
fill="currentColor"
|
695
|
+
viewBox="0 0 20 20"
|
696
|
+
xmlns="http://www.w3.org/2000/svg"
|
697
|
+
>
|
698
|
+
<path
|
699
|
+
fill-rule="evenodd"
|
700
|
+
d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z"
|
701
|
+
clip-rule="evenodd"
|
702
|
+
></path>
|
703
|
+
</svg>
|
704
|
+
</a>
|
705
|
+
</li>
|
706
|
+
</ul>
|
707
|
+
<ul
|
708
|
+
class="py-1 text-gray-700 dark:text-gray-300"
|
709
|
+
aria-labelledby="dropdown"
|
710
|
+
>
|
711
|
+
<li>
|
712
|
+
<a
|
713
|
+
href="#"
|
714
|
+
class="block py-2 px-4 text-sm hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white"
|
715
|
+
>Sign out</a
|
716
|
+
>
|
717
|
+
</li>
|
718
|
+
</ul>
|
719
|
+
</div>
|
718
720
|
</div>
|
719
721
|
</div>
|
720
722
|
</div>
|