diff --git a/publish/changeLog.md b/publish/changeLog.md index 99abe45d..44692877 100644 --- a/publish/changeLog.md +++ b/publish/changeLog.md @@ -16,7 +16,7 @@ - 新增歌词时是否歌词翻译、罗马音设置,默认关闭,可以去设置-下载设置开启(#344) - 新增界面字体大小设置 - 桌面歌词新增竖排歌词显示功能(#971) -- 桌面歌词新增歌词对齐方式、是否不允许歌词换行、歌词颜色设置 +- 桌面歌词新增歌词对齐方式、是否不允许歌词换行、歌词颜色、滚动对齐方式、歌词间距设置 - 桌面歌词新增歌曲频谱显示(得益于主窗口与桌面歌词进程通信的改进,可以将此功能以CPU使用率“相对较低”的方式带到桌面歌词中) - 添加kg源罗马音歌词的支持 diff --git a/src/common/defaultSetting.ts b/src/common/defaultSetting.ts index 8e290314..c753c4d6 100644 --- a/src/common/defaultSetting.ts +++ b/src/common/defaultSetting.ts @@ -50,14 +50,16 @@ const defaultSetting: LX.AppSetting = { 'desktopLyric.y': null, 'desktopLyric.isLockScreen': true, 'desktopLyric.isDelayScroll': true, + 'desktopLyric.scrollAlign': 'center', 'desktopLyric.isHoverHide': false, 'desktopLyric.direction': 'horizontal', 'desktopLyric.style.align': 'center', 'desktopLyric.style.font': '', 'desktopLyric.style.fontSize': 20, + 'desktopLyric.style.lineGap': 15, 'desktopLyric.style.lyricUnplayColor': 'rgba(255, 255, 255, 1)', 'desktopLyric.style.lyricPlayedColor': 'rgba(7, 197, 86, 1)', - 'desktopLyric.style.lyricShadowColor': 'rgba(0, 0, 0, 0.14)', + 'desktopLyric.style.lyricShadowColor': 'rgba(0, 0, 0, 0.15)', // 'desktopLyric.style.fontWeight': false, 'desktopLyric.style.opacity': 95, 'desktopLyric.style.ellipsis': false, diff --git a/src/common/types/app_setting.d.ts b/src/common/types/app_setting.d.ts index 4e5667d1..c0a0b18f 100644 --- a/src/common/types/app_setting.d.ts +++ b/src/common/types/app_setting.d.ts @@ -222,6 +222,11 @@ declare namespace LX { */ 'desktopLyric.isDelayScroll': boolean + /** + * 歌词滚动位置 + */ + 'desktopLyric.scrollAlign': 'top' | 'center' + /** * 是否在鼠标划过桌面歌词窗口时降低歌词透明度 */ @@ -233,7 +238,7 @@ declare namespace LX { 'desktopLyric.direction': 'horizontal' | 'vertical' /** - * 是否在鼠标划过桌面歌词窗口时降低歌词透明度 + * 歌词对齐方式 */ 'desktopLyric.style.align': 'center' | 'left' | 'right' @@ -247,6 +252,11 @@ declare namespace LX { */ 'desktopLyric.style.fontSize': number + /** + * 歌词间距大小 + */ + 'desktopLyric.style.lineGap': number + /** * 桌面歌词未播放字体颜色 */ diff --git a/src/common/types/desktop_lyric.d.ts b/src/common/types/desktop_lyric.d.ts index 21e5bcab..b57515f0 100644 --- a/src/common/types/desktop_lyric.d.ts +++ b/src/common/types/desktop_lyric.d.ts @@ -12,11 +12,13 @@ declare namespace LX { 'desktopLyric.y': LX.AppSetting['desktopLyric.y'] 'desktopLyric.isLockScreen': LX.AppSetting['desktopLyric.isLockScreen'] 'desktopLyric.isDelayScroll': LX.AppSetting['desktopLyric.isDelayScroll'] + 'desktopLyric.scrollAlign': LX.AppSetting['desktopLyric.scrollAlign'] 'desktopLyric.isHoverHide': LX.AppSetting['desktopLyric.isHoverHide'] 'desktopLyric.direction': LX.AppSetting['desktopLyric.direction'] 'desktopLyric.style.align': LX.AppSetting['desktopLyric.style.align'] 'desktopLyric.style.font': LX.AppSetting['desktopLyric.style.font'] 'desktopLyric.style.fontSize': LX.AppSetting['desktopLyric.style.fontSize'] + 'desktopLyric.style.lineGap': LX.AppSetting['desktopLyric.style.lineGap'] 'desktopLyric.style.lyricUnplayColor': LX.AppSetting['desktopLyric.style.lyricUnplayColor'] 'desktopLyric.style.lyricPlayedColor': LX.AppSetting['desktopLyric.style.lyricPlayedColor'] 'desktopLyric.style.lyricShadowColor': LX.AppSetting['desktopLyric.style.lyricShadowColor'] diff --git a/src/lang/en-us.json b/src/lang/en-us.json index 50afbc3c..039e7631 100644 --- a/src/lang/en-us.json +++ b/src/lang/en-us.json @@ -70,11 +70,6 @@ "duplicate_list_tip": "You have favorited this list [{name}] before, do you need to update the songs in it?", "export": "Export", "fullscreen_exit": "Exit Full Screen", - "theme_edit_modal__copy": "Copy theme", - "theme_edit_modal__remove": "delete", - "theme_edit_modal__remove_tip": "Do you really want to remove this thread?", - "theme_edit_modal__save_new": "Save new", - "theme_edit_modal__select_bg_file": "Choose a background image", "history_clear": "Clear History", "history_remove": "Right click to remove this entry", "history_search": "History Searches", @@ -315,9 +310,15 @@ "setting__desktop_lyric_font_default": "Default", "setting__desktop_lyric_font_weight": "Bold font", "setting__desktop_lyric_hover_hide": "Reduce the transparency of lyrics when the mouse moves into the lyrics area (this feature has platform compatibility issues)", + "setting__desktop_lyric_line_gap": "Lyric spacing ({num})", + "setting__desktop_lyric_line_gap_add": "increase the spacing", + "setting__desktop_lyric_line_gap_dec": "Reduce spacing", "setting__desktop_lyric_lock": "Lock lyrics", "setting__desktop_lyric_lock_screen": "It is not allowed to drag the lyrics window out of the main screen", "setting__desktop_lyric_played_color": "color played", + "setting__desktop_lyric_scroll_align": "now playing lyrics scroll position", + "setting__desktop_lyric_scroll_align_center": "Center", + "setting__desktop_lyric_scroll_align_top": "Top", "setting__desktop_lyric_shadow_color": "shadow color", "setting__desktop_lyric_unplay_color": "Color not playing", "setting__download": "Download", @@ -521,6 +522,7 @@ "theme_edit_modal__bg_image_remove": "remove background image", "theme_edit_modal__close_btn": "Closure", "theme_edit_modal__control_btn": "Left control button color", + "theme_edit_modal__copy": "Copy theme", "theme_edit_modal__dark": "Dark theme", "theme_edit_modal__hide_btn": "Hide play details page", "theme_edit_modal__main_bg": "Content area background color", @@ -531,6 +533,10 @@ "theme_edit_modal__pick_save": "Confirm", "theme_edit_modal__preview": "Preview theme", "theme_edit_modal__primary": "Theme color", + "theme_edit_modal__remove": "delete", + "theme_edit_modal__remove_tip": "Do you really want to remove this thread?", + "theme_edit_modal__save_new": "Save new", + "theme_edit_modal__select_bg_file": "Choose a background image", "theme_edit_modal__title": "Edit topic", "theme_green": "Green", "theme_grey": "Grey", diff --git a/src/lang/zh-cn.json b/src/lang/zh-cn.json index 388d9711..c54b878b 100644 --- a/src/lang/zh-cn.json +++ b/src/lang/zh-cn.json @@ -70,11 +70,6 @@ "duplicate_list_tip": "你之前已收藏过该列表 [{name}],是否需要更新里面的歌曲?", "export": "导出", "fullscreen_exit": "退出全屏", - "theme_edit_modal__copy": "复制主题", - "theme_edit_modal__remove": "删除", - "theme_edit_modal__remove_tip": "是否真的要移除这个主题?", - "theme_edit_modal__save_new": "另存", - "theme_edit_modal__select_bg_file": "选择背景图片", "history_clear": "清空搜索历史", "history_remove": "右击移除该历史", "history_search": "历史搜索", @@ -317,9 +312,15 @@ "setting__desktop_lyric_font_default": "默认", "setting__desktop_lyric_font_weight": "加粗字体", "setting__desktop_lyric_hover_hide": "鼠标移入歌词区域时降低歌词透明度(此功能存在平台兼容性问题)", + "setting__desktop_lyric_line_gap": "歌词间距({num})", + "setting__desktop_lyric_line_gap_add": "加大间距", + "setting__desktop_lyric_line_gap_dec": "减小间距", "setting__desktop_lyric_lock": "锁定歌词", "setting__desktop_lyric_lock_screen": "不允许歌词窗口拖出主屏幕之外", "setting__desktop_lyric_played_color": "已播放颜色", + "setting__desktop_lyric_scroll_align": "正在播放歌词滚动位置", + "setting__desktop_lyric_scroll_align_center": "中心", + "setting__desktop_lyric_scroll_align_top": "顶部", "setting__desktop_lyric_shadow_color": "阴影颜色", "setting__desktop_lyric_unplay_color": "未播放颜色", "setting__download": "下载设置", @@ -523,6 +524,7 @@ "theme_edit_modal__bg_image_remove": "移除背景图片", "theme_edit_modal__close_btn": "关闭", "theme_edit_modal__control_btn": "左侧控制按钮颜色", + "theme_edit_modal__copy": "复制主题", "theme_edit_modal__dark": "暗色主题", "theme_edit_modal__hide_btn": "隐藏播放详情页", "theme_edit_modal__main_bg": "内容区域背景颜色", @@ -533,6 +535,10 @@ "theme_edit_modal__pick_save": "确认", "theme_edit_modal__preview": "预览主题", "theme_edit_modal__primary": "主题色", + "theme_edit_modal__remove": "删除", + "theme_edit_modal__remove_tip": "是否真的要移除这个主题?", + "theme_edit_modal__save_new": "另存", + "theme_edit_modal__select_bg_file": "选择背景图片", "theme_edit_modal__title": "编辑主题", "theme_green": "绿意盎然", "theme_grey": "灰常美丽", diff --git a/src/lang/zh-tw.json b/src/lang/zh-tw.json index 3f00affc..4a73e3b0 100644 --- a/src/lang/zh-tw.json +++ b/src/lang/zh-tw.json @@ -70,11 +70,6 @@ "duplicate_list_tip": "你之前已收藏過該列表 [{name}],是否需要更新里面的歌曲?", "export": "導出", "fullscreen_exit": "退出全屏", - "theme_edit_modal__copy": "複製主題", - "theme_edit_modal__remove": "刪除", - "theme_edit_modal__remove_tip": "是否真的要移除這個主題?", - "theme_edit_modal__save_new": "另存", - "theme_edit_modal__select_bg_file": "選擇背景圖片", "history_clear": "清空搜索歷史", "history_remove": "右擊移除該歷史", "history_search": "歷史搜索", @@ -316,9 +311,15 @@ "setting__desktop_lyric_font_default": "默認", "setting__desktop_lyric_font_weight": "加粗字體", "setting__desktop_lyric_hover_hide": "鼠標移入歌詞區域時降低歌詞透明度(此功能存在平台兼容性問題)", + "setting__desktop_lyric_line_gap": "歌詞間距({num})", + "setting__desktop_lyric_line_gap_add": "加大間距", + "setting__desktop_lyric_line_gap_dec": "減小間距", "setting__desktop_lyric_lock": "鎖定歌詞", "setting__desktop_lyric_lock_screen": "不允許歌詞窗口拖出主屏幕之外", "setting__desktop_lyric_played_color": "已播放顏色", + "setting__desktop_lyric_scroll_align": "正在播放歌詞滾動位置", + "setting__desktop_lyric_scroll_align_center": "中心", + "setting__desktop_lyric_scroll_align_top": "頂部", "setting__desktop_lyric_shadow_color": "陰影顏色", "setting__desktop_lyric_unplay_color": "未播放顏色", "setting__download": "下載設置", @@ -521,6 +522,7 @@ "theme_edit_modal__bg_image_remove": "移除背景圖片", "theme_edit_modal__close_btn": "關閉", "theme_edit_modal__control_btn": "左側控制按鈕顏色", + "theme_edit_modal__copy": "複製主題", "theme_edit_modal__dark": "暗色主題", "theme_edit_modal__hide_btn": "隱藏播放詳情頁", "theme_edit_modal__main_bg": "內容區域背景顏色", @@ -531,6 +533,10 @@ "theme_edit_modal__pick_save": "確認", "theme_edit_modal__preview": "預覽主題", "theme_edit_modal__primary": "主題色", + "theme_edit_modal__remove": "刪除", + "theme_edit_modal__remove_tip": "是否真的要移除這個主題?", + "theme_edit_modal__save_new": "另存", + "theme_edit_modal__select_bg_file": "選擇背景圖片", "theme_edit_modal__title": "編輯主題", "theme_green": "綠意盎然", "theme_grey": "灰常美麗", diff --git a/src/main/modules/winLyric/utils.ts b/src/main/modules/winLyric/utils.ts index 95e107cb..ad84d64e 100644 --- a/src/main/modules/winLyric/utils.ts +++ b/src/main/modules/winLyric/utils.ts @@ -87,6 +87,7 @@ export const watchConfigKeys = [ 'desktopLyric.y', 'desktopLyric.isLockScreen', 'desktopLyric.isDelayScroll', + 'desktopLyric.scrollAlign', 'desktopLyric.isHoverHide', 'desktopLyric.direction', 'desktopLyric.style.align', @@ -95,6 +96,7 @@ export const watchConfigKeys = [ 'desktopLyric.style.lyricShadowColor', 'desktopLyric.style.font', 'desktopLyric.style.fontSize', + 'desktopLyric.style.lineGap', // 'desktopLyric.style.fontWeight', 'desktopLyric.style.opacity', 'desktopLyric.style.ellipsis', diff --git a/src/renderer-lyric/components/layout/LyricHorizontal/index.vue b/src/renderer-lyric/components/layout/LyricHorizontal/index.vue index 40f49fd6..557c514a 100644 --- a/src/renderer-lyric/components/layout/LyricHorizontal/index.vue +++ b/src/renderer-lyric/components/layout/LyricHorizontal/index.vue @@ -25,6 +25,8 @@ export default { fontSize: Math.trunc(setting['desktopLyric.style.fontSize']) + 'px', opacity: setting['desktopLyric.style.opacity'] / 100, textAlign: setting['desktopLyric.style.align'], + '--line-gap': setting['desktopLyric.style.lineGap'] + 'px', + '--line-extended-gap': (setting['desktopLyric.style.lineGap'] / 3).toFixed(2) + 'px', })) const { dom_lyric, @@ -74,7 +76,7 @@ export default { } .line-content { line-height: 1.2; - margin: 16px 0; + margin: var(--line-gap) 0; overflow-wrap: break-word; .font-lrc { @@ -83,7 +85,7 @@ export default { .extended { font-size: 0.8em; - margin-top: 5px; + margin-top: var(--line-extended-gap); } &.line-mode { .font-lrc { @@ -167,7 +169,7 @@ export default { // // -webkit-text-stroke: thin #124628; // } .lyric-space { - height: 70%; + height: 80%; } // .lrc-active { diff --git a/src/renderer-lyric/components/layout/LyricHorizontal/useLyric.js b/src/renderer-lyric/components/layout/LyricHorizontal/useLyric.js index 86317aec..948ee3de 100644 --- a/src/renderer-lyric/components/layout/LyricHorizontal/useLyric.js +++ b/src/renderer-lyric/components/layout/LyricHorizontal/useLyric.js @@ -4,6 +4,13 @@ import { lyric } from '@lyric/store/lyric' import { isPlay, setting } from '@lyric/store/state' import { setWindowBounds } from '@lyric/utils/ipc' +const getOffsetTop = (contentHeight, lineHeight) => { + switch (setting['desktopLyric.scrollAlign']) { + case 'top': return setting['desktopLyric.style.lineGap'] / 2 + default: return contentHeight * 0.5 - lineHeight / 2 + } +} + export default () => { const dom_lyric = ref(null) const dom_lyric_text = ref(null) @@ -32,7 +39,7 @@ export default () => { } if (isStopScroll) return let dom_p = dom_lines[lyric.line] - cancelScrollFn = scrollTo(dom_lyric.value, dom_p ? (dom_p.offsetTop - dom_lyric.value.clientHeight * 0.5 + dom_p.clientHeight / 2) : 0, duration) + cancelScrollFn = scrollTo(dom_lyric.value, dom_p ? (dom_p.offsetTop - getOffsetTop(dom_lyric.value.clientHeight, dom_p.clientHeight)) : 0, duration) } const clearLyricScrollTimeout = () => { if (!timeout) return diff --git a/src/renderer-lyric/components/layout/LyricVertical/index.vue b/src/renderer-lyric/components/layout/LyricVertical/index.vue index 2490339d..aecfd634 100644 --- a/src/renderer-lyric/components/layout/LyricVertical/index.vue +++ b/src/renderer-lyric/components/layout/LyricVertical/index.vue @@ -25,6 +25,8 @@ export default { fontSize: Math.trunc(setting['desktopLyric.style.fontSize']) + 'px', opacity: setting['desktopLyric.style.opacity'] / 100, textAlign: setting['desktopLyric.style.align'], + '--line-gap': Math.ceil(setting['desktopLyric.style.lineGap'] * 1.06) + 'px', + '--line-extended-gap': Math.ceil(setting['desktopLyric.style.lineGap'] * 1.06 / 8).toFixed(2) + 'px', })) const { dom_lyric, @@ -78,7 +80,7 @@ export default { } .line-content { line-height: 1.2; - margin: 0 16px; + margin: 0 var(--line-gap); overflow-wrap: break-word; letter-spacing: 5px; @@ -88,7 +90,7 @@ export default { .extended { font-size: 0.8em; - margin-right: 2px; + margin-right: var(--line-extended-gap); } &.line-mode { .font-lrc { @@ -173,7 +175,7 @@ export default { // // -webkit-text-stroke: thin #124628; // } .lyric-space { - width: 70%; + width: 80%; height: 100%; } // .lrc-active { diff --git a/src/renderer-lyric/components/layout/LyricVertical/useLyric.js b/src/renderer-lyric/components/layout/LyricVertical/useLyric.js index 3dfa8e6f..6ab1d063 100644 --- a/src/renderer-lyric/components/layout/LyricVertical/useLyric.js +++ b/src/renderer-lyric/components/layout/LyricVertical/useLyric.js @@ -4,6 +4,13 @@ import { lyric } from '@lyric/store/lyric' import { isPlay, setting } from '@lyric/store/state' import { setWindowBounds } from '@lyric/utils/ipc' +const getOffsetTop = (contentWidth, lineWidth) => { + switch (setting['desktopLyric.scrollAlign']) { + case 'top': return contentWidth - lineWidth - lineWidth * 0.1 + default: return contentWidth * 0.5 - lineWidth / 2 + } +} + export default () => { const dom_lyric = ref(null) const dom_lyric_text = ref(null) @@ -32,7 +39,7 @@ export default () => { } if (isStopScroll) return let dom_p = dom_lines[lyric.line] - cancelScrollFn = scrollXRTo(dom_lyric.value, dom_p ? (dom_p.offsetLeft - dom_lyric.value.clientWidth * 0.5 + dom_p.clientWidth / 2) : 0, duration) + cancelScrollFn = scrollXRTo(dom_lyric.value, dom_p ? (dom_p.offsetLeft - getOffsetTop(dom_lyric.value.clientWidth, dom_p.clientWidth)) : 0, duration) } const clearLyricScrollTimeout = () => { if (!timeout) return diff --git a/src/renderer-lyric/store/state.ts b/src/renderer-lyric/store/state.ts index 9bf08558..8fcf2109 100644 --- a/src/renderer-lyric/store/state.ts +++ b/src/renderer-lyric/store/state.ts @@ -12,6 +12,7 @@ export const setting = shallowReactive({ 'desktopLyric.y': null, 'desktopLyric.isLockScreen': true, 'desktopLyric.isDelayScroll': true, + 'desktopLyric.scrollAlign': 'center', 'desktopLyric.isHoverHide': false, 'desktopLyric.direction': 'horizontal', 'desktopLyric.style.align': 'center', @@ -19,7 +20,8 @@ export const setting = shallowReactive({ 'desktopLyric.style.lyricPlayedColor': 'rgba(7, 197, 86, 1)', 'desktopLyric.style.lyricShadowColor': 'rgba(0, 0, 0, 0.14)', 'desktopLyric.style.font': '', - 'desktopLyric.style.fontSize': 120, + 'desktopLyric.style.fontSize': 20, + 'desktopLyric.style.lineGap': 15, // 'desktopLyric.style.fontWeight': true, 'desktopLyric.style.opacity': 95, 'desktopLyric.style.ellipsis': false, diff --git a/src/renderer-lyric/useApp/useTheme.ts b/src/renderer-lyric/useApp/useTheme.ts index 0c8973c5..a5dc07e0 100644 --- a/src/renderer-lyric/useApp/useTheme.ts +++ b/src/renderer-lyric/useApp/useTheme.ts @@ -12,7 +12,7 @@ export default () => { '--color-lyric-unplay': unplayColor, '--color-lyric-played': playedColor, '--color-lyric-shadow': shadowColor, - '--color-lyric-shadow-font-mode': RGB_Alpha_Shade(0.5, shadowColor), + '--color-lyric-shadow-font-mode': RGB_Alpha_Shade(0.49, shadowColor), }) }, { immediate: true, diff --git a/src/renderer/views/Setting/components/SettingDesktopLyric.vue b/src/renderer/views/Setting/components/SettingDesktopLyric.vue index c3d78cb9..20d667f2 100644 --- a/src/renderer/views/Setting/components/SettingDesktopLyric.vue +++ b/src/renderer/views/Setting/components/SettingDesktopLyric.vue @@ -30,6 +30,12 @@ dd base-checkbox.gap-left(id="setting_desktop_lyric_direction_horizontal" :modelValue="appSetting['desktopLyric.direction']" @update:modelValue="updateSetting({ 'desktopLyric.direction': $event })" need value="horizontal" :label="$t('setting__desktop_lyric_direction_horizontal')") base-checkbox.gap-left(id="setting_desktop_lyric_direction_vertical" :modelValue="appSetting['desktopLyric.direction']" @update:modelValue="updateSetting({ 'desktopLyric.direction': $event })" need value="vertical" :label="$t('setting__desktop_lyric_direction_vertical')") +dd + h3#desktop_lyric_scroll_align {{$t('setting__desktop_lyric_scroll_align')}} + div + base-checkbox.gap-left(id="setting_desktop_lyric_scroll_align_top" :modelValue="appSetting['desktopLyric.scrollAlign']" @update:modelValue="updateSetting({ 'desktopLyric.scrollAlign': $event })" need value="top" :label="$t('setting__desktop_lyric_scroll_align_top')") + base-checkbox.gap-left(id="setting_desktop_lyric_scroll_align_center" :modelValue="appSetting['desktopLyric.scrollAlign']" @update:modelValue="updateSetting({ 'desktopLyric.scrollAlign': $event })" need value="center" :label="$t('setting__desktop_lyric_scroll_align_center')") + dd h3#desktop_lyric_align {{$t('setting__desktop_lyric_align')}} div @@ -37,6 +43,12 @@ dd base-checkbox.gap-left(id="setting_desktop_lyric_align_center" :modelValue="appSetting['desktopLyric.style.align']" @update:modelValue="updateSetting({ 'desktopLyric.style.align': $event })" need value="center" :label="$t('setting__desktop_lyric_align_center')") base-checkbox.gap-left(id="setting_desktop_lyric_align_right" :modelValue="appSetting['desktopLyric.style.align']" @update:modelValue="updateSetting({ 'desktopLyric.style.align': $event })" need value="right" :label="$t('setting__desktop_lyric_align_right')") +dd + h3#desktop_lyric_line_gap {{$t('setting__desktop_lyric_line_gap', { num: appSetting['desktopLyric.style.lineGap'] })}} + div + p + base-btn.btn(min @click="changeLineGap(-1)") {{$t('setting__desktop_lyric_line_gap_dec')}} + base-btn.btn(min @click="changeLineGap(1)") {{$t('setting__desktop_lyric_line_gap_add')}} dd h3#desktop_lyric_color {{$t('setting__desktop_lyric_color')}} div @@ -174,7 +186,7 @@ const useLyricColor = () => { const defaultSetting = { 'desktopLyric.style.lyricUnplayColor': 'rgba(255, 255, 255, 1)', 'desktopLyric.style.lyricPlayedColor': 'rgba(7, 197, 86, 1)', - 'desktopLyric.style.lyricShadowColor': 'rgba(0, 0, 0, 0.14)', + 'desktopLyric.style.lyricShadowColor': 'rgba(0, 0, 0, 0.15)', } updateSetting(defaultSetting) setLyricUnplayColor(defaultSetting['desktopLyric.style.lyricUnplayColor']) @@ -202,6 +214,10 @@ export default { setup() { const t = useI18n() + const changeLineGap = (step) => { + let gap = appSetting['desktopLyric.style.lineGap'] + step + updateSetting({ 'desktopLyric.style.lineGap': Math.min(Math.max(gap, 0), 25) }) + } const { lyric_unplay_color_ref, @@ -221,6 +237,7 @@ export default { return { appSetting, updateSetting, + changeLineGap, lyric_unplay_color_ref, lyric_played_color_ref, lyric_shadow_color_ref,