修复桌面歌词启用歌词缩放后的阴影显示问题；就放桌面歌词在启用卡拉OK歌词后字体边缘可能被截断的问题

publish/changeLog.md

@@ -3,3 +3,5 @@
 
 - 修复备份文件导入指引无法识别v2配置的问题
 - 修复从搜索界面进入歌单详情后，若启用强迫症设置的清空功能会导致意外清空搜索框、搜索列表的问题
+- 就放桌面歌词在启用卡拉OK歌词后字体边缘可能被截断的问题
+- 修复桌面歌词启用歌词缩放后的阴影显示问题

src/common/utils/lyric-font-player/font-player.js

@@ -159,7 +159,7 @@ module.exports = class FontPlayer {
     }
 
     if (this.shadowContent && lrcShadowContent) {
-      lrcShadowContent.style = 'position:absolute;top:0;left:0;width:100%;z-index:-1;'
+      lrcShadowContent.style = 'position:absolute;top:0;left:0;right:0;z-index:-1;'
       lrcShadowContent.className = this.shadowClassName
       this.line.appendChild(lrcShadowContent)
     }

src/renderer-lyric/components/layout/LyricHorizontal/index.vue

@@ -76,7 +76,7 @@ export default {
     }
     .shadow {
       color: transparent;
-      margin-left: -0.14em;
+      // margin-left: -0.14em;
     }
     .line-content {
       line-height: 1.2;
@@ -119,8 +119,16 @@ export default {
           -webkit-text-fill-color: transparent;
           -webkit-background-clip: text;
           background-size: 0 100%;
+          padding-left: 1px;
+          padding-right: 1px;
+          padding-bottom: 1px;
         }
       }
+     .line .shadow span {
+        padding-left: 1px;
+        padding-right: 1px;
+        padding-bottom: 1px;
+      }
       // &.line-mode {
       //   .shadow {
       //     text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.40);
@@ -138,7 +146,7 @@ export default {
       // .stroke(2px, rgba(0, 0, 0, 0.025));
       transition: font-size @transition-slow;
     }
-    .font-mode .line .shadow {
+    .font-mode .line .shadow span {
       .stroke(1px, var(--color-lyric-shadow-font-mode));
       transition: font-size @transition-slow;
       // text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3),  1px 1px 1px rgba(0, 0, 0, 0.3);

src/renderer-lyric/components/layout/LyricVertical/index.vue

@@ -86,7 +86,6 @@ export default {
       line-height: 1.2;
       margin: 0 var(--line-gap);
       overflow-wrap: break-word;
-      letter-spacing: 5px;
 
       .font-lrc {
         cursor: grab;
@@ -97,6 +96,7 @@ export default {
         margin-right: var(--line-extended-gap);
       }
       &.line-mode {
+        letter-spacing: 5px;
         .font-lrc {
           transition: @transition-slow;
           transition-property: font-size, color;
@@ -124,8 +124,13 @@ export default {
           -webkit-text-fill-color: transparent;
           -webkit-background-clip: text;
           background-size: 0 100%;
+          padding: 2px;
         }
       }
+
+      &.font-mode .line .shadow span {
+        padding: 2px;
+      }
     }
     // .shadow {
     //   .stroke2(rgba(0, 0, 0, 0.05));
@@ -143,7 +148,7 @@ export default {
       // .stroke(2px, rgba(0, 0, 0, 0.025));
       transition: font-size @transition-slow;
     }
-    .font-mode .line .shadow {
+    .font-mode .line .shadow span {
       .stroke(1px, var(--color-lyric-shadow-font-mode));
       // .stroke(1px, rgba(0, 0, 0, 0.07));
       transition: font-size @transition-slow;