Based on iphone.psd i found, i had some button style. you can see them here
http://remi-grumeau.com/iphone/#_buttons
(red, disabled, grey)
Also, i had a <p> in <fieldset><div class="row"> in order to put text left aligned.
About this, i'd like to ask you guys about a PNG vs CSS question i'm asking me lately.
This rounded button with gradient style is actually based on a PNG, but it also could be done in plain CSS, for webkit (using background-image: -webkit-linear-gradient) and firefox (using background-image: -moz-linear-gradient). Both provide an alpha channel.
So my question is: would it be nice to recreate default theme buttons by CSS style or let's just keep PNG as it is ?
1. Creating those button in CSS could be quicklier and bandwidth safer since no image in downloaded - and it seems the HTML renderer use native GPU to render it
2. using a PNG is definitely simplier for theme modification/customization (if you have some image editing skills, which sounds obvious if you want to make a custom theme)
What you think ?
Remi
Actually, it's also a downloading time / bandwidth saving / pages loading question since the CSS file is loaded on website startup and not related images, having those buttons done in plain CSS do not need to download additional contents (PNGs here, which is the worse file-size optimized format). If your 3G/mobile signal is not good, this could be great.
When this button image has been loaded once and so stored in the browser cache, i assume the winner of PNG vs CSS game would still be CSS but from milliseconds only.
I have done a few tests here
http://remi-grumeau.com/iphone/buttons.php#_buttons
first one is the PNG, second is made with 3 border definitions : top, right&left, bottom. Last one use a webkit border image property using linear gradient as image.
Issue : border image and opacity / radius :-S
I'll try to work this out with this example i found: http://www.zenelements.com/blog/images/web-tutorials/css3-introduction/border-color-II.gif
Will keep you informed but it seems gradient border and radius border are not supposed to work together…
Remi
> --
>
> You received this message because you are subscribed to the Google Groups "iui-developers" group.
> To post to this group, send email to iui-dev...@googlegroups.com.
> To unsubscribe from this group, send email to iui-developer...@googlegroups.com.
> For more options, visit this group at http://groups.google.com/group/iui-developers?hl=en.
>
>
Remi Grumeau
(+33) 663 687 206
http://www.remi-grumeau.com
Stan
Thanks, Stan!
Looks ambitious ;) I should have time to comment on it next week.
-- Sean
Cheers!
Stan
> Should you make space for the
> mercurial managed DocBook files in the iUI source and then I make a
> clone to work on?
>
Yes. A placeholder is here:
http://code.google.com/p/iui/source/browse/docs/iUIGuide.xml
Clone away!
Maybe we want a "book" not an "article" we can change that at any time.
I can hook up some basic Java XSLT processing tools fairly easily
if/when needed. We also may want to use XInclude to put
chapters/sections in separate files to make coordination a little easier.
-- Sean
I agree 100%, we need to use all the CSS3 possible to reduce loading
time and optimize the code.
Who will do it? If you need me, drop a line!
Could sounds funny but … any plan for this doc to be accessible via a webapp based on iUI ? :)
> For more options, visit this group at http://groups.google.com/group/iui-developers?hl=en.
>
>
I attended to recreate most of the PNG effect using PNG.
The problem is that you definitely can't get the same level of details, specially for buttons (tail for the back, gradient in borders of buttons, …)
I should publish what i have already btw. Want a copy by mail and enhance what i've start ?
Remi
> --
>
> You received this message because you are subscribed to the Google Groups "iui-developers" group.
> To post to this group, send email to iui-dev...@googlegroups.com.
> To unsubscribe from this group, send email to iui-developer...@googlegroups.com.
> For more options, visit this group at http://groups.google.com/group/iui-developers?hl=en.
>
>
It's been mentioned before and I've been thinking about it.
I'd love to see some extensions to the DocBook XSL stylesheets to
generate an iUI version. I'm not sure how much work it would be or if
anyone in the DocBook community would be interested in helping, but it
would be cool to be able to take any DocBook doc and generate an iUI
version.
DocBook has support for ePub:
http://toc.oreilly.com/2008/06/open-source-docbook-xsl-experimental-epub-support-released.html
ePub was experimental in DocBook XSL 1.74.0 -- I'm not sure how well it
works in 1.75.2 (latest version)
I haven't worked much with DocBook in the last couple of years, so I'm
not sure how it's been improved in that time. The XSL stylesheets are
very powerful and can be customized/extended in many ways. The core
HTML/XHTML stylesheets allow output of a single HTML file or "chunked"
HTML with one file per chapter or section. If you've used DocBook you
can easily recognize on-line documentation that was produced with these
stylesheets.
Working with the XSL is difficult though. The core HTML/XHTML
stylesheets don't produce clean, modern CSS-based markup and the DocBook
team is working to do that, but have acknowledged that the change is not
a small task and have not committed to a schedule for completion.
I'd like to see XSL to produce clean HTML5 (since it is partly based on
DocBook) but that must be even further out. (It would also be cool to
see XSL that makes DocBook from HTML5)
It would seem that the best approach for generating an iUI webapp/site
from DocBook would be to use the chunked output and alter the styles to
work with iui.css and iui.js. The links from the main document to the
chunks would then be iUI Ajax (AHAH) links.
I'm not sure how much the existing styles and attributes would interfere
with iUI or how much work it would be to modify the XSL to produce
(X)HTML/CSS that does work with iUI. It might also be possible to write
some XSL that postprocesses the (X)HTML generated by the existing
stylesheets.
I'll post something to the DocBook list (I used to post on the list
years ago, but am a lurker there these days)
-- Sean
p.s. AHAH is defined here: http://microformats.org/wiki/rest/ahah
Remi
Le 31 déc. 2009 à 02:29, Sean Gilligan a écrit :
> Remi Grumeau wrote:
>> Thx ;))
>> Any suggestions btw ? (for ex sub-sub parts)
>>
>> Could sounds funny but … any plan for this doc to be accessible via a webapp based on iUI ? :)