m038/intotheeast-com-content
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: collapse entry card article+a to flat <a>, unify hover targets across card types

Browse Source 
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01WPJztrVGbwic2xTG7G9fjM
This commit is contained in:
Mischa
2026-06-20 12:38:28 +02:00
parent ca283d621a
commit 2a151b710c
3 changed files with 14 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files
themes/intotheeast/css/style.css
+6 -5
View File
@@ -90,12 +90,13 @@ body::after {
.feed { display: flex; flex-direction: column; gap: var(--space-12); } .feed { display: flex; flex-direction: column; gap: var(--space-12); }
.feed-empty { color: var(--color-ink-muted); font-style: italic; } .feed-empty { color: var(--color-ink-muted); font-style: italic; }
.entry-card { border-bottom: 1px solid var(--color-border); padding-bottom: var(--space-12); } .entry-card {
.entry-card-inner {
display: block; display: block;
text-decoration: none; text-decoration: none;
color: inherit; color: inherit;
border-bottom: 1px solid var(--color-border);
padding-bottom: var(--space-12);
transition: background 0.15s;
} }
/* Card: photo variant */ /* Card: photo variant */
@@ -117,7 +118,7 @@ body::after {
transition: transform 0.45s ease; transition: transform 0.45s ease;
} }
.entry-card-inner:hover .entry-card-photo img { transform: scale(1.04); } .entry-card:hover .entry-card-photo img { transform: scale(1.04); }
.entry-card-photo-overlay { .entry-card-photo-overlay {
position: absolute; position: absolute;
@@ -180,7 +181,7 @@ body::after {
transition: color 0.15s; transition: color 0.15s;
} }
.entry-card-inner:hover .entry-title { color: var(--color-accent); } .entry-card:hover .entry-title { color: var(--color-accent); }
.entry-excerpt { .entry-excerpt {
font-size: var(--text-base); font-size: var(--text-base);
themes/intotheeast/templates/dailies.html.twig
+4 -8
View File
@@ -119,8 +119,7 @@ feedMap.on('load', function () {
{% endif %} {% endif %}
{% if item.type == 'journal' %} {% if item.type == 'journal' %}
<article class="entry-card" id="entry-{{ entry.slug }}" data-lat="{{ entry.header.lat }}" data-lng="{{ entry.header.lng }}"> <a class="entry-card" id="entry-{{ entry.slug }}" data-lat="{{ entry.header.lat }}" data-lng="{{ entry.header.lng }}" href="{{ entry.url }}">
<a class="entry-card-inner" href="{{ entry.url }}">
{% if hero %} {% if hero %}
<div class="entry-card-photo"> <div class="entry-card-photo">
<img src="{{ hero.cropResize(720, 405).url }}" alt="{{ entry.title }}" loading="lazy"> <img src="{{ hero.cropResize(720, 405).url }}" alt="{{ entry.title }}" loading="lazy">
@@ -158,11 +157,9 @@ feedMap.on('load', function () {
<p class="entry-excerpt">{{ entry.summary|striptags|slice(0, 250)|trim }}</p> <p class="entry-excerpt">{{ entry.summary|striptags|slice(0, 250)|trim }}</p>
<span class="entry-read-more">Read entry →</span> <span class="entry-read-more">Read entry →</span>
</div> </div>
</a> </a>
</article>
{% else %} {% else %}
<article class="entry-card entry-card--story" id="entry-{{ entry.slug }}"> <a class="entry-card entry-card--story" id="entry-{{ entry.slug }}" href="{{ entry.url }}">
<a class="entry-card-inner" href="{{ entry.url }}">
{% if hero %} {% if hero %}
<div class="entry-card-photo entry-card-photo--story"> <div class="entry-card-photo entry-card-photo--story">
<img src="{{ hero.cropResize(720, 405).url }}" alt="{{ entry.title }}" loading="lazy"> <img src="{{ hero.cropResize(720, 405).url }}" alt="{{ entry.title }}" loading="lazy">
@@ -172,8 +169,7 @@ feedMap.on('load', function () {
<span class="story-badge">✦ Story</span> <span class="story-badge">✦ Story</span>
<h2 class="entry-title">{{ entry.title }}</h2> <h2 class="entry-title">{{ entry.title }}</h2>
</div> </div>
</a> </a>
</article>
{% endif %} {% endif %}
{% endfor %} {% endfor %}
{% else %} {% else %}
themes/intotheeast/templates/trip.html.twig
+4 -8
View File
@@ -222,8 +222,7 @@
{% endif %} {% endif %}
{% if item.type == 'journal' %} {% if item.type == 'journal' %}
<article class="entry-card" id="entry-{{ entry.slug }}" data-type="journal" data-lat="{{ entry.header.lat }}" data-lng="{{ entry.header.lng }}"> <a class="entry-card" id="entry-{{ entry.slug }}" data-type="journal" data-lat="{{ entry.header.lat }}" data-lng="{{ entry.header.lng }}" href="{{ entry.url }}">
<a class="entry-card-inner" href="{{ entry.url }}">
{% if hero %} {% if hero %}
<div class="entry-card-photo"> <div class="entry-card-photo">
<img src="{{ hero.cropResize(720, 405).url }}" alt="{{ entry.title }}" loading="lazy"> <img src="{{ hero.cropResize(720, 405).url }}" alt="{{ entry.title }}" loading="lazy">
@@ -261,11 +260,9 @@
<p class="entry-excerpt">{{ entry.summary|striptags|slice(0, 250)|trim }}</p> <p class="entry-excerpt">{{ entry.summary|striptags|slice(0, 250)|trim }}</p>
<span class="entry-read-more">Read entry →</span> <span class="entry-read-more">Read entry →</span>
</div> </div>
</a> </a>
</article>
{% else %} {% else %}
<article class="entry-card entry-card--story" id="entry-{{ entry.slug }}" data-type="story"> <a class="entry-card entry-card--story" id="entry-{{ entry.slug }}" data-type="story" href="{{ entry.url }}">
<a class="entry-card-inner" href="{{ entry.url }}">
{% if hero %} {% if hero %}
<div class="entry-card-photo entry-card-photo--story"> <div class="entry-card-photo entry-card-photo--story">
<img src="{{ hero.cropResize(720, 405).url }}" alt="{{ entry.title }}" loading="lazy"> <img src="{{ hero.cropResize(720, 405).url }}" alt="{{ entry.title }}" loading="lazy">
@@ -275,8 +272,7 @@
<span class="story-badge">✦ Story</span> <span class="story-badge">✦ Story</span>
<h2 class="entry-title">{{ entry.title }}</h2> <h2 class="entry-title">{{ entry.title }}</h2>
</div> </div>
</a> </a>
</article>
{% endif %} {% endif %}
{% endfor %} {% endfor %}
{% else %} {% else %}