svemagie.net/indiekit-blog
1
0
Fork 0
Code Issues Actions Packages Projects Releases Activity

fix: prevent overflow on mobile in featured repos commits list

Browse Source 
Add overflow-hidden and min-w-0 to fix truncation issues on mobile.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Ricardo
2026-01-24 20:36:55 +01:00
parent 9a0c1a5111
commit 5be3d02be3
1 changed files with 4 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
github.njk
+4 -4
View File
@@ -67,17 +67,17 @@ withSidebar: true
</div> </div>
{% if repo.commits and repo.commits.length %} {% if repo.commits and repo.commits.length %}
<details class="border-t border-primary-200 dark:border-surface-700 pt-3 mt-3"> <details class="border-t border-primary-200 dark:border-surface-700 pt-3 mt-3 overflow-hidden">
<summary class="cursor-pointer text-sm font-medium text-primary-600 dark:text-primary-400 hover:underline"> <summary class="cursor-pointer text-sm font-medium text-primary-600 dark:text-primary-400 hover:underline">
Recent commits ({{ repo.commits.length }}) Recent commits ({{ repo.commits.length }})
</summary> </summary>
<ul class="mt-3 space-y-2"> <ul class="mt-3 space-y-2 overflow-hidden">
{% for commit in repo.commits %} {% for commit in repo.commits %}
<li class="flex items-start gap-2 text-sm"> <li class="flex items-start gap-2 text-sm min-w-0">
<code class="flex-shrink-0 text-xs font-mono bg-surface-100 dark:bg-surface-700 px-1.5 py-0.5 rounded"> <code class="flex-shrink-0 text-xs font-mono bg-surface-100 dark:bg-surface-700 px-1.5 py-0.5 rounded">
<a href="{{ commit.url }}" class="text-primary-600 dark:text-primary-400 hover:underline" target="_blank" rel="noopener">{{ commit.sha }}</a> <a href="{{ commit.url }}" class="text-primary-600 dark:text-primary-400 hover:underline" target="_blank" rel="noopener">{{ commit.sha }}</a>
</code> </code>
<span class="text-surface-700 dark:text-surface-300 truncate">{{ commit.message }}</span> <span class="text-surface-700 dark:text-surface-300 truncate min-w-0 flex-1">{{ commit.message }}</span>
</li> </li>
{% endfor %} {% endfor %}
</ul> </ul>