97 lines
4.7 KiB
HTML
97 lines
4.7 KiB
HTML
<!-- Profile Modal Component -->
|
|
<div id="profile-modal" class="profile-modal" style="display: none;">
|
|
<div class="profile-modal-backdrop"></div>
|
|
<div class="profile-modal-content">
|
|
<button class="profile-modal-close" aria-label="Close" onclick="if(window.ProfileModal){window.ProfileModal.close();}">×</button>
|
|
|
|
<div class="profile-modal-loading" id="profile-modal-loading">
|
|
<div class="loading-spinner"></div>
|
|
<p>Loading profile...</p>
|
|
</div>
|
|
|
|
<div class="profile-modal-error" id="profile-modal-error" style="display: none;">
|
|
<p>Failed to load profile</p>
|
|
</div>
|
|
|
|
<div class="profile-modal-body" id="profile-modal-body" style="display: none;">
|
|
<div class="profile-modal-header">
|
|
<div class="profile-modal-avatar-container">
|
|
<img id="profile-modal-avatar" class="profile-modal-avatar" alt="Avatar" onerror="this.style.display='none'; document.getElementById('profile-modal-avatar-placeholder').style.display='flex';">
|
|
<div id="profile-modal-avatar-placeholder" class="profile-modal-avatar-placeholder" style="display: none;">
|
|
<svg width="64" height="64" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path>
|
|
<circle cx="12" cy="7" r="4"></circle>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
<div class="profile-modal-header-info">
|
|
<h2 id="profile-modal-name" class="profile-modal-name">Loading...</h2>
|
|
<p id="profile-modal-peerid" class="profile-modal-peerid">...</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="profile-modal-bio" id="profile-modal-bio-container" style="display: none;">
|
|
<p id="profile-modal-bio" class="profile-modal-bio-text"></p>
|
|
</div>
|
|
|
|
<div class="profile-modal-tags" id="profile-modal-tags-container" style="display: none;">
|
|
<div class="profile-modal-tags-label">Tags</div>
|
|
<div class="profile-modal-tags-list" id="profile-modal-tags-list"></div>
|
|
</div>
|
|
|
|
<div class="profile-modal-details" id="profile-modal-details">
|
|
<div class="profile-modal-detail-item" id="profile-modal-email-item" style="display: none;">
|
|
<span class="profile-modal-detail-icon">📧</span>
|
|
<a id="profile-modal-email" href="#" class="profile-modal-detail-link"></a>
|
|
</div>
|
|
<div class="profile-modal-detail-item" id="profile-modal-website-item" style="display: none;">
|
|
<span class="profile-modal-detail-icon">🌐</span>
|
|
<a id="profile-modal-website" href="#" target="_blank" rel="noopener noreferrer" class="profile-modal-detail-link"></a>
|
|
</div>
|
|
<div class="profile-modal-detail-item" id="profile-modal-x-item" style="display: none;">
|
|
<span class="profile-modal-detail-icon">🐦</span>
|
|
<a id="profile-modal-x" href="#" target="_blank" rel="noopener noreferrer" class="profile-modal-detail-link"></a>
|
|
</div>
|
|
<div class="profile-modal-detail-item" id="profile-modal-github-item" style="display: none;">
|
|
<span class="profile-modal-detail-icon">💻</span>
|
|
<a id="profile-modal-github" href="#" target="_blank" rel="noopener noreferrer" class="profile-modal-detail-link"></a>
|
|
</div>
|
|
<div class="profile-modal-detail-item" id="profile-modal-discord-item" style="display: none;">
|
|
<span class="profile-modal-detail-icon">💬</span>
|
|
<span id="profile-modal-discord" class="profile-modal-detail-text"></span>
|
|
</div>
|
|
<div class="profile-modal-detail-item" id="profile-modal-location-item" style="display: none;">
|
|
<span class="profile-modal-detail-icon">📍</span>
|
|
<span id="profile-modal-location" class="profile-modal-detail-text"></span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="profile-modal-actions" id="profile-modal-actions" style="display: none;">
|
|
<button id="profile-modal-block-btn" class="profile-modal-action-btn profile-modal-action-btn-block" style="display: none;">
|
|
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<circle cx="12" cy="12" r="10"></circle>
|
|
<line x1="4.93" y1="4.93" x2="19.07" y2="19.07"></line>
|
|
</svg>
|
|
Block
|
|
</button>
|
|
<button id="profile-modal-unblock-btn" class="profile-modal-action-btn profile-modal-action-btn-unblock" style="display: none;">
|
|
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<circle cx="12" cy="12" r="10"></circle>
|
|
<path d="M12 6v6l4 2"></path>
|
|
</svg>
|
|
Unblock
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|