vazirmatn icon indicating copy to clipboard operation
vazirmatn copied to clipboard

وسط نبودن کاراکتر ها موقع استفاده از حروف لاتین

Open saeedvaziry opened this issue 2 years ago • 4 comments

توی نسخه وب و موقع هایلایت کردن نوشته ها:

کاراکتر های فارسی دقیقا وسط هستن ولی موقع استفاده از کاراکتر های لاتین یکم بالاتر قرار میگیرن.

image image

معمولا این مشکل رو با margin و یا line-height برطرف میکنم ولی وقتی قراره هم زبان فارسی هم انگلیسی ساپورت بشه بمشکل میخوره متاسفانه.

saeedvaziry avatar Jul 24 '22 21:07 saeedvaziry

همانطور که فرمودید فارسی مشکلی نداره. این تفاوت در ارتفاع فارسی و لاتین مشکل رایجی هست: #264 #110 #209 #150

پیشنهاد من اینه که در وضعیت لاتین، از فونت روبوتو یا هر فونت لاتین دیگری استفاده کنید. یعنی در شرایطی که اولویت با لاتین باشه:

.latin_el {
    font-family: Roboto, Vazirmatn, sans-serif;
}

در حالت فارسی:

.farsi_el {
    font-family: Vazirmatn, Roboto, sans-serif;
}

rastikerdar avatar Jul 26 '22 12:07 rastikerdar

همانطور که فرمودید فارسی مشکلی نداره. این تفاوت در ارتفاع فارسی و لاتین مشکل رایجی هست: #264 #110 #209 #150

پیشنهاد من اینه که در وضعیت لاتین، از فونت روبوتو یا هر فونت لاتین دیگری استفاده کنید. یعنی در شرایطی که اولویت با لاتین باشه:

.latin_el {
    font-family: Roboto, Vazirmatn, sans-serif;
}

در حالت فارسی:

.farsi_el {
    font-family: Vazirmatn, Roboto, sans-serif;
}

و البته که امکانش هست از unicode-range ها توی CSS استفاده کنن تا فونت برای زبان خاصی ست بشه بجای اینکه از کلاس های مختلف استفاده کنن :)

RealMrHex avatar Jan 06 '23 19:01 RealMrHex

ببخشید یه راه‌حلی هست برای حروف الفبای لاتین به جای روبوتو از فونت Poppins استفاده بشه. مشکل کمتری بابت line hight داره فکر کنم.

Mrahmani71 avatar Feb 21 '23 12:02 Mrahmani71

من یک راه حلی پیدا کردم. به این صورت هست که unicode range اون کاراکتر هایی که میخوام فونت وزیر روشون اعمال بشه رو موقع تعریف font توی css قرار میدم. در این صورت اگر کاراکتری وارد بشه که unicode دیگه ای داشته باشه فونت وزیر روش اعمال نمیشه و فونت دومی که تعریف کردید به صورت خودکار اعمال میشه.

یونی کد رنجی که باید قرار بدید: U+0600-06FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE80-FEFC, U+0030-0039

نمونه کد:

@font-face {
    font-family: "Vazir";
    font-weight: 500;
    src: url(Vazirmatn-Medium.woff2);
    unicode-range: U+0600-06FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE80-FEFC, U+0030-0039;
  }

استفاده از فونت:

.css_class{
font-family: "Vazir, arial"
}

mohammad-ILA avatar Feb 27 '23 16:02 mohammad-ILA