use border-radius instead of raster images.

so that we can customise the color easily.

bt5/erp5_knowledge_pad/SkinTemplateItem/portal_skins/erp5_knowledge_pad/erp5_knowledge_box.css.xml

@@ -12,7 +12,7 @@
         </item>
         <item>
             <key> <string>_EtagSupport__etag</string> </key>
-            <value> <string>ts29466233.61</string> </value>
+            <value> <string>ts25913313.34</string> </value>
         </item>
         <item>
             <key> <string>__name__</string> </key>
@@ -77,18 +77,20 @@ div.pad-actions{\n
 }\n
 h3.handle {\n
   margin: 0;\n
-  padding: 0 0 0 10px;\n
+  padding: 0 0 0 9px;\n
   font-size: 14px;\n
   color: #fff;\n
-  background: transparent url(images/tab_left_selected.png) no-repeat scroll left top;\n
-  border-bottom: 1px solid #3D6474;\n
+  border-radius: 10px 10px 0 0;\n
+  -moz-border-radius: 10px 10px 0 0;\n
+  -webkit-border-top-left-radius: 10px;\n
+  -webkit-border-top-right-radius: 10px;\n
+  border: 1px solid #3D6474;\n
 }\n
 \n
 h3.handle span.handle {\n
   display: block;\n
   min-height:20px;\n
-  padding: 5px 5px 0 0;\n
-  background: transparent url(images/tab_right_selected.png) no-repeat scroll right top;\n
+  padding: 4px 4px 0 0;\n
 }\n
 \n
 div.block h3 span.gadget_title{\n
@@ -345,6 +347,9 @@ div.block div.listbox-head-content {\n
   border: none;\n
   margin-left:0;\n
   padding-left: 10px;\n
+  border-top-left-radius: 0;\n
+  -moz-border-top-left-radius: 0;\n
+  -webkit-border-top-left-radius: 0;\n
 }\n
 div.block table.listbox tr{\n
   margin-top:2px;\n
@@ -501,7 +506,7 @@ div.gadget-rss-reader .body {\n
         </item>
         <item>
             <key> <string>size</string> </key>
-            <value> <int>8337</int> </value>
+            <value> <int>8403</int> </value>
         </item>
         <item>
             <key> <string>title</string> </key>

product/ERP5/bootstrap/erp5_xhtml_style/SkinTemplateItem/portal_skins/erp5_xhtml_style/erp5.css.xml

@@ -1143,34 +1143,37 @@ span.search button .image {\n
 \n
 .document .actions li {\n
   float: left;\n
+  border: 1px solid <dtml-var document_border_color>;\n
+  border-bottom-color: transparent;\n
+  border-radius: 10px 10px 0 0;\n
+  -moz-border-radius: 10px 10px 0 0;\n
+  -webkit-border-top-left-radius: 10px;\n
+  -webkit-border-top-right-radius: 10px;\n
+}\n
+\n
+.document .actions li.selected {\n
+  border-bottom-color: <dtml-var background_color>;\n
 }\n
 \n
 .document .actions li a {\n
   display: block;\n
   color: inherit;\n
-  background: url(\'images/tab_left.png\') top left no-repeat;\n
   margin: 0;\n
-  padding: 0 0 0 10px;\n
+  padding: 0 0 0 9px;\n
   line-height: 1.2em;\n
 }\n
 \n
-.document .actions li.selected a {\n
-  background: url(\'images/tab_left_selected.png\') top left no-repeat;\n
-}\n
-\n
 .document .actions li a span {\n
   display: block;\n
-  padding: 5px 10px 4px 0;\n
+  padding: 4px 9px 4px 0;\n
   color: inherit;\n
   background-color: inherit;\n
-  background: url(\'images/tab_right.png\') top right no-repeat;\n
 /*   font-size: 90%; */\n
 }\n
 \n
 .document .actions li.selected a span {\n
   font-weight: bold;\n
-  padding-bottom: 5px;\n
-  background: url(\'images/tab_right_selected.png\') top right no-repeat;\n
+  padding-bottom: 4px;\n
 }\n
 \n
 .document .actions li a:hover {\n

product/ERP5/bootstrap/erp5_xhtml_style/SkinTemplateItem/portal_skins/erp5_xhtml_style/erp5_listbox.css.xml

@@ -443,21 +443,21 @@ table.listbox tr.listbox-search-line {\n
 \n
 div.listbox-head{\n
   color:#9D968D;\n
-  margin-left:-1px;\n
 }\n
 \n
 div.listbox-head-spacer{\n
-  background:transparent url("images/tab_left_selected.png") no-repeat scroll left top;\n
-  height:36px;\n
-  width:10px;\n
-  float:left;\n
+  display: none;\n
 }\n
 \n
 div.listbox-head-content{\n
   border-right:1px solid #3D6474;\n
   border-top:1px solid #3D6474;\n
+  border-left:1px solid #3D6474;\n
+  border-top-left-radius: 10px;\n
+  -moz-border-top-left-radius: 10px;\n
+  -webkit-border-top-left-radius: 10px;\n
   height:25px;\n
-  margin-left:10px;\n
+  padding-left:10px;\n
   padding-top:10px;\n
   padding-right: 5px;\n
   width:auto;\n