Page MenuHomePhabricator

Hindi Title text characters are partially cut (not visible)
Closed, ResolvedPublic

Assigned To
Authored By
bzimport
Jun 14 2011, 10:30 PM
Referenced Files
F7834: Safari.png
Nov 21 2014, 11:34 PM
F7835: fix_for_bug2945_and_bug30809
Nov 21 2014, 11:34 PM
F7833: rekonq_raghindi_font.jpg
Nov 21 2014, 11:34 PM
F7831: Opera_Raghindi_font1.jpg
Nov 21 2014, 11:34 PM
F7832: rekonq_nithyananda_font.jpg
Nov 21 2014, 11:34 PM
F7830: Opera_Nithyananda_font.jpg
Nov 21 2014, 11:34 PM
F7829: konqueror_nithyananda_font.jpg
Nov 21 2014, 11:34 PM
F7828: Firefox_Raghindi_font.jpg
Nov 21 2014, 11:34 PM

Description

Author: fast.rizwaan

Description:
text getting cut with arora browser

Hindi Wikipedia, renders the title text with fonts having big sized characters improperly

Please test hi.wikipedia.org with my and cdac fonts:

My font Nithyananda.ttf http://kde-look.org/content/show.php/Nithyananda+Hindi+Unicode+Font+%28GPL%29?content=142684

and many existing hindi fonts like "Raghu.ttf or Raghindi.ttf" "CDAC Fonts Yogesh" "CDAC font gargi", etc., see and download the fonts here:

http://tdil.mit.gov.in/download/openfonts.htm

My GPL font Nithyananda.ttf also uses big characters; because text is unreadable and manually hinting is the work of professional.

Affect Webbrowsers:
Not only it cuts the text in all webrowsers in Linux it also has the same issue in Internet explorer and other web browsers in MS Windows too.

Please see the attachments of different fonts and webbrowsers I tested the website
http://hi.wikipedia.org/wiki/%E0%A4%B5%E0%A4%BF%E0%A4%95%E0%A4%BF%E0%A4%AA%E0%A5%80%E0%A4%A1%E0%A4%BF%E0%A4%AF%E0%A4%BE:%E0%A4%A8%E0%A4%BF%E0%A4%B0%E0%A5%8D%E0%A4%B5%E0%A4%BE%E0%A4%9A%E0%A4%BF%E0%A4%A4_%E0%A4%B5%E0%A4%BF%E0%A4%B7%E0%A4%AF_%E0%A4%B5%E0%A4%B8%E0%A5%8D%E0%A4%A4%E0%A5%81

Expected behavior:
The text top and bottom height should be bigger on hindi wikipedia so that various fonts could work well with wikipedia. thanks.


Version: unspecified
Severity: normal

Attached:

arora_browser_nithyananda_font.jpg (558×753 px, 99 KB)

Details

Reference
bz29405

Event Timeline

bzimport raised the priority of this task from to Medium.Nov 21 2014, 11:34 PM
bzimport added a project: MediaWiki-Parser.
bzimport set Reference to bz29405.

fast.rizwaan wrote:

chromium browser with cdac surekh hindi font

Attached:

Chromium_CDAC_Surekh_font.jpg (592×677 px, 93 KB)

fast.rizwaan wrote:

chromium with rather small font gargi still having text display issue on title

Attached:

Chromium_Gargi_font.jpg (592×677 px, 92 KB)

fast.rizwaan wrote:

chromium with my font nithyananda (same problem)

Attached:

Chromium_Nithyananda_font.jpg (575×655 px, 92 KB)

fast.rizwaan wrote:

chromium with classic hindi font Raghindi (same problem)

Attached:

Chromium_Raghindi_font.jpg (592×677 px, 95 KB)

fast.rizwaan wrote:

firefox 4 with nithyananda font

Attached:

Firefox_CDAC_Nithyananda_font.jpg (613×754 px, 111 KB)

fast.rizwaan wrote:

firefox 4 with surekh font

Attached:

Firefox_CDAC_Surekh_font.jpg (613×754 px, 107 KB)

fast.rizwaan wrote:

firefox 4 with raghindi font

Attached:

Firefox_Raghindi_font.jpg (613×754 px, 111 KB)

fast.rizwaan wrote:

KDE 4.7beta1 konqueror with Nithyananda font

Attached:

konqueror_nithyananda_font.jpg (577×751 px, 100 KB)

fast.rizwaan wrote:

Opera 11.1 with Nithyananda font

Attached:

Opera_Nithyananda_font.jpg (609×686 px, 96 KB)

fast.rizwaan wrote:

Opera 11.1 with Raghindi font

Attached:

Opera_Raghindi_font1.jpg (609×686 px, 97 KB)

fast.rizwaan wrote:

rekonq 0.7.52 with Nithyananda font

Attached:

rekonq_nithyananda_font.jpg (577×779 px, 104 KB)

fast.rizwaan wrote:

rekonq 0.7.52 with raghindi font

thanks.

Attached:

rekonq_raghindi_font.jpg (444×681 px, 70 KB)

I can confirm this in Firefox 5 / Mac OS X on the linked page...

There's an 'overflow: hidden' applied to all headers in Vector skin... and actually in most of our skins (wtf?). In combination with too-tight spacing this is probably what's causing the risers to get cut off.

I'm not sure what the reason for those overflows is; it may be for really-long or really-wide titles in which case fixing it to only apply horizontally might help.

it is there to fix the bunching issue of edit links.

Is that something that becomes obsolete when the section edit links are no longer floated?

mayurdce wrote:

Actually there exists some fonts problem, as Collection extension also show Wrong fonts in generated PDF.Our words are not looking correct in pdf format generated by Collection extension,for example रचियता(correct) is lookin like रचयइता(wrong).

fast.rizwaan wrote:

(In reply to comment #16)

Actually there exists some fonts problem, as Collection extension also show
Wrong fonts in generated PDF.Our words are not looking correct in pdf format
generated by Collection extension,for example रचियता(correct) is lookin like
रचयइता(wrong).

रचियता(correct) is not correct.

रचयिता <- this is correct
n. rachaita:
रचनाकार; सृजनकर्ता; सर्जक; रचयिता; सृजक; रचेता; प्रणेता; कर्त्ता; कर्ता; सिरजनहार; 'वह जो रचना करता या बनाता हो '

mayurdce wrote:

(In reply to comment #17)

(In reply to comment #16)

Actually there exists some fonts problem, as Collection extension also show
Wrong fonts in generated PDF.Our words are not looking correct in pdf format
generated by Collection extension,for example रचियता(correct) is lookin like
रचयइता(wrong).

रचियता(correct) is not correct.

रचयिता <- this is correct
n. rachaita:
रचनाकार; सृजनकर्ता; सर्जक; रचयिता; सृजक; रचेता; प्रणेता; कर्त्ता; कर्ता;
सिरजनहार; 'वह जो रचना करता या बनाता हो '

I know that, plz create a pdf of any article on hindi wiki and see you will find what i am saying.

fast.rizwaan wrote:

(In reply to comment #18)

I know that, plz create a pdf of any article on hindi wiki and see you will
find what i am saying.

Yes, The pdf is not rendering devanagari characters; that might be related to icu-4.8.1 at wikimedia.

Bug 30809 looks closely related.

Windows 7 Home Basic SP1, Safari 5.0.3(7533.19.4), vector skin

Upper diacritics fine, lower diacritics cut in page title and heading. Page: विकिपीडिया:निर्वाचित विषयवस्तु

Attached:

Safari.png (474×935 px, 79 KB)

Created attachment 9041
Add padding for #firstHeading

Zero padding for #firstHeading makes text cut for scripts like Devanagari , Malayalam etc(Bug 29405 and 30809), especially when the glyphs are stacked or having lower diacritic marks.
Remove padding-top:0 and padding-bottom:0 to allow h1 inherit the padding bottom and top values from commonElements.css fixes this.

Fixing overflow:hidden will also make them appear, but will be overlapping with the line below heading.

Attached:

  • Bug 30809 has been marked as a duplicate of this bug. ***

(In reply to comment #22)

Created attachment 9041 [details]
Add padding for #firstHeading

Zero padding for #firstHeading makes text cut for scripts like Devanagari ,
Malayalam etc(Bug 29405 and 30809), especially when the glyphs are stacked or
having lower diacritic marks.
Remove padding-top:0 and padding-bottom:0 to allow h1 inherit the padding
bottom and top values from commonElements.css fixes this.

Fixing overflow:hidden will also make them appear, but will be overlapping with
the line below heading.

The section headings are h2 and under span class mw-heading. Headings h1 to h6 seem to have overflow:hidden and padding-bottom:0.17em . This is causing the headings too to be cut. Maybe setting padding-bottom for mw-heading too would help? (seems good to me at around 0.32em in vector, but that may be browser and machine-specific).

Attached: