Mirrors_Framework/awesome-python
1
0
Fork 0
mirror of https://github.com/vinta/awesome-python.git synced 2026-05-28 22:31:31 +08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

refactor(website): move back-to-top button into sticky table header

Browse Source 
Replaces the fixed-position floating button with an inline button
inside the last column of the sticky table header. Removes the hidden
attribute toggle and float positioning in favour of opacity/pointer-
events toggling, keeping the visibility logic intact.

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Vinta Chen
2026-03-22 02:28:16 +08:00
parent 818950f442
commit 49fafd3497
4 changed files with 12 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files
website/static/main.js
-1
View File
@@ -282,7 +282,6 @@ if (searchInput) {
// Back to top // Back to top
var backToTop = document.querySelector('.back-to-top'); var backToTop = document.querySelector('.back-to-top');
if (backToTop) { if (backToTop) {
backToTop.hidden = false;
var scrollTicking = false; var scrollTicking = false;
window.addEventListener('scroll', function () { window.addEventListener('scroll', function () {
if (!scrollTicking) { if (!scrollTicking) {
website/static/style.css
+9 -26
View File
@@ -545,39 +545,26 @@ th[data-sort].sort-asc::after {
/* === Back to Top === */ /* === Back to Top === */
.back-to-top { .back-to-top {
position: fixed; background: none;
bottom: 2rem; border: none;
left: 50%; padding: 0;
margin-left: -2rem;
background: var(--bg);
border: 1px solid var(--border-strong);
border-radius: 4px;
padding: 0.4rem 0.75rem;
font-family: var(--font-body); font-family: var(--font-body);
font-size: var(--text-xs); font-size: 0.8rem;
font-weight: 600; font-weight: 600;
color: var(--text-muted); color: var(--accent);
cursor: pointer; cursor: pointer;
opacity: 0; opacity: 0;
transform: translateY(0.5rem); transition: opacity 0.15s ease, color 0.15s;
transition: opacity 0.15s ease, transform 0.15s ease, border-color 0.15s, color 0.15s; pointer-events: none;
z-index: 50;
} }
.back-to-top[hidden] { display: none; }
.back-to-top.visible { .back-to-top.visible {
opacity: 1; opacity: 1;
transform: translateY(0); pointer-events: auto;
} }
.back-to-top:hover { .back-to-top:hover {
border-color: var(--accent); color: var(--accent-hover);
color: var(--accent);
}
.back-to-top:active {
transform: scale(0.95);
} }
.back-to-top:focus-visible { .back-to-top:focus-visible {
@@ -585,10 +572,6 @@ th[data-sort].sort-asc::after {
outline-offset: 2px; outline-offset: 2px;
} }
@media (max-width: 640px) {
.back-to-top { bottom: 1.25rem; }
}
/* === Noscript === */ /* === Noscript === */
.noscript-msg { .noscript-msg {
text-align: center; text-align: center;
website/templates/base.html
-2
View File
@@ -37,8 +37,6 @@
<main id="content">{% block content %}{% endblock %}</main> <main id="content">{% block content %}{% endblock %}</main>
<button class="back-to-top" aria-label="Back to top" hidden>&uarr; Top</button>
<footer class="footer"> <footer class="footer">
<span <span
>Made by >Made by
website/templates/index.html
+3 -1
View File
@@ -76,7 +76,9 @@
<th class="col-stars" data-sort="stars">GitHub Stars</th> <th class="col-stars" data-sort="stars">GitHub Stars</th>
<th class="col-commit" data-sort="commit-time">Last Commit</th> <th class="col-commit" data-sort="commit-time">Last Commit</th>
<th class="col-cat">Category</th> <th class="col-cat">Category</th>
<th class="col-arrow"><span class="sr-only">Details</span></th> <th class="col-arrow">
<button class="back-to-top" aria-label="Back to top">&uarr;</button>
</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>