wisecolt/dupe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(ui): mini player düzenlemesi

Browse Source 
Kullanıcı meta verilerini kapağın altına taşıyarak mini player'ın düzenini yeniden düzenledi. Paylaş ve beğen butonlarını kaldırdı.
This commit is contained in:
wisecolt
2026-02-03 17:20:58 +03:00
parent 7753b68578
commit 90f6291e14
1 changed files with 10 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
client/src/components/MiniPlayer.svelte
View File

@@ -55,23 +55,7 @@
{#if $musicPlayer.currentTrack && !isMusicRoute} {#if $musicPlayer.currentTrack && !isMusicRoute}
<div class="mini-player" aria-label="Mini music player"> <div class="mini-player" aria-label="Mini music player">
<div class="mini-top"> <div class="mini-top"></div>
<div class="mini-user-meta">
<div class="mini-user-name">
{cleanFileName($musicPlayer.currentTrack.title)}
</div>
<div class="mini-user-handle">{sourceLabel($musicPlayer.currentTrack)}</div>
</div>
<div class="mini-actions">
<button class="mini-icon-btn" title="Paylaş">
<i class="fa-solid fa-arrow-up-from-bracket"></i>
</button>
<button class="mini-icon-btn" title="Beğen">
<i class="fa-regular fa-heart"></i>
</button>
</div>
</div>
<div class="mini-cover"> <div class="mini-cover">
{#if $musicPlayer.isPlaying && videoStreamURL($musicPlayer.currentTrack)} {#if $musicPlayer.isPlaying && videoStreamURL($musicPlayer.currentTrack)}
@@ -93,6 +77,12 @@
</div> </div>
{/if} {/if}
</div> </div>
<div class="mini-meta">
<div class="mini-user-name">
{cleanFileName($musicPlayer.currentTrack.title)}
</div>
<div class="mini-user-handle">{sourceLabel($musicPlayer.currentTrack)}</div>
</div>
<div class="mini-progress"> <div class="mini-progress">
<span class="mini-time">{formatTime($musicPlayer.currentTime)}</span> <span class="mini-time">{formatTime($musicPlayer.currentTime)}</span>
@@ -145,15 +135,12 @@
} }
.mini-top { .mini-top {
display: flex; min-height: 0;
align-items: center;
justify-content: space-between;
gap: 10px;
} }
.mini-user-meta { .mini-meta {
min-width: 0;
text-align: left; text-align: left;
margin: 0 4px 8px;
} }
.mini-user-name { .mini-user-name {
@@ -169,21 +156,6 @@
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }
.mini-actions {
display: flex;
gap: 8px;
}
.mini-icon-btn {
width: 32px;
height: 32px;
border-radius: 12px;
border: none;
background: rgba(255, 255, 255, 0.12);
color: #f6f6f6;
cursor: pointer;
}
.mini-cover { .mini-cover {
margin: 14px auto 12px; margin: 14px auto 12px;
width: 160px; width: 160px;