Some css from pkgdb for Fedora Apps

Hey all, I have some css that I'm carrying i nthe pkgdb that would be more generally useful (and could use some touchups by people who know more about design than I :-) I think we should merge this to a global css somewhere. Perhaps fedora.css or something that's for all of the Fedora Applications. I'm looking to answer two questions about these: 1) Where should we put them? 2) How can we improve them? Here's what I have with annotations of what they do: /*************** pageLogin is a box to log people into a TurboGears app. It could use more styling than this if someone wanted to take the time. ***************/ #pageLogin { float: right; } /************** actions is a menubar in the packagedb that links to bodhi, koji, packagedb... Basically all the package oriented apps. Maybe this needs a rename. Maybe it should be moved somewhere else in the templates. **************/ .actions { list-style: none; line-height: 1; margin: 1ex 0!important; } .actions li { display: inline; margin-right: 1ex; } a.bodhi { padding-left: 20px; background: url(../images/bodhi.png) 0 50% no-repeat; } a.koji { padding-left: 20px; background: url(../images/koji.png) 0 50% no-repeat; } a.bugz { padding-left: 20px; background: url(../images/bugz.png) 0 50% no-repeat; } a.pkgdb { padding-left: 20px; background: url(../images/pkgdb.png) 0 50% no-repeat; } a.cvs { padding-left: 20px; background: url(../images/emblem-cvs-controlled.png) 0 50% no-repeat; } /************ Tooltip is a tooltip. A little popup box when you mouseover an area. Both Bodhi and FAS have other implementations of Tooltips. We should have a tooltips class but I don't know which implementation is best. ************/ .ToolTip { display: block; positon: absolute; border: 1px solid black; background-color: lightyellow; width: 200px; } /************* This is used to toggle an element on and off on the page. Using javascript to set the class to invisible makes the element disappear from the page. *************/ .invisible { display: none; } /************** filter is a box that I use for filtering searches. It contains a list of form elements and a submit button to filter out extraneous data. **************/ .filter { background: #ddd; float: right; border-width: 1px; border-color: #000; border-style: solid; padding: .4em; margin: .1em; } .filter li { list-style-type: none; line-height:0; } .filter li select { margin: .1em; } /************** flash is for status messages (usually errors) generated by turbogears. It appears as a banner across the top of a page when you do something unexpected. This was taken from FAS and doesn't do what I want yet -- I haven't figured out how to have a success vs error image, for instance. Bodhi has a different implementation of flash that I haven't looked at. Just like tooltips we need to have something for this. ***************/ .flash { background: #DEE681 url(../images/success.png) 10px 50% no-repeat; border: 1px solid #CCBBAA; padding: 1.5ex 15px 1.5ex 43px; margin: 1ex 0; } -Toshio