tamius-han/ultrawidify
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Force zero margins on <video> element.

Browse Source 
This should fix issues with alignment on twitch and hulu, et al.
This commit is contained in:
Tamius Han 2020-10-21 19:49:26 +02:00
parent 7093236237
commit ec83830e78
1 changed files with 12 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/ext/lib/video-transform/Resizer.js
View File

@ -613,11 +613,13 @@ class Resizer {
styleArray[i] = styleArray[i].trim();
// some sites do 'top: 50%; left: 50%; transform: <transform>' to center videos.
// we dont wanna, because we already center videos on our own
if (styleArray[i].startsWith("transform:") ||
styleArray[i].startsWith("top:") ||
styleArray[i].startsWith("left:") ||
styleArray[i].startsWith("right:") ||
styleArray[i].startsWith("bottom:") ){
if (styleArray[i].startsWith("transform:")
|| styleArray[i].startsWith("top:")
|| styleArray[i].startsWith("left:")
|| styleArray[i].startsWith("right:")
|| styleArray[i].startsWith("bottom:")
|| styleArray[i].startsWith("margin")
){
delete styleArray[i];
}
}
@ -667,9 +669,13 @@ class Resizer {
const styleArray = this.buildStyleArray('', extraStyleString)
// sometimes, site designers will center <video> by setting margin: to something. We do not like that, as
// it prevents extension from working properly.
styleArray.push('margin: 0px 0px 0px 0px !important; width: initial !important; height: initial !important');
// add remaining elements
if (stretchFactors) {
styleArray.push(`transform: translate(${translate.x}px, ${translate.y}px) scale(${stretchFactors.xFactor}, ${stretchFactors.yFactor})`);
styleArray.push(`transform: translate(${translate.x}px, ${translate.y}px) scale(${stretchFactors.xFactor}, ${stretchFactors.yFactor});`);
// important — guarantees video will be properly aligned
styleArray.push("top: 0px !important; left: 0px !important; bottom: 0px !important; right: 0px;");