diff --git a/index.html b/index.html
index b2a1276..20c6a34 100644
--- a/index.html
+++ b/index.html
@@ -174,7 +174,7 @@
align-items: center;
justify-content: center;
gap: 6px;
- min-height: 22px;
+ min-height: 24px;
padding: 2px 8px;
border-radius: 999px;
background: var(--diff-color, rgba(255,255,255,0.16));
@@ -189,8 +189,8 @@
}
.difficulty-char-icon {
- width: 14px;
- height: 14px;
+ width: 18px;
+ height: 18px;
display: block;
color: #fff;
flex-shrink: 0;
@@ -216,10 +216,8 @@
/* === ШИРОКИЙ PROGRESS BAR === */
#stats-row {
display: flex;
- padding-top: 5px;
- border-top: 1px dashed rgba(255,255,255,0.1);
- margin-top: 2px;
width: 100%;
+ align-self: stretch;
}
#progress-wrapper {
@@ -322,7 +320,12 @@
#miss-val { color: var(--neon-red); text-shadow: 0 0 8px rgba(255, 59, 59, 0.6), 1px 1px 2px #000; }
.stat-item.acc-large .label { font-size: 14px; }
- .stat-item.acc-large #acc-num { font-size: 32px; color: #fff; }
+ .stat-item.acc-large #acc-num {
+ font-size: 32px;
+ color: #fff;
+ -webkit-text-stroke: 0.6px rgba(0, 0, 0, 0.7);
+ text-shadow: 0 1px 2px rgba(0, 0, 0, 0.55);
+ }
.stat-item.acc-large #acc-grade { font-size: 32px; }
#bl-wrapper {
@@ -348,13 +351,29 @@
.bl-stat-compact {
font-size: 13px;
- color: #ccc;
+ font-weight: 700;
+ color: #fff !important;
+ text-shadow:
+ -1px -1px 0 rgba(0, 0, 0, 0.45),
+ 1px -1px 0 rgba(0, 0, 0, 0.45),
+ -1px 1px 0 rgba(0, 0, 0, 0.45),
+ 1px 1px 0 rgba(0, 0, 0, 0.45),
+ 0 1px 2px rgba(0, 0, 0, 0.4);
}
.bl-stat-compact span {
color: var(--neon-cyan);
font-weight: bold;
- text-shadow: 0 0 5px rgba(0,255,255,0.5);
+ text-shadow: 0 0 5px rgba(0,255,255,0.5), 0 1px 2px rgba(0, 0, 0, 0.5);
+ }
+
+ .bl-country-flag {
+ width: 16px;
+ height: 12px;
+ margin-left: 6px;
+ border-radius: 2px;
+ vertical-align: -1px;
+ box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.25);
}
/* === МЕНЮ НАСТРОЕК === */
@@ -475,11 +494,12 @@
-
+
+
@@ -747,7 +767,7 @@
function renderBLPlayer(player) {
els.blName.textContent = player.name || 'Unknown';
els.blGlobal.textContent = player.rank ? `#${player.rank.toLocaleString()}` : '#--';
- els.blLocal.textContent = player.countryRank ? `#${player.countryRank.toLocaleString()} (${player.country || 'N/A'})` : '#-- (N/A)';
+ els.blLocal.innerHTML = formatBLLocal(player.countryRank, player.country);
els.blPp.textContent = player.pp ? `${Math.round(player.pp).toLocaleString()} pp` : '-- pp';
if (player.avatar) {
@@ -759,6 +779,17 @@
}
}
+ function formatBLLocal(countryRank, country) {
+ if (!(countryRank > 0)) return '#--';
+
+ const rankText = `#${countryRank.toLocaleString()}`;
+ const countryCode = String(country || '').trim().toUpperCase();
+ if (!/^[A-Z]{2}$/.test(countryCode)) return rankText;
+
+ const flagUrl = `https://flagcdn.com/20x15/${countryCode.toLowerCase()}.png`;
+ return `${rankText}
`;
+ }
+
function normalizeName(value) {
return String(value || '').trim().toLowerCase().replace(/\s+/g, ' ');
}
@@ -1050,7 +1081,7 @@
els.statsRow.style.display = config.showProgress ? 'flex' : 'none';
- const showTopPanel = showHeader || config.showProgress;
+ const showTopPanel = showHeader;
els.topGlassPanel.style.display = showTopPanel ? 'flex' : 'none';
els.hpBarWrapper.style.display = config.showHp ? 'flex' : 'none';
@@ -1170,12 +1201,27 @@
function getCharacteristicIconSvg(characteristic) {
const normalized = normalizeCharacteristic(characteristic);
- const icons = {
- standard: '',
- onesaber: '',
- lawless: ''
+ const iconMap = {
+ standard: 'standard',
+ onesaber: 'onesaber',
+ noarrows: 'noarrows',
+ rotation90degree: '90degree',
+ degree90: '90degree',
+ _90degree: '90degree',
+ '90degree': '90degree',
+ rotation360degree: '360degree',
+ degree360: '360degree',
+ _360degree: '360degree',
+ '360degree': '360degree',
+ lightshow: 'lightshow',
+ lawless: 'lawless',
+ legacy: 'legacy'
};
- return icons[normalized] || '';
+
+ const icon = iconMap[normalized];
+ if (!icon) return '';
+
+ return `
`;
}
function formatCharacteristicBadge(characteristic) {