mirror of
https://github.com/Cametendo/devil-fruit-encyclopedia.git
synced 2026-09-13 15:59:48 +02:00
Merge pull request #6 from Cametendo/codex/add-images-for-characters-and-devil-fruits-q49vz4
Load wiki thumbnails for portraits and refine character bounty/rank labels
This commit is contained in:
@@ -811,10 +811,10 @@ p { margin: 0 0 1em; color: var(--text-muted); }
|
||||
}
|
||||
|
||||
.proper-image--fruit .proper-image__img {
|
||||
object-fit: contain;
|
||||
object-fit: cover;
|
||||
object-position: center;
|
||||
padding: 8%;
|
||||
background: radial-gradient(circle at 50% 45%, rgba(255,255,255,0.08), #0b1220 70%);
|
||||
padding: 0;
|
||||
background: #0b1220;
|
||||
}
|
||||
|
||||
.proper-image.is-loaded .proper-image__fallback { opacity: 0; }
|
||||
|
||||
14
js/app.js
14
js/app.js
@@ -74,6 +74,16 @@ function statusBadgeClass(status) {
|
||||
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) {
|
||||
const accent = accentFor(c);
|
||||
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)}">
|
||||
<div class="char-card__poster">
|
||||
${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>
|
||||
<div class="char-card__body">
|
||||
<h3>${escapeHtml(c.name)}</h3>
|
||||
<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">
|
||||
<span class="tag">${escapeHtml(c.affiliation)}</span>
|
||||
${fruitTag}
|
||||
|
||||
@@ -42,7 +42,7 @@
|
||||
<p class="profile-epithet">${character.epithet ? '"' + escapeHtml(character.epithet) + '"' : ''}</p>
|
||||
<div class="profile-badges">
|
||||
<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>` : ''}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user