Leatherface/mastodon
1
0
Fork 0
mirror of https://github.com/glitch-soc/mastodon.git synced 2025-12-28 13:47:23 +00:00
Code Issues Packages Projects Releases Wiki Activity

[Glitch] Add loading indicator to timeline gap indicators in web UI

Browse Source 
Port 82183d8a79 to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>
This commit is contained in:
Eugen Rochko
2025-01-29 09:46:04 +01:00
committed by Claire
parent 844ae90dad
commit 2c97a59148
2 changed files with 25 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
app/javascript/flavours/glitch/styles/components.scss
View File

@@ -4105,23 +4105,27 @@ a.status-card {
}
.load-more {
display: block;
display: flex;
align-items: center;
justify-content: center;
color: $dark-text-color;
background-color: transparent;
border: 0;
font-size: inherit;
text-align: center;
line-height: inherit;
margin: 0;
width: 100%;
padding: 15px;
box-sizing: border-box;
width: 100%;
clear: both;
text-decoration: none;
&:hover {
background: var(--on-surface-color);
}
.icon {
width: 22px;
height: 22px;
}
}
.load-gap {
@@ -4643,6 +4647,7 @@ a.status-card {
justify-content: center;
}
.load-more .loading-indicator,
.button .loading-indicator {
position: static;
transform: none;
@@ -4654,6 +4659,10 @@ a.status-card {
}
}
.load-more .loading-indicator .circular-progress {
color: lighten($ui-base-color, 26%);
}
.circular-progress {
color: lighten($ui-base-color, 26%);
animation: 1.4s linear 0s infinite normal none running simple-rotate;