@adminkit/core 3.4.0 → 4.0.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.
- package/LICENSE +21 -21
- package/README.md +216 -148
- package/dist/charts-chartjs.html +666 -0
- package/dist/css/app.css +5 -5
- package/dist/css/app.d.css.ts +3 -0
- package/dist/fonts/inter-cyrillic-300-normal-BnqRxXuy.woff2 +0 -0
- package/dist/fonts/inter-cyrillic-400-normal-obahsSVq.woff2 +0 -0
- package/dist/fonts/inter-cyrillic-600-normal-CWCymEST.woff2 +0 -0
- package/dist/fonts/inter-cyrillic-ext-300-normal-CgCALhwJ.woff2 +0 -0
- package/dist/fonts/inter-cyrillic-ext-400-normal-BQZuk6qB.woff2 +0 -0
- package/dist/fonts/inter-cyrillic-ext-600-normal-Dfes3d0z.woff2 +0 -0
- package/dist/fonts/inter-greek-300-normal-DmGD3g_f.woff2 +0 -0
- package/dist/fonts/inter-greek-400-normal-B4URO6DV.woff2 +0 -0
- package/dist/fonts/inter-greek-600-normal-plRanbMR.woff2 +0 -0
- package/dist/fonts/inter-greek-ext-300-normal-l2DDyC6M.woff2 +0 -0
- package/dist/fonts/inter-greek-ext-400-normal-DGGRlc-M.woff2 +0 -0
- package/dist/fonts/inter-greek-ext-600-normal-DRtmH8MT.woff2 +0 -0
- package/dist/fonts/inter-latin-300-normal-BVlfKGgI.woff2 +0 -0
- package/dist/fonts/inter-latin-400-normal-C38fXH4l.woff2 +0 -0
- package/dist/fonts/inter-latin-600-normal-LgqL8muc.woff2 +0 -0
- package/dist/fonts/inter-latin-ext-300-normal-CPgO9Ksf.woff2 +0 -0
- package/dist/fonts/inter-latin-ext-400-normal-C1nco2VV.woff2 +0 -0
- package/dist/fonts/inter-latin-ext-600-normal-D2bJ5OIk.woff2 +0 -0
- package/dist/fonts/inter-vietnamese-300-normal-Bdr24Bqb.woff2 +0 -0
- package/dist/fonts/inter-vietnamese-400-normal-DMkecbls.woff2 +0 -0
- package/dist/fonts/inter-vietnamese-600-normal-Cc8MFFhd.woff2 +0 -0
- package/dist/icons-lucide.html +7249 -0
- package/dist/img/screenshots/pro/ai-chat-dark-800.webp +0 -0
- package/dist/img/screenshots/pro/ai-chat-dark.webp +0 -0
- package/dist/img/screenshots/pro/ai-chat-light-800.webp +0 -0
- package/dist/img/screenshots/pro/ai-chat-light.webp +0 -0
- package/dist/img/screenshots/pro/ai-usage-dark-800.webp +0 -0
- package/dist/img/screenshots/pro/ai-usage-dark.webp +0 -0
- package/dist/img/screenshots/pro/ai-usage-light-800.webp +0 -0
- package/dist/img/screenshots/pro/ai-usage-light.webp +0 -0
- package/dist/img/screenshots/pro/analytics-dark-800.webp +0 -0
- package/dist/img/screenshots/pro/analytics-dark.webp +0 -0
- package/dist/img/screenshots/pro/analytics-light-800.webp +0 -0
- package/dist/img/screenshots/pro/analytics-light.webp +0 -0
- package/dist/img/screenshots/pro/calendar-dark-800.webp +0 -0
- package/dist/img/screenshots/pro/calendar-dark.webp +0 -0
- package/dist/img/screenshots/pro/calendar-light-800.webp +0 -0
- package/dist/img/screenshots/pro/calendar-light.webp +0 -0
- package/dist/img/screenshots/pro/crm-dark-800.webp +0 -0
- package/dist/img/screenshots/pro/crm-dark.webp +0 -0
- package/dist/img/screenshots/pro/crm-light-800.webp +0 -0
- package/dist/img/screenshots/pro/crm-light.webp +0 -0
- package/dist/img/screenshots/pro/crypto-dark-800.webp +0 -0
- package/dist/img/screenshots/pro/crypto-dark.webp +0 -0
- package/dist/img/screenshots/pro/crypto-light-800.webp +0 -0
- package/dist/img/screenshots/pro/crypto-light.webp +0 -0
- package/dist/img/screenshots/pro/datatables-dark-800.webp +0 -0
- package/dist/img/screenshots/pro/datatables-dark.webp +0 -0
- package/dist/img/screenshots/pro/datatables-light-800.webp +0 -0
- package/dist/img/screenshots/pro/datatables-light.webp +0 -0
- package/dist/img/screenshots/pro/ecommerce-dark-800.webp +0 -0
- package/dist/img/screenshots/pro/ecommerce-dark.webp +0 -0
- package/dist/img/screenshots/pro/ecommerce-light-800.webp +0 -0
- package/dist/img/screenshots/pro/ecommerce-light.webp +0 -0
- package/dist/img/screenshots/pro/settings-dark-800.webp +0 -0
- package/dist/img/screenshots/pro/settings-dark.webp +0 -0
- package/dist/img/screenshots/pro/settings-light-800.webp +0 -0
- package/dist/img/screenshots/pro/settings-light.webp +0 -0
- package/dist/index.html +918 -0
- package/dist/js/app.d.ts +78 -0
- package/dist/js/app.js +4 -3
- package/dist/js/head.js +1 -0
- package/dist/js/icons-all.js +1 -0
- package/dist/maps-google.html +469 -0
- package/dist/pages-404.html +46 -0
- package/dist/pages-500.html +46 -0
- package/dist/pages-blank.html +423 -0
- package/dist/pages-invoice.html +715 -0
- package/dist/pages-pricing.html +730 -0
- package/dist/pages-profile.html +787 -0
- package/dist/pages-sign-in.html +76 -0
- package/dist/pages-sign-up.html +73 -0
- package/dist/tables-bootstrap.html +856 -0
- package/dist/ui-alerts.html +745 -0
- package/dist/ui-buttons.html +529 -0
- package/dist/ui-cards.html +469 -0
- package/dist/ui-forms.html +584 -0
- package/dist/ui-modals.html +800 -0
- package/dist/ui-typography.html +560 -0
- package/dist/upgrade-to-pro.html +788 -0
- package/package.json +114 -88
- package/dist/css/app.css.map +0 -1
- package/dist/fonts/.gitkeep +0 -0
- package/dist/img/photos/unsplash-3.jpg +0 -0
- package/dist/js/app.js.LICENSE.txt +0 -514
- package/dist/js/app.js.map +0 -1
|
@@ -0,0 +1,787 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
|
|
4
|
+
<head>
|
|
5
|
+
<meta charset="utf-8">
|
|
6
|
+
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
|
7
|
+
<meta name="description"
|
|
8
|
+
content="User profile demo for the free AdminKit Bootstrap 5 admin template. Profile header with stats, about and skills, team, projects and an activity feed.">
|
|
9
|
+
<meta name="author" content="AdminKit">
|
|
10
|
+
<meta name="keywords" content="adminkit, bootstrap, bootstrap 5, admin, dashboard, template, responsive, css, sass, html, theme, front-end, ui kit, web">
|
|
11
|
+
|
|
12
|
+
<link rel="shortcut icon" href="./img/icons/icon-48x48.png" />
|
|
13
|
+
|
|
14
|
+
<link rel="canonical" href="https://demo-basic.adminkit.io/pages-profile" />
|
|
15
|
+
|
|
16
|
+
<title>Profile | AdminKit Demo</title>
|
|
17
|
+
|
|
18
|
+
<!-- Color mode before the first paint (src/js/head.js). Vite leaves vite-ignore tags as they are; vite.config.js builds the file. -->
|
|
19
|
+
<script src="js/head.js"></script>
|
|
20
|
+
|
|
21
|
+
<script type="module" crossorigin src="./js/app.js"></script>
|
|
22
|
+
<link rel="stylesheet" crossorigin href="./css/app.css">
|
|
23
|
+
<link rel="preload" href="./fonts/inter-latin-400-normal-C38fXH4l.woff2" as="font" type="font/woff2" crossorigin>
|
|
24
|
+
<link rel="preload" href="./fonts/inter-latin-600-normal-LgqL8muc.woff2" as="font" type="font/woff2" crossorigin>
|
|
25
|
+
</head>
|
|
26
|
+
|
|
27
|
+
<body>
|
|
28
|
+
<div class="wrapper">
|
|
29
|
+
<nav id="sidebar" class="sidebar js-sidebar offcanvas-lg offcanvas-start" tabindex="-1" aria-label="Sidebar">
|
|
30
|
+
<div class="sidebar-content js-simplebar">
|
|
31
|
+
<a class="sidebar-brand" href="index.html">
|
|
32
|
+
<span class="align-middle">AdminKit</span>
|
|
33
|
+
</a>
|
|
34
|
+
|
|
35
|
+
<ul class="sidebar-nav">
|
|
36
|
+
<li class="sidebar-header">
|
|
37
|
+
Pages
|
|
38
|
+
</li>
|
|
39
|
+
|
|
40
|
+
<li class="sidebar-item">
|
|
41
|
+
<a class="sidebar-link" href="index.html">
|
|
42
|
+
<i class="align-middle" data-lucide="sliders-vertical"></i> <span class="align-middle">Analytics</span>
|
|
43
|
+
</a>
|
|
44
|
+
</li>
|
|
45
|
+
|
|
46
|
+
<li class="sidebar-item active">
|
|
47
|
+
<a class="sidebar-link" href="pages-profile.html">
|
|
48
|
+
<i class="align-middle" data-lucide="user"></i> <span class="align-middle">Profile</span>
|
|
49
|
+
</a>
|
|
50
|
+
</li>
|
|
51
|
+
|
|
52
|
+
<li class="sidebar-item">
|
|
53
|
+
<a class="sidebar-link" href="pages-invoice.html">
|
|
54
|
+
<i class="align-middle" data-lucide="credit-card"></i> <span class="align-middle">Invoice</span>
|
|
55
|
+
</a>
|
|
56
|
+
</li>
|
|
57
|
+
|
|
58
|
+
<li class="sidebar-item">
|
|
59
|
+
<a class="sidebar-link" href="pages-sign-in.html">
|
|
60
|
+
<i class="align-middle" data-lucide="log-in"></i> <span class="align-middle">Sign In</span>
|
|
61
|
+
</a>
|
|
62
|
+
</li>
|
|
63
|
+
|
|
64
|
+
<li class="sidebar-item">
|
|
65
|
+
<a class="sidebar-link" href="pages-sign-up.html">
|
|
66
|
+
<i class="align-middle" data-lucide="user-plus"></i> <span class="align-middle">Sign Up</span>
|
|
67
|
+
</a>
|
|
68
|
+
</li>
|
|
69
|
+
|
|
70
|
+
<li class="sidebar-item">
|
|
71
|
+
<a class="sidebar-link" href="pages-404.html">
|
|
72
|
+
<i class="align-middle" data-lucide="search-x"></i> <span class="align-middle">404 Page</span>
|
|
73
|
+
</a>
|
|
74
|
+
</li>
|
|
75
|
+
|
|
76
|
+
<li class="sidebar-item">
|
|
77
|
+
<a class="sidebar-link" href="pages-500.html">
|
|
78
|
+
<i class="align-middle" data-lucide="server-crash"></i> <span class="align-middle">500 Page</span>
|
|
79
|
+
</a>
|
|
80
|
+
</li>
|
|
81
|
+
|
|
82
|
+
<li class="sidebar-item">
|
|
83
|
+
<a class="sidebar-link" href="pages-pricing.html">
|
|
84
|
+
<i class="align-middle" data-lucide="tag"></i> <span class="align-middle">Pricing</span>
|
|
85
|
+
</a>
|
|
86
|
+
</li>
|
|
87
|
+
|
|
88
|
+
<li class="sidebar-item">
|
|
89
|
+
<a class="sidebar-link" href="pages-blank.html">
|
|
90
|
+
<i class="align-middle" data-lucide="book"></i> <span class="align-middle">Blank</span>
|
|
91
|
+
</a>
|
|
92
|
+
</li>
|
|
93
|
+
|
|
94
|
+
<li class="sidebar-header">
|
|
95
|
+
Tools & Components
|
|
96
|
+
</li>
|
|
97
|
+
|
|
98
|
+
<li class="sidebar-item">
|
|
99
|
+
<a class="sidebar-link" href="ui-alerts.html">
|
|
100
|
+
<i class="align-middle" data-lucide="bell"></i> <span class="align-middle">Alerts</span>
|
|
101
|
+
</a>
|
|
102
|
+
</li>
|
|
103
|
+
|
|
104
|
+
<li class="sidebar-item">
|
|
105
|
+
<a class="sidebar-link" href="ui-buttons.html">
|
|
106
|
+
<i class="align-middle" data-lucide="square"></i> <span class="align-middle">Buttons</span>
|
|
107
|
+
</a>
|
|
108
|
+
</li>
|
|
109
|
+
|
|
110
|
+
<li class="sidebar-item">
|
|
111
|
+
<a class="sidebar-link" href="ui-forms.html">
|
|
112
|
+
<i class="align-middle" data-lucide="square-check-big"></i> <span class="align-middle">Forms</span>
|
|
113
|
+
</a>
|
|
114
|
+
</li>
|
|
115
|
+
|
|
116
|
+
<li class="sidebar-item">
|
|
117
|
+
<a class="sidebar-link" href="ui-cards.html">
|
|
118
|
+
<i class="align-middle" data-lucide="layout-grid"></i> <span class="align-middle">Cards</span>
|
|
119
|
+
</a>
|
|
120
|
+
</li>
|
|
121
|
+
|
|
122
|
+
<li class="sidebar-item">
|
|
123
|
+
<a class="sidebar-link" href="ui-modals.html">
|
|
124
|
+
<i class="align-middle" data-lucide="app-window"></i> <span class="align-middle">Modals</span>
|
|
125
|
+
</a>
|
|
126
|
+
</li>
|
|
127
|
+
|
|
128
|
+
<li class="sidebar-item">
|
|
129
|
+
<a class="sidebar-link" href="ui-typography.html">
|
|
130
|
+
<i class="align-middle" data-lucide="text-align-start"></i> <span class="align-middle">Typography</span>
|
|
131
|
+
</a>
|
|
132
|
+
</li>
|
|
133
|
+
|
|
134
|
+
<li class="sidebar-item">
|
|
135
|
+
<a class="sidebar-link" href="icons-lucide.html">
|
|
136
|
+
<i class="align-middle" data-lucide="coffee"></i> <span class="align-middle">Icons</span>
|
|
137
|
+
</a>
|
|
138
|
+
</li>
|
|
139
|
+
|
|
140
|
+
<li class="sidebar-item">
|
|
141
|
+
<a class="sidebar-link" href="tables-bootstrap.html">
|
|
142
|
+
<i class="align-middle" data-lucide="list"></i> <span class="align-middle">Tables</span>
|
|
143
|
+
</a>
|
|
144
|
+
</li>
|
|
145
|
+
|
|
146
|
+
<li class="sidebar-header">
|
|
147
|
+
Plugins & Addons
|
|
148
|
+
</li>
|
|
149
|
+
|
|
150
|
+
<li class="sidebar-item">
|
|
151
|
+
<a class="sidebar-link" href="charts-chartjs.html">
|
|
152
|
+
<i class="align-middle" data-lucide="chart-no-axes-column"></i> <span class="align-middle">Charts</span>
|
|
153
|
+
</a>
|
|
154
|
+
</li>
|
|
155
|
+
|
|
156
|
+
<li class="sidebar-item">
|
|
157
|
+
<a class="sidebar-link" href="maps-google.html">
|
|
158
|
+
<i class="align-middle" data-lucide="map"></i> <span class="align-middle">Maps</span>
|
|
159
|
+
</a>
|
|
160
|
+
</li>
|
|
161
|
+
</ul>
|
|
162
|
+
|
|
163
|
+
<div class="sidebar-cta">
|
|
164
|
+
<div class="sidebar-cta-content">
|
|
165
|
+
<strong class="d-inline-block mb-2">Upgrade to Pro</strong>
|
|
166
|
+
<div class="mb-3 text-sm">
|
|
167
|
+
AdminKit PRO, the premium version, has more components.
|
|
168
|
+
</div>
|
|
169
|
+
<div class="d-grid">
|
|
170
|
+
<a href="upgrade-to-pro.html" class="btn btn-primary">Upgrade to Pro</a>
|
|
171
|
+
</div>
|
|
172
|
+
</div>
|
|
173
|
+
</div>
|
|
174
|
+
</div>
|
|
175
|
+
</nav>
|
|
176
|
+
|
|
177
|
+
<div class="main">
|
|
178
|
+
<nav class="navbar navbar-expand navbar-light navbar-bg" aria-label="Top bar">
|
|
179
|
+
<button type="button" class="sidebar-toggle js-sidebar-toggle" aria-controls="sidebar" aria-expanded="true" aria-label="Collapse sidebar">
|
|
180
|
+
<i class="hamburger align-self-center"></i>
|
|
181
|
+
</button>
|
|
182
|
+
|
|
183
|
+
<div class="navbar-collapse collapse">
|
|
184
|
+
<ul class="navbar-nav navbar-align">
|
|
185
|
+
<li class="nav-item dropdown">
|
|
186
|
+
<a class="nav-icon dropdown-toggle" href="#" id="alertsDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
|
|
187
|
+
<div class="position-relative">
|
|
188
|
+
<span class="visually-hidden">Notifications</span>
|
|
189
|
+
<i class="align-middle" data-lucide="bell"></i>
|
|
190
|
+
<span class="indicator">4</span>
|
|
191
|
+
</div>
|
|
192
|
+
</a>
|
|
193
|
+
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end py-0" aria-labelledby="alertsDropdown">
|
|
194
|
+
<div class="dropdown-menu-header">
|
|
195
|
+
4 New Notifications
|
|
196
|
+
</div>
|
|
197
|
+
<div class="list-group">
|
|
198
|
+
<a href="#" class="list-group-item">
|
|
199
|
+
<div class="row g-0 align-items-center">
|
|
200
|
+
<div class="col-2">
|
|
201
|
+
<i class="text-danger" data-lucide="circle-alert"></i>
|
|
202
|
+
</div>
|
|
203
|
+
<div class="col-10">
|
|
204
|
+
<div class="text-dark">Update completed</div>
|
|
205
|
+
<div class="text-body-secondary small mt-1">Restart server 12 to complete the update.</div>
|
|
206
|
+
<div class="text-body-secondary small mt-1">30m ago</div>
|
|
207
|
+
</div>
|
|
208
|
+
</div>
|
|
209
|
+
</a>
|
|
210
|
+
<a href="#" class="list-group-item">
|
|
211
|
+
<div class="row g-0 align-items-center">
|
|
212
|
+
<div class="col-2">
|
|
213
|
+
<i class="text-warning" data-lucide="bell"></i>
|
|
214
|
+
</div>
|
|
215
|
+
<div class="col-10">
|
|
216
|
+
<div class="text-dark">Lorem ipsum</div>
|
|
217
|
+
<div class="text-body-secondary small mt-1">Aliquam ex eros, imperdiet vulputate hendrerit et.</div>
|
|
218
|
+
<div class="text-body-secondary small mt-1">2h ago</div>
|
|
219
|
+
</div>
|
|
220
|
+
</div>
|
|
221
|
+
</a>
|
|
222
|
+
<a href="#" class="list-group-item">
|
|
223
|
+
<div class="row g-0 align-items-center">
|
|
224
|
+
<div class="col-2">
|
|
225
|
+
<i class="text-primary" data-lucide="house"></i>
|
|
226
|
+
</div>
|
|
227
|
+
<div class="col-10">
|
|
228
|
+
<div class="text-dark">Login from 192.186.1.8</div>
|
|
229
|
+
<div class="text-body-secondary small mt-1">5h ago</div>
|
|
230
|
+
</div>
|
|
231
|
+
</div>
|
|
232
|
+
</a>
|
|
233
|
+
<a href="#" class="list-group-item">
|
|
234
|
+
<div class="row g-0 align-items-center">
|
|
235
|
+
<div class="col-2">
|
|
236
|
+
<i class="text-success" data-lucide="user-plus"></i>
|
|
237
|
+
</div>
|
|
238
|
+
<div class="col-10">
|
|
239
|
+
<div class="text-dark">New connection</div>
|
|
240
|
+
<div class="text-body-secondary small mt-1">Christina accepted your request.</div>
|
|
241
|
+
<div class="text-body-secondary small mt-1">14h ago</div>
|
|
242
|
+
</div>
|
|
243
|
+
</div>
|
|
244
|
+
</a>
|
|
245
|
+
</div>
|
|
246
|
+
<div class="dropdown-menu-footer">
|
|
247
|
+
<a href="#" class="text-body-secondary">Show all notifications</a>
|
|
248
|
+
</div>
|
|
249
|
+
</div>
|
|
250
|
+
</li>
|
|
251
|
+
<li class="nav-item dropdown">
|
|
252
|
+
<a class="nav-icon dropdown-toggle" href="#" id="messagesDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false"
|
|
253
|
+
aria-label="Messages">
|
|
254
|
+
<div class="position-relative">
|
|
255
|
+
<i class="align-middle" data-lucide="message-square"></i>
|
|
256
|
+
</div>
|
|
257
|
+
</a>
|
|
258
|
+
<div class="dropdown-menu dropdown-menu-lg dropdown-menu-end py-0" aria-labelledby="messagesDropdown">
|
|
259
|
+
<div class="dropdown-menu-header">
|
|
260
|
+
<div class="position-relative">
|
|
261
|
+
4 New Messages
|
|
262
|
+
</div>
|
|
263
|
+
</div>
|
|
264
|
+
<div class="list-group">
|
|
265
|
+
<a href="#" class="list-group-item">
|
|
266
|
+
<div class="row g-0 align-items-center">
|
|
267
|
+
<div class="col-2">
|
|
268
|
+
<img src="./img/avatars/avatar-5.jpg" class="avatar img-fluid rounded-circle" alt="Vanessa Tucker" width="40"
|
|
269
|
+
height="40">
|
|
270
|
+
</div>
|
|
271
|
+
<div class="col-10 ps-2">
|
|
272
|
+
<div class="text-dark">Vanessa Tucker</div>
|
|
273
|
+
<div class="text-body-secondary small mt-1">Nam pretium turpis et arcu. Duis arcu tortor.</div>
|
|
274
|
+
<div class="text-body-secondary small mt-1">15m ago</div>
|
|
275
|
+
</div>
|
|
276
|
+
</div>
|
|
277
|
+
</a>
|
|
278
|
+
<a href="#" class="list-group-item">
|
|
279
|
+
<div class="row g-0 align-items-center">
|
|
280
|
+
<div class="col-2">
|
|
281
|
+
<img src="./img/avatars/avatar-2.jpg" class="avatar img-fluid rounded-circle" alt="William Harris" width="40"
|
|
282
|
+
height="40">
|
|
283
|
+
</div>
|
|
284
|
+
<div class="col-10 ps-2">
|
|
285
|
+
<div class="text-dark">William Harris</div>
|
|
286
|
+
<div class="text-body-secondary small mt-1">Curabitur ligula sapien euismod vitae.</div>
|
|
287
|
+
<div class="text-body-secondary small mt-1">2h ago</div>
|
|
288
|
+
</div>
|
|
289
|
+
</div>
|
|
290
|
+
</a>
|
|
291
|
+
<a href="#" class="list-group-item">
|
|
292
|
+
<div class="row g-0 align-items-center">
|
|
293
|
+
<div class="col-2">
|
|
294
|
+
<img src="./img/avatars/avatar-4.jpg" class="avatar img-fluid rounded-circle" alt="Christina Mason" width="40"
|
|
295
|
+
height="40">
|
|
296
|
+
</div>
|
|
297
|
+
<div class="col-10 ps-2">
|
|
298
|
+
<div class="text-dark">Christina Mason</div>
|
|
299
|
+
<div class="text-body-secondary small mt-1">Pellentesque auctor neque nec urna.</div>
|
|
300
|
+
<div class="text-body-secondary small mt-1">4h ago</div>
|
|
301
|
+
</div>
|
|
302
|
+
</div>
|
|
303
|
+
</a>
|
|
304
|
+
<a href="#" class="list-group-item">
|
|
305
|
+
<div class="row g-0 align-items-center">
|
|
306
|
+
<div class="col-2">
|
|
307
|
+
<img src="./img/avatars/avatar-3.jpg" class="avatar img-fluid rounded-circle" alt="Sharon Lessman" width="40"
|
|
308
|
+
height="40">
|
|
309
|
+
</div>
|
|
310
|
+
<div class="col-10 ps-2">
|
|
311
|
+
<div class="text-dark">Sharon Lessman</div>
|
|
312
|
+
<div class="text-body-secondary small mt-1">Aenean tellus metus, bibendum sed, posuere ac, mattis non.</div>
|
|
313
|
+
<div class="text-body-secondary small mt-1">5h ago</div>
|
|
314
|
+
</div>
|
|
315
|
+
</div>
|
|
316
|
+
</a>
|
|
317
|
+
</div>
|
|
318
|
+
<div class="dropdown-menu-footer">
|
|
319
|
+
<a href="#" class="text-body-secondary">Show all messages</a>
|
|
320
|
+
</div>
|
|
321
|
+
</div>
|
|
322
|
+
</li>
|
|
323
|
+
<li class="nav-item dropdown">
|
|
324
|
+
<a class="nav-icon dropdown-toggle" href="#" id="colorModeDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false"
|
|
325
|
+
aria-label="Color mode" data-color-mode-toggle>
|
|
326
|
+
<span data-color-mode-icon="light" hidden><i class="align-middle" data-lucide="sun"></i></span>
|
|
327
|
+
<span data-color-mode-icon="dark" hidden><i class="align-middle" data-lucide="moon"></i></span>
|
|
328
|
+
<span data-color-mode-icon="auto"><i class="align-middle" data-lucide="sun-moon"></i></span>
|
|
329
|
+
</a>
|
|
330
|
+
<ul class="dropdown-menu dropdown-menu-end" aria-labelledby="colorModeDropdown">
|
|
331
|
+
<li>
|
|
332
|
+
<button type="button" class="dropdown-item" data-color-mode-value="light" aria-pressed="false">
|
|
333
|
+
<i class="align-middle me-1" data-lucide="sun"></i> Light
|
|
334
|
+
</button>
|
|
335
|
+
</li>
|
|
336
|
+
<li>
|
|
337
|
+
<button type="button" class="dropdown-item" data-color-mode-value="dark" aria-pressed="false">
|
|
338
|
+
<i class="align-middle me-1" data-lucide="moon"></i> Dark
|
|
339
|
+
</button>
|
|
340
|
+
</li>
|
|
341
|
+
<li>
|
|
342
|
+
<button type="button" class="dropdown-item" data-color-mode-value="auto" aria-pressed="false">
|
|
343
|
+
<i class="align-middle me-1" data-lucide="sun-moon"></i> Auto
|
|
344
|
+
</button>
|
|
345
|
+
</li>
|
|
346
|
+
</ul>
|
|
347
|
+
</li>
|
|
348
|
+
<li class="nav-item dropdown">
|
|
349
|
+
<a class="nav-icon dropdown-toggle d-inline-block d-sm-none" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false"
|
|
350
|
+
aria-label="Account">
|
|
351
|
+
<i class="align-middle" data-lucide="settings"></i>
|
|
352
|
+
</a>
|
|
353
|
+
|
|
354
|
+
<a class="nav-link dropdown-toggle d-none d-sm-inline-block" href="#" role="button" data-bs-toggle="dropdown" aria-expanded="false">
|
|
355
|
+
<img src="./img/avatars/avatar.jpg" class="avatar img-fluid rounded me-1" alt="Charles Hall" width="40" height="40" /> <span
|
|
356
|
+
class="text-dark">Charles Hall</span>
|
|
357
|
+
</a>
|
|
358
|
+
<div class="dropdown-menu dropdown-menu-end">
|
|
359
|
+
<a class="dropdown-item" href="pages-profile.html"><i class="align-middle me-1" data-lucide="user"></i> Profile</a>
|
|
360
|
+
<a class="dropdown-item" href="#"><i class="align-middle me-1" data-lucide="chart-pie"></i> Analytics</a>
|
|
361
|
+
<div class="dropdown-divider"></div>
|
|
362
|
+
<a class="dropdown-item" href="index.html"><i class="align-middle me-1" data-lucide="settings"></i> Settings & Privacy</a>
|
|
363
|
+
<a class="dropdown-item" href="#"><i class="align-middle me-1" data-lucide="circle-question-mark"></i> Help Center</a>
|
|
364
|
+
<div class="dropdown-divider"></div>
|
|
365
|
+
<a class="dropdown-item" href="#">Log out</a>
|
|
366
|
+
</div>
|
|
367
|
+
</li>
|
|
368
|
+
</ul>
|
|
369
|
+
</div>
|
|
370
|
+
</nav>
|
|
371
|
+
|
|
372
|
+
<main class="content ak-reveal-cards">
|
|
373
|
+
<div class="container-fluid p-0">
|
|
374
|
+
<div class="mb-3">
|
|
375
|
+
<h1 class="h3 d-inline align-middle">Profile</h1>
|
|
376
|
+
<a class="badge bg-dark text-light ms-2 d-print-none" href="upgrade-to-pro.html">
|
|
377
|
+
Get more page examples
|
|
378
|
+
</a>
|
|
379
|
+
</div>
|
|
380
|
+
<div class="card">
|
|
381
|
+
<div class="card-body">
|
|
382
|
+
<div class="row g-3 align-items-center">
|
|
383
|
+
<div class="col-auto">
|
|
384
|
+
<img src="./img/avatars/avatar.jpg" alt="Charles Hall" class="rounded-circle profile-avatar" width="96" height="96" />
|
|
385
|
+
</div>
|
|
386
|
+
<div class="col">
|
|
387
|
+
<h2 class="h3 mb-1">Charles Hall</h2>
|
|
388
|
+
<p class="text-body-secondary mb-2">Senior Product Designer, Design team</p>
|
|
389
|
+
<ul class="list-inline small text-body-secondary mb-0">
|
|
390
|
+
<li class="list-inline-item me-3"><i class="lucide-sm align-text-bottom me-1" data-lucide="map-pin"></i>San Francisco,
|
|
391
|
+
CA</li>
|
|
392
|
+
<li class="list-inline-item me-3"><i class="lucide-sm align-text-bottom me-1" data-lucide="calendar"></i>Joined March
|
|
393
|
+
2022</li>
|
|
394
|
+
</ul>
|
|
395
|
+
</div>
|
|
396
|
+
<div class="col-12 col-md-auto d-flex flex-wrap gap-2">
|
|
397
|
+
<button class="btn btn-outline-primary" type="button" data-profile-copy>
|
|
398
|
+
<i class="align-middle me-1" data-lucide="copy"></i> <span data-profile-copy-label>Copy profile link</span>
|
|
399
|
+
</button>
|
|
400
|
+
</div>
|
|
401
|
+
</div>
|
|
402
|
+
</div>
|
|
403
|
+
<div class="card-body border-top">
|
|
404
|
+
<dl class="row row-cols-2 row-cols-md-4 g-3 mb-0">
|
|
405
|
+
<div class="col">
|
|
406
|
+
<dt class="small fw-normal text-body-secondary">Active projects</dt>
|
|
407
|
+
<dd class="h3 mb-0">6</dd>
|
|
408
|
+
</div>
|
|
409
|
+
<div class="col">
|
|
410
|
+
<dt class="small fw-normal text-body-secondary">Tasks done in October</dt>
|
|
411
|
+
<dd class="h3 mb-0">148</dd>
|
|
412
|
+
</div>
|
|
413
|
+
<div class="col">
|
|
414
|
+
<dt class="small fw-normal text-body-secondary">Hours logged in October</dt>
|
|
415
|
+
<dd class="h3 mb-0">126</dd>
|
|
416
|
+
</div>
|
|
417
|
+
<div class="col">
|
|
418
|
+
<dt class="small fw-normal text-body-secondary">Delivered on time</dt>
|
|
419
|
+
<dd class="h3 mb-0">94%</dd>
|
|
420
|
+
</div>
|
|
421
|
+
</dl>
|
|
422
|
+
</div>
|
|
423
|
+
</div>
|
|
424
|
+
|
|
425
|
+
<div class="row">
|
|
426
|
+
<div class="col-xl-4">
|
|
427
|
+
<div class="card">
|
|
428
|
+
<div class="card-header">
|
|
429
|
+
<h2 class="card-title mb-0">About</h2>
|
|
430
|
+
</div>
|
|
431
|
+
<div class="card-body">
|
|
432
|
+
<p>
|
|
433
|
+
I look after the design system and work with the developers on the CRM and the customer portal. Before joining the team
|
|
434
|
+
I spent six years designing booking tools for travel companies.
|
|
435
|
+
</p>
|
|
436
|
+
<ul class="list-unstyled mb-0">
|
|
437
|
+
<li class="d-flex align-items-center gap-2 mb-2">
|
|
438
|
+
<i class="text-body-secondary flex-shrink-0" data-lucide="mail"></i>
|
|
439
|
+
<a class="text-break" href="mailto:charles.hall@example.com">charles.hall@example.com</a>
|
|
440
|
+
</li>
|
|
441
|
+
<li class="d-flex align-items-center gap-2 mb-2">
|
|
442
|
+
<i class="text-body-secondary flex-shrink-0" data-lucide="phone"></i>
|
|
443
|
+
<a href="tel:+14155550132">+1 415 555 0132</a>
|
|
444
|
+
</li>
|
|
445
|
+
<li class="d-flex align-items-center gap-2 mb-2">
|
|
446
|
+
<i class="text-body-secondary flex-shrink-0" data-lucide="users"></i>
|
|
447
|
+
<span>Reports to Sharon Lessman</span>
|
|
448
|
+
</li>
|
|
449
|
+
<li class="d-flex align-items-center gap-2">
|
|
450
|
+
<i class="text-body-secondary flex-shrink-0" data-lucide="briefcase"></i>
|
|
451
|
+
<span>Full time, Pacific Time (UTC−7)</span>
|
|
452
|
+
</li>
|
|
453
|
+
</ul>
|
|
454
|
+
</div>
|
|
455
|
+
<div class="card-body border-top">
|
|
456
|
+
<h3 class="h6 card-title">Skills</h3>
|
|
457
|
+
<ul class="list-inline mb-0">
|
|
458
|
+
<li class="list-inline-item badge badge-primary-light me-1 my-1">Figma</li>
|
|
459
|
+
<li class="list-inline-item badge badge-primary-light me-1 my-1">Design systems</li>
|
|
460
|
+
<li class="list-inline-item badge badge-primary-light me-1 my-1">Prototyping</li>
|
|
461
|
+
<li class="list-inline-item badge badge-primary-light me-1 my-1">User research</li>
|
|
462
|
+
<li class="list-inline-item badge badge-primary-light me-1 my-1">Accessibility</li>
|
|
463
|
+
<li class="list-inline-item badge badge-primary-light me-1 my-1">HTML & CSS</li>
|
|
464
|
+
<li class="list-inline-item badge badge-primary-light me-1 my-1">Usability testing</li>
|
|
465
|
+
</ul>
|
|
466
|
+
</div>
|
|
467
|
+
</div>
|
|
468
|
+
|
|
469
|
+
<div class="card">
|
|
470
|
+
<div class="card-header">
|
|
471
|
+
<h2 class="card-title mb-0">Team</h2>
|
|
472
|
+
</div>
|
|
473
|
+
<ul class="list-group list-group-flush">
|
|
474
|
+
<li class="list-group-item d-flex align-items-center gap-3">
|
|
475
|
+
<img src="./img/avatars/avatar-3.jpg" class="rounded-circle flex-shrink-0" alt="" width="40" height="40" />
|
|
476
|
+
<div class="flex-grow-1">
|
|
477
|
+
<div class="fw-semibold">Sharon Lessman</div>
|
|
478
|
+
<div class="small text-body-secondary">Head of Design</div>
|
|
479
|
+
</div>
|
|
480
|
+
<a class="btn btn-sm btn-light border" href="mailto:sharon.lessman@example.com" aria-label="Email Sharon Lessman"><i
|
|
481
|
+
class="align-middle" data-lucide="mail"></i></a>
|
|
482
|
+
</li>
|
|
483
|
+
<li class="list-group-item d-flex align-items-center gap-3">
|
|
484
|
+
<img src="./img/avatars/avatar-4.jpg" class="rounded-circle flex-shrink-0" alt="" width="40" height="40" />
|
|
485
|
+
<div class="flex-grow-1">
|
|
486
|
+
<div class="fw-semibold">Christina Mason</div>
|
|
487
|
+
<div class="small text-body-secondary">Lead Developer</div>
|
|
488
|
+
</div>
|
|
489
|
+
<a class="btn btn-sm btn-light border" href="mailto:christina.mason@example.com" aria-label="Email Christina Mason"><i
|
|
490
|
+
class="align-middle" data-lucide="mail"></i></a>
|
|
491
|
+
</li>
|
|
492
|
+
<li class="list-group-item d-flex align-items-center gap-3">
|
|
493
|
+
<img src="./img/avatars/avatar-2.jpg" class="rounded-circle flex-shrink-0" alt="" width="40" height="40" />
|
|
494
|
+
<div class="flex-grow-1">
|
|
495
|
+
<div class="fw-semibold">William Harris</div>
|
|
496
|
+
<div class="small text-body-secondary">Product Manager</div>
|
|
497
|
+
</div>
|
|
498
|
+
<a class="btn btn-sm btn-light border" href="mailto:william.harris@example.com" aria-label="Email William Harris"><i
|
|
499
|
+
class="align-middle" data-lucide="mail"></i></a>
|
|
500
|
+
</li>
|
|
501
|
+
<li class="list-group-item d-flex align-items-center gap-3">
|
|
502
|
+
<img src="./img/avatars/avatar-5.jpg" class="rounded-circle flex-shrink-0" alt="" width="40" height="40" />
|
|
503
|
+
<div class="flex-grow-1">
|
|
504
|
+
<div class="fw-semibold">Vanessa Tucker</div>
|
|
505
|
+
<div class="small text-body-secondary">UX Researcher</div>
|
|
506
|
+
</div>
|
|
507
|
+
<a class="btn btn-sm btn-light border" href="mailto:vanessa.tucker@example.com" aria-label="Email Vanessa Tucker"><i
|
|
508
|
+
class="align-middle" data-lucide="mail"></i></a>
|
|
509
|
+
</li>
|
|
510
|
+
</ul>
|
|
511
|
+
</div>
|
|
512
|
+
</div>
|
|
513
|
+
|
|
514
|
+
<div class="col-xl-8">
|
|
515
|
+
<div class="card">
|
|
516
|
+
<div class="card-header">
|
|
517
|
+
<h2 class="card-title mb-0" id="profile-projects-title">Projects</h2>
|
|
518
|
+
</div>
|
|
519
|
+
<div class="table-responsive" role="region" tabindex="0" aria-labelledby="profile-projects-title">
|
|
520
|
+
<table class="table my-0">
|
|
521
|
+
<thead>
|
|
522
|
+
<tr>
|
|
523
|
+
<th>Project</th>
|
|
524
|
+
<th>Status</th>
|
|
525
|
+
<th class="d-none d-md-table-cell w-25">Progress</th>
|
|
526
|
+
<th class="d-none d-sm-table-cell text-nowrap">Due date</th>
|
|
527
|
+
</tr>
|
|
528
|
+
</thead>
|
|
529
|
+
<tbody>
|
|
530
|
+
<tr>
|
|
531
|
+
<td>
|
|
532
|
+
<div class="fw-semibold">Company posters</div>
|
|
533
|
+
<div class="small text-body-secondary">Lead designer</div>
|
|
534
|
+
</td>
|
|
535
|
+
<td><span class="badge badge-warning-light">In progress</span></td>
|
|
536
|
+
<td class="d-none d-md-table-cell">
|
|
537
|
+
<div class="d-flex align-items-center gap-2">
|
|
538
|
+
<div class="progress progress-sm flex-grow-1" role="progressbar" aria-label="Company posters progress"
|
|
539
|
+
aria-valuenow="75" aria-valuemin="0" aria-valuemax="100">
|
|
540
|
+
<div class="progress-bar" style="width: 75%"></div>
|
|
541
|
+
</div>
|
|
542
|
+
<span class="small text-body-secondary profile-progress-value">75%</span>
|
|
543
|
+
</div>
|
|
544
|
+
</td>
|
|
545
|
+
<td class="d-none d-sm-table-cell text-nowrap">Nov 6, 2026</td>
|
|
546
|
+
</tr>
|
|
547
|
+
<tr>
|
|
548
|
+
<td>
|
|
549
|
+
<div class="fw-semibold">Upgrade CRM software</div>
|
|
550
|
+
<div class="small text-body-secondary">UI design</div>
|
|
551
|
+
</td>
|
|
552
|
+
<td><span class="badge badge-warning-light">In progress</span></td>
|
|
553
|
+
<td class="d-none d-md-table-cell">
|
|
554
|
+
<div class="d-flex align-items-center gap-2">
|
|
555
|
+
<div class="progress progress-sm flex-grow-1" role="progressbar"
|
|
556
|
+
aria-label="Upgrade CRM software progress" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100">
|
|
557
|
+
<div class="progress-bar" style="width: 50%"></div>
|
|
558
|
+
</div>
|
|
559
|
+
<span class="small text-body-secondary profile-progress-value">50%</span>
|
|
560
|
+
</div>
|
|
561
|
+
</td>
|
|
562
|
+
<td class="d-none d-sm-table-cell text-nowrap">Nov 20, 2026</td>
|
|
563
|
+
</tr>
|
|
564
|
+
<tr>
|
|
565
|
+
<td>
|
|
566
|
+
<div class="fw-semibold">New company logo</div>
|
|
567
|
+
<div class="small text-body-secondary">Brand design</div>
|
|
568
|
+
</td>
|
|
569
|
+
<td><span class="badge badge-danger-light">On hold</span></td>
|
|
570
|
+
<td class="d-none d-md-table-cell">
|
|
571
|
+
<div class="d-flex align-items-center gap-2">
|
|
572
|
+
<div class="progress progress-sm flex-grow-1" role="progressbar" aria-label="New company logo progress"
|
|
573
|
+
aria-valuenow="20" aria-valuemin="0" aria-valuemax="100">
|
|
574
|
+
<div class="progress-bar" style="width: 20%"></div>
|
|
575
|
+
</div>
|
|
576
|
+
<span class="small text-body-secondary profile-progress-value">20%</span>
|
|
577
|
+
</div>
|
|
578
|
+
</td>
|
|
579
|
+
<td class="d-none d-sm-table-cell text-nowrap">Dec 4, 2026</td>
|
|
580
|
+
</tr>
|
|
581
|
+
<tr>
|
|
582
|
+
<td>
|
|
583
|
+
<div class="fw-semibold">Landing page redesign</div>
|
|
584
|
+
<div class="small text-body-secondary">Lead designer</div>
|
|
585
|
+
</td>
|
|
586
|
+
<td><span class="badge badge-success-light">Finished</span></td>
|
|
587
|
+
<td class="d-none d-md-table-cell">
|
|
588
|
+
<div class="d-flex align-items-center gap-2">
|
|
589
|
+
<div class="progress progress-sm flex-grow-1" role="progressbar"
|
|
590
|
+
aria-label="Landing page redesign progress" aria-valuenow="100" aria-valuemin="0"
|
|
591
|
+
aria-valuemax="100">
|
|
592
|
+
<div class="progress-bar bg-success" style="width: 100%"></div>
|
|
593
|
+
</div>
|
|
594
|
+
<span class="small text-body-secondary profile-progress-value">100%</span>
|
|
595
|
+
</div>
|
|
596
|
+
</td>
|
|
597
|
+
<td class="d-none d-sm-table-cell text-nowrap">Oct 16, 2026</td>
|
|
598
|
+
</tr>
|
|
599
|
+
</tbody>
|
|
600
|
+
</table>
|
|
601
|
+
</div>
|
|
602
|
+
</div>
|
|
603
|
+
|
|
604
|
+
<div class="card">
|
|
605
|
+
<div class="card-header">
|
|
606
|
+
<h2 class="card-title mb-0">Activity</h2>
|
|
607
|
+
</div>
|
|
608
|
+
<div class="card-body">
|
|
609
|
+
<h3 class="h6 text-body-secondary mb-3">Today</h3>
|
|
610
|
+
<ul class="list-unstyled vstack gap-4 mb-4">
|
|
611
|
+
<li class="d-flex gap-3">
|
|
612
|
+
<img src="./img/avatars/avatar-4.jpg" class="rounded-circle flex-shrink-0" alt="" width="36" height="36" />
|
|
613
|
+
<div class="flex-grow-1">
|
|
614
|
+
<div class="d-flex justify-content-between gap-2">
|
|
615
|
+
<p class="mb-0"><strong>Christina Mason</strong> commented on Company posters</p>
|
|
616
|
+
<time class="small text-body-secondary text-nowrap" datetime="2026-10-28T09:42">9:42 am</time>
|
|
617
|
+
</div>
|
|
618
|
+
<p class="border rounded small text-body-secondary px-3 py-2 mt-2 mb-0">
|
|
619
|
+
The A2 export looks right now. Can you send the print files to the agency before Friday?
|
|
620
|
+
</p>
|
|
621
|
+
</div>
|
|
622
|
+
</li>
|
|
623
|
+
<li class="d-flex gap-3">
|
|
624
|
+
<img src="./img/avatars/avatar.jpg" class="rounded-circle flex-shrink-0" alt="" width="36" height="36" />
|
|
625
|
+
<div class="flex-grow-1">
|
|
626
|
+
<div class="d-flex justify-content-between gap-2">
|
|
627
|
+
<p class="mb-0"><strong>You</strong> uploaded 2 files to Company posters</p>
|
|
628
|
+
<time class="small text-body-secondary text-nowrap" datetime="2026-10-28T09:05">9:05 am</time>
|
|
629
|
+
</div>
|
|
630
|
+
<div class="d-flex flex-wrap gap-2 mt-2">
|
|
631
|
+
<a class="d-inline-flex align-items-center gap-2 border rounded px-2 py-1 small text-reset text-decoration-none"
|
|
632
|
+
href="#">
|
|
633
|
+
<i class="text-body-secondary" data-lucide="file"></i>
|
|
634
|
+
<span class="text-break">posters-a2-final.pdf</span>
|
|
635
|
+
<span class="text-body-secondary">4.2 MB</span>
|
|
636
|
+
</a>
|
|
637
|
+
<a class="d-inline-flex align-items-center gap-2 border rounded px-2 py-1 small text-reset text-decoration-none"
|
|
638
|
+
href="#">
|
|
639
|
+
<i class="text-body-secondary" data-lucide="file"></i>
|
|
640
|
+
<span class="text-break">posters-a3-final.pdf</span>
|
|
641
|
+
<span class="text-body-secondary">2.8 MB</span>
|
|
642
|
+
</a>
|
|
643
|
+
</div>
|
|
644
|
+
</div>
|
|
645
|
+
</li>
|
|
646
|
+
<li class="d-flex gap-3">
|
|
647
|
+
<img src="./img/avatars/avatar-3.jpg" class="rounded-circle flex-shrink-0" alt="" width="36" height="36" />
|
|
648
|
+
<div class="flex-grow-1">
|
|
649
|
+
<div class="d-flex justify-content-between gap-2">
|
|
650
|
+
<p class="mb-0"><strong>Sharon Lessman</strong> assigned you Review the onboarding screens in Upgrade CRM
|
|
651
|
+
software</p>
|
|
652
|
+
<time class="small text-body-secondary text-nowrap" datetime="2026-10-28T08:17">8:17 am</time>
|
|
653
|
+
</div>
|
|
654
|
+
</div>
|
|
655
|
+
</li>
|
|
656
|
+
</ul>
|
|
657
|
+
|
|
658
|
+
<h3 class="h6 text-body-secondary mb-3">Yesterday</h3>
|
|
659
|
+
<ul class="list-unstyled vstack gap-4 mb-4">
|
|
660
|
+
<li class="d-flex gap-3">
|
|
661
|
+
<img src="./img/avatars/avatar-2.jpg" class="rounded-circle flex-shrink-0" alt="" width="36" height="36" />
|
|
662
|
+
<div class="flex-grow-1">
|
|
663
|
+
<div class="d-flex justify-content-between gap-2">
|
|
664
|
+
<p class="mb-0"><strong>William Harris</strong> moved New company logo to <span
|
|
665
|
+
class="badge badge-danger-light">On hold</span></p>
|
|
666
|
+
<time class="small text-body-secondary text-nowrap" datetime="2026-10-27T16:30">4:30 pm</time>
|
|
667
|
+
</div>
|
|
668
|
+
<p class="border rounded small text-body-secondary px-3 py-2 mt-2 mb-0">
|
|
669
|
+
Parking this until the brand workshop on November 12. We'll pick it up with the new brief.
|
|
670
|
+
</p>
|
|
671
|
+
</div>
|
|
672
|
+
</li>
|
|
673
|
+
<li class="d-flex gap-3">
|
|
674
|
+
<img src="./img/avatars/avatar.jpg" class="rounded-circle flex-shrink-0" alt="" width="36" height="36" />
|
|
675
|
+
<div class="flex-grow-1">
|
|
676
|
+
<div class="d-flex justify-content-between gap-2">
|
|
677
|
+
<p class="mb-0"><strong>You</strong> completed 4 tasks in Upgrade CRM software</p>
|
|
678
|
+
<time class="small text-body-secondary text-nowrap" datetime="2026-10-27T14:12">2:12 pm</time>
|
|
679
|
+
</div>
|
|
680
|
+
</div>
|
|
681
|
+
</li>
|
|
682
|
+
<li class="d-flex gap-3">
|
|
683
|
+
<img src="./img/avatars/avatar-5.jpg" class="rounded-circle flex-shrink-0" alt="" width="36" height="36" />
|
|
684
|
+
<div class="flex-grow-1">
|
|
685
|
+
<div class="d-flex justify-content-between gap-2">
|
|
686
|
+
<p class="mb-0"><strong>Vanessa Tucker</strong> shared the results of usability test round 3</p>
|
|
687
|
+
<time class="small text-body-secondary text-nowrap" datetime="2026-10-27T10:48">10:48 am</time>
|
|
688
|
+
</div>
|
|
689
|
+
<p class="border rounded small text-body-secondary px-3 py-2 mt-2 mb-0">
|
|
690
|
+
7 of 8 people finished the new checkout without help. Most of the trouble was on the address step.
|
|
691
|
+
</p>
|
|
692
|
+
</div>
|
|
693
|
+
</li>
|
|
694
|
+
</ul>
|
|
695
|
+
|
|
696
|
+
<div id="profile-older-activity" hidden>
|
|
697
|
+
<h3 class="h6 text-body-secondary mb-3" tabindex="-1">Monday, October 26</h3>
|
|
698
|
+
<ul class="list-unstyled vstack gap-4 mb-4">
|
|
699
|
+
<li class="d-flex gap-3">
|
|
700
|
+
<img src="./img/avatars/avatar.jpg" class="rounded-circle flex-shrink-0" alt="" width="36" height="36" />
|
|
701
|
+
<div class="flex-grow-1">
|
|
702
|
+
<div class="d-flex justify-content-between gap-2">
|
|
703
|
+
<p class="mb-0"><strong>You</strong> published version 2.4 of the design system</p>
|
|
704
|
+
<time class="small text-body-secondary text-nowrap" datetime="2026-10-26T15:20">3:20 pm</time>
|
|
705
|
+
</div>
|
|
706
|
+
</div>
|
|
707
|
+
</li>
|
|
708
|
+
<li class="d-flex gap-3">
|
|
709
|
+
<img src="./img/avatars/avatar-4.jpg" class="rounded-circle flex-shrink-0" alt="" width="36" height="36" />
|
|
710
|
+
<div class="flex-grow-1">
|
|
711
|
+
<div class="d-flex justify-content-between gap-2">
|
|
712
|
+
<p class="mb-0"><strong>Christina Mason</strong> added you to Upgrade CRM software</p>
|
|
713
|
+
<time class="small text-body-secondary text-nowrap" datetime="2026-10-26T09:02">9:02 am</time>
|
|
714
|
+
</div>
|
|
715
|
+
</div>
|
|
716
|
+
</li>
|
|
717
|
+
</ul>
|
|
718
|
+
</div>
|
|
719
|
+
|
|
720
|
+
<button class="btn btn-light border w-100" type="button" aria-controls="profile-older-activity" data-profile-older>Show
|
|
721
|
+
older activity</button>
|
|
722
|
+
</div>
|
|
723
|
+
</div>
|
|
724
|
+
</div>
|
|
725
|
+
</div>
|
|
726
|
+
|
|
727
|
+
</div>
|
|
728
|
+
</main>
|
|
729
|
+
|
|
730
|
+
<footer class="footer ak-reveal">
|
|
731
|
+
<div class="container-fluid">
|
|
732
|
+
<div class="row text-body-secondary">
|
|
733
|
+
<div class="col-6 text-start">
|
|
734
|
+
<p class="mb-0">
|
|
735
|
+
<a class="text-body-secondary" href="https://adminkit.io/" target="_blank"><strong>AdminKit</strong></a> - <a
|
|
736
|
+
class="text-body-secondary" href="https://adminkit.io/" target="_blank"><strong>Bootstrap Admin Template</strong></a> ©
|
|
737
|
+
2026
|
|
738
|
+
</p>
|
|
739
|
+
</div>
|
|
740
|
+
<div class="col-6 text-end">
|
|
741
|
+
<ul class="list-inline">
|
|
742
|
+
<li class="list-inline-item">
|
|
743
|
+
<a class="text-body-secondary" href="https://adminkit.io/" target="_blank">Support</a>
|
|
744
|
+
</li>
|
|
745
|
+
<li class="list-inline-item">
|
|
746
|
+
<a class="text-body-secondary" href="https://adminkit.io/" target="_blank">Help Center</a>
|
|
747
|
+
</li>
|
|
748
|
+
<li class="list-inline-item">
|
|
749
|
+
<a class="text-body-secondary" href="https://adminkit.io/" target="_blank">Privacy</a>
|
|
750
|
+
</li>
|
|
751
|
+
<li class="list-inline-item">
|
|
752
|
+
<a class="text-body-secondary" href="https://adminkit.io/" target="_blank">Terms</a>
|
|
753
|
+
</li>
|
|
754
|
+
</ul>
|
|
755
|
+
</div>
|
|
756
|
+
</div>
|
|
757
|
+
</div>
|
|
758
|
+
</footer>
|
|
759
|
+
</div>
|
|
760
|
+
</div>
|
|
761
|
+
|
|
762
|
+
<script>
|
|
763
|
+
document.addEventListener("DOMContentLoaded", function() {
|
|
764
|
+
var copyButton = document.querySelector("[data-profile-copy]");
|
|
765
|
+
var copyLabel = document.querySelector("[data-profile-copy-label]");
|
|
766
|
+
var olderButton = document.querySelector("[data-profile-older]");
|
|
767
|
+
var older = document.getElementById("profile-older-activity");
|
|
768
|
+
copyButton.addEventListener("click", function() {
|
|
769
|
+
if (!navigator.clipboard) return;
|
|
770
|
+
navigator.clipboard.writeText(window.location.href).then(function() {
|
|
771
|
+
copyLabel.textContent = "Link copied";
|
|
772
|
+
setTimeout(function() {
|
|
773
|
+
copyLabel.textContent = "Copy profile link";
|
|
774
|
+
}, 2000);
|
|
775
|
+
});
|
|
776
|
+
});
|
|
777
|
+
olderButton.addEventListener("click", function() {
|
|
778
|
+
older.hidden = false;
|
|
779
|
+
olderButton.remove();
|
|
780
|
+
older.querySelector("h3").focus();
|
|
781
|
+
});
|
|
782
|
+
});
|
|
783
|
+
</script>
|
|
784
|
+
|
|
785
|
+
</body>
|
|
786
|
+
|
|
787
|
+
</html>
|