1
0
Fork 0
mirror of https://github.com/sussy-code/smov.git synced 2024-12-29 16:07:40 +01:00

Fix RTL issues

This commit is contained in:
mrjvs 2023-12-16 16:50:34 +01:00
parent cf4cb6f300
commit 6dea1fb3f6
4 changed files with 22 additions and 16 deletions

View file

@ -227,3 +227,7 @@ input[type=range].styled-slider.slider-progress::-ms-fill-lower {
/* Invert horizontal X offset on transform (Tailwind RTL plugin does the rest) */ /* Invert horizontal X offset on transform (Tailwind RTL plugin does the rest) */
transform: translate(calc(var(--tw-translate-x) * -1), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important; transform: translate(calc(var(--tw-translate-x) * -1), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important;
} }
[dir="ltr"] .transform {
/* default - otherwise it overwrites*/
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important;
}

View file

@ -158,7 +158,7 @@ export function ProgressBar() {
{/* Actual progress bar */} {/* Actual progress bar */}
<div <div
className="absolute top-0 left-0 h-full rounded-full bg-progress-filled flex justify-end items-center" className="absolute top-0 dir-neutral:left-0 h-full rounded-full bg-progress-filled flex justify-end items-center"
style={{ style={{
width: `${ width: `${
Math.max( Math.max(

View file

@ -97,6 +97,7 @@ export function CaptionSetting(props: {
onTouchStart={dragMouseDown} onTouchStart={dragMouseDown}
> >
<div <div
dir="ltr"
className={[ className={[
"relative w-full h-1 bg-video-context-slider bg-opacity-25 rounded-full transition-[height] duration-100 group-hover/progress:h-1.5", "relative w-full h-1 bg-video-context-slider bg-opacity-25 rounded-full transition-[height] duration-100 group-hover/progress:h-1.5",
dragging ? "!h-1.5" : "", dragging ? "!h-1.5" : "",

View file

@ -60,18 +60,18 @@ export function ScrapingPart(props: ScrapingProps) {
(async () => { (async () => {
const output = await startScraping(props.media); const output = await startScraping(props.media);
if (!isMounted()) return; if (!isMounted()) return;
// props.onResult?.( props.onResult?.(
// resultRef.current.sources, resultRef.current.sources,
// resultRef.current.sourceOrder resultRef.current.sourceOrder
// ); );
// report( report(
// scrapePartsToProviderMetric( scrapePartsToProviderMetric(
// props.media, props.media,
// resultRef.current.sourceOrder, resultRef.current.sourceOrder,
// resultRef.current.sources resultRef.current.sources
// ) )
// ); );
// props.onGetStream?.(output); props.onGetStream?.(output);
})(); })();
}, [startScraping, props, report, isMounted]); }, [startScraping, props, report, isMounted]);
@ -86,12 +86,13 @@ export function ScrapingPart(props: ScrapingProps) {
return ( return (
<div <div
className="h-full w-full relative dir-neutral:origin-top-left flex dir-neutral:flex-row dir-neutral:items-start dir-neutral:justify-start" className="h-full w-full relative dir-neutral:origin-top-left flex"
ref={containerRef} ref={containerRef}
> >
<div <div
className={classNames({ className={classNames({
"absolute transition-[transform,opacity] opacity-0": true, "absolute transition-[transform,opacity] opacity-0 dir-neutral:left-0":
true,
"!opacity-100": renderedOnce, "!opacity-100": renderedOnce,
})} })}
ref={listRef} ref={listRef}