keith/Portfolio-2026
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

✨feature: Move back top top button styling to buttons.css

Browse Source
This commit is contained in:
Keith Solomon
2026-03-19 15:59:17 -05:00
parent ced4f4c021
commit 7a578c67c0
2 changed files with 19 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/js/components/backToTop.js
+1 -1
View File
@@ -2,7 +2,7 @@
class BackToTopButton extends HTMLElement { class BackToTopButton extends HTMLElement {
connectedCallback() { connectedCallback() {
this.innerHTML = ` this.innerHTML = `
<button id="backToTopBtn" aria-label="Back to top" class="back-to-top" style="display:none;position:fixed;bottom:2rem;right:2rem;z-index:1000;padding:0.75em 1.5em;font-size:1.1rem;border-radius:2em;background:var(--color-primary,#3857BC);color:#fff;border:none;box-shadow:0 2px 8px rgba(0,0,0,0.15);cursor:pointer;transition:opacity 0.2s;"> <button id="backToTopBtn" aria-label="Back to top" class="back-to-top" style="">
↑ Top ↑ Top
</button> </button>
`; `;
styles/blocks/buttons.css
+18
View File
@@ -74,6 +74,24 @@
.btn:active, .button:active { transform: scale(99%); } .btn:active, .button:active { transform: scale(99%); }
/* Back To Top Button */
#backToTopBtn {
display:none;
position:fixed;
bottom:2rem;
right:2rem;
z-index:1000;
padding:0.75em 1.5em;
font-size:1.1rem;
border-radius:2em;
background:var(--color-primary,#3857BC);
color:#fff;
border:none;
box-shadow:0 2px 8px rgba(0,0,0,0.15);
cursor:pointer;
transition:opacity 0.2s;
}
/** /**
* Variants * Variants
* *