Cametendo/devil-fruit-encyclopedia
1
0
Fork 0
mirror of https://github.com/Cametendo/devil-fruit-encyclopedia.git synced 2026-09-13 15:59:48 +02:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #6 from Cametendo/codex/add-images-for-characters-and-devil-fruits-q49vz4

Browse Source 
Load wiki thumbnails for portraits and refine character bounty/rank labels
This commit is contained in:
Cametendo
2026-08-15 02:07:53 +02:00
committed by GitHub
parent 266925ff4a 47d40c0cc6
commit 84d3be478e
3 changed files with 16 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
css/styles.css
View File

@@ -811,10 +811,10 @@ p { margin: 0 0 1em; color: var(--text-muted); }
} }
.proper-image--fruit .proper-image__img { .proper-image--fruit .proper-image__img {
object-fit: contain; object-fit: cover;
object-position: center; object-position: center;
padding: 8%; padding: 0;
background: radial-gradient(circle at 50% 45%, rgba(255,255,255,0.08), #0b1220 70%); background: #0b1220;
} }
.proper-image.is-loaded .proper-image__fallback { opacity: 0; } .proper-image.is-loaded .proper-image__fallback { opacity: 0; }

14
js/app.js
View File

@@ -74,6 +74,16 @@ function statusBadgeClass(status) {
return 'badge--unknown'; return 'badge--unknown';
} }
function characterPosterLabel(c) {
if (c.bounty !== null && c.bounty !== undefined) return 'WANTED';
if (/marine/i.test(c.affiliation || '')) return 'MARINE';
return (c.affiliation || c.role || 'UNKNOWN').split(/[/(]/)[0].trim().toUpperCase();
}
function characterBountyOrRank(c) {
return c.bounty !== null && c.bounty !== undefined ? formatBounty(c.bounty) : c.role || 'Rank unknown';
}
function characterCardHTML(c) { function characterCardHTML(c) {
const accent = accentFor(c); const accent = accentFor(c);
const deadRibbon = /deceased/i.test(c.status || '') ? '<span class="char-card__status">Deceased</span>' : ''; const deadRibbon = /deceased/i.test(c.status || '') ? '<span class="char-card__status">Deceased</span>' : '';
@@ -83,13 +93,13 @@ function characterCardHTML(c) {
<a href="${characterLink(c.id)}" aria-label="View ${escapeHtml(c.name)}"> <a href="${characterLink(c.id)}" aria-label="View ${escapeHtml(c.name)}">
<div class="char-card__poster"> <div class="char-card__poster">
${deadRibbon} ${deadRibbon}
<span class="char-card__wanted">WANTED</span> <span class="char-card__wanted">${escapeHtml(characterPosterLabel(c))}</span>
<div class="char-card__avatar">${characterPortraitSVG(c)}</div> <div class="char-card__avatar">${characterPortraitSVG(c)}</div>
</div> </div>
<div class="char-card__body"> <div class="char-card__body">
<h3>${escapeHtml(c.name)}</h3> <h3>${escapeHtml(c.name)}</h3>
<p class="char-card__epithet">${c.epithet ? '"' + escapeHtml(c.epithet) + '"' : ' '}</p> <p class="char-card__epithet">${c.epithet ? '"' + escapeHtml(c.epithet) + '"' : ' '}</p>
<p class="char-card__bounty">${c.bounty ? formatBounty(c.bounty) : 'Bounty Unknown'}</p> <p class="char-card__bounty">${escapeHtml(characterBountyOrRank(c))}</p>
<div class="char-card__tags"> <div class="char-card__tags">
<span class="tag">${escapeHtml(c.affiliation)}</span> <span class="tag">${escapeHtml(c.affiliation)}</span>
${fruitTag} ${fruitTag}

2
js/character.js
View File

@@ -42,7 +42,7 @@
<p class="profile-epithet">${character.epithet ? '"' + escapeHtml(character.epithet) + '"' : ''}</p> <p class="profile-epithet">${character.epithet ? '"' + escapeHtml(character.epithet) + '"' : ''}</p>
<div class="profile-badges"> <div class="profile-badges">
<span class="badge ${statusBadgeClass(character.status)}">${escapeHtml(character.status || 'Unknown')}</span> <span class="badge ${statusBadgeClass(character.status)}">${escapeHtml(character.status || 'Unknown')}</span>
<span class="badge badge--bounty">${character.bounty ? formatBounty(character.bounty) : 'Bounty Unknown'}</span> <span class="badge badge--bounty">${escapeHtml(characterBountyOrRank(character))}</span>
${fruit ? `<span class="badge" data-cat="${escapeHtml(fruit.category)}" style="color:var(--cat-color)">${escapeHtml(fruit.category)} User</span>` : ''} ${fruit ? `<span class="badge" data-cat="${escapeHtml(fruit.category)}" style="color:var(--cat-color)">${escapeHtml(fruit.category)} User</span>` : ''}
</div> </div>
</div> </div>