Re: Re: Maybe a PLIP for portlets?
Mirto Silvio Busico <mbusico-+bmjRK/[email protected]> Thu, 13 May 2004 12:23:06 +0200
| Newsgroups | gmane.comp.web.zope.plone.design |
|---|---|
| Message-ID | <[email protected]> |
Well I'm not a CSS guru. The skin I realized is working well with
Mozilla and Epyphany, some glitches with Konqueror and Microsofi
Internet Explorer when changiing the font sizes.
To obtain this I had to define a table of three rows and three columns
with pictures on the border and the portlet content in the center cell.
To be clear here is a modified portlet:
==============================================
<html xmlns:tal="http://xml.zope.org/namespaces/tal"
xmlns:metal="http://xml.zope.org/namespaces/metal"
i18n:domain="plone">
<body>
<!-- This code is *really* messed up, and will be replaced in the next
version of Plone.
Do not try to make sense of this.
-->
<div metal:define-macro="portlet"
i18n:domain="plone"
tal:omit-tag=""
tal:define="isContainer here/isPrincipiaFolderish|nothing;
navBatchStart request/navBatchStart | python:None;
portalObject portal;
tree
python:here.plone_utils.createNavigationTreeBuilder(portalObject,navBatchStart);
showOtherNav python:0;
showNav python:0;
listContentsPermission python:checkPermission('List
folder contents', here);
notFolderContents
python:test(template.getId()!='folder_contents', 1, 0);
editorView python:test(listContentsPermission and
notFolderContents, 1, 0);
croppingLength here/navtree_properties/croppingLength
| portal_properties/navtree_properties/croppingLength | python:18;
rolesSeeContentsView
here/navtree_properties/rolesSeeContentsView |
portal_properties/navtree_properties/rolesSeeContentsView |
python:['Manager','Reviewer','Owner'];
useFolderContents
here/navtree_properties/typesLinkToFolderContents |
portal_properties/navtree_properties/typesLinkToFolderContents | python:[];
desc_ellipsis site_properties/ellipsis;"
>
<div class="portlet" id="portlet-navigation-tree">
<div>
/*<div tal:replace="structure here/portlet_tabpre"> </div>*/
<h5 i18n:translate="box_navigation">Navigation</h5>
<div class="portletBody">
<div class="portletContent odd">
<div tal:condition="tree/prev">
<a tal:attributes="href
string:${request/URL}?navBatchStart=${tree/prevBatchStart}">
<span tal:replace="desc_ellipsis">...</span>
</a>
</div>
<div tal:repeat="te tree/list">
<span tal:define="iscurrent te/iscurrent | python:0;
sibling python:te['object'];
typeInfo sibling/getTypeInfo;
stdCommand python:test(not
notFolderContents,'folder_contents',test(typeInfo.id in
useFolderContents,'folder_contents',typeInfo.getActionById('view')));
command python:test(stdCommand in
('folder_contents','folder_listing') and not checkPermission('List
folder contents',sibling) ,'',stdCommand);
title
python:te['object'].title_or_id();
charset
site_properties/default_charset|string:utf-8;
sibling_title python:' '.join(
(unicode(title, charset)[:croppingLength]).encode(charset).split(' '));"
tal:on-error="structure
string:<!--Error in Navigation loop!!-->"
>
<a href=""
tal:condition="python: sibling != portalObject"
tal:define="url
string:${sibling/absolute_url}/${command}"
tal:attributes="href url;
title python:test(title !=
sibling_title, title, '');
style python: 'padding-left:
' + str(te['indent']/2.0) + 'em;;' + 'display:block'; "
accesskey="accesskeys-navigation"
i18n:attributes="accesskey">
<tal:block replace="structure
python:path('here/%s' % sibling.getIcon(1))"
on-error="structure here/site_icon.gif"
/> <span tal:condition="not:
iscurrent" tal:content="sibling_title" /><span class="currentNavItem"
tal:condition=" iscurrent" tal:content="sibling_title" />
</a>
<a href=""
tal:condition="python: sibling == portalObject"
tal:define="url
string:${sibling/absolute_url}/${command}"
tal:attributes="href url;
title title;"
accesskey="accesskeys-navigation"
i18n:attributes="accesskey">
<tal:block replace="structure
portal/site_icon.gif"/> <span class="" tal:attributes="class
python:test(iscurrent,'currentNavItem','')"
i18n:translate="tabs_home">Home</span>
</a>
</span>
</div>
<div tal:condition="tree/next">
<a tal:attributes="href
string:${request/URL}?navBatchStart=${tree/nextBatchStart}">
<span tal:replace="desc_ellipsis">...</span>
</a>
</div>
</div>
</div>
</div>
/* <div tal:replace="structure here/portlet_tabpost"> </div>*/
</div>
</div>
</body>
</html>
==============================================
The added code is rendered in bold
Here is the first table definition:
==============================================
<!--
inizio di tabpre
-->
<table border=0 id="trC" cellpadding=0 cellspacing=0 width=100%>
<tr>
<td id="trCHeadL">
 
</td>
<td id="trCHeadM">
 
</td>
<td id="trCHeadR">
 
</td>
</tr>
<tr>
<td id="trCBodyL">
 
</td>
<td id="trCBodyM">
<!--
fine di tabpre
-->
==============================================
I have a working skin.
My question is: how can this be done *without* modifiyng *all* the portlets.
Regards
Mirto
David Convent wrote:
> Hi there,
> as far as i know, it is possible to render portlets like on your
> screenshot only with CSS.
> This solution would then let you keep all zpt and py skins unmodified,
> and let you add and upgrade all products as you need to.
>
> Mirto Silvio Busico wrote:
>
>> Well, I was not clear. I'll try to explain my mind.
>> If you look at the skin I've realized (screenshot at
>> http://plone.org/Members/mbusico/sh1/image_view ) you can see that
>> portlets are rendered inside a box with a three dimensional aspect.
>> To obtain this I had to hack all and every portlet used in the plone
>> site.
>> This is horrible because for every product change I have to change also
>> the skin.
>