mirrors/mue
1
0
Fork 0
mirror of https://github.com/mue/mue.git synced 2026-07-16 05:23:49 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat(MainModal): implement sidebar skeleton loader and enhance loading experience

Browse Source
This commit is contained in:
alexsparkes
2026-01-24 00:28:31 +00:00
parent 7b48b3a4d8
commit e43615bcdf
5 changed files with 107 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
src/components/Elements/MainModal/scss/modules/_sidebar.scss
View File

@@ -74,3 +74,54 @@
margin-left: 0 !important;
margin-right: 0 !important;
}
// Sidebar skeleton loader
.sidebarSkeleton {
padding: 0.5rem 0.2rem;
.skeletonItem {
display: flex;
align-items: center;
padding: 0.5rem;
margin: 0.2rem;
pointer-events: none;
.iconPlaceholder {
width: 17px;
height: 17px;
border-radius: 6px;
margin-left: 20px;
margin-right: 20px;
flex-shrink: 0;
@include themed {
background: t($modal-sidebarActive);
}
}
.textPlaceholder {
height: 18px;
border-radius: 6px;
@include themed {
background: t($modal-sidebarActive);
}
}
}
.skeletonDivider {
@include themed {
height: 1px;
background: linear-gradient(
90deg,
transparent 0%,
t($modal-sidebarActive) 20%,
t($modal-sidebarActive) 80%,
transparent 100%
);
margin: 0.5rem 1.75rem;
border: none;
opacity: 0.6;
}
}
}