Solved a placement problem with the History in Arab
This commit is contained in:
@@ -33,7 +33,7 @@ const Element = ({date, label, isEven, language, Icon}: ElementProps) => {
|
||||
<span className={clsx("w-64 text-mti-purple-light font-semibold text-lg", isEven && "text-right")}>{date}</span>
|
||||
</div>
|
||||
|
||||
<div className={clsx("flex items-center gap-8 md:hidden", language === "ar" && "flex-row-reverse text-right")}>
|
||||
<div className={clsx("flex items-center gap-8 md:hidden")}>
|
||||
<div className="h-16 w-16 rounded-full bg-mti-purple-dark flex items-center justify-center text-white border-white border-4 drop-shadow">
|
||||
<Icon className="h-6 w-6" />
|
||||
</div>
|
||||
@@ -75,9 +75,9 @@ export default function History({language}: Props) {
|
||||
</div>
|
||||
<div
|
||||
className={clsx(
|
||||
"w-2 h-[89%] bg-mti-purple-light absolute md:left-1/2 md:-translate-x-1/2 top-1/2 -translate-y-1/2 rounded-full",
|
||||
language === "en" && "left-1/2 -translate-x-[148px]",
|
||||
language === "ar" && "right-1/2 translate-x-[148px]",
|
||||
"w-2 h-[89%] bg-mti-purple-light absolute top-1/2 -translate-y-1/2 rounded-full",
|
||||
language === "en" && "left-1/2 -translate-x-[148px] md:left-1/2 md:-translate-x-1/2",
|
||||
language === "ar" && "right-1/2 translate-x-[148px] md:right-1/2 md:translate-x-1/2",
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user