BradNut/awesome-uses
1
0
Fork 0
mirror of https://github.com/BradNut/awesome-uses synced 2025-09-08 17:40:31 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #1538 from theMosaad/show-back-to-top-link

Browse source 
Fix BackToTop link not showing after scrolling past 25% of the page
This commit is contained in:
Wes Bos 2023-02-23 11:11:46 -05:00 committed by GitHub
commit df9258f28a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 4 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/components/BackToTop.js
View file

@ -25,7 +25,7 @@ function useScrollPosition() {
export default function BackToTop() {
const percent = useScrollPosition();
return (
<a className="BackToTopLink" href="#top" title="Back To Top" percent={percent}>
<a className={`BackToTopLink ${percent > 0.25 ? 'Show' : ''}`} href="#top" title="Back To Top">
&uarr;
</a>
);

8
src/styles.css
View file

@ -245,7 +245,6 @@ body::-webkit-scrollbar-thumb {
position: fixed;
bottom: 1%;
right: 1%;
background: var(--pink);
color: white;
background: rgba(0, 0, 0, 0.5);
cursor: pointer;
@ -255,11 +254,10 @@ body::-webkit-scrollbar-thumb {
opacity: 0;
text-decoration: none;
/* ${props =>
props.percent > 0.25 &&
`
&.Show {
opacity: 1;
`} */
}
@media screen and (max-width: 500px) {
display: none;
}