fix: wrap SOL price + wallet in shared flex group to eliminate space-between gap

This commit is contained in:
jae 2026-04-06 20:48:44 +00:00
parent 090481cde0
commit 56e01f3f52
2 changed files with 44 additions and 27 deletions

View file

@ -329,6 +329,13 @@ a:hover { color: #fff; text-shadow: none; }
}
/* === NAV SOL + WALLET GROUP === */
.nav-sol-wallet-group {
display: flex;
align-items: center;
gap: 3px;
}
/* === NAV SOL PRICE TICKER === */
.nav-sol-price {
display: flex;
@ -343,7 +350,7 @@ a:hover { color: #fff; text-shadow: none; }
background: rgba(153, 69, 255, 0.08);
border: 1px solid rgba(153, 69, 255, 0.25);
border-radius: 4px;
margin-right: 2px;
margin-right: 0;
white-space: nowrap;
cursor: default;
transition: all 0.3s ease;
@ -390,7 +397,7 @@ a:hover { color: #fff; text-shadow: none; }
display: flex;
align-items: center;
margin-left: 0;
margin-right: 0.5rem;
margin-right: 0;
}
.nav-wallet-btn {

View file

@ -86,9 +86,8 @@
// Bind mobile dropdown toggles after rendering
initMobileDropdowns();
// Inject SOL price ticker and wallet button after nav loads
injectSolPrice();
injectWalletButton();
// Inject shared wrapper for SOL price + wallet, then inject both
injectSolWalletGroup();
} catch (err) {
console.warn('Nav load failed, keeping existing:', err);
}
@ -151,10 +150,35 @@
}
}
// ─── SOL Price Ticker ──────────────────────────────────────
function injectSolPrice() {
// ─── SOL + Wallet Group Wrapper ────────────────────────────
function injectSolWalletGroup() {
const navContainer = document.querySelector('.nav-container');
if (!navContainer || document.getElementById('navSolPrice')) return;
const navStatus = document.querySelector('.nav-status');
if (!navContainer) return;
// Don't inject twice
if (document.getElementById('navSolWalletGroup')) return;
// Create shared wrapper
const group = document.createElement('div');
group.id = 'navSolWalletGroup';
group.className = 'nav-sol-wallet-group';
// Insert before nav-status
if (navStatus) {
navContainer.insertBefore(group, navStatus);
} else {
navContainer.appendChild(group);
}
// Now inject SOL price and wallet into the group
injectSolPrice(group);
injectWalletButton(group);
}
// ─── SOL Price Ticker ──────────────────────────────────────
function injectSolPrice(parent) {
if (!parent || document.getElementById('navSolPrice')) return;
const wrap = document.createElement('div');
wrap.id = 'navSolPrice';
@ -166,15 +190,7 @@
<span class="sol-price-change" id="solPriceChange"></span>
`;
// Insert before wallet wrap or nav-status
const walletWrap = document.getElementById('navWalletWrap');
const navStatus = document.querySelector('.nav-status');
const insertBefore = walletWrap || navStatus;
if (insertBefore) {
navContainer.insertBefore(wrap, insertBefore);
} else {
navContainer.appendChild(wrap);
}
parent.appendChild(wrap);
fetchSolPrice();
setInterval(fetchSolPrice, 30000);
@ -222,10 +238,8 @@
// ─── Wallet Button Injection ────────────────────────────────
function injectWalletButton() {
const navContainer = document.querySelector('.nav-container');
const navStatus = document.querySelector('.nav-status');
if (!navContainer) return;
function injectWalletButton(parent) {
if (!parent) return;
// Don't inject twice
if (document.getElementById('navWalletWrap')) return;
@ -242,12 +256,8 @@
<div class="nav-wallet-dropdown hidden" id="navWalletDropdown"></div>
`;
// Insert before nav-status (or append to container)
if (navStatus) {
navContainer.insertBefore(wrap, navStatus);
} else {
navContainer.appendChild(wrap);
}
parent.appendChild(wrap);
// Bind click
const btn = document.getElementById('navWalletBtn');