<html><body style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; "><div><span class="Apple-style-span" style="border-collapse: separate; color: rgb(0, 0, 0); font-family: 'Lucida Grande'; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-align: auto; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; -webkit-text-decorations-in-effect: none; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0; "><span class="Apple-style-span" style="border-collapse: separate; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; color: rgb(0, 0, 0); font-family: 'Lucida Grande'; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; -webkit-text-decorations-in-effect: none; text-indent: 0px; -webkit-text-size-adjust: auto; text-transform: none; orphans: 2; white-space: normal; widows: 2; word-spacing: 0px; "><span class="Apple-style-span" style="border-collapse: separate; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; color: rgb(0, 0, 0); font-family: 'Lucida Grande'; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; -webkit-text-decorations-in-effect: none; text-indent: 0px; -webkit-text-size-adjust: auto; text-transform: none; orphans: 2; white-space: normal; widows: 2; word-spacing: 0px; "><span class="Apple-style-span" style="border-collapse: separate; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; color: rgb(0, 0, 0); font-family: 'Lucida Grande'; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; -webkit-text-decorations-in-effect: none; text-indent: 0px; -webkit-text-size-adjust: auto; text-transform: none; orphans: 2; white-space: normal; widows: 2; word-spacing: 0px; "><span class="Apple-style-span" style="border-collapse: separate; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; color: rgb(0, 0, 0); font-family: 'Lucida Grande'; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; -webkit-text-decorations-in-effect: none; text-indent: 0px; -webkit-text-size-adjust: auto; text-transform: none; orphans: 2; white-space: normal; widows: 2; word-spacing: 0px; "><span class="Apple-style-span" style="border-collapse: separate; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; color: rgb(0, 0, 0); font-family: 'Lucida Grande'; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; -webkit-text-decorations-in-effect: none; text-indent: 0px; -webkit-text-size-adjust: auto; text-transform: none; orphans: 2; white-space: normal; widows: 2; word-spacing: 0px; "><span class="Apple-style-span" style="border-collapse: separate; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; color: rgb(0, 0, 0); font-family: Helvetica; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; -webkit-text-decorations-in-effect: none; text-indent: 0px; -webkit-text-size-adjust: auto; text-transform: none; orphans: 2; white-space: normal; widows: 2; word-spacing: 0px; "><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font-family: Helvetica; "><font class="Apple-style-span" face="Lucida Grande"><span class="Apple-style-span" style="border-collapse: separate; color: rgb(0, 0, 0); font-family: 'Lucida Grande'; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-align: auto; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; -webkit-text-decorations-in-effect: none; -webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0; "><span class="Apple-style-span" style="border-collapse: separate; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; color: rgb(0, 0, 0); font-family: 'Lucida Grande'; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; -webkit-text-decorations-in-effect: none; text-indent: 0px; -webkit-text-size-adjust: auto; text-transform: none; orphans: 2; white-space: normal; widows: 2; word-spacing: 0px; "><span class="Apple-style-span" style="border-collapse: separate; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; color: rgb(0, 0, 0); font-family: 'Lucida Grande'; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; -webkit-text-decorations-in-effect: none; text-indent: 0px; -webkit-text-size-adjust: auto; text-transform: none; orphans: 2; white-space: normal; widows: 2; word-spacing: 0px; "><span class="Apple-style-span" style="border-collapse: separate; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; color: rgb(0, 0, 0); font-family: 'Lucida Grande'; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; -webkit-text-decorations-in-effect: none; text-indent: 0px; -webkit-text-size-adjust: auto; text-transform: none; orphans: 2; white-space: normal; widows: 2; word-spacing: 0px; "><span class="Apple-style-span" style="border-collapse: separate; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; color: rgb(0, 0, 0); font-family: 'Lucida Grande'; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; -webkit-text-decorations-in-effect: none; text-indent: 0px; -webkit-text-size-adjust: auto; text-transform: none; orphans: 2; white-space: normal; widows: 2; word-spacing: 0px; "><span class="Apple-style-span" style="border-collapse: separate; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; color: rgb(0, 0, 0); font-family: Helvetica; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; -webkit-text-decorations-in-effect: none; text-indent: 0px; -webkit-text-size-adjust: auto; text-transform: none; orphans: 2; white-space: normal; widows: 2; word-spacing: 0px; "><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font-family: Helvetica; "><font class="Apple-style-span" face="Lucida Grande"><span class="Apple-style-span" style="border-collapse: separate; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; color: rgb(0, 0, 0); font-family: 'Lucida Grande'; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; -webkit-text-decorations-in-effect: none; text-indent: 0px; -webkit-text-size-adjust: auto; text-transform: none; orphans: 2; white-space: normal; widows: 2; word-spacing: 0px; "><span class="Apple-style-span" style="border-collapse: separate; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; color: rgb(0, 0, 0); font-family: 'Lucida Grande'; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; -webkit-text-decorations-in-effect: none; text-indent: 0px; -webkit-text-size-adjust: auto; text-transform: none; orphans: 2; white-space: normal; widows: 2; word-spacing: 0px; "><span class="Apple-style-span" style="border-collapse: separate; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; color: rgb(0, 0, 0); font-family: 'Lucida Grande'; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; -webkit-text-decorations-in-effect: none; text-indent: 0px; -webkit-text-size-adjust: auto; text-transform: none; orphans: 2; white-space: normal; widows: 2; word-spacing: 0px; "><span class="Apple-style-span" style="border-collapse: separate; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; color: rgb(0, 0, 0); font-family: 'Lucida Grande'; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; -webkit-text-decorations-in-effect: none; text-indent: 0px; -webkit-text-size-adjust: auto; text-transform: none; orphans: 2; white-space: normal; widows: 2; word-spacing: 0px; "><span class="Apple-style-span" style="border-collapse: separate; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; color: rgb(0, 0, 0); font-family: Helvetica; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; -webkit-text-decorations-in-effect: none; text-indent: 0px; -webkit-text-size-adjust: auto; text-transform: none; orphans: 2; white-space: normal; widows: 2; word-spacing: 0px; "><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font-family: Helvetica; "><font class="Apple-style-span" face="Lucida Grande"><span class="Apple-style-span" style="border-collapse: separate; -webkit-border-horizontal-spacing: 0px; -webkit-border-vertical-spacing: 0px; color: rgb(0, 0, 0); font-family: 'Lucida Grande'; font-size: 12px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; -webkit-text-decorations-in-effect: none; text-indent: 0px; -webkit-text-size-adjust: auto; text-transform: none; orphans: 2; white-space: normal; widows: 2; word-spacing: 0px; ">I dont have proper rounded corners on my subskins product <span class="Apple-style-span" style="font-family: Helvetica; "><a href="http://plone.org/products/subskins-iii/releases/1.0%20beta">http://plone.org/products/subskins-iii/releases/1.0%20beta</a> <span class="Apple-style-span" style="font-family: 'Lucida Grande'; ">, and people keep asking for it, so if anyone can be bothered to make some (gonna need it with jquery (?) as the background colors changes.</span></span></span></font></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font-family: Helvetica; "><font class="Apple-style-span" face="'Lucida Grande'"><br></font></div></span></span></span></span>= If someone can make a new file to put in the subskinsiii_portlets folder</span></font></div></span></span></span></span></span><br class="Apple-interchange-newline"></span><br class="Apple-interchange-newline"> </font></div><font class="Apple-style-span" face="Lucida Grande"></font></span></span></span></span></span></span></span></div><br><div><div>Den 25. feb. 2009 kl. 21.58 skrev Veda Williams:</div><br class="Apple-interchange-newline"><blockquote type="cite"> <font face="Verdana, Helvetica, Arial"><span style="font-size:10.0px">Excellent!<br> <br> Since you’re working on the filesystem, you can find the syntax for the other portlets by going to yourbuildout/eggs/plone.app.portlets[some version number]/plone/app/portlets/portlets/configure.zcml. <br> <br> If you’re using omelette, you’d go to: yourbuildout/omelette/plone/app/portlets/portlets/configure.zcml.<br> <br> It’s always best to be sure that you’ve got the right code.<br> <br> Same goes for plone.app.layout --> it’s in yourbuildout/eggs/plone.app.layout[some version number]/plone/app/layout/ or via omelette it is: yourbuildout/omelette/plone/app/layout/<br> <br> I’d recommend grabbing the omelette egg if you possibly can — saves a lot of hunting and pecking, though really plain old symlinks will do the trick. <br> <br> - Veda<br> <br> <br> On 2/25/09 12:51 PM, "erik kulvinskas" &lt;<a href="mailto:vaporboy@gmail.com">vaporboy@gmail.com</a>> wrote:<br> <br> </span></font><blockquote type="cite"><font face="Verdana, Helvetica, Arial"><span style="font-size:10.0px">Veda, <br> <br> OK i used the ID of the Portlet and that seems to work. I do have a <br> question though on portlets. I skinned the News portlet no problem. I <br> have a news.pt file and in my configure.zcml i have the following <br> lines: <br> <br>     &lt;interface <br>         interface=".interfaces.IThemeSpecific" <br>         type="zope.publisher.interfaces.browser.IBrowserSkinType" <br>         name="external" <br>         /> <br> <br>         &lt;include package="plone.app.portlets" /> <br>                 &lt;plone:portletRenderer portlet="plone.app.portlets.portlets.news.INewsPortlet" <br>    template="templates/news.pt" <br>    layer=".interfaces.IThemeSpecific" <br>    /> <br> <br> <br> Do all of the portlets use the same syntax? In other words, can i copy <br> and paste the portletrenderer lines above and just rename iNewsPortlet <br> to IEventsPortlet (if i were doing the events portlet). If not, where <br> do i find the information i need to make sure i call the portlet <br> correctly in the configure.zcml? <br> <br> Thanks! <br> <br> -erik <br> <br> On Wed, Feb 25, 2009 at 12:49 PM, vedaw (via Nabble) <br> &lt;ml-user+36195-1628119807@... <a href="http://n2.nabble.com/user/SendEmail.jtp?type=node&amp;node=2386038&amp;i=0">&lt;http://n2.nabble.com/user/SendEmail.jtp?type=node&amp;node=2386038&amp;i=0></a> > wrote: <br> <br> > Ok, I understand you now. Interesting solution, I'm accustomed to using <br> > sprites, but this is certainly an extra twist. <br> > <br> > Why does specificity in your stylesheets based on the ID of the portlet, not <br> > work? For example: <br> > <br> > .portletRSS .dialog .content, <br> > .portletRSS .dialog .t, <br> > .portletRSS .dialog .b, <br> > .portletRSS .dialog .b div { <br> >  background:transparent url(dialog2-blue-800x1600.png) no-repeat top right; <br> >  _background-image:url(dialog2-blue.gif); <br> > } <br> > <br> > .portlet-news .dialog .content, <br> > .portlet-news .dialog .t, <br> > .portlet-news .dialog .b, <br> > .portlet-news .dialog .b div { <br> >  background:transparent url(different swappable PNG here or maybe <br> > coordinates of the first image where the area is a different color header); <br> > } <br> > <br> > Are you combining all of the different colored PNGs into a single image, or <br> > do you have more than one PNG? <br> > <br> > BTW, I don't understand your issue with transparency -- you are using a PNG, <br> > right? Either you can use PNG8 to get IE6 to behave, or there is also an <br> > add-on you can use to do it with javascript: <br> > <br> > <a href="http://plone.org/products/products-easyaspiie">http://plone.org/products/products-easyaspiie</a><br> > <br> > Glad to hear you're looking forward to my book (I assume you mean the <br> > skinning book?), but I should warn you that it won't dive into CSS tricks <br> > like you're asking here. I'll leave that for the CSS geeks in the world. :) <br> > <br> > It's going to be geared more towards a "get your hands dirty, here are the <br> > tools and theming gotchas to worry about" than anything. It's also more for <br> > beginners, so if you're already working on the filesystem comfortably, there <br> > may not be much the book does give you... <br> > <br> > Practical Plone, the other book, *does* have something for everyone, IMO. <br> > <br> > Cheers, <br> > <br> > - Veda <br> > <br> > <br> > <br> > On 2/25/09 11:02 AM, "erik kulvinskas" &lt;vaporboy@...> wrote: <br> > <br> >> <br> >> All, thanks for your responses but i AM developing on the file system. I <br> >> have <br> >> change the portlet code because A, the method i am using for rounded <br> >> corners <br> >> is different from how Plone does things. B, the method i am using is much <br> >> simpler using divs instead of dl's, dt's, etc etc. <br> >> <br> >> Instead of using custom css for every portlet color, i figured it would be <br> >> easier to call the css and just switch out the single image i am using for <br> >> the rounded corners depending on the portlet i am in (news, rss, etc) . <br> >> You <br> >> can find the method i am using here: <br> >> <a href="http://www.schillmania.com/content/projects/even-more-rounded-corners/">http://www.schillmania.com/content/projects/even-more-rounded-corners/</a><br> >> <br> >> Oh, and implementing rounded corners WITH transparent curves is not a <br> >> trivial thing in the standard build-out of plone. i have a gradient <br> >> background and need rounded corners to look properly. So, many of the <br> >> methods that exist out there that have 'rounded corners' work ONLY if you <br> >> background is solid that the corner resides on. The above method is the <br> >> one <br> >> i found that works quite nicely <br> >> <br> >> Veda, thanks for the info on the links and tutorials, i have poured <br> >> through <br> >> those, i have about every plone/zope book out there (waiting for yours to <br> >> be <br> >> available) and i 'get' the file system development. <br> >> <br> >> Erik <br> >> <br> >> <br> >> <br> >> vedaw wrote: <br> >>> <br> >>> It sounds like you've started working through the ZMI to do skinning, <br> >>> which <br> >>> is an OK place to start until you get the concepts down. You will have <br> >>> trouble moving things around via the ZMI, at which point you should start <br> >>> looking at filesystem development. <br> >>> <br> >>> In the meantime... Rene is correct in saying that this can be done <br> >>> trivially <br> >>> using only CSS and the CSS hooks that Plone portlets give you by default. <br> >>> Make the changes to your ploneCustom.css, make sure that your portal_css <br> >>> is <br> >>> in debug mode ( <br> >>> <br> >>> <a href="http://plone.org/documentation/how-to/how-to-make-your-css-changes-take-effe">http://plone.org/documentation/how-to/how-to-make-your-css-changes-take-effe</a><br> >>> ct-instantly), and you should see the updates. <br> >>> <br> >>> There's no need for variables / calling of CSS, etc. Plone already knows <br> >>> about ploneCustom.css, so it should be pretty straightforward. <br> >>> <br> >>> I'm somewhat biased, but there's a great theming chapter in the new <br> >>> Practical Plone book if you need some step-by-step assistance: <br> >>> <br> >>> <br> >>> <a href="http://www.packtpub.com/practical-plone-3-beginners-guide-to-building-powerf">http://www.packtpub.com/practical-plone-3-beginners-guide-to-building-powerf</a><br> >>> ul-websites/ <br> >>> <br> >>> Cheers, <br> >>> <br> >>> - Veda <br> >>> <br> >>> <br> >>> On 2/25/09 7:55 AM, "erik kulvinskas" &lt;vaporboy@...> wrote: <br> >>> <br> >>>> <br> >>>> I am trying to create a custom color header for each type of portlet <br> >>>> type <br> >>>> within my theme. I have created some custom css in my ploneCustom.css <br> >>>> (&lt;theme>/skins/theme_styles) for my theme using a rounded corner <br> >>>> technique <br> >>>> and it looks great. What i would like to do, for example, is have the <br> >>>> news <br> >>>> portlets have a grey header and RSS portlets to have an orange header, <br> >>>> etc. <br> >>>> So for the news portlet, i have a custom news.pt file that i am loading <br> >>>> within my theme and i THINK i have to do the following: <br> >>>> <br> >>>> 1) set some sort of variable in my news.pt file such as 'portletColor <br> >>>> string:grey' <br> >>>> 2) separate out the rounded corners css into a separate css file <br> >>>> 3) call that css file within my news.pt and pass that variable to the <br> >>>> css <br> >>>> so <br> >>>> that the particular image it calls is the one that i have set as a <br> >>>> variable <br> >>>> in the news.pt file. <br> >>>> <br> >>>> So here are my questions: <br> >>>> <br> >>>> 1) am i thinking of this correctly? <br> >>>> 2) if so, what type of file do i save this ccs as? a .pt or .dtml <br> >>>> 3) where do i call this css from? browser/templates/blah.css.dtml(.pt) <br> >>>> ?? <br> >>>> 4) how do i pass the variable value from the news.pt to the css and then <br> >>>> have the css render that value when it gets called? <br> >>>> <br> >>>> I hope i have not been too confusing. <br> >>>> <br> >>>> thanks, <br> >>>> <br> >>>> -erik <br> >>> <br> >>> <br> >>> _______________________________________________ <br> >>> UI mailing list <br> >>> UI@... <br> >>> <a href="http://lists.plone.org/mailman/listinfo/ui">http://lists.plone.org/mailman/listinfo/ui</a><br> >>> <br> >>> <br> > <br> > _______________________________________________ <br> > UI mailing list <br> > UI@... <br> > <a href="http://lists.plone.org/mailman/listinfo/ui">http://lists.plone.org/mailman/listinfo/ui</a><br> > <br> > <br> > ________________________________ <br> > This email is a reply to your post @ <br> > <a href="http://n2.nabble.com/Custom-CSS-for-different-portlet-types--tp2384432p2385719.html">http://n2.nabble.com/Custom-CSS-for-different-portlet-types--tp2384432p2385719.html</a><br> > You can reply by email or by visting the link above. <br> > <br> > <br> <br> <hr align="LEFT" size="3" width="300">View this message in context: Re: [Plone-UI] Custom CSS for different portlet types? <a href="http://n2.nabble.com/Custom-CSS-for-different-portlet-types--tp2384432p2386038.html">&lt;http://n2.nabble.com/Custom-CSS-for-different-portlet-types--tp2384432p2386038.html></a> <br> Sent from the User Interface &amp; Design mailing list archive <a href="http://n2.nabble.com/User-Interface---Design-f293357.html">&lt;http://n2.nabble.com/User-Interface---Design-f293357.html></a>  at Nabble.com.<br> <br> <hr align="CENTER" size="3" width="95%"></span></font><span style="font-size:10.0px"><font face="Monaco, Courier New">_______________________________________________<br> UI mailing list<br> <a href="mailto:UI@lists.plone.org">UI@lists.plone.org</a><br> <a href="http://lists.plone.org/mailman/listinfo/ui">http://lists.plone.org/mailman/listinfo/ui</a><br> </font></span></blockquote><span style="font-size:10.0px"><font face="Monaco, Courier New"><br> </font></span><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; ">_______________________________________________</div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; ">UI mailing list</div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; "><a href="mailto:UI@lists.plone.org">UI@lists.plone.org</a></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; "><a href="http://lists.plone.org/mailman/listinfo/ui">http://lists.plone.org/mailman/listinfo/ui</a></div> </blockquote></div><br></body></html>