Last modified: 2008-10-04 06:34:59 UTC

Wikimedia Bugzilla is closed!

Wikimedia has migrated from Bugzilla to Phabricator. Bug reports should be created and updated in Wikimedia Phabricator instead. Please create an account in Phabricator and add your Bugzilla email address to it.
Wikimedia Bugzilla is read-only. If you try to edit or create any bug report in Bugzilla you will be shown an intentional error message.
In order to access the Phabricator task corresponding to a Bugzilla report, just remove "static-" from its URL.
You could still run searches in Bugzilla or access your list of votes but bug reports will obviously not be up-to-date in Bugzilla.
Bug 7020 - Create handheld stylesheet
Create handheld stylesheet
Status: RESOLVED FIXED
Product: MediaWiki
Classification: Unclassified
Interface (Other open bugs)
unspecified
All All
: Normal enhancement with 1 vote (vote)
: ---
Assigned To: Nobody - You can work on this!
:
Depends on:
Blocks: css 1882
  Show dependency treegraph
 
Reported: 2006-08-15 17:12 UTC by Aryeh Gregor (not reading bugmail, please e-mail directly)
Modified: 2008-10-04 06:34 UTC (History)
1 user (show)

See Also:
Web browser: ---
Mobile Platform: ---
Assignee Huggle Beta Tester: ---


Attachments

Description Aryeh Gregor (not reading bugmail, please e-mail directly) 2006-08-15 17:12:11 UTC
Currently we have no stylesheet for handheld devices.  The CSS will devolve
pretty well if the device doesn't support stylesheets, but if it tries to
interpret the screen stylesheets we use now, that will be actively *worse* due
to the enormous floating navigation bars.  Probably what we want is the content
starting at the very top, or close to it, with a prominent "jump to nav" link,
and ideally the search bar at the top at least for the main page.
Comment 1 Aryeh Gregor (not reading bugmail, please e-mail directly) 2006-08-15 18:34:57 UTC
Useful pages:

http://www.htmldog.com/ptg/archives/000055.php
http://my.opera.com/community/dev/mini/phones/

CSS could be used to improve the layout for those UAs that do support it.  JS
could perhaps be used to collapse floated images with a "show" button, too, for
those that support JS (because scrolling past huge images is probably annoying).
 Enwiki could use autohiding for infoboxes as well.

Opera Mobile actually deals with Wikipedia pages quite gracefully as-is.  An
emulator is available in recent desktop copies of Opera.
Comment 2 AnyFile 2006-08-16 14:58:54 UTC
Would be useful, untill a css specific to "handheld" media type is developed, to
have this media type force to use the same css of the  print media type?

That is replace in the HTML of each page, the line that starts with 

<link rel="stylesheet" type="text/css" media="print" href="

with a line starting with

<link rel="stylesheet" type="text/css" media="print, handheld" href="


(sorry, I do not know where to hack in the code, so I can not provide you a patch)

Comment 3 Aryeh Gregor (not reading bugmail, please e-mail directly) 2006-08-16 18:25:40 UTC
(In reply to comment #2)
> Would be useful, untill a css specific to "handheld" media type is developed, to
> have this media type force to use the same css of the  print media type?

I couldn't see why.  They're quite different media; in particular, print has a
much larger canvas, as well as effectively unlimited bandwidth and processing
power (since it's not real-time), and they're also static (can't deal with links
or scrolling, etc.).  Those handheld browsers that support CSS are generally
designed to try figuring out how to deal with screen stylesheets, and won't deal
nearly as well with a print stylesheet.

Unless you were suggesting to just use the same file for both, and give each its
own part via @media declarations within the stylesheet itself.  I don't see much
point in that; saving a few bytes on every page load?
Comment 4 Aryeh Gregor (not reading bugmail, please e-mail directly) 2007-01-07 23:16:10 UTC
Okay, I checked something in for Monobook in r18777.  It seems to be working
pretty decently on Opera Mini, but that was clever enough to avoid the floats
and so on already.  I suppose I'll FIXED this when I make comparable stylesheets
for the other skins.

The duplication of code between the screen/handheld stylesheets kind of annoys
me.  I could fix that up by just loading the whole thing for both and using
suitable @media declarations, of course.  That would probably be best . . .
Comment 5 Aryeh Gregor (not reading bugmail, please e-mail directly) 2007-01-08 18:04:16 UTC
More changes, see r18949 (also r18965).  Still Monobook-only.
Comment 6 Splarka 2007-03-29 02:49:02 UTC
(In reply to comment #5)
> More changes, see r18949 (also r18965).  Still Monobook-only.

There was an odd change to monobook/main.css in r18948 (line 773):

 r1=18903&r2=18949">http://svn.wikimedia.org/viewvc/mediawiki/trunk/phase3/skins/monobook/main.css?r1=18903&r2=18949
 "display: block;"

This puts the portlet links in #p-navigation at odds (different spacing/padding)
with every other left-side link portlet (toolbox, other languages, and
MediaWiki:Sidebar).

For a simple example of this, try this in your user/monobook.css on en.wp:

 .portlet a {background-color: #ccffcc; }

 #p-tb a, #p-interaction a, #p-navigation a { text-decoration: underline; }

Screenshot: http://test.wikipedia.org/wiki/Image:Portletfunky.gif
Comment 7 Aryeh Gregor (not reading bugmail, please e-mail directly) 2007-03-29 15:37:40 UTC
That wasn't a change, I was just reshuffling existing code (and I believe I un-reshuffled it later, 
anyway).  That style was added by tomgilder, r11305.  Offhand I can't think what the point might be.
Comment 8 Aryeh Gregor (not reading bugmail, please e-mail directly) 2007-07-16 14:48:11 UTC
Removed the stylesheet in r24163 after David Storey from Opera said it was screwed up, which I believed, given how little testing it got.  His comments on a handheld stylesheet:

> Removing the handheld stylesheet entirely would probably be the best
> option for now.  If you have time later you can play with it using
> the small screen option in opera desktop and the opera mini simulator
> (once we've removed the hack we have in place).  We can help you with
> any issues.  As Safari doesn't support handheld, it would be best to
> include a media query with the handheld declaration, such as:
> 
> <link media="handheld, screen and (max-device-width: 480px)"
> href="mobile.css" type="text/css" rel="stylesheet" />
> 
> That will make opera and iphone safari pick up the handheld
> stylesheet.  You may need to add meta tags to disable Safari's zoom
> feature 9I don't have a iPhone to test how it handles media queries
> etc).
Comment 9 MZMcBride 2008-10-04 06:34:59 UTC
Fixed by Brion in r40414 I believe. Resolved as such.

Note You need to log in before you can comment on or make changes to this bug.


Navigation
Links