Re: Styling form control elements

2013-12-12 Thread Tab Atkins Jr.
On Thu, Dec 12, 2013 at 10:03 AM, Jonas Sicking jo...@sicking.cc wrote: On Tue, Dec 10, 2013 at 8:24 PM, Tab Atkins Jr. jackalm...@gmail.com wrote: On Wed, Dec 11, 2013 at 2:46 PM, Boris Zbarsky bzbar...@mit.edu wrote: On 12/10/13 6:30 PM, Jonas Sicking wrote: I would also think that you need

Re: Styling form control elements

2013-12-11 Thread Jonas Sicking
On Tue, Dec 10, 2013 at 8:24 PM, Tab Atkins Jr. jackalm...@gmail.com wrote: On Wed, Dec 11, 2013 at 2:46 PM, Boris Zbarsky bzbar...@mit.edu wrote: On 12/10/13 6:30 PM, Jonas Sicking wrote: I would also think that you need properties to position the ::popout. Oh, yes. The extra fun here is:

Re: Styling form control elements

2013-12-10 Thread Jonas Sicking
On Sat, Dec 7, 2013 at 11:57 AM, Domenic Denicola dome...@domenicdenicola.com wrote: From: Jonas Sicking [mailto:jo...@sicking.cc] The reason you've been unable to get rid of the arrow is because it's a separate box that is rendered inside the outermost box. That will remain true even if

RE: Styling form control elements

2013-12-10 Thread Domenic Denicola
From: Jonas Sicking jo...@sicking.cc Actually, I think our mental models are surprisingly aligned. Which is great! More below. Sweet! So dropping the arrowthingy element seems fine. I'm not opposed to it, just trying to come up with something minimal. option:hover should just work, no?

Re: Styling form control elements

2013-12-10 Thread Jonas Sicking
On Tue, Dec 10, 2013 at 3:42 PM, Domenic Denicola dome...@domenicdenicola.com wrote: I'm not sure I understand this. If you want the ::control to render the same way no matter if the select is open or not, then why do you need to test for that state? Right, what I meant was: normally, when

Re: Styling form control elements

2013-12-10 Thread Charles Pritchard
On Dec 6, 2013, at 4:59 AM, Scott González scott.gonza...@gmail.com wrote: On Fri, Dec 6, 2013 at 5:26 AM, Brian Di Palma off...@gmail.com wrote: If UA controls are not styleable in the manner I wish them to be and I have access to custom elements + shadow DOM, I think I would just create my

Re: Styling form control elements

2013-12-10 Thread Boris Zbarsky
On 12/10/13 6:30 PM, Jonas Sicking wrote: I would also think that you need properties to position the ::popout. Oh, yes. The extra fun here is: 1) Should the popout be able to paint outside the browser window? Right now, comboboxes (select size=1) can but normal CSS boxes cannot. 2) The

Re: Styling form control elements

2013-12-10 Thread Tab Atkins Jr.
On Wed, Dec 11, 2013 at 2:46 PM, Boris Zbarsky bzbar...@mit.edu wrote: On 12/10/13 6:30 PM, Jonas Sicking wrote: I would also think that you need properties to position the ::popout. Oh, yes. The extra fun here is: 1) Should the popout be able to paint outside the browser window? Right

RE: Styling form control elements

2013-12-07 Thread Domenic Denicola
From: Boris Zbarsky [mailto:bzbar...@mit.edu] You can, but if it doesn't match the scrollbar width in cases when there is a scrollbar the result looks pretty terrible when the popup is opened... And scrollbar widths are user-configurable. Ah! Right. Well, styling scrollbars would also be

Re: Styling form control elements

2013-12-06 Thread Brian Di Palma
If UA controls are not styleable in the manner I wish them to be and I have access to custom elements + shadow DOM, I think I would just create my own controls and use them instead of UA ones. I know it sounds wasteful but I'd imagine that the best ones would end up being reused much like jQuery

Re: Styling form control elements

2013-12-06 Thread Scott González
On Fri, Dec 6, 2013 at 5:26 AM, Brian Di Palma off...@gmail.com wrote: If UA controls are not styleable in the manner I wish them to be and I have access to custom elements + shadow DOM, I think I would just create my own controls and use them instead of UA ones. And you'll make the

Re: Styling form control elements

2013-12-06 Thread TJ VanToll
On Thu, 5 Dec 2013, Jonas Sicking wrote: I think both are issues. I.e. I think we have two separate use cases: 1. Enable using the built-in rendering of form controls, but style them using author-supplied CSS. 2. Enable completely replacing the rendering of form controls I agree and

Re: Styling form control elements

2013-12-06 Thread Brian Di Palma
On Fri, Dec 6, 2013 at 12:59 PM, Scott González scott.gonza...@gmail.com wrote: On Fri, Dec 6, 2013 at 5:26 AM, Brian Di Palma off...@gmail.com wrote: If UA controls are not styleable in the manner I wish them to be and I have access to custom elements + shadow DOM, I think I would just

Re: Styling form control elements

2013-12-06 Thread Scott González
On Fri, Dec 6, 2013 at 10:53 AM, Brian Di Palma off...@gmail.com wrote: I did mention that these would probably be turned into reusable components in widget libraries. If they hope to be used by developers I see no reason why the issues you raised would not be addressed by those libraries.

Re: Styling form control elements

2013-12-06 Thread Brian Di Palma
On Fri, Dec 6, 2013 at 4:00 PM, Scott González scott.gonza...@gmail.com wrote: On Fri, Dec 6, 2013 at 10:53 AM, Brian Di Palma off...@gmail.com wrote: I did mention that these would probably be turned into reusable components in widget libraries. If they hope to be used by developers I see no

Re: Styling form control elements

2013-12-06 Thread Jonas Sicking
On Thu, Dec 5, 2013 at 5:56 PM, Domenic Denicola dome...@domenicdenicola.com wrote: From: Jonas Sicking [mailto:jo...@sicking.cc] The tricky part is finding a set of pseudo elements that work across different UAs, and that give authors enough control that they can integrate the control with

RE: Styling form control elements

2013-12-06 Thread Domenic Denicola
From: Jonas Sicking [mailto:jo...@sicking.cc] The control that you see by default can simply be targetted with select, no? Hmm, I suppose so. Although I have been unable to get rid of the arrow (which I consider part of that control) with CSS. And, I have found that styles applied to the

Re: Styling form control elements

2013-12-06 Thread Boris Zbarsky
On 12/6/13 10:25 PM, Domenic Denicola wrote: We can create our own arrows with (multiple) background images, or ::after. You can, but if it doesn't match the scrollbar width in cases when there is a scrollbar the result looks pretty terrible when the popup is opened... And scrollbar widths

Re: Styling form control elements

2013-12-06 Thread Jonas Sicking
On Fri, Dec 6, 2013 at 7:25 PM, Domenic Denicola dome...@domenicdenicola.com wrote: From: Jonas Sicking [mailto:jo...@sicking.cc] The control that you see by default can simply be targetted with select, no? Hmm, I suppose so. Although I have been unable to get rid of the arrow (which I

Re: Styling form control elements

2013-12-05 Thread Boris Zbarsky
On 12/5/13 4:30 AM, Ryosuke Niwa wrote: As I understand it, people want to do: select name=cities is=map That's not the main issue being discussed right now, as far as I can tell. What's being discussed, I think, is that people want to do things like: input type=date and then style the

Re: Styling form control elements

2013-12-05 Thread Scott González
Yeah, the big issues come in with using the existing elements. Given input type=date, we want to keep all of the semantics (the APIs, built-in validation, etc.), but apply custom styling. Custom styling may come in the form of CSS or it may come in the form of a completely new UI that uses JS. The

Re: Styling form control elements

2013-12-05 Thread Ryosuke Niwa
On Dec 5, 2013, at 7:38 AM, Boris Zbarsky bzbar...@mit.edu wrote: On 12/5/13 4:30 AM, Ryosuke Niwa wrote: As I understand it, people want to do: select name=cities is=map That's not the main issue being discussed right now, as far as I can tell. Sorry, I should have been more explicit in

Re: Styling form control elements

2013-12-05 Thread Ian Hickson
On Thu, 5 Dec 2013, Ryosuke Niwa wrote: Let me understand the problem of styling/replacing builtin form controls. As I understand it, people want to do: select name=cities is=map optionOakland/option optionSan Francisco/option optionSan Jose/option ... /select or input is=switch

Re: Styling form control elements

2013-12-05 Thread Ian Hickson
On Thu, 5 Dec 2013, Ryosuke Niwa wrote: On Dec 5, 2013, at 8:49 AM, Ian Hickson i...@hixie.ch wrote: On Thu, 5 Dec 2013, Ryosuke Niwa wrote: Let me understand the problem of styling/replacing builtin form controls. As I understand it, people want to do: select name=cities

Re: Styling form control elements

2013-12-05 Thread Jonas Sicking
On Thu, Dec 5, 2013 at 7:38 AM, Boris Zbarsky bzbar...@mit.edu wrote: On 12/5/13 4:30 AM, Ryosuke Niwa wrote: As I understand it, people want to do: select name=cities is=map That's not the main issue being discussed right now, as far as I can tell. What's being discussed, I think, is that

Re: Styling form control elements

2013-12-05 Thread Ian Hickson
On Thu, 5 Dec 2013, Jonas Sicking wrote: I think both are issues. I.e. I think we have two separate use cases: 1. Enable using the built-in rendering of form controls, but style them using author-supplied CSS. 2. Enable completely replacing the rendering of form controls I think 1 is

Re: Styling form control elements

2013-12-05 Thread Jonas Sicking
On Thu, Dec 5, 2013 at 3:15 PM, Ian Hickson i...@hixie.ch wrote: On Thu, 5 Dec 2013, Jonas Sicking wrote: I think both are issues. I.e. I think we have two separate use cases: 1. Enable using the built-in rendering of form controls, but style them using author-supplied CSS. 2. Enable

RE: Styling form control elements

2013-12-05 Thread Domenic Denicola
From: Jonas Sicking [mailto:jo...@sicking.cc] The tricky part is finding a set of pseudo elements that work across different UAs, and that give authors enough control that they can integrate the control with the look-and-feel of their website. I am wondering if we put forward the following

Re: Styling form control elements

2013-12-05 Thread Ryosuke Niwa
On Dec 5, 2013, at 3:15 PM, Ian Hickson i...@hixie.ch wrote: On Thu, 5 Dec 2013, Jonas Sicking wrote: I think both are issues. I.e. I think we have two separate use cases: 1. Enable using the built-in rendering of form controls, but style them using author-supplied CSS. 2. Enable