Commit 0fe869e8 authored by Kevin Deldycke's avatar Kevin Deldycke

Split css in two parts: the generic classes for web forms and the specific classes for the theme.

git-svn-id: https://svn.erp5.org/repos/public/erp5/trunk@9811 20353a03-c40f-0410-a6d1-a30d3c3de9de
parent 02711c37
...@@ -44,6 +44,12 @@ ...@@ -44,6 +44,12 @@
</object> </object>
</value> </value>
</item> </item>
<item>
<key> <string>_owner</string> </key>
<value>
<none/>
</value>
</item>
<item> <item>
<key> <string>_text</string> </key> <key> <string>_text</string> </key>
<value> <string encoding="cdata"><![CDATA[ <value> <string encoding="cdata"><![CDATA[
...@@ -71,6 +77,8 @@ ...@@ -71,6 +77,8 @@
* Konqueror 3.4.2\n * Konqueror 3.4.2\n
* Opera 9.01\n * Opera 9.01\n
* Internet Explorer 6 (Layout: OK; Style: not OK)\n * Internet Explorer 6 (Layout: OK; Style: not OK)\n
\n
TODO: Layout is ok in ie6, now styling should be adapted to support ie6.\n
____________________________________*/\n ____________________________________*/\n
\n \n
\n \n
...@@ -82,12 +90,6 @@ ____________________________________*/\n ...@@ -82,12 +90,6 @@ ____________________________________*/\n
margin: 0;\n margin: 0;\n
}\n }\n
\n \n
html {\n
/* XXX width: 85%; work with current layout technic but, background should be changed */\n
margin-right: auto;\n
margin-left: auto;\n
}\n
\n
.clear {\n .clear {\n
clear: both;\n clear: both;\n
}\n }\n
...@@ -135,75 +137,6 @@ span.cancelled {color: #ccc}\n ...@@ -135,75 +137,6 @@ span.cancelled {color: #ccc}\n
\n \n
\n \n
\n \n
/* General Layout.\n
** Layout technic based on http://alistapart.com/articles/holygrail/\n
-----------------------------------------------*/\n
\n
div.content {\n
background: #fff;\n
border: .1em solid #ccc;\n
}\n
\n
/* Define some constant to make the css flexible without pain */\n
<tal:block\n
define="unit python: \'px\';\n
LC_fullwidth python: 200;\n
LC_width python: 180;\n
LC_padding python: 10;\n
CC_padding python: 40;\n
RC_fullwidth python: 150;\n
RC_width python: 130;\n
RC_padding python: 10;\n
">\n
form#main_form {\n
padding-left: <tal:block replace="python: (\'%s%s\') % (LC_fullwidth, unit)"/>;\n
padding-right: <tal:block replace="python: (\'%s%s\') % (RC_fullwidth + CC_padding, unit)"/>;\n
min-width: <tal:block replace="python: (\'%s%s\') % (LC_fullwidth + CC_padding, unit)"/>;\n
}\n
\n
form#main_form div#footer,\n
form#main_form div#header /* XXX Is header working ?? */\n
{\n
margin-left: <tal:block replace="python: (\'-%s%s\') % (LC_fullwidth, unit)"/>;\n
margin-right: <tal:block replace="python: (\'-%s%s\') % (RC_fullwidth + CC_padding, unit)"/>;\n
}\n
\n
form#main_form div.column {\n
position: relative;\n
float: left;\n
}\n
\n
form#main_form div#main_content {\n
padding: 0 20px;\n
width: 100%;\n
}\n
\n
form#main_form div#left_column {\n
width: <tal:block replace="python: (\'%s%s\') % (LC_width, unit)"/>;\n
padding: 0 <tal:block replace="python: (\'%s%s\') % (LC_padding, unit)"/>;\n
right: <tal:block replace="python: (\'%s%s\') % (LC_fullwidth + CC_padding, unit)"/>;\n
margin-left: -100%;\n
}\n
\n
form#main_form div#right_column {\n
width: <tal:block replace="python: (\'%s%s\') % (RC_width, unit)"/>;\n
padding: 0 <tal:block replace="python: (\'%s%s\') % (RC_padding, unit)"/>;\n
margin-right: -100%;\n
}\n
\n
form#main_form div#footer {\n
clear: both;\n
}\n
\n
/*** IE Fix ***/\n
* html form#main_form div#left_column {\n
left: <tal:block replace="python: (\'%s%s\') % (RC_fullwidth, unit)"/>;\n
}\n
\n
</tal:block>\n
\n
\n
\n
/* Widget default styling\n /* Widget default styling\n
----------------------------------------------- */\n ----------------------------------------------- */\n
\n \n
...@@ -237,35 +170,6 @@ div.field.logo label {\n ...@@ -237,35 +170,6 @@ div.field.logo label {\n
\n \n
\n \n
\n \n
<tal:block replace="nothing">\n
/* Special layout for search bar group: move it top right */\n
form#main_form > div.searchBar {\n
position: absolute;\n
z-index: 200;\n
top: .3em;\n
right: 1em; /* Same as "body > form#main_form[padding-right]".\n
TODO: use dtml code to make this more flexible.\n
*/\n
width: 28em; /* XXX Must be adapted dynamiccaly to let several web widget be diplayed inline.\n
TODO: find the appropriate CSS trick to do hit without pain.\n
*/\n
border: 0;\n
}\n
div.searchBar > div.field {\n
float: right;\n
}\n
div.searchBar div.field > label {\n
display: inherit;\n
}\n
div.searchBar > div.field > label,\n
div.searchBar > div.field > div.input {\n
float: left;\n
margin: 0 .5em;\n
}\n
</tal:block>\n
\n
\n
\n
/* Default content styling (apply to everything, site wide);\n /* Default content styling (apply to everything, site wide);\n
Typography & colors (fonts, color, background).\n Typography & colors (fonts, color, background).\n
----------------------------------------------- */\n ----------------------------------------------- */\n
...@@ -685,7 +589,7 @@ div.content fieldset.webcontent.extra label:after {\n ...@@ -685,7 +589,7 @@ div.content fieldset.webcontent.extra label:after {\n
</item> </item>
<item> <item>
<key> <string>id</string> </key> <key> <string>id</string> </key>
<value> <string>erp5_web_default.css</string> </value> <value> <string>erp5_web_form.css</string> </value>
</item> </item>
<item> <item>
<key> <string>title</string> </key> <key> <string>title</string> </key>
......
...@@ -69,7 +69,8 @@ ...@@ -69,7 +69,8 @@
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>\n <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>\n
<title tal:content="python: \'%s | %s\' % (here.getTitleOrId(), here.getPortalObject().getTitle() or here.getPortalObject().getId())"/>\n <title tal:content="python: \'%s | %s\' % (here.getTitleOrId(), here.getPortalObject().getTitle() or here.getPortalObject().getId())"/>\n
\n \n
<link rel="stylesheet" type="text/css" media="screen" href="erp5_web_default.css"/>\n <link rel="stylesheet" type="text/css" media="screen" href="erp5_web_form.css"/>\n
<link rel="stylesheet" type="text/css" media="screen" href="erp5_web_default_theme.css"/>\n
<tal:block tal:repeat="css css_list">\n <tal:block tal:repeat="css css_list">\n
<link tal:attributes="href css" type="text/css" rel="stylesheet"/>\n <link tal:attributes="href css" type="text/css" rel="stylesheet"/>\n
</tal:block>\n </tal:block>\n
...@@ -105,20 +106,18 @@ ...@@ -105,20 +106,18 @@
<tal:block tal:define="template python: here.developper_shortcut_render">\n <tal:block tal:define="template python: here.developper_shortcut_render">\n
<tal:block metal:use-macro="template/macros/form"/>\n <tal:block metal:use-macro="template/macros/form"/>\n
</tal:block>\n </tal:block>\n
<tal:block>\n <tal:block tal:repeat="group groups">\n
<tal:block tal:repeat="group groups">\n <div tal:condition="python: group.find(\'hidden\') < 0"\n
<div tal:condition="python: group.find(\'hidden\') < 0"\n tal:define="group_details python: here.ERP5XhtmlStyle_getFormGroupTitleAndId(group);\n
tal:define="group_details python: here.ERP5XhtmlStyle_getFormGroupTitleAndId(group);\n group_css_classes python: group_details[0]"\n
group_css_classes python: group_details[0]"\n tal:attributes="class python: group_css_classes;\n
tal:attributes="class python: group_css_classes;\n id python: group_css_classes.replace(\' \', \'_\');\n
id python: group_css_classes.replace(\' \', \'_\');\n title python: group_details[1];\n
title python: group_details[1];\n ">\n
">\n <tal:block tal:repeat="field python: layout_form.get_fields_in_group(group)">\n
<tal:block tal:repeat="field python: layout_form.get_fields_in_group(group)">\n <tal:block metal:use-macro="here/field_render/macros/field_render"/>\n
<tal:block metal:use-macro="here/field_render/macros/field_render"/>\n </tal:block>\n
</tal:block>\n </div>\n
</div>\n
</tal:block>\n
</tal:block>\n </tal:block>\n
</tal:block>\n </tal:block>\n
\n \n
......
<?xml version="1.0"?>
<ZopeData>
<record id="1" aka="AAAAAAAAAAE=">
<pickle>
<tuple>
<tuple>
<string>Products.PageTemplates.ZopePageTemplate</string>
<string>ZopePageTemplate</string>
</tuple>
<none/>
</tuple>
</pickle>
<pickle>
<dictionary>
<item>
<key> <string>__ac_local_roles__</string> </key>
<value>
<none/>
</value>
</item>
<item>
<key> <string>_bind_names</string> </key>
<value>
<object>
<klass>
<global name="NameAssignments" module="Shared.DC.Scripts.Bindings"/>
</klass>
<tuple/>
<state>
<dictionary>
<item>
<key> <string>_asgns</string> </key>
<value>
<dictionary>
<item>
<key> <string>name_subpath</string> </key>
<value> <string>traverse_subpath</string> </value>
</item>
</dictionary>
</value>
</item>
</dictionary>
</state>
</object>
</value>
</item>
<item>
<key> <string>_text</string> </key>
<value> <string encoding="cdata"><![CDATA[
<tal:block replace="nothing"\n
xmlns:tal="http://xml.zope.org/namespaces/tal"\n
xmlns:metal="http://xml.zope.org/namespaces/metal"\n
xmlns:i18n="http://xml.zope.org/namespaces/i18n"/>\n
\n
<tal:block define="dummy python: request.RESPONSE.setHeader(\'Content-Type\', \'text/css;; charset=utf-8\')"/>\n
\n
\n
html {\n
/* XXX width: 85%; work with current layout technic but, background should be changed */\n
margin-right: auto;\n
margin-left: auto;\n
}\n
\n
/* General Layout.\n
** Layout technic based on http://alistapart.com/articles/holygrail/\n
-----------------------------------------------*/\n
\n
div.content {\n
background: #fff;\n
border: .1em solid #ccc;\n
}\n
\n
/* Define some constant to make the css flexible without pain */\n
<tal:block\n
define="unit python: \'px\';\n
LC_fullwidth python: 200;\n
LC_width python: 180;\n
LC_padding python: 10;\n
CC_padding python: 40;\n
RC_fullwidth python: 150;\n
RC_width python: 130;\n
RC_padding python: 10;\n
">\n
form#main_form {\n
padding-left: <tal:block replace="python: (\'%s%s\') % (LC_fullwidth, unit)"/>;\n
padding-right: <tal:block replace="python: (\'%s%s\') % (RC_fullwidth + CC_padding, unit)"/>;\n
min-width: <tal:block replace="python: (\'%s%s\') % (LC_fullwidth + CC_padding, unit)"/>;\n
}\n
\n
form#main_form div#footer,\n
form#main_form div#header /* XXX Is header working ?? */\n
{\n
margin-left: <tal:block replace="python: (\'-%s%s\') % (LC_fullwidth, unit)"/>;\n
margin-right: <tal:block replace="python: (\'-%s%s\') % (RC_fullwidth + CC_padding, unit)"/>;\n
}\n
\n
form#main_form div.column {\n
position: relative;\n
float: left;\n
}\n
\n
form#main_form div#main_content {\n
padding: 0 20px;\n
width: 100%;\n
}\n
\n
form#main_form div#left_column {\n
width: <tal:block replace="python: (\'%s%s\') % (LC_width, unit)"/>;\n
padding: 0 <tal:block replace="python: (\'%s%s\') % (LC_padding, unit)"/>;\n
right: <tal:block replace="python: (\'%s%s\') % (LC_fullwidth + CC_padding, unit)"/>;\n
margin-left: -100%;\n
}\n
\n
form#main_form div#right_column {\n
width: <tal:block replace="python: (\'%s%s\') % (RC_width, unit)"/>;\n
padding: 0 <tal:block replace="python: (\'%s%s\') % (RC_padding, unit)"/>;\n
margin-right: -100%;\n
}\n
\n
form#main_form div#footer {\n
clear: both;\n
}\n
\n
/*** IE Fix ***/\n
* html form#main_form div#left_column {\n
left: <tal:block replace="python: (\'%s%s\') % (RC_fullwidth, unit)"/>;\n
}\n
\n
</tal:block>\n
\n
\n
\n
<tal:block replace="nothing">\n
/* Special layout for search bar group: move it top right */\n
form#main_form > div.searchBar {\n
position: absolute;\n
z-index: 200;\n
top: .3em;\n
right: 1em; /* Same as "body > form#main_form[padding-right]".\n
TODO: use dtml code to make this more flexible.\n
*/\n
width: 28em; /* XXX Must be adapted dynamiccaly to let several web widget be diplayed inline.\n
TODO: find the appropriate CSS trick to do hit without pain.\n
*/\n
border: 0;\n
}\n
div.searchBar > div.field {\n
float: right;\n
}\n
div.searchBar div.field > label {\n
display: inherit;\n
}\n
div.searchBar > div.field > label,\n
div.searchBar > div.field > div.input {\n
float: left;\n
margin: 0 .5em;\n
}\n
</tal:block>
]]></string> </value>
</item>
<item>
<key> <string>content_type</string> </key>
<value> <string>text/html</string> </value>
</item>
<item>
<key> <string>expand</string> </key>
<value> <int>0</int> </value>
</item>
<item>
<key> <string>id</string> </key>
<value> <string>erp5_web_default_theme.css</string> </value>
</item>
<item>
<key> <string>title</string> </key>
<value> <string></string> </value>
</item>
</dictionary>
</pickle>
</record>
</ZopeData>
2006-09-11 Kevin
* Split css in two parts: the generic classes for web forms and the specific classes for the theme.
2006-09-08 Kevin 2006-09-08 Kevin
* Use group id for the layout. * Use group id for the layout.
* Fix css layout to support ie6. * Fix css layout to support ie6.
......
374 376
\ No newline at end of file \ No newline at end of file
0.3.29 0.3.30
\ No newline at end of file \ No newline at end of file
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment