diff --git a/netflix-subtitle-restyle.user.js b/netflix-subtitle-restyle.user.js index 1b344fe..456755c 100644 --- a/netflix-subtitle-restyle.user.js +++ b/netflix-subtitle-restyle.user.js @@ -2,7 +2,7 @@ // @name Netflix subtitle restyle // @namespace https://git.owall.se/oscar/nfsub // @description Render Netflix subtitles in a custom font, with optional size, color, and outline overrides -// @version 1.3.1 +// @version 1.4.0 // @match *://www.netflix.com/* // @homepageURL https://git.owall.se/oscar/nfsub // @supportURL https://git.owall.se/oscar/nfsub/issues @@ -28,6 +28,7 @@ const defaults = { edgeColor: '#000000', lockBottom: false, bottomOffset: 6, + mergeLines: true, }; const stored = GM_getValue('config', {}); @@ -104,13 +105,19 @@ function applyConfig() { ); } if (config.lockBottom) { - rules.push( - `.player-timedtext { - display: flex !important; + const layout = config.mergeLines + ? `display: flex !important; flex-flow: row wrap !important; justify-content: center !important; align-content: flex-end !important; - align-items: flex-end !important; + align-items: flex-end !important;` + : `display: flex !important; + flex-direction: column !important; + align-items: center !important; + justify-content: flex-end !important;`; + rules.push( + `.player-timedtext { + ${layout} padding-bottom: ${config.bottomOffset}% !important; box-sizing: border-box !important; } @@ -126,11 +133,15 @@ function applyConfig() { transform: none !important; text-align: center !important; margin: 0 !important; - } - .player-timedtext .player-timedtext-text-container + .player-timedtext-text-container > span > span::before { - content: "\\00a0" !important; }` ); + if (config.mergeLines) { + rules.push( + `.player-timedtext .player-timedtext-text-container + .player-timedtext-text-container > span > span::before { + content: "\\00a0" !important; + }` + ); + } } subtitleStyle.textContent = rules.join('\n'); } @@ -223,8 +234,10 @@ function buildPanel() { step: '1', value: String(config.bottomOffset), }); + const mergeToggle = el('input', { type: 'checkbox', checked: config.mergeLines }); const syncLockInputs = () => { offsetInput.disabled = !config.lockBottom; + mergeToggle.disabled = !config.lockBottom; }; lockToggle.addEventListener('input', () => { config.lockBottom = lockToggle.checked; @@ -235,6 +248,10 @@ function buildPanel() { config.bottomOffset = Math.min(40, Math.max(0, parseFloat(offsetInput.value) || 0)); save(); }); + mergeToggle.addEventListener('input', () => { + config.mergeLines = mergeToggle.checked; + save(); + }); syncLockInputs(); const closeButton = el('button', { type: 'button', className: 'nfsub-close' }, '×'); @@ -251,6 +268,7 @@ function buildPanel() { row('Edge style', edgeSelect), row('Edge width', el('span', { className: 'nfsub-pair' }, edgeWidthInput, edgeColorInput)), row('Lock to bottom', el('span', { className: 'nfsub-pair' }, lockToggle, offsetInput, el('span', {}, '% up'))), + row('Merge lines', mergeToggle), resetButton );