mirror of
https://github.com/kennethreitz/photos.kennethreitz.org.git
synced 2026-06-21 15:10:56 +00:00
kennethreitz
dbdbdea109
- Add Inter font via Google Fonts with proper preconnect - Nav: backdrop-filter blur with semi-transparent background - Image cards: hover-reveal overlay, inner zoom, shadow on hover - Gear/collection cards: hover lift with shadow - EXIF bar: rounded card style instead of bordered lines - Search inputs: accent focus glow ring - Homepage: display site tagline, more generous hero spacing - View Transitions API for smooth cross-page fades (Chrome 126+) - Animated loading pulse for infinite scroll - Global: smooth scroll, accent selection color, focus-visible - Radius 6px→8px, font smoothing, CSS custom properties - Fix stray </div> in base template - Disable hover transforms on mobile Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
24 lines
1.2 KiB
HTML
24 lines
1.2 KiB
HTML
{% extends "base.html" %}
|
|
{% block title %}{{ site_title }}{% if site_tagline %} — {{ site_tagline }}{% endif %}{% endblock %}
|
|
{% block head %}
|
|
<link rel="alternate" type="application/json+oembed" href="https://photos.kennethreitz.org/oembed?url=https://photos.kennethreitz.org/&format=json" title="{{ site_title }}">
|
|
{% endblock %}
|
|
{% block content %}
|
|
<div style="text-align: center; padding: 3rem 0 2rem;">
|
|
<h1 style="font-size: 2.5rem; font-weight: 700; letter-spacing: -0.04em;">{{ site_title }}</h1>
|
|
{% if site_tagline %}<p style="color: var(--text-muted); margin-top: 0.35rem; font-size: 1.05rem; letter-spacing: -0.01em;">{{ site_tagline }}</p>{% endif %}
|
|
<div style="margin-top: 1rem;">
|
|
<div style="display: flex; flex-wrap: wrap; gap: 0.4rem; justify-content: center;">
|
|
<a href="/" class="brand-pill {% if not selected_year %}brand-pill-active{% endif %}">All</a>
|
|
{% for y in years %}
|
|
<a href="/?year={{ y }}" class="brand-pill {% if selected_year == y|stringformat:'d' %}brand-pill-active{% endif %}">{{ y }}</a>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="image-grid" style="grid-template-columns: repeat(4, 1fr);">
|
|
{% include "includes/image_grid_page.html" %}
|
|
</div>
|
|
{% endblock %}
|