Fix model speed/accuracy indicator alignment (#1116)

* increase indicator width to fit German translation
* use text-end for proper alignment of Arabic translation
* use ms-4 instead of ml-4 to fix score bar alignment for Arabic
* use ms-auto to fix download button alignment for Arabic

Fixes #1109
This commit is contained in:
Alexander Yastrebov 2026-03-23 01:35:39 +01:00 committed by GitHub
parent f6e71862ff
commit cca4c49455
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -162,10 +162,10 @@ const ModelCard: React.FC<ModelCardProps> = ({
</p>
</div>
{(model.accuracy_score > 0 || model.speed_score > 0) && (
<div className="hidden sm:flex items-center ml-4">
<div className="hidden sm:flex items-center ms-4">
<div className="space-y-1">
<div className="flex items-center gap-2">
<p className="text-xs text-text/60 w-14 text-right">
<p className="text-xs text-text/60 w-24 text-end">
{t("onboarding.modelCard.accuracy")}
</p>
<div className="w-16 h-1.5 bg-mid-gray/20 rounded-full overflow-hidden">
@ -176,7 +176,7 @@ const ModelCard: React.FC<ModelCardProps> = ({
</div>
</div>
<div className="flex items-center gap-2">
<p className="text-xs text-text/60 w-14 text-right">
<p className="text-xs text-text/60 w-24 text-end">
{t("onboarding.modelCard.speed")}
</p>
<div className="w-16 h-1.5 bg-mid-gray/20 rounded-full overflow-hidden">
@ -218,7 +218,7 @@ const ModelCard: React.FC<ModelCardProps> = ({
</div>
)}
{status === "downloadable" && (
<span className="flex items-center gap-1.5 ml-auto text-xs text-text/50">
<span className="flex items-center gap-1.5 ms-auto text-xs text-text/50">
<Download className="w-3.5 h-3.5" />
<span>{formatModelSize(Number(model.size_mb))}</span>
</span>
@ -229,7 +229,7 @@ const ModelCard: React.FC<ModelCardProps> = ({
size="sm"
onClick={handleDelete}
title={t("modelSelector.deleteModel", { modelName: displayName })}
className="flex items-center gap-1.5 ml-auto text-logo-primary/85 hover:text-logo-primary hover:bg-logo-primary/10"
className="flex items-center gap-1.5 ms-auto text-logo-primary/85 hover:text-logo-primary hover:bg-logo-primary/10"
>
<Trash2 className="w-3.5 h-3.5" />
<span>{t("common.delete")}</span>