Currently, I'm trying to use my web source URL to develop an UWP webview app on VS2022.
In my web source URL we're using the different stylings for dir='rtl' for arabic language so when I run the code on the normal browser everything is working fine. But when I run it on XBOX using the local/remote machine method the 'rtl' styles are not working as expected.
I've tried making a lot of changes to CSS but still facing the issue with the styling part used by the dir='rtl'. All the text is shown from right to left but the image styles for -webkit-mask-image is not working as expected.
This is working as expected on the edge browser but not on the XBOX UWP WebView app.
@include rtl(
-webkit-mask-image,
-webkit-linear-gradient(left, transparent, rgba(0, 0, 0, 1) 25%),
-webkit-linear-gradient(right, transparent, rgba(0, 0, 0, 1) 25%)
);
@include rtl(
mask-image,
linear-gradient(right, #060011 34%, rgba(0, 0, 0, 0.1) 18%, rgba(0, 0, 0, 0) 0%),
linear-gradient(left, #060011 34%, rgba(0, 0, 0, 0.1) 18%, rgba(0, 0, 0, 0) 0%)
);
Here the styles were given as the image should get blurred on the right side and should visible properly on the left side. But when I run this on local/remote machine the total image is getting blurred.
Is there any work around that can be used to make this property work as expected.
