devops/encoach_landingpage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Solved a placement problem with the History in Arab

Browse Source
This commit is contained in:
Tiago Ribeiro
2024-02-14 11:35:10 +00:00
parent 86f7dd4a89
commit 78abfe3eda
1 changed files with 4 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/templates/History.tsx
View File

@@ -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> <span className={clsx("w-64 text-mti-purple-light font-semibold text-lg", isEven && "text-right")}>{date}</span>
</div> </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"> <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" /> <Icon className="h-6 w-6" />
</div> </div>
@@ -75,9 +75,9 @@ export default function History({language}: Props) {
</div> </div>
<div <div
className={clsx( 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", "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]", 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]", language === "ar" && "right-1/2 translate-x-[148px] md:right-1/2 md:translate-x-1/2",
)} )}
/> />
</div> </div>