🎨 fix follow btn transition

This commit is contained in:
kawamataryo 2023-05-21 22:49:03 +09:00
parent 877d0a9cbe
commit 8127489173
2 changed files with 14 additions and 4 deletions

View File

@ -96,6 +96,7 @@ export const insertBskyProfileEl = ({ dom, profile, abortController, followActio
target.textContent = "Follow on Bluesky" target.textContent = "Follow on Bluesky"
target.classList.remove('follow-button__processing') target.classList.remove('follow-button__processing')
target.classList.remove('follow-button__following') target.classList.remove('follow-button__following')
target.classList.add('follow-button__just-followed')
return return
} }
}, { }, {
@ -115,6 +116,9 @@ export const insertBskyProfileEl = ({ dom, profile, abortController, followActio
bskyUserContentDom?.addEventListener('mouseout', async (e) => { bskyUserContentDom?.addEventListener('mouseout', async (e) => {
const target = e.target as Element const target = e.target as Element
const classList = target.classList const classList = target.classList
if(classList.contains('follow-button__just-followed')) {
target.classList.remove('follow-button__just-followed')
}
if (classList.contains('follow-button') && classList.contains('follow-button__following')) { if (classList.contains('follow-button') && classList.contains('follow-button__following')) {
target.textContent = "Following on Bluesky" target.textContent = "Following on Bluesky"
} }

View File

@ -1,7 +1,6 @@
/* ----------------- */ /* ----------------- */
/* base */ /* base */
/* ----------------- */ /* ----------------- */
:root { :root {
--bsky-primary-color: rgb(29, 78, 216); --bsky-primary-color: rgb(29, 78, 216);
--bsky-primary-hover-color: #2563eb; --bsky-primary-hover-color: #2563eb;
@ -88,10 +87,17 @@
cursor: pointer; cursor: pointer;
} }
.name-and-controller .follow-button__following.follow-button__just-followed:hover {
background: transparent !important;
color: #fff !important;
border: 1px solid #fff !important;
cursor: pointer;
}
.name-and-controller .follow-button__processing { .name-and-controller .follow-button__processing {
background: rgb(255,255,255, 0.3);; background: rgb(255,255,255, 0.3) !important;
color: #fff; color: #fff !important;
border: 1px solid #fff; border: 1px solid #fff !important;
cursor: auto; cursor: auto;
} }