incubator-adffaces-user mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From Martin Dickson <martin.dick...@peace.com>
Subject Re: selectManyShuttle skinning
Date Thu, 31 Aug 2006 21:00:49 GMT
Hi Simon,

Thank you for the reply -- comments on comments inline. :-)

Simon Lessard wrote:

> On 8/30/06, Martin Dickson <martin.dickson@peace.com> wrote:
>
>>
>> 1) How can one turn off / not render / hide the text-only links in 
>> the  Shuttle for "Move", "Move All", etc?
>> The icon links (e.g. af|selectManyShuttle::move-icon) are addressable 
>> in a stylesheet, but there appears to be no matching ability to style 
>> (and
>> thus hide) the text only links.
>
> What is the use case exactly? A shuttle with icon only?

Yes indeed.  The default use of the Shuttle appears to be either a) only 
text links (no icons) or b) text links and icons.  We want c) icons only.

>
> 2) How is the :hover pseduoclass supported in Trinidad skins?
>
> :hover will pass thourgh the final generated CSS, however this won't work
> with icons.

OK -- I can see that. The images given as content in the CSS become img 
tags in the generated html... which means that I can't use a background 
image switch as we have been doing.  (This is a bit frustrating).

> Also, beware of CSS :hover though as it work only on <a> elements in IE.

Understood. There are ways around this by using IE htc behavior.

>
> I guess you would like to add an highlighted border to the button on 
> :hover... This would be a very nice addition imho and I will try to 
> think of the best way to support it. However I doubt it's possible at 
> the moment.

Not really. What I want to do is switch images on hover.  I can 
currently do this in CSS (on Tomahawk components).  The engineering team 
now want to use Trinidad components and I need to work out how to match 
their behaviour to the rest of the UI (which uses image background 
switching), eg:

a.taskIcon {
    width: 32px;
    height: 32px;
    background-repeat: no-repeat;
    background-position: 0 0px;
}

a.taskIcon.homeIcon {background-image: url("images/home32.png"); }

a.taskIcon:hover {background-position: 0 -32px;}

>
> 2a) (OK so maybe three questions) :-)  Is there a way to set a 
> specific class against each of the links in the Shuttle?
>
> Not currently... Would be a nice addition too. However, supporting 
> something
> like af|selectManyShuttle::move-icon:hover looks better.

Not if it doesn't support images this way.

If I can't support image swapping via the skin selectors I'd still be 
very happy to support it using traditional CSS and classes on the 
links.  Without either I cannot implement with Trinidad something that 
is trivial to implement without it... and that would seem to be an 
undesirable weakness in in the skinning framework.

I cannot see that removing / preventing standard CSS abilities without 
offering an alternative is a good way to go. If there is no method for 
achieving this then using Trinidad is (from this UI designers 
perspective at least) no longer just an "implementation detail". :-)

Regards,
Martin

-- 
Martin Dickson                           ph:  +64 9 3730400 x3592
User Experience Engineer                 fax: +64 9 3730401
First Data Utilities                     http://www.firstdata.com


Mime
View raw message