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

feat: redesign website homepage

Browse Source
This commit is contained in:
Vinta Chen
2026-03-22 07:54:14 +08:00
parent 15b0ff3b07
commit 7d1d9e0af3
4 changed files with 1116 additions and 573 deletions
Download Patch File Download Diff File Expand all files Collapse all files
website/static/main.js
+32 -1
View File
@@ -10,6 +10,37 @@ var rows = document.querySelectorAll('.table tbody tr.row');
var tags = document.querySelectorAll('.tag');
var tbody = document.querySelector('.table tbody');
function initRevealSections() {
var sections = document.querySelectorAll('[data-reveal]');
if (!sections.length) return;
if (!('IntersectionObserver' in window)) {
sections.forEach(function (section) {
section.classList.add('is-visible');
});
return;
}
var observer = new IntersectionObserver(function (entries) {
entries.forEach(function (entry) {
if (!entry.isIntersecting) return;
entry.target.classList.add('is-visible');
observer.unobserve(entry.target);
});
}, {
threshold: 0.12,
rootMargin: '0px 0px -8% 0px',
});
sections.forEach(function (section, index) {
section.classList.add('will-reveal');
section.style.transitionDelay = Math.min(index * 70, 180) + 'ms';
observer.observe(section);
});
}
initRevealSections();
// Relative time formatting
function relativeTime(isoStr) {
var date = new Date(isoStr);
@@ -293,7 +324,7 @@ if (backToTop) {
}
});
backToTop.addEventListener('click', function () {
window.scrollTo({ top: 0 });
window.scrollTo({ top: 0, behavior: 'smooth' });
});
}
website/static/style.css
+797 -395
View File
File diff suppressed because it is too large Load Diff
website/templates/base.html
+25 -9
View File
@@ -18,6 +18,12 @@
<meta property="og:url" content="https://awesome-python.com/" />
<meta name="twitter:card" content="summary" />
<link rel="icon" href="/static/favicon.svg" type="image/svg+xml" />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap"
rel="stylesheet"
/>
<link rel="stylesheet" href="/static/style.css" />
<script
async
@@ -38,20 +44,30 @@
<main id="content">{% block content %}{% endblock %}</main>
<footer class="footer">
<span
>Made by
<a href="https://vinta.ws/" target="_blank" rel="noopener"
>Vinta</a
></span
<div class="footer-copy">
Maintained by
<a href="https://vinta.ws/" target="_blank" rel="noopener">Vinta</a>
for the Python community.
</div>
<div class="footer-links">
<a
href="https://github.com/vinta/awesome-python"
target="_blank"
rel="noopener"
>Repository</a
>
<span class="footer-sep">/</span>
<a
href="https://github.com/vinta/awesome-python/blob/master/CONTRIBUTING.md"
target="_blank"
rel="noopener"
>Contribute</a
>
<span class="footer-sep">/</span>
<a href="https://github.com/vinta" target="_blank" rel="noopener"
>GitHub</a
>
<span class="footer-sep">/</span>
<a href="https://twitter.com/vinta" target="_blank" rel="noopener"
>Twitter</a
>
</div>
</footer>
<noscript
website/templates/index.html
+122 -28
View File
@@ -1,7 +1,32 @@
{% extends "base.html" %} {% block content %}
<header class="hero">
<div class="hero-main">
<div>
<div class="hero-sheen" aria-hidden="true"></div>
<div class="hero-noise" aria-hidden="true"></div>
<div class="hero-shell">
<div class="hero-topbar">
<a href="#content" class="hero-brand-mini">Awesome Python</a>
<div class="hero-topbar-actions">
<a
href="https://github.com/vinta/awesome-python"
class="hero-topbar-link"
target="_blank"
rel="noopener"
>Repository</a
>
<a
href="https://github.com/vinta/awesome-python/blob/master/CONTRIBUTING.md"
class="hero-topbar-link hero-topbar-link-strong"
target="_blank"
rel="noopener"
>Submit a Project</a
>
</div>
</div>
<div class="hero-grid">
<div class="hero-copy">
<p class="hero-kicker">The field guide to the Python ecosystem</p>
<h1>Awesome Python</h1>
<p class="hero-sub">
{{ subtitle }}<br />Maintained by
@@ -16,26 +41,55 @@
>@JinyangWang27</a
>.
</p>
<div class="hero-actions">
<a href="#library-index" class="hero-action hero-action-primary"
>Browse the Index</a
>
<a
href="https://github.com/vinta/awesome-python"
class="hero-gh"
class="hero-action hero-action-secondary"
target="_blank"
rel="noopener"
>awesome-python on GitHub &rarr;</a
>View on GitHub</a
>
</div>
<a
href="https://github.com/vinta/awesome-python/blob/master/CONTRIBUTING.md"
class="hero-submit"
target="_blank"
rel="noopener"
>Submit a Project</a
>
<dl class="hero-metrics" aria-label="Site overview">
<div>
<dt>{{ "{:,}".format(entries | length) }}</dt>
<dd>unique projects indexed</dd>
</div>
<div>
<dt>{{ total_categories }}</dt>
<dd>categories to search</dd>
</div>
<div>
<dt>{{ groups | length }}</dt>
<dd>editorial groupings</dd>
</div>
</dl>
</div>
</div>
<a href="#library-index" class="hero-scrollcue">Scroll into the index</a>
</div>
</header>
<h2 class="sr-only">Search and filter</h2>
<div class="controls">
<section class="results-section" id="library-index">
<div class="results-intro section-shell" data-reveal>
<div>
<p class="section-label">Library index</p>
<h2>One searchable surface for the ecosystem.</h2>
</div>
<p class="results-note">
Use <kbd>/</kbd> to focus search, tap a tag to filter, and open a row for
descriptions, related projects, and source details.
</p>
</div>
<div class="controls section-shell" data-reveal>
<h2 class="sr-only">Search and filter</h2>
<div class="search-wrap">
<svg
class="search-icon"
@@ -58,16 +112,21 @@
aria-label="Search libraries"
/>
</div>
<div class="filter-bar">
<span>Showing <strong class="filter-value"></strong></span>
<div class="filter-bar" aria-live="polite">
<span>Filtering for <strong class="filter-value"></strong></span>
<button class="filter-clear" aria-label="Clear filter">
&times; Clear
Clear filter
</button>
</div>
</div>
</div>
<h2 class="sr-only">Results</h2>
<div class="table-wrap" tabindex="0" role="region" aria-label="Libraries table">
<h2 class="sr-only">Results</h2>
<div
class="table-wrap"
tabindex="0"
role="region"
aria-label="Libraries table"
>
<table class="table">
<thead>
<tr>
@@ -77,7 +136,7 @@
<th class="col-commit" data-sort="commit-time">Last Commit</th>
<th class="col-cat">Category</th>
<th class="col-arrow">
<button class="back-to-top" aria-label="Back to top">&uarr;</button>
<button class="back-to-top" aria-label="Back to top">Top</button>
</th>
</tr>
</thead>
@@ -100,8 +159,9 @@
</td>
<td class="col-stars">
{% if entry.stars is not none %}{{ "{:,}".format(entry.stars) }}{%
elif entry.source_type %}<span class="source-badge">{{ entry.source_type }}</span>{%
else %}&mdash;{% endif %}
elif entry.source_type %}<span class="source-badge"
>{{ entry.source_type }}</span
>{% else %}&mdash;{% endif %}
</td>
<td
class="col-commit"
@@ -123,13 +183,20 @@
<button class="tag" data-type="cat" data-value="{{ cat }}">
{{ cat }}
</button>
{% endfor %}
{% if entry.source_type == 'Built-in' %}
<button class="tag tag-source" data-type="cat" data-value="Built-in">
{% endfor %} {% if entry.source_type == 'Built-in' %}
<button
class="tag tag-source"
data-type="cat"
data-value="Built-in"
>
Built-in
</button>
{% endif %}
<button class="tag tag-group" data-type="group" data-value="{{ entry.groups[0] }}">
<button
class="tag tag-group"
data-type="group"
data-value="{{ entry.groups[0] }}"
>
{{ entry.groups[0] }}
</button>
</td>
@@ -171,7 +238,34 @@
{% endfor %}
</tbody>
</table>
</div>
</div>
<div class="no-results" hidden>No libraries match your search.</div>
<div class="no-results" hidden>
No libraries match your current search or filter.
</div>
</section>
<section class="final-cta section-shell" data-reveal>
<p class="section-label">Keep it sharp</p>
<h2>Know a project that belongs in the canon?</h2>
<p>
Submit it with enough context to make the list more useful, not just longer.
</p>
<div class="final-cta-actions">
<a
href="https://github.com/vinta/awesome-python/blob/master/CONTRIBUTING.md"
class="hero-action hero-action-primary"
target="_blank"
rel="noopener"
>Read the contribution guide</a
>
<a
href="https://github.com/vinta/awesome-python"
class="hero-action hero-action-secondary"
target="_blank"
rel="noopener"
>Star the repository</a
>
</div>
</section>
{% endblock %}