mirror of
https://github.com/jokob-sk/NetAlertX.git
synced 2026-06-21 06:39:52 -04:00
12d5991505
- Created skeleton templates for events, notifications, plugins, presence, report, settings, and workflows to enhance loading states. - Implemented structured skeletons for tab details, tab events, maintenance backup, database tools, logging, multi-edit, presence, sessions, and system info. - Each template includes shimmer effects for loading indicators, improving user experience during data fetching.
43 lines
1.8 KiB
PHP
43 lines
1.8 KiB
PHP
<!-- Details Tab Skeleton ================================================== -->
|
|
<div id="skel-tab-details" class="skel-tab-pane">
|
|
<div class="skel-detail-form">
|
|
<div class="skel-form-row">
|
|
<span class="skel-form-label skel-shimmer"></span>
|
|
<span class="skel-form-input skel-shimmer" style="max-width:340px"></span>
|
|
</div>
|
|
<div class="skel-form-row">
|
|
<span class="skel-form-label skel-shimmer"></span>
|
|
<span class="skel-form-input skel-shimmer" style="max-width:260px"></span>
|
|
</div>
|
|
<div class="skel-form-row">
|
|
<span class="skel-form-label skel-shimmer"></span>
|
|
<span class="skel-form-input skel-shimmer" style="max-width:400px"></span>
|
|
</div>
|
|
<div class="skel-form-row">
|
|
<span class="skel-form-label skel-shimmer"></span>
|
|
<span class="skel-form-input skel-shimmer" style="max-width:300px"></span>
|
|
</div>
|
|
<div class="skel-form-row">
|
|
<span class="skel-form-label skel-shimmer"></span>
|
|
<span class="skel-form-input skel-shimmer" style="max-width:220px"></span>
|
|
</div>
|
|
<div class="skel-form-row">
|
|
<span class="skel-form-label skel-shimmer"></span>
|
|
<span class="skel-form-input skel-shimmer" style="max-width:380px"></span>
|
|
</div>
|
|
<div class="skel-form-row">
|
|
<span class="skel-form-label skel-shimmer"></span>
|
|
<span class="skel-form-input skel-shimmer" style="max-width:280px"></span>
|
|
</div>
|
|
<div class="skel-form-row">
|
|
<span class="skel-form-label skel-shimmer"></span>
|
|
<span class="skel-form-input skel-shimmer" style="max-width:320px"></span>
|
|
</div>
|
|
<div class="skel-form-footer">
|
|
<span class="skel-form-btn skel-shimmer"></span>
|
|
<span class="skel-form-btn skel-shimmer"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- /Details Tab Skeleton ================================================= -->
|