mirror of
https://github.com/kennethreitz/kennethreitz.org.git
synced 2026-06-05 22:50:17 +00:00
Refactor mindmap and base templates for improved UI and functionality; enhance header, footer, and live download counter.
This commit is contained in:
+53
-23
@@ -64,19 +64,19 @@
|
||||
</head>
|
||||
<body class="bg-gray-900 font-serif text-gray-100 selection:bg-primary-700 selection:text-white tufte dark-mode" id="tufte-body">
|
||||
<!-- Header -->
|
||||
<header class="border-b border-gray-700 bg-gray-900/80 backdrop-blur-md sticky top-0 z-50">
|
||||
<div class="max-w-4xl mx-auto px-6 py-8">
|
||||
<header class="border-b border-gray-700 bg-gray-900/90 backdrop-blur-xl sticky top-0 z-50 shadow-lg">
|
||||
<div class="max-w-6xl mx-auto px-6 py-8">
|
||||
<div class="flex flex-col space-y-4">
|
||||
<!-- Main brand -->
|
||||
<div class="flex items-center justify-between">
|
||||
<div>
|
||||
<h1 class="text-4xl font-bold tracking-tight">
|
||||
<a href="/" class="text-gray-100 hover:text-primary-400 transition-colors duration-200 no-underline font-serif">
|
||||
<h1 class="text-5xl font-bold tracking-tight">
|
||||
<a href="/" class="text-gray-100 hover:text-primary-400 transition-colors duration-200 no-underline font-serif bg-gradient-to-r from-primary-400 via-purple-400 to-pink-400 bg-clip-text text-transparent">
|
||||
Kenneth Reitz
|
||||
</a>
|
||||
</h1>
|
||||
<p class="text-xl text-gray-400 font-serif italic mt-2 et-book tracking-wide">
|
||||
Digital Vault & Blog
|
||||
Creator of <span class="text-primary-400 font-semibold">Requests</span> • Python Advocate • Making Complex Things Simple
|
||||
</p>
|
||||
</div>
|
||||
|
||||
@@ -84,8 +84,11 @@
|
||||
|
||||
<!-- Mobile-friendly navigation -->
|
||||
<nav class="hidden md:flex space-x-6">
|
||||
<a href="/directory" class="text-sm font-medium text-gray-300 hover:text-primary-400 transition-colors duration-200 px-3 py-2 rounded-md hover:bg-gray-800/60">
|
||||
📁 Files
|
||||
<a href="/directory" class="text-sm font-medium text-gray-300 hover:text-primary-400 transition-all duration-300 px-4 py-2 rounded-lg hover:bg-primary-900/30 border border-transparent hover:border-primary-500/30">
|
||||
📁 Explore Files
|
||||
</a>
|
||||
<a href="https://github.com/psf/requests" target="_blank" class="text-sm font-medium text-gray-300 hover:text-primary-400 transition-all duration-300 px-4 py-2 rounded-lg hover:bg-primary-900/30 border border-transparent hover:border-primary-500/30">
|
||||
🌐 Requests
|
||||
</a>
|
||||
</nav>
|
||||
</div>
|
||||
@@ -94,9 +97,12 @@
|
||||
<div class="flex md:hidden">
|
||||
<!-- Mobile nav links -->
|
||||
<nav class="flex space-x-4">
|
||||
<a href="/directory" class="text-sm font-medium text-gray-300 hover:text-primary-400 transition-colors duration-200 px-3 py-2 rounded-md hover:bg-gray-800/60">
|
||||
<a href="/directory" class="text-sm font-medium text-gray-300 hover:text-primary-400 transition-all duration-300 px-4 py-2 rounded-lg hover:bg-primary-900/30">
|
||||
📁 Files
|
||||
</a>
|
||||
<a href="https://github.com/psf/requests" target="_blank" class="text-sm font-medium text-gray-300 hover:text-primary-400 transition-all duration-300 px-4 py-2 rounded-lg hover:bg-primary-900/30">
|
||||
🌐 Requests
|
||||
</a>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
@@ -126,25 +132,49 @@
|
||||
</main>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="border-t border-gray-800/60 mt-16 bg-gray-900/60 backdrop-blur-sm">
|
||||
<div class="max-w-4xl mx-auto px-6 py-12">
|
||||
<footer class="border-t border-gray-800/60 mt-20 bg-gradient-to-t from-gray-900 to-gray-900/60 backdrop-blur-sm">
|
||||
<div class="max-w-6xl mx-auto px-6 py-16">
|
||||
<div class="text-center">
|
||||
<p class="text-sm text-gray-400">
|
||||
© {{ current_year }} Kenneth Reitz. Built with elegant typography and thoughtful design.
|
||||
</p>
|
||||
<div class="mt-4 flex justify-center space-x-6">
|
||||
<a href="https://twitter.com/kennethreitz" class="text-gray-500 hover:text-primary-400 transition-colors duration-200">
|
||||
<span class="sr-only">Twitter</span>
|
||||
<svg class="h-5 w-5" fill="currentColor" viewBox="0 0 20 20">
|
||||
<path d="M6.29 18.251c7.547 0 11.675-6.253 11.675-11.675 0-.178 0-.355-.012-.53A8.348 8.348 0 0020 3.92a8.19 8.19 0 01-2.357.646 4.118 4.118 0 001.804-2.27 8.224 8.224 0 01-2.605.996 4.107 4.107 0 00-6.993 3.743 11.65 11.65 0 01-8.457-4.287 4.106 4.106 0 001.27 5.477A4.073 4.073 0 01.8 7.713v.052a4.105 4.105 0 003.292 4.022 4.095 4.095 0 01-1.853.07 4.108 4.108 0 003.834 2.85A8.233 8.233 0 010 16.407a11.616 11.616 0 006.29 1.84"/>
|
||||
</svg>
|
||||
</a>
|
||||
<a href="https://github.com/kennethreitz" class="text-gray-500 hover:text-primary-400 transition-colors duration-200">
|
||||
<span class="sr-only">GitHub</span>
|
||||
<svg class="h-5 w-5" fill="currentColor" viewBox="0 0 20 20">
|
||||
<!-- Impact Statement -->
|
||||
<div class="mb-8">
|
||||
<p class="text-lg text-gray-300 font-medium mb-2">
|
||||
Empowering developers worldwide with elegant, human-centered code
|
||||
</p>
|
||||
<p class="text-sm text-gray-500">
|
||||
16M downloads daily • Touching every Python project on Earth
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Social Links -->
|
||||
<div class="flex justify-center space-x-8 mb-8">
|
||||
<a href="https://github.com/kennethreitz" target="_blank" class="text-gray-400 hover:text-primary-400 transition-all duration-300 flex items-center space-x-2 group">
|
||||
<svg class="h-6 w-6 group-hover:scale-110 transition-transform" fill="currentColor" viewBox="0 0 20 20">
|
||||
<path fill-rule="evenodd" d="M10 0C4.477 0 0 4.484 0 10.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0110 4.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.203 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.942.359.31.678.921.678 1.856 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0020 10.017C20 4.484 15.522 0 10 0z" clip-rule="evenodd"/>
|
||||
</svg>
|
||||
<span class="hidden sm:inline font-medium">GitHub</span>
|
||||
</a>
|
||||
<a href="https://twitter.com/kennethreitz" target="_blank" class="text-gray-400 hover:text-primary-400 transition-all duration-300 flex items-center space-x-2 group">
|
||||
<svg class="h-6 w-6 group-hover:scale-110 transition-transform" fill="currentColor" viewBox="0 0 20 20">
|
||||
<path d="M6.29 18.251c7.547 0 11.675-6.253 11.675-11.675 0-.178 0-.355-.012-.53A8.348 8.348 0 0020 3.92a8.19 8.19 0 01-2.357.646 4.118 4.118 0 001.804-2.27 8.224 8.224 0 01-2.605.996 4.107 4.107 0 00-6.993 3.743 11.65 11.65 0 01-8.457-4.287 4.106 4.106 0 001.27 5.477A4.073 4.073 0 01.8 7.713v.052a4.105 4.105 0 003.292 4.022 4.095 4.095 0 01-1.853.07 4.108 4.108 0 003.834 2.85A8.233 8.233 0 010 16.407a11.616 11.616 0 006.29 1.84"/>
|
||||
</svg>
|
||||
<span class="hidden sm:inline font-medium">Twitter</span>
|
||||
</a>
|
||||
<a href="https://github.com/psf/requests" target="_blank" class="text-gray-400 hover:text-primary-400 transition-all duration-300 flex items-center space-x-2 group">
|
||||
<svg class="h-6 w-6 group-hover:scale-110 transition-transform" fill="currentColor" viewBox="0 0 20 20">
|
||||
<path d="M10 2L3 7v11h14V7l-7-5z"/>
|
||||
</svg>
|
||||
<span class="hidden sm:inline font-medium">Requests</span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- Copyright -->
|
||||
<div class="border-t border-gray-800/40 pt-8">
|
||||
<p class="text-sm text-gray-500">
|
||||
© {{ current_year }} Kenneth Reitz. Crafted with passion for beautiful, human-centered design.
|
||||
</p>
|
||||
<p class="text-xs text-gray-600 mt-2">
|
||||
"Beautiful is better than ugly. Simple is better than complex."
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
+227
-16
@@ -1,6 +1,93 @@
|
||||
{% extends "base.html" %}
|
||||
<!DOCTYPE html>
|
||||
<html lang="en" class="antialiased">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Kenneth Reitz - Digital Mind Map</title>
|
||||
|
||||
<!-- Load Google Fonts -->
|
||||
<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=Inter:wght@300;400;500;600;700;800&family=Crimson+Text:ital,wght@0,400;0,600;1,400;1,600&family=JetBrains+Mono:wght@400;500;600&display=swap" rel="stylesheet">
|
||||
|
||||
<!-- Load Tailwind CSS -->
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
<script>
|
||||
tailwind.config = {
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
primary: {
|
||||
DEFAULT: '#4e3979',
|
||||
50: '#f8f7fd',
|
||||
100: '#f0eef9',
|
||||
200: '#e3e0f4',
|
||||
300: '#d0c8ec',
|
||||
400: '#b5a7e0',
|
||||
500: '#9b86d3',
|
||||
600: '#8265c4',
|
||||
700: '#6f52b0',
|
||||
800: '#5c4394',
|
||||
900: '#4e3979',
|
||||
950: '#3a2b5c',
|
||||
}
|
||||
},
|
||||
fontFamily: {
|
||||
'sans': ['Inter', 'system-ui', '-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'sans-serif'],
|
||||
'serif': ['Crimson Text', 'Charter', 'Georgia', 'Times New Roman', 'serif'],
|
||||
'mono': ['JetBrains Mono', 'Fira Code', 'SF Mono', 'Consolas', 'monospace'],
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
</head>
|
||||
<body class="bg-gray-900 font-serif text-gray-100 selection:bg-primary-700 selection:text-white">
|
||||
<!-- Header -->
|
||||
<header class="border-b border-gray-700 bg-gray-900/90 backdrop-blur-xl sticky top-0 z-50 shadow-lg">
|
||||
<div class="max-w-6xl mx-auto px-6 py-8">
|
||||
<div class="flex flex-col space-y-4">
|
||||
<!-- Main brand -->
|
||||
<div class="flex items-center justify-between">
|
||||
<div>
|
||||
<h1 class="text-5xl font-bold tracking-tight">
|
||||
<a href="/" class="text-gray-100 hover:text-primary-400 transition-colors duration-200 no-underline font-serif bg-gradient-to-r from-primary-400 via-purple-400 to-pink-400 bg-clip-text text-transparent">
|
||||
Kenneth Reitz
|
||||
</a>
|
||||
</h1>
|
||||
<p class="text-xl text-gray-400 font-serif italic mt-2 tracking-wide">
|
||||
Creator of <span class="text-primary-400 font-semibold">Requests</span> • Python Advocate • Making Complex Things Simple
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Mobile-friendly navigation -->
|
||||
<nav class="hidden md:flex space-x-6">
|
||||
<a href="/directory" class="text-sm font-medium text-gray-300 hover:text-primary-400 transition-all duration-300 px-4 py-2 rounded-lg hover:bg-primary-900/30 border border-transparent hover:border-primary-500/30">
|
||||
📁 Explore Files
|
||||
</a>
|
||||
<a href="https://github.com/psf/requests" target="_blank" class="text-sm font-medium text-gray-300 hover:text-primary-400 transition-all duration-300 px-4 py-2 rounded-lg hover:bg-primary-900/30 border border-transparent hover:border-primary-500/30">
|
||||
🌐 Requests
|
||||
</a>
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
<!-- Mobile navigation -->
|
||||
<div class="flex md:hidden">
|
||||
<!-- Mobile nav links -->
|
||||
<nav class="flex space-x-4">
|
||||
<a href="/directory" class="text-sm font-medium text-gray-300 hover:text-primary-400 transition-all duration-300 px-4 py-2 rounded-lg hover:bg-primary-900/30">
|
||||
📁 Files
|
||||
</a>
|
||||
<a href="https://github.com/psf/requests" target="_blank" class="text-sm font-medium text-gray-300 hover:text-primary-400 transition-all duration-300 px-4 py-2 rounded-lg hover:bg-primary-900/30">
|
||||
🌐 Requests
|
||||
</a>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
{% block extra_head %}
|
||||
<style>
|
||||
/* Kenneth Reitz Brand Colors & Variables */
|
||||
:root {
|
||||
@@ -70,6 +157,48 @@
|
||||
font-weight: 700;
|
||||
color: var(--kr-primary);
|
||||
display: block;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
#live-downloads {
|
||||
background: linear-gradient(135deg, var(--kr-primary), var(--kr-purple));
|
||||
-webkit-background-clip: text;
|
||||
background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#live-downloads::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: linear-gradient(135deg, rgba(99, 102, 241, 0.1), rgba(139, 92, 246, 0.1));
|
||||
border-radius: 8px;
|
||||
animation: pulse-bg 3s ease-in-out infinite;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
@keyframes pulse-bg {
|
||||
0%, 100% { opacity: 0.3; transform: scale(1); }
|
||||
50% { opacity: 0.7; transform: scale(1.05); }
|
||||
}
|
||||
|
||||
.live-indicator {
|
||||
display: inline-block;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
background: #10b981;
|
||||
border-radius: 50%;
|
||||
margin-left: 8px;
|
||||
animation: live-pulse 2s ease-in-out infinite;
|
||||
}
|
||||
|
||||
@keyframes live-pulse {
|
||||
0%, 100% { opacity: 1; transform: scale(1); }
|
||||
50% { opacity: 0.6; transform: scale(1.2); }
|
||||
}
|
||||
|
||||
.stat-label {
|
||||
@@ -550,30 +679,28 @@
|
||||
}
|
||||
}
|
||||
</style>
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<!-- Hero Section -->
|
||||
<section class="hero-section">
|
||||
<div class="max-w-6xl mx-auto px-6">
|
||||
<h1 class="hero-title">Kenneth Reitz</h1>
|
||||
<p class="hero-subtitle">
|
||||
Creator of <strong>requests</strong> • Python Advocate • Making Complex Things Simple & Beautiful
|
||||
Creator of <strong>Requests</strong> • Python Advocate • Making Complex Things Simple & Beautiful
|
||||
</p>
|
||||
|
||||
<div class="hero-stats">
|
||||
<div class="stat-item">
|
||||
<span class="stat-number">500M+</span>
|
||||
<span class="stat-label">Downloads</span>
|
||||
<span class="stat-number" id="live-downloads">0</span>
|
||||
<span class="stat-label">Live Downloads Today <span class="live-indicator"></span></span>
|
||||
</div>
|
||||
<div class="stat-item">
|
||||
<span class="stat-number">16M</span>
|
||||
<span class="stat-label">Daily Average</span>
|
||||
</div>
|
||||
<div class="stat-item">
|
||||
<span class="stat-number">51K+</span>
|
||||
<span class="stat-label">GitHub Stars</span>
|
||||
</div>
|
||||
<div class="stat-item">
|
||||
<span class="stat-number">15+</span>
|
||||
<span class="stat-label">Years Contributing</span>
|
||||
</div>
|
||||
<div class="stat-item">
|
||||
<span class="stat-number">∞</span>
|
||||
<span class="stat-label">Impact</span>
|
||||
@@ -591,11 +718,11 @@
|
||||
<div class="featured-grid">
|
||||
<div class="project-card">
|
||||
<div class="project-icon">🌐</div>
|
||||
<h3 class="project-title">requests</h3>
|
||||
<h3 class="project-title">Requests</h3>
|
||||
<p class="project-desc">HTTP for Humans. The most elegant Python library ever created, downloaded by every Python developer on Earth.</p>
|
||||
<div class="project-stats">
|
||||
<span>⭐ 51k stars</span>
|
||||
<span>📦 500M+ downloads</span>
|
||||
<span>📦 16M daily downloads</span>
|
||||
<span>🔥 Industry standard</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -707,9 +834,55 @@
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{% endblock %}
|
||||
<!-- Footer -->
|
||||
<footer class="border-t border-gray-800/60 mt-20 bg-gradient-to-t from-gray-900 to-gray-900/60 backdrop-blur-sm">
|
||||
<div class="max-w-6xl mx-auto px-6 py-16">
|
||||
<div class="text-center">
|
||||
<!-- Impact Statement -->
|
||||
<div class="mb-8">
|
||||
<p class="text-lg text-gray-300 font-medium mb-2">
|
||||
Empowering developers worldwide with elegant, human-centered code
|
||||
</p>
|
||||
<p class="text-sm text-gray-500">
|
||||
16M downloads daily • Touching every Python project on Earth
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Social Links -->
|
||||
<div class="flex justify-center space-x-8 mb-8">
|
||||
<a href="https://github.com/kennethreitz" target="_blank" class="text-gray-400 hover:text-primary-400 transition-all duration-300 flex items-center space-x-2 group">
|
||||
<svg class="h-6 w-6 group-hover:scale-110 transition-transform" fill="currentColor" viewBox="0 0 20 20">
|
||||
<path fill-rule="evenodd" d="M10 0C4.477 0 0 4.484 0 10.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0110 4.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.203 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.942.359.31.678.921.678 1.856 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0020 10.017C20 4.484 15.522 0 10 0z" clip-rule="evenodd"/>
|
||||
</svg>
|
||||
<span class="hidden sm:inline font-medium">GitHub</span>
|
||||
</a>
|
||||
<a href="https://twitter.com/kennethreitz" target="_blank" class="text-gray-400 hover:text-primary-400 transition-all duration-300 flex items-center space-x-2 group">
|
||||
<svg class="h-6 w-6 group-hover:scale-110 transition-transform" fill="currentColor" viewBox="0 0 20 20">
|
||||
<path d="M6.29 18.251c7.547 0 11.675-6.253 11.675-11.675 0-.178 0-.355-.012-.53A8.348 8.348 0 0020 3.92a8.19 8.19 0 01-2.357.646 4.118 4.118 0 001.804-2.27 8.224 8.224 0 01-2.605.996 4.107 4.107 0 00-6.993 3.743 11.65 11.65 0 01-8.457-4.287 4.106 4.106 0 001.27 5.477A4.073 4.073 0 01.8 7.713v.052a4.105 4.105 0 003.292 4.022 4.095 4.095 0 01-1.853.07 4.108 4.108 0 003.834 2.85A8.233 8.233 0 010 16.407a11.616 11.616 0 006.29 1.84"/>
|
||||
</svg>
|
||||
<span class="hidden sm:inline font-medium">Twitter</span>
|
||||
</a>
|
||||
<a href="https://github.com/psf/requests" target="_blank" class="text-gray-400 hover:text-primary-400 transition-all duration-300 flex items-center space-x-2 group">
|
||||
<svg class="h-6 w-6 group-hover:scale-110 transition-transform" fill="currentColor" viewBox="0 0 20 20">
|
||||
<path d="M10 2L3 7v11h14V7l-7-5z"/>
|
||||
</svg>
|
||||
<span class="hidden sm:inline font-medium">Requests</span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- Copyright -->
|
||||
<div class="border-t border-gray-800/40 pt-8">
|
||||
<p class="text-sm text-gray-500">
|
||||
© 2024 Kenneth Reitz. Crafted with passion for beautiful, human-centered design.
|
||||
</p>
|
||||
<p class="text-xs text-gray-600 mt-2">
|
||||
"Beautiful is better than ugly. Simple is better than complex."
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
{% block extra_scripts %}
|
||||
<script src="https://d3js.org/d3.v7.min.js"></script>
|
||||
<script>
|
||||
class ObsidianMindmap {
|
||||
@@ -1047,8 +1220,46 @@ class ObsidianMindmap {
|
||||
}
|
||||
}
|
||||
|
||||
// Real-time download counter
|
||||
function initDownloadCounter() {
|
||||
const downloadsPerSecond = 16000000 / (24 * 60 * 60); // 16M per day
|
||||
const startOfDay = new Date();
|
||||
startOfDay.setHours(0, 0, 0, 0);
|
||||
const now = new Date();
|
||||
const secondsSinceStartOfDay = (now - startOfDay) / 1000;
|
||||
|
||||
let currentDownloads = Math.floor(secondsSinceStartOfDay * downloadsPerSecond);
|
||||
|
||||
const counter = document.getElementById('live-downloads');
|
||||
|
||||
function updateCounter() {
|
||||
currentDownloads += downloadsPerSecond;
|
||||
const displayNumber = Math.floor(currentDownloads);
|
||||
|
||||
// Format with commas
|
||||
counter.textContent = displayNumber.toLocaleString();
|
||||
|
||||
// Add a subtle glow effect when updating
|
||||
counter.style.transform = 'scale(1.05)';
|
||||
counter.style.filter = 'brightness(1.2)';
|
||||
setTimeout(() => {
|
||||
counter.style.transform = 'scale(1)';
|
||||
counter.style.filter = 'brightness(1)';
|
||||
}, 200);
|
||||
}
|
||||
|
||||
// Initial display
|
||||
updateCounter();
|
||||
|
||||
// Update every second
|
||||
setInterval(updateCounter, 1000);
|
||||
}
|
||||
|
||||
// Initialize the mindmap when the page loads
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
new ObsidianMindmap();
|
||||
initDownloadCounter();
|
||||
});
|
||||
</script>
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user