Fix results overflow and add debug logging for reference badges
CSS Changes: - Added max-width and overflow handling to .badge-row - Added word-wrap and overflow protection to .item - Added overflow-x: hidden to .window-body - Badges now use white-space: nowrap to prevent text wrapping - Item titles now break words properly with word-break JavaScript Changes: - Added console.log debugging for reference counts - Logs show whether fields are present and their values - Helps diagnose why badges aren't appearing This should fix the overflow issue and help debug badge visibility. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
parent
595b19f7c7
commit
d8d2c5e34c
@ -995,6 +995,18 @@ async function updateFrequencyChart(term, channels, year, queryMode) {
|
|||||||
// Add reference count badges
|
// Add reference count badges
|
||||||
const refByCount = item.referenced_by_count || 0;
|
const refByCount = item.referenced_by_count || 0;
|
||||||
const refToCount = item.internal_references_count || 0;
|
const refToCount = item.internal_references_count || 0;
|
||||||
|
|
||||||
|
// Debug: log reference counts for first item
|
||||||
|
if (badges.length === 0 || badges.length <= 2) {
|
||||||
|
console.log('Reference counts:', {
|
||||||
|
title: item.title,
|
||||||
|
referenced_by_count: refByCount,
|
||||||
|
internal_references_count: refToCount,
|
||||||
|
hasReferencedBy: 'referenced_by_count' in item,
|
||||||
|
hasInternalRefs: 'internal_references_count' in item
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
if (refByCount > 0) badges.push(`${refByCount} backlink${refByCount !== 1 ? 's' : ''}`);
|
if (refByCount > 0) badges.push(`${refByCount} backlink${refByCount !== 1 ? 's' : ''}`);
|
||||||
if (refToCount > 0) badges.push(`${refToCount} reference${refToCount !== 1 ? 's' : ''}`);
|
if (refToCount > 0) badges.push(`${refToCount} reference${refToCount !== 1 ? 's' : ''}`);
|
||||||
|
|
||||||
|
|||||||
@ -168,18 +168,34 @@ body.dimmed {
|
|||||||
border-bottom: 1px solid ButtonShadow;
|
border-bottom: 1px solid ButtonShadow;
|
||||||
padding: 12px 0;
|
padding: 12px 0;
|
||||||
margin-bottom: 8px;
|
margin-bottom: 8px;
|
||||||
|
max-width: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
word-wrap: break-word;
|
||||||
}
|
}
|
||||||
|
|
||||||
#results .item:last-child {
|
#results .item:last-child {
|
||||||
border-bottom: none;
|
border-bottom: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#results .item strong {
|
||||||
|
word-break: break-word;
|
||||||
|
max-width: 100%;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.window-body {
|
||||||
|
max-width: 100%;
|
||||||
|
overflow-x: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
/* Badges */
|
/* Badges */
|
||||||
.badge-row {
|
.badge-row {
|
||||||
margin-top: 6px;
|
margin-top: 6px;
|
||||||
display: flex;
|
display: flex;
|
||||||
gap: 4px;
|
gap: 4px;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
|
max-width: 100%;
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
.badge {
|
.badge {
|
||||||
@ -189,6 +205,8 @@ body.dimmed {
|
|||||||
padding: 2px 6px;
|
padding: 2px 6px;
|
||||||
font-size: 10px;
|
font-size: 10px;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
|
white-space: nowrap;
|
||||||
|
word-break: keep-all;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Transcript and highlights */
|
/* Transcript and highlights */
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user