Global: Add a CSS style for disabled and loading profile buttons

Groups: Add a loading animation
This commit is contained in:
veselcraft 2021-12-25 14:17:11 +03:00
parent a1691a1485
commit 5d47549442
No known key found for this signature in database
GPG key ID: AED66BC1AC628A4E
3 changed files with 20 additions and 0 deletions

View file

@ -334,6 +334,20 @@ a {
width: 150px; width: 150px;
} }
.profile_link.disable > a, .profile_link.disable {
cursor: not-allowed;
color: grey;
}
.profile_link.loading > a::after, .profile_link.loading::after {
content: "";
display: inline-block;
background-image: url('/assets/packages/static/openvk/img/loading_mini.gif');
width: 30px;
height: 7px;
margin-left: 5px;
}
.page_footer { .page_footer {
margin-left: 95px; margin-left: 95px;
padding-top: 5px; padding-top: 5px;

BIN
Web/static/img/loading_mini.gif Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 246 B

View file

@ -93,6 +93,9 @@ document.addEventListener("DOMContentLoaded", function() { //BEGIN
let groupName = u(this).attr("data-group-name"); let groupName = u(this).attr("data-group-name");
let groupUrl = u(this).attr("data-group-url"); let groupUrl = u(this).attr("data-group-url");
let list = u('#_groupListPinnedGroups'); let list = u('#_groupListPinnedGroups');
thisButton.nodes[0].classList.add('loading');
thisButton.nodes[0].classList.add('disable');
let req = await ky(link); let req = await ky(link);
if(req.ok == false) { if(req.ok == false) {
@ -122,6 +125,9 @@ document.addEventListener("DOMContentLoaded", function() { //BEGIN
if(list.nodes[0].children[0].className != "menu_divider" || list.nodes[0].children.length == 1) { if(list.nodes[0].children[0].className != "menu_divider" || list.nodes[0].children.length == 1) {
list.nodes[0].children[0].remove(); list.nodes[0].children[0].remove();
} }
thisButton.nodes[0].classList.remove('loading');
thisButton.nodes[0].classList.remove('disable');
return false; return false;
}); });