nucleo000/RepoDructor
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

mejoras de ui 3

Browse Source
This commit is contained in:
josedario87
2025-08-10 01:40:56 -06:00
parent bf7413b45f
commit ba70e0d280
1 changed files with 15 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
components/MusicControls.client.vue
View File

@@ -238,7 +238,7 @@ onMounted(() => {
<style scoped> <style scoped>
.music-controls { .music-controls {
position: fixed; position: fixed;
bottom: 80px; bottom: 10px;
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
backdrop-filter: blur(40px); backdrop-filter: blur(40px);
@@ -252,7 +252,11 @@ onMounted(() => {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 12px; gap: 12px;
transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); transition: min-width 0.4s cubic-bezier(0.4, 0, 0.2, 1),
max-width 0.4s cubic-bezier(0.4, 0, 0.2, 1),
padding 0.4s cubic-bezier(0.4, 0, 0.2, 1),
border-radius 0.4s cubic-bezier(0.4, 0, 0.2, 1),
bottom 0.4s cubic-bezier(0.4, 0, 0.2, 1);
} }
.music-controls.collapsed { .music-controls.collapsed {
@@ -260,7 +264,7 @@ onMounted(() => {
max-width: 450px; max-width: 450px;
padding: 12px 16px; padding: 12px 16px;
border-radius: 16px; border-radius: 16px;
bottom: -10px; bottom: 2px;
} }
/* Collapsed State Styles */ /* Collapsed State Styles */
@@ -307,9 +311,7 @@ onMounted(() => {
flex-shrink: 0; flex-shrink: 0;
} }
.music-controls { /* .music-controls is fixed earlier; avoid overriding with relative */
position: relative;
}
.collapse-btn-compact { .collapse-btn-compact {
position: absolute; position: absolute;
@@ -568,6 +570,12 @@ onMounted(() => {
.music-controls.collapsed { .music-controls.collapsed {
padding: 10px 12px; padding: 10px 12px;
border-radius: 12px; border-radius: 12px;
bottom: 2px;
left: 50%;
right: auto;
transform: translateX(-50%);
width: calc(100% - 40px);
max-width: 450px;
} }
.collapsed-track-name { .collapsed-track-name {