feat: apply back-pill class to story footer back link

Apply the .back-pill class to the story footer back link and add
:not(.back-pill) guard to .story-footer a rule to prevent the accent
color override. This ensures the back pill maintains its design system
styling (border, background, text color) in story footers.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01WPJztrVGbwic2xTG7G9fjM
This commit is contained in:
2026-06-20 12:23:53 +02:00
parent d0c821588e
commit 26182ec363
2 changed files with 2 additions and 2 deletions
+1 -1
View File
@@ -1183,7 +1183,7 @@ body::after {
padding-top: var(--space-8); padding-top: var(--space-8);
border-top: 1px solid var(--color-border); border-top: 1px solid var(--color-border);
} }
.story-footer a { .story-footer a:not(.back-pill) {
font-family: var(--font-ui); font-family: var(--font-ui);
font-size: var(--text-sm); font-size: var(--text-sm);
color: var(--color-accent); color: var(--color-accent);
+1 -1
View File
@@ -58,7 +58,7 @@
{{ page.content|raw }} {{ page.content|raw }}
<footer class="story-footer"> <footer class="story-footer">
<a href="{{ page.parent().url }}" onclick="if(history.length > 1){ history.back(); return false; }">← Back</a> <a class="back-pill" href="{{ page.parent().url }}" onclick="if(history.length > 1){ history.back(); return false; }">← Back</a>
</footer> </footer>
</div> </div>