Opened 12 years ago
Closed 8 years ago
#592 closed defect (fixed)
Poor overflow handling for thumbnail titles
Reported by: | Sergey "Shnatsel" Davidoff | Owned by: | |
---|---|---|---|
Priority: | major | Milestone: | |
Component: | graphic design/interface | Keywords: | |
Cc: | Jiyda Mint Moussa | Parent Tickets: |
Description
The default theme has poor overflow handling in thumbnail titles, at least in Firefox 18 and Chromium 20. Screenshot: http://pix.toile-libre.org/upload/original/1357821869.png
In CSS3 browsers this can be avoided by using "text-overflow: ellipsis", see http://dev.w3.org/csswg/css3-ui/#text-overflow
In older browsers, perhaps "text-overflow: ellipsis" can be emulated using a JavaScript snippet. If JS is not available either, the text should be at least cut off properly.
Attachments (3)
Change History (15)
comment:1 by , 12 years ago
Owner: | set to |
---|---|
Status: | new → assigned |
comment:2 by , 11 years ago
I fixed this issue in #664 by simply modifying the css. The commit link is
I also attached a screenshot of the results, tested with firefox and chromium.
by , 11 years ago
Attachment: | 592_thumnail_title_overflow.png added |
---|
comment:3 by , 11 years ago
Owner: | removed |
---|---|
Status: | assigned → review |
comment:4 by , 11 years ago
Cc: | added |
---|---|
Owner: | set to |
Status: | review → in_progress |
There's a lot of changing of float: left to float: right and etc... I'm a bit confused by that, could you help me figure out what that is? It looks like it flips a lot of things around... the dropdown menu is now on the right, for instance? I'm not sure why that was done... could you help by explaining to me? :)
Thanks! I'm passing this back to you in the meanwhile...
comment:5 by , 9 years ago
Owner: | removed |
---|---|
Status: | in_progress → accepted |
comment:6 by , 8 years ago
Owner: | set to |
---|---|
Status: | accepted → in_progress |
comment:7 by , 8 years ago
Owner: | removed |
---|---|
Status: | in_progress → review |
This will fix the problem of the text going out of the screen, However if you were to write in one continuous word that will still go out. If the file name was aaaaaaaaaaaaaaaaaaaaaa for example.
The code can be found at https://github.com/Dealsy/mediagoblin
comment:8 by , 8 years ago
Status: | review → accepted |
---|
Sorry, but i cannot review that. There is one big commit that contains all mediagoblin files.
Could you please checkout mediagoblin repo, then make a commit with your change only and push it somewhere?
comment:9 by , 8 years ago
Dealsy has fixed this bad commit in https://github.com/Dealsy/mediagoblin/tree/thumbnail - ready for review.
comment:10 by , 8 years ago
I've tested this patch, and it improves the thumbnail layout significantly when a title is longer than a single line.
comment:11 by , 8 years ago
Status: | accepted → review |
---|
comment:12 by , 8 years ago
Resolution: | → fixed |
---|---|
Status: | review → closed |
Dealsy, your change was merged in commit 8c1728e. Thanks very much for your contribution!
Thanks for this ticket! Assigning to schendje so he can give feedback.