libs/cbi: implement tabbing to split large sections and group options in tabs

[project/luci.git] / libs / cbi / luasrc / view / cbi / nsection.htm

diff --git a/libs/cbi/luasrc/view/cbi/nsection.htm b/libs/cbi/luasrc/view/cbi/nsection.htm
index a999e47..d096ac3 100644 (file)
--- a/libs/cbi/luasrc/view/cbi/nsection.htm
+++ b/libs/cbi/luasrc/view/cbi/nsection.htm
@@ -1,7 +1,7 @@
 <%#
 LuCI - Lua Configuration Interface
 Copyright 2008 Steven Barth <steven@midlink.org>
-Copyright 2008 Jo-Philipp Wich <xm@leipzig.freifunk.net>
+Copyright 2008-2009 Jo-Philipp Wich <xm@subsignal>
 
 Licensed under the Apache License, Version 2.0 (the "License");
 you may not use this file except in compliance with the License.
@@ -14,23 +14,33 @@ $Id$
 -%>
 
 <% if self:cfgvalue(self.section) then section = self.section %>
-       <div class="cbi-section" id="cbi-<%=self.config%>-<%=section%>">
-               <h2><%=self.title%></h2>
-               <div class="cbi-section-descr"><%=self.description%></div>
+       <fieldset class="cbi-section" id="cbi-<%=self.config%>-<%=section%>">
+               <% if self.title and #self.title > 0 then -%>
+                       <legend><%=self.title%></legend>
+               <%- end %>
+               <% if self.description and #self.description > 0 then -%>
+                       <div class="cbi-section-descr"><%=self.description%></div>
+               <%- end %>
                <% if self.addremove then -%>
                        <div class="cbi-section-remove right">
                                <input type="submit" name="cbi.rns.<%=self.config%>.<%=section%>" value="<%:cbi_del%>" />
                        </div>
                <%- end %>
+               <%+cbi/tabmenu%>
                <div class="cbi-section-node" id="cbi-<%=self.config%>-<%=section%>">
                        <%+cbi/ucisection%>
                </div>
                <br />
-       </div>
+       </fieldset>
 <% elseif self.addremove then %>
-       <div class="cbi-section" id="cbi-<%=self.config%>-<%=self.section%>">
-               <h2><%=self.title%></h2>
+       <% if self.template_addremove then include(self.template_addremove) else -%>
+       <fieldset class="cbi-section" id="cbi-<%=self.config%>-<%=self.section%>">
+               <% if self.title and #self.title > 0 then -%>
+                       <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%>" />
-       </div>
+               <input type="submit" class="cbi-button-add" name="cbi.cns.<%=self.config%>.<%=self.section%>" value="<%:cbi_add%>" />
+       </fieldset>
+       <%- end %>
 <% end %>
+<!-- /nsection -->