- Complete redesign with clean, editorial layout focused on content - Removed flashy elements, gradients, and animations for minimal aesthetic - Implemented magazine-style typography using Crimson Text and Inter fonts - Added support for different post types: long-form, photography, and short posts - Created photography-focused layout with proper image handling - Streamlined navigation and removed complex features - Simplified JavaScript to essential functionality only - Perfect for photography, writing, and technology content - Mobile-responsive design maintaining clean aesthetics 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
45 lines
No EOL
1.3 KiB
JavaScript
45 lines
No EOL
1.3 KiB
JavaScript
// Minimal Blog JavaScript
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
// Simple smooth scrolling for anchor links
|
|
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
|
anchor.addEventListener('click', function (e) {
|
|
e.preventDefault();
|
|
const target = document.querySelector(this.getAttribute('href'));
|
|
if (target) {
|
|
target.scrollIntoView({
|
|
behavior: 'smooth',
|
|
block: 'start'
|
|
});
|
|
}
|
|
});
|
|
});
|
|
|
|
// Simple image loading effect
|
|
const images = document.querySelectorAll('img');
|
|
images.forEach(img => {
|
|
img.addEventListener('load', () => {
|
|
img.style.opacity = '1';
|
|
});
|
|
});
|
|
});
|
|
|
|
// Simple focus management for accessibility
|
|
document.addEventListener('keydown', (e) => {
|
|
// Remove focus styles when using mouse
|
|
if (e.key === 'Tab') {
|
|
document.body.classList.add('using-keyboard');
|
|
}
|
|
});
|
|
|
|
document.addEventListener('mousedown', () => {
|
|
document.body.classList.remove('using-keyboard');
|
|
});
|
|
|
|
// Add minimal CSS for focus management
|
|
const style = document.createElement('style');
|
|
style.textContent = `
|
|
body:not(.using-keyboard) *:focus {
|
|
outline: none;
|
|
}
|
|
`;
|
|
document.head.appendChild(style); |