Further optimize layout for RTL languages
This commit is contained in:
parent
d4f9df2801
commit
ce8cb1bad4
2 changed files with 10 additions and 1 deletions
|
@ -88,9 +88,18 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
footer {
|
footer {
|
||||||
|
.timer {
|
||||||
|
font-size: larger;
|
||||||
|
}
|
||||||
|
.sound-on.icon,
|
||||||
|
.sound-off.icon {
|
||||||
|
position: relative;
|
||||||
|
bottom: 5px;
|
||||||
|
}
|
||||||
.sound-on.icon,
|
.sound-on.icon,
|
||||||
.sound-off.icon,
|
.sound-off.icon,
|
||||||
.play.icon {
|
.play.icon {
|
||||||
|
display: inline-block;
|
||||||
transform: rotate(180deg);
|
transform: rotate(180deg);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -67,7 +67,7 @@ export function SurahStream({ surah, locale, t }: Props) {
|
||||||
{!endOfStream && isPaused && <PlayIcon onClick={() => setIsPaused(false)} />}
|
{!endOfStream && isPaused && <PlayIcon onClick={() => setIsPaused(false)} />}
|
||||||
{!endOfStream && !isPaused && <PauseIcon onClick={() => setIsPaused(true)} />}
|
{!endOfStream && !isPaused && <PauseIcon onClick={() => setIsPaused(true)} />}
|
||||||
<span
|
<span
|
||||||
className={classNames("sound-box flex w-14 justify-end", {
|
className={classNames("sound-box flex flex-col items-end w-16", {
|
||||||
hidden: endOfStream,
|
hidden: endOfStream,
|
||||||
})}
|
})}
|
||||||
>
|
>
|
||||||
|
|
Loading…
Reference in a new issue