Tip of the Day
Collectibles you find give 1 extra achievement point per item!
MediaWiki:Gadget-backToTop.css: Difference between revisions
From Walkscape Walkthrough
Created page with "#gadget-backtotop { position: fixed; right: 16px; bottom: 16px; z-index: 9999; display: inline-flex; align-items: center; gap: 8px; padding: 10px 12px; border-radius: 999px; border: 1px solid rgba(0,0,0,0.25); background: #fff; color: #000; text-decoration: none; font-size: 14px; line-height: 1; opacity: 0; pointer-events: none; transform: translateY(6px); transition: opacity 150ms ease-in-out, transform 150ms ease-in-out; } #g..." |
mNo edit summary |
||
| (One intermediate revision by the same user not shown) | |||
| Line 20: | Line 20: | ||
line-height: 1; | line-height: 1; | ||
/* Hidden by default */ | |||
opacity: 0; | opacity: 0; | ||
visibility: hidden; | |||
pointer-events: none; | pointer-events: none; | ||
transition: opacity 150ms ease-in-out, | transition: opacity 150ms ease-in-out, visibility 0s linear 150ms; | ||
} | } | ||
#gadget-backtotop.is-visible { | #gadget-backtotop.is-visible { | ||
opacity: 0.92; | opacity: 0.92; | ||
visibility: visible; | |||
pointer-events: auto; | pointer-events: auto; | ||
transition: opacity 150ms ease-in-out, visibility 0s linear 0s; | |||
} | } | ||
#gadget-backtotop:hover, | #gadget-backtotop.is-visible:hover, | ||
#gadget-backtotop:focus { | #gadget-backtotop.is-visible:focus { | ||
opacity: 1; | opacity: 1; | ||
} | } | ||
Latest revision as of 12:47, 5 January 2026
#gadget-backtotop {
position: fixed;
right: 16px;
bottom: 16px;
z-index: 9999;
display: inline-flex;
align-items: center;
gap: 8px;
padding: 10px 12px;
border-radius: 999px;
border: 1px solid rgba(0,0,0,0.25);
background: #fff;
color: #000;
text-decoration: none;
font-size: 14px;
line-height: 1;
/* Hidden by default */
opacity: 0;
visibility: hidden;
pointer-events: none;
transition: opacity 150ms ease-in-out, visibility 0s linear 150ms;
}
#gadget-backtotop.is-visible {
opacity: 0.92;
visibility: visible;
pointer-events: auto;
transition: opacity 150ms ease-in-out, visibility 0s linear 0s;
}
#gadget-backtotop.is-visible:hover,
#gadget-backtotop.is-visible:focus {
opacity: 1;
}
#gadget-backtotop .btt-icon {
font-size: 18px;
line-height: 1;
}
/* Mobile/narrow: icon only */
@media (max-width: 720px) {
#gadget-backtotop {
width: 44px;
height: 44px;
padding: 0;
justify-content: center;
}
#gadget-backtotop .btt-label {
display: none;
}
}
