diff --git a/xiaomusic/static/iwebplayer/iwebplayer.html b/xiaomusic/static/iwebplayer/iwebplayer.html index 4616831a..a921f62 100644 --- a/xiaomusic/static/iwebplayer/iwebplayer.html +++ b/xiaomusic/static/iwebplayer/iwebplayer.html @@ -706,9 +706,27 @@ align-items: center; z-index: 110; width: 54px; - height: 160px; + height: 230px; touch-action: none; } + .vol-adj-btn { + background: transparent; + border: none; + color: var(--text-main); + font-size: 20px; + font-weight: 500; + cursor: pointer; + width: 32px; + height: 32px; + display: flex; + align-items: center; + justify-content: center; + border-radius: 50%; + transition: background 0.2s; + margin: 4px 0; + user-select: none; + } + .vol-adj-btn:active { background: var(--bg-color); } .volume-popup.show { display: flex; } .volume-text { font-size: 12px; @@ -1371,7 +1389,37 @@ } /* ========================================== - 13. 宽屏适配 + 13. iOS 桌面安装专用样式 + ========================================== */ + .ios-install-pane { display: none; animation: fadeIn 0.2s; } + .ios-install-pane.active { display: block; } + + /* 底部偏右引导气泡 */ + .ios-guide-bubble { + position: fixed; bottom: calc(20px + env(safe-area-inset-bottom)); right: 15px; left: auto; + transform: translateY(20px); width: 260px; background: rgba(255, 255, 255, 0.95); + backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px); border: 1px solid rgba(0, 0, 0, 0.1); + border-radius: 16px; padding: 15px; box-shadow: 0 10px 30px rgba(0,0,0,0.2); + z-index: 1000; opacity: 0; pointer-events: none; transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1); + display: flex; flex-direction: column; align-items: flex-end; color: var(--text-main); text-align: right; + } + @media (prefers-color-scheme: dark) { + .ios-guide-bubble { background: rgba(31, 41, 55, 0.95); border-color: rgba(255,255,255,0.1); color: #fff; } + } + .ios-guide-bubble.show { opacity: 1; transform: translateY(0); pointer-events: auto; } + + /* 🌟 紫红底色白箭头 */ + .ios-guide-arrow { + margin-top: 12px; margin-right: 12px; width: 28px; height: 28px; + background: var(--primary); color: #fff; border-radius: 50%; + display: flex; align-items: center; justify-content: center; + box-shadow: 0 4px 10px rgba(236, 72, 153, 0.3); + animation: ios-bounce 1.2s infinite; + } + @keyframes ios-bounce { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(8px); } } + + /* ========================================== + 14. 宽屏适配 ========================================== */ @media (min-width: 600px) { html { background-color: #e5e7eb; overflow-y: scroll; scrollbar-gutter: stable; } @@ -1423,6 +1471,16 @@
  • 后台配置
  • + +
  • + + + + + + + 桌面 (iOS) +
  • 版本
  • @@ -1588,7 +1646,9 @@
    50%
    + +
    @@ -1608,7 +1668,7 @@
    -

    iWebPlayerXiaoMusic 的主题之一,专为 iPhone 交互优化,提供接近原生APP的音乐播放体验与远程设备控制能力。

    +

    iWebPlayerXiaoMusic 的主题之一,专为 iPhone 交互优化,媲美原生APP的音乐播放与小爱音箱控制。

    + + +
    +
    + 点击底部的 菜单 +
    +
    + 选择 共享 -> 添加到主屏幕 +
    +
    + +
    +
    +