svn commit: r782120 - in /ofbiz/trunk: framework/images/webapp/images/ecommain.css framework/images/webapp/images/forms.css specialpurpose/ecommerce/webapp/ecommerce/customer/newcustomer.ftl

Previous Topic Next Topic
 
classic Classic list List threaded Threaded
1 message Options
Reply | Threaded
Open this post in threaded view
|

svn commit: r782120 - in /ofbiz/trunk: framework/images/webapp/images/ecommain.css framework/images/webapp/images/forms.css specialpurpose/ecommerce/webapp/ecommerce/customer/newcustomer.ftl

apatel-2
Author: apatel
Date: Fri Jun  5 20:04:16 2009
New Revision: 782120

URL: http://svn.apache.org/viewvc?rev=782120&view=rev
Log:
more improvements to forms styling in ecommerce component.

Modified:
    ofbiz/trunk/framework/images/webapp/images/ecommain.css
    ofbiz/trunk/framework/images/webapp/images/forms.css
    ofbiz/trunk/specialpurpose/ecommerce/webapp/ecommerce/customer/newcustomer.ftl

Modified: ofbiz/trunk/framework/images/webapp/images/ecommain.css
URL: http://svn.apache.org/viewvc/ofbiz/trunk/framework/images/webapp/images/ecommain.css?rev=782120&r1=782119&r2=782120&view=diff
==============================================================================
--- ofbiz/trunk/framework/images/webapp/images/ecommain.css (original)
+++ ofbiz/trunk/framework/images/webapp/images/ecommain.css Fri Jun  5 20:04:16 2009
@@ -20,55 +20,97 @@
 @import url("reset.css");
 @import url("forms.css");
 
-a,address,body,caption,cite,code,dfn,em,strong,th,var {
-font-style:normal;
-font-weight:400;
-text-decoration:none;
+/***********************************************
+General Styles
+***********************************************/
+body {
+background: #fff;
+color: #333;
+font-family: Arial, Helvetica, sans-serif;
+font-size:.75em;
+line-height:1.5em;
+text-align:center;
 }
 
-body,caption,th {
-text-align:left;
-}
+img {display: inline-block; vertical-align: bottom;}
 
-h1,h2,h3,h4,h5,h6 {
-font-size:100%;
-}
+h1,h2,h3,h4,h5,h6,strong,b,dt,th {font-weight: 700;}
+address,cite,em,i,caption,dfn,var {font-style: italic;}
+
+h1 {margin: 0 0 0.75em; font-size: 2em; color:#1F2948;}
+h2 {margin: 0 0 1em; font-size: 1.5em;}
+h3 {margin: 0 0 .5em; font-size: 1.167em; color:#1F2948;}
+h4 {margin: 0 0 1.5em; font-size: 1em;}
+h5 {margin: 0 0 1.8em; font-size: .834em;}
+h6 {margin: 0 0 2em; font-size: .75em;}
 
 h1 span,h2 span,h3 span ,h4 span ,h5 span,h6 span {font-size:75%}
 
-ol,ul {
-list-style:none;
-}
+p,ul,ol,dl,blockquote,pre {margin: 0 0 1.5em;}
 
-a,a:visited {
-color:#1C334D;
-font-weight:700;
-}
+blockquote {padding: 0 1.5em;}
 
-a:hover,a:active {
-text-decoration:underline;
+li ul,li ol {margin: 0;}
+ul {list-style: none;}
+ol {list-style: outside decimal;}
+li {margin: 0;}
+
+dl { margin: 0 0 1.5em 0; }
+dl dt { font-weight: bold; }
+dd { margin-left: 1.5em;}
+
+a, a:link, a:visited {text-decoration: none; color:#1C334D; font-weight:700;}
+a:hover {text-decoration: none; color:#111;}
+abbr,acronym {border-bottom: 1px dotted; cursor: help;}
+del {text-decoration: line-through;}
+ins {text-decoration: overline;}
+sub {font-size: .834em; line-height: 1em; vertical-align: sub;}
+sup {font-size: .834em; line-height: 1em; vertical-align: super;}
+strong { font-weight: bold; }
+em, dfn { font-style: italic; }
+
+tt,code,kbd,samp,pre {font-size: 1em; font-family: "Courier New", Courier, monospace;}
+
+/***********************************************
+Tables
+***********************************************/
+table {border-collapse: collapse; border-spacing: 0; margin: 0 0 1.5em;}
+caption {text-align: left;}
+th, td {padding: .25em .5em;}
+tbody td, tbody th {}
+
+col.colC {width:8em;}
+
+th, td {padding:.2em 1em;text-align:left;}
+
+thead th {
+border-bottom:2px solid #888;
+background:#bbb;
+padding:.4em 1em .2em;
+}
+thead th.table-head {
+font-size:1em;
+font-weight:normal;
+text-transform:uppercase;
+color:#fff;
+background:#555;
+border:1px solid #555;
 }
 
+tbody th, tbody td {border-top:1px solid #bbb;}
+tbody tr.odd th, tbody tr.odd td {background:#fff;}
+
+tfoot th, tfoot td {border-top:2px solid #666;background:#eee;text-align:right}
+tfoot tr.total th, tfoot tr.total td {border-top:6px double #666;}
+
+tfoot tr.total th {text-transform:uppercase;}
+th.currency, td.currency {text-align:right;}
+
 .disabled {
 color:#336;
 text-decoration:none;
 }
 
-body {
-background-color:#FFF;
-color:#000;
-font-family:Verdana, Arial, Helvetica, sans-serif;
-font-size:10px;
-margin:10px;
-}
-
-hr {
-background-color:#999;
-border:0;
-height:1px;
-margin:5px 0;
-}
-
 input[type=radio],input[type=checkbox] {
 font-size:8pt;
 }
@@ -92,46 +134,6 @@
 font-size:11px;
 }
 
-h1,.h1 {
-color:#1C334D;
-font-size:12pt;
-font-weight:700;
-}
-
-h2,.h2 {
-font-size:10pt;
-font-weight:700;
-}
-
-h3,.h3 {
-font-size:8pt;
-font-weight:700;
-}
-
-table {
-font-size:10px;
-}
-
-table input {
-border:#999 solid 1px;
-}
-
-textarea {
-background:#FFF;
-border:#999 solid 1px;
-font-size:8pt;
-margin:2px;
-}
-
-th,th a {
-color:#000;
-font-weight:700;
-}
-
-img {
-behavior:url(/images/pngbehavior.htc);
-}
-
 .endcolumns {
 clear:both;
 height:0;
@@ -158,16 +160,16 @@
 }
 
 #ecom-header #left {
-left:0;
+left:10px;
 position:absolute;
-top:0;
+top:20px;
 width:280px;
 }
 
 #ecom-header #middle {
 margin-left:290px;
 margin-right:210px;
-padding-top:10px;
+padding-top:20px;
 text-align:center;
 width:auto;
 }
@@ -176,7 +178,7 @@
 margin-top:20px;
 padding:0;
 position:absolute;
-right:0;
+right:20px;
 text-align:right;
 top:0;
 width:290px;
@@ -233,7 +235,7 @@
 
 #ecom-header-bar {
 background:#B4B0AA;
-height:14px;
+height:18px;
 overflow:visible;
 text-align:center;
 }
@@ -245,7 +247,7 @@
 }
 
 #ecom-header-bar ul li {
-height:14px;
+height:18px;
 padding:0 8px;
 }
 
@@ -275,39 +277,43 @@
 margin-top:10px;
 position:relative;
 width:100%;
+text-align:left;
 }
 
 #ecom-mainarea .left {
 background:#fff;
 float:left;
-width:150px;
+width:180px;
+margin:0 0 0 10px;
 }
 
 #ecom-mainarea .right {
 background:#fff;
 float:right;
-width:200px;
+width:240px;
+margin:0 10px 0 0;
 }
 
 #ecom-mainarea .center,#ecom-mainarea .leftonly,#ecom-mainarea .rightonly,#ecom-mainarea .nocolumns {
 background:#fff;
 text-align:left;
 vertical-align:top;
+margin:0 0 0 10px;
 }
 
 #ecom-mainarea .center {
-margin-left:161px;
-margin-right:211px;
+margin-left:201px;
+margin-right:261px;
 voice-family:inherit;
 }
 
 #ecom-mainarea .leftonly {
-margin-left:161px;
+margin-left:201px;
 voice-family:inherit;
 }
 
 #ecom-mainarea .rightonly {
-margin-right:211px;
+margin-right:261px;
 voice-family:inherit;
 }
 

Modified: ofbiz/trunk/framework/images/webapp/images/forms.css
URL: http://svn.apache.org/viewvc/ofbiz/trunk/framework/images/webapp/images/forms.css?rev=782120&r1=782119&r2=782120&view=diff
==============================================================================
--- ofbiz/trunk/framework/images/webapp/images/forms.css (original)
+++ ofbiz/trunk/framework/images/webapp/images/forms.css Fri Jun  5 20:04:16 2009
@@ -33,7 +33,7 @@
 *+html legend {margin-left: -7px;}
 
 form .form-row, .buttons {clear: both; margin: 0 0 0.8em;}
-form .form-row label {display: block; padding-bottom:.34em}
+form .form-row label {display: block; padding-bottom:.08em}
 form ul li {list-style-type: none; margin: 0;}
 form .inline li, form .inline label {display: inline;}
 form .inline li {padding: 0 .75em 0 0;}
@@ -82,68 +82,68 @@
 /***********************************************
 Buttons
 ***********************************************/
-.buttons { font-size:110%; padding:5px 0px 5px 0px; text-align:center;}
-.buttons a, .buttons button, .buttons input[type=submit], .buttons input[type=reset]{
-display:block;
-float:left;
+.buttons { font-size:100%; padding:5px 0px 5px 0px;}
+a.button, button.button, input[type=submit].button, input[type=reset].button{
+display:inline;
 margin:0 7px 0 0;
 background-color:#f5f5f5;
 border:1px solid #dedede;
 border-top:1px solid #eee;
 border-left:1px solid #eee;
 font-family:"Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
-font-size:110%;
-line-height:140%;
+font-size:100%;
+line-height:130%;
 text-decoration:none;
 font-weight:bold;
 color:#565656;
 cursor:pointer;
 padding:5px 10px 6px 7px; /* Links */
 }
-.buttons button{
+button{
 width:auto;
 overflow:visible;
 padding:4px 10px 3px 7px; /* IE6 */
 }
-.buttons button[type]{
+button[type]{
 padding:5px 10px 5px 7px; /* Firefox */
 line-height:17px; /* Safari */
 }
 *:first-child+html button[type]{
 padding:4px 10px 3px 7px; /* IE7 */
 }
-button:hover, .buttons a:hover{
+button:hover, a.button:hover{
 background-color:#dff4ff;
 border:1px solid #c2e1ef;
 color:#336699;
 }
-.buttons a:active{
+a.button:active{
 background-color:#6299c5;
 border:1px solid #6299c5;
 color:#fff;
 }
-.buttons input[type=submit]:hover {
+
+input[type=submit].button:hover {
 background-color:#dff4ff;
 border:1px solid #c2e1ef;
 color:#336699;
 }
-.buttons a.submit:active{
+a.submit:active{
 background-color:#529214;
 border:1px solid #529214;
 color:#fff;
 }
-.buttons a.reset, button.reset{color:#d12f19;}
-.buttons a.reset:hover, button.reset:hover{
+a.reset, button.reset{color:#d12f19;}
+a.reset:hover, button.reset:hover{
 background:#fbe3e4;
 border:1px solid #fbc2c4;
 color:#d12f19;
 }
-.buttons input[type=reset]:hover, .buttons button[type=reset]:hover {
+input[type=reset].button:hover, button[type=reset].button:hover {
 background:#fbe3e4;
 border:1px solid #fbc2c4;
 color:#d12f19;
 }
-.buttons a.reset:active{
+a.reset:active{
 background-color:#d12f19;
 border:1px solid #d12f19;
 color:#fff;

Modified: ofbiz/trunk/specialpurpose/ecommerce/webapp/ecommerce/customer/newcustomer.ftl
URL: http://svn.apache.org/viewvc/ofbiz/trunk/specialpurpose/ecommerce/webapp/ecommerce/customer/newcustomer.ftl?rev=782120&r1=782119&r2=782120&view=diff
==============================================================================
--- ofbiz/trunk/specialpurpose/ecommerce/webapp/ecommerce/customer/newcustomer.ftl (original)
+++ ofbiz/trunk/specialpurpose/ecommerce/webapp/ecommerce/customer/newcustomer.ftl Fri Jun  5 20:04:16 2009
@@ -58,11 +58,12 @@
 </script>
 </#if>
 
-<!--------------------------------------------------------------------------------------------
-NOTE: all page headings should start with an <h2></h2> tag,
-(not an H1 tag, as there should generally always only be one <h1></h1> tag on the page and
-that will generally always be reserved for the logo at the top of the page.
----------------------------------------------------------------------------------------------->
+<!------------------------------------------------------------------------------
+NOTE: all page headings should start with an h2 tag, not an H1 tag, as
+there should generally always only be one h1 tag on the page and that
+will generally always be reserved for the logo at the top of the page.
+------------------------------------------------------------------------------->
+
 <h2>${uiLabelMap.PartyRequestNewAccount}
  <span>
  ${uiLabelMap.PartyAlreadyHaveAccount}, <a href='<@ofbizUrl>checkLogin/main</@ofbizUrl>'>${uiLabelMap.CommonLoginHere}</a>
@@ -399,15 +400,17 @@
   
 </form>
 
-<!--------------------------------------------------------------------------------------------
-To create a consistent look and feel for all buttons, input[type=submit], and a tags acting as
-submit buttons, all button actions should be enclosed in a div with a class name of "buttons"
---------------------------------------------------------------------------------------------->
+<!------------------------------------------------------------------------------
+To create a consistent look and feel for all buttons, input[type=submit],
+and a tags acting assubmit buttons, all button actions should have a
+class name of "button". No other class names should be used to style
+button actions.
+------------------------------------------------------------------------------->
 <div class="buttons">
-    <a href="javascript:document.newuserform.submit()">${uiLabelMap.CommonSave}</a>
-    <a href="<@ofbizUrl>checkLogin/main</@ofbizUrl>" class="reset">${uiLabelMap.CommonBack}</a>
+    <a href="javascript:document.newuserform.submit()" class="button">${uiLabelMap.CommonSave}</a>
+    <a href="<@ofbizUrl>checkLogin/main</@ofbizUrl>" class="button reset">${uiLabelMap.CommonBack}</a>
 </div>
 
 <script language="JavaScript" type="text/javascript">
     hideShowUsaStates();
-</script>
+</script>
\ No newline at end of file