libs/cbi: Improved user interface draft #1

12 files changed, 21 insertions, 22 deletions

diff --git a/libs/cbi/htdocs/luci-static/resources/cbi/add.gif b/libs/cbi/htdocs/luci-static/resources/cbi/add.gif
new file mode 100644
index 000000000..0888abf85
--- /dev/null
+++ b/libs/cbi/htdocs/luci-static/resources/cbi/add.gif
diff --git a/libs/cbi/htdocs/luci-static/resources/cbi/apply.gif b/libs/cbi/htdocs/luci-static/resources/cbi/apply.gif
new file mode 100644
index 000000000..82ae7ed82
--- /dev/null
+++ b/libs/cbi/htdocs/luci-static/resources/cbi/apply.gif
diff --git a/libs/cbi/htdocs/luci-static/resources/cbi/fieldadd.gif b/libs/cbi/htdocs/luci-static/resources/cbi/fieldadd.gif
new file mode 100644
index 000000000..431ff64d1
--- /dev/null
+++ b/libs/cbi/htdocs/luci-static/resources/cbi/fieldadd.gif
diff --git a/libs/cbi/htdocs/luci-static/resources/cbi/help.gif b/libs/cbi/htdocs/luci-static/resources/cbi/help.gif
new file mode 100644
index 000000000..9dfa0e196
--- /dev/null
+++ b/libs/cbi/htdocs/luci-static/resources/cbi/help.gif
diff --git a/libs/cbi/htdocs/luci-static/resources/cbi/reset.gif b/libs/cbi/htdocs/luci-static/resources/cbi/reset.gif
new file mode 100644
index 000000000..c941c1902
--- /dev/null
+++ b/libs/cbi/htdocs/luci-static/resources/cbi/reset.gif
diff --git a/libs/cbi/htdocs/luci-static/resources/cbi/save.gif b/libs/cbi/htdocs/luci-static/resources/cbi/save.gif
new file mode 100644
index 000000000..35e949963
--- /dev/null
+++ b/libs/cbi/htdocs/luci-static/resources/cbi/save.gif
diff --git a/libs/cbi/luasrc/view/cbi/footer.htm b/libs/cbi/luasrc/view/cbi/footer.htm
index 732389c00..b71905820 100644
--- a/libs/cbi/luasrc/view/cbi/footer.htm
+++ b/libs/cbi/luasrc/view/cbi/footer.htm
@@ -14,9 +14,9 @@ $Id$
 -%>
 
 	<div>
-		<input type="submit" name="cbi.apply" value="<%:saveapply%>" />
-		<input type="submit" value="<%:save%>" />
-		<input type="reset" value="<%:reset%>" />
+		<input class="cbi-button cbi-button-apply" type="submit" name="cbi.apply" value="<%:saveapply%>" />
+		<input class="cbi-button cbi-button-save" type="submit" value="<%:save%>" />
+		<input class="cbi-button cbi-button-reset" type="reset" value="<%:reset%>" />
 		<script type="text/javascript">cbi_d_init();</script>
 	</div>
 </form>
diff --git a/libs/cbi/luasrc/view/cbi/full_valuefooter.htm b/libs/cbi/luasrc/view/cbi/full_valuefooter.htm
index a7b56e294..8933016d7 100644
--- a/libs/cbi/luasrc/view/cbi/full_valuefooter.htm
+++ b/libs/cbi/luasrc/view/cbi/full_valuefooter.htm
@@ -14,6 +14,7 @@ $Id$
 -%>
 
 		<% if #self.description > 0 then -%>
+			<span class="cbi-value-helpicon"><img src="<%=resource%>/cbi/help.gif" alt="<%:help%>" /></span>
 			<div class="cbi-value-description"><%=self.description%></div>
 		<%- end %>
 	</div>
diff --git a/libs/cbi/luasrc/view/cbi/nsection.htm b/libs/cbi/luasrc/view/cbi/nsection.htm
index 3f8653109..27db4bfbf 100644
--- a/libs/cbi/luasrc/view/cbi/nsection.htm
+++ b/libs/cbi/luasrc/view/cbi/nsection.htm
@@ -35,7 +35,7 @@ $Id$
 			<legend><%=self.title%></legend>
 		<%- end %>
 		<div class="cbi-section-descr"><%=self.description%></div>
-		<input type="submit" name="cbi.cns.<%=self.config%>.<%=self.section%>" value="<%:cbi_add%>" />
+		<input type="submit" class="cbi-button-add" name="cbi.cns.<%=self.config%>.<%=self.section%>" value="<%:cbi_add%>" />
 	</fieldset>
 <% end %>
 <!-- /nsection -->
diff --git a/libs/cbi/luasrc/view/cbi/tblsection.htm b/libs/cbi/luasrc/view/cbi/tblsection.htm
index 46f7e5115..cfee09f1c 100644
--- a/libs/cbi/luasrc/view/cbi/tblsection.htm
+++ b/libs/cbi/luasrc/view/cbi/tblsection.htm
@@ -12,6 +12,13 @@ You may obtain a copy of the License at
 $Id$
 
 -%>
+<%-
+local rowcnt = 1
+function rowstyle()
+	rowcnt = rowcnt + 1
+	return (rowcnt % 2) + 1
+end
+-%>
 
 <!-- tblsection -->
 <div class="cbi-section" id="cbi-<%=self.config%>-<%=self.sectiontype%>">
@@ -26,9 +33,7 @@ $Id$
 			<%- end -%>
 			<%- for i, k in pairs(self.children) do -%>
 				<th class="cbi-section-table-cell"><%=k.title%></th>
-			<%- count = count + 1; end; if self.extedit then -%>
-				<th class="cbi-section-table-cell">&nbsp;</th>
-			<%- count = count + 1; end; if self.addremove then -%>
+			<%- count = count + 1; end; if self.extedit or self.addremove then -%>
 				<th class="cbi-section-table-cell">&nbsp;</th>
 			<%- count = count + 1; end -%>
 			</tr>
@@ -38,9 +43,7 @@ $Id$
 			<%- end -%>
 			<%- for i, k in pairs(self.children) do -%>
 				<th class="cbi-section-table-cell"><%=k.description%></th>
-			<%- end; if self.extedit then -%>
-				<th class="cbi-section-table-cell">&nbsp;</th>
-			<%- end; if self.addremove then -%>
+			<%- end; if self.extedit or self.addremove then -%>
 				<th class="cbi-section-table-cell">&nbsp;</th>
 			<%- end -%>
 			</tr>
@@ -50,7 +53,7 @@ $Id$
 					isempty = false
 					scope = { valueheader = "cbi/cell_valueheader", valuefooter = "cbi/cell_valuefooter" }
 			-%>
-			<tr class="cbi-section-table-row" id="cbi-<%=self.config%>-<%=section%>">
+			<tr class="cbi-section-table-row<% if self.extedit then %> cbi-rowstyle-<%=rowstyle()%><% end %>" id="cbi-<%=self.config%>-<%=section%>">
 				<% if not self.anonymous then -%>
 					<th><h3><%=k%></h3></th>
 				<%- end %>
@@ -60,15 +63,10 @@ $Id$
 						<%- if self.extedit then -%>
 							<a href="<%=self.extedit:format(section)%>"><img style="border: none" src="<%=resource%>/cbi/edit.gif" alt="<%:edit%>" /></a>
 						<%- end; if self.addremove then %>
-							<button class="clean" type="submit" value="1" name="cbi.rts.<%=self.config%>.<%=k%>" title="<%:delete%>"><img src="<%=resource%>/cbi/remove.gif" alt="<%:delete%>" /></button>
+							<input type="image" value="<%:cbi_del%>" name="cbi.rts.<%=self.config%>.<%=k%>" alt="<%:cbi_del%>" title="<%:cbi_del%>" src="<%=resource%>/cbi/remove.gif" />
 						<%- end -%>
 					</td>
 				<%- end -%>
-				<%- if self.addremove then -%>
-					<td class="cbi-section-table-cell">
-						
-					</td>
-				<%- end -%>
 			</tr>
 			<%- end -%>
 
@@ -84,10 +82,10 @@ $Id$
 				<td colspan="<%=count%>" class="cbi-section-table-optionals">
 					<div class="cbi-section-create">
 						<% if self.anonymous then %>
-							<input type="submit" name="cbi.cts.<%=self.config%>.<%=self.sectiontype%>" value="<%:cbi_add%>" />
+							<input class="cbi-button cbi-button-add" type="submit" value="<%:cbi_add%>" name="cbi.cts.<%=self.config%>.<%=self.sectiontype%>" title="<%:cbi_add%>" />
 						<% else %>
 							<input type="text" class="cbi-section-create-name" name="cbi.cts.<%=self.config%>.<%=self.sectiontype%>" />
-							<input type="submit" value="<%:cbi_add%>" />
+							<input class="cbi-button cbi-button-add" type="submit" value="<%:cbi_add%>" title="<%:cbi_add%>" />
 						<% end %>
 
 						<% if self.err_invalid then %>
diff --git a/libs/cbi/luasrc/view/cbi/tsection.htm b/libs/cbi/luasrc/view/cbi/tsection.htm
index da44cdc13..a81715b0a 100644
--- a/libs/cbi/luasrc/view/cbi/tsection.htm
+++ b/libs/cbi/luasrc/view/cbi/tsection.htm
@@ -43,10 +43,10 @@ $Id$
 	<% if self.addremove then -%>
 		<div class="cbi-section-create">
 			<% if self.anonymous then -%>
-				<input type="submit" name="cbi.cts.<%=self.config%>.<%=self.sectiontype%>" value="<%:cbi_add%>" />
+				<input type="submit" class="cbi-button cbi-button-add" name="cbi.cts.<%=self.config%>.<%=self.sectiontype%>" value="<%:cbi_add%>" />
 			<%- else -%>
 				<input type="text" class="cbi-section-create-name" name="cbi.cts.<%=self.config%>.<%=self.sectiontype%>" />
-				<input type="submit" value="<%:cbi_add%>" />
+				<input type="submit" class="cbi-button cbi-button-add" value="<%:cbi_add%>" />
 			<%- end %>
 
 			<% if self.err_invalid then -%>
diff --git a/libs/cbi/luasrc/view/cbi/ucisection.htm b/libs/cbi/luasrc/view/cbi/ucisection.htm
index e06cb5392..2ae856003 100644
--- a/libs/cbi/luasrc/view/cbi/ucisection.htm
+++ b/libs/cbi/luasrc/view/cbi/ucisection.htm
@@ -31,6 +31,6 @@ $Id$
 		<% end %><% end %>
 		<% end %></script>
 	<% end %>
-		<input type="submit" value="<%:add%>" />
+		<input type="submit" class="cbi-button cbi-button-fieldadd" value="<%:add%>" />
 	</div>
 <% end %>