diff options
| -rw-r--r-- | themes/openwrt/htdocs/luci-static/openwrt.org/cascade.css | 246 | ||||
| -rw-r--r-- | themes/openwrt/htdocs/luci-static/openwrt.org/tabbg.png | bin | 0 -> 152 bytes | |||
| -rw-r--r-- | themes/openwrt/luasrc/view/themes/openwrt.org/footer.htm | 2 | ||||
| -rw-r--r-- | themes/openwrt/luasrc/view/themes/openwrt.org/header.htm | 186 |
4 files changed, 172 insertions, 262 deletions
diff --git a/themes/openwrt/htdocs/luci-static/openwrt.org/cascade.css b/themes/openwrt/htdocs/luci-static/openwrt.org/cascade.css index bada73b99..aaba385e5 100644 --- a/themes/openwrt/htdocs/luci-static/openwrt.org/cascade.css +++ b/themes/openwrt/htdocs/luci-static/openwrt.org/cascade.css @@ -24,6 +24,71 @@ body { padding: 0; } +ul.tabmenu { + margin: 0; + clear: both; + display: block; + vertical-align: bottom; + font-size: 90%; + padding: 5px 0 0 5px; +} + +div.tabmenu2 { + background-color: #AAAAAA; + background-image: url(tabbg.png); + background-repeat: repeat-x; + margin-top: -1px; + border: 1px solid #444444; + border-bottom: none; +} + +div.tabmenu3, +div.tabmenu4, +div.tabmenu5 { + background-color: #AAAAAA; + background-image: url(tabbg.png); + background-repeat: repeat-x; + border: none; +} + +ul.tabmenu li { + float: left; + display: block; + overflow: hidden; +} + +ul.tabmenu li a { + text-decoration: none; + color: #444444; + display: block; + padding: 3px 8px; + margin: 0 2px; + line-height: 1.3em; + border: 1px solid transparent; + border-bottom: none; + font-size: 85%; +} + +ul.tabmenu li.active a { + font-weight: bold; + color: #000000; + background: #f5f5f5; + border: 1px solid #AAAAAA; + border-bottom: none; +} + +ul.tabmenu li a:hover { + color: #444444; + border-color: #444444; +} + +ul.l1 li a { + background-color: #AAAAAA; + background-image: url(tabbg.png); + background-repeat: repeat-x; + border-color: #444444; +} + abbr, acronym { font-style: normal; @@ -79,106 +144,13 @@ code { background-color: white; } -#header { - min-height: 98px; - background-image: url(header.png); - background-repeat: no-repeat; - background-position: left center; - background-color: #557788; - color: #ffffff; - text-align: right; -} - -#header h1 { - padding: 1em 1em 0 1em; -} - -#header p { - padding: 0 1em 1em 1em; -} - -#header h1, -#header p { - font-size: 70%; - font-weight: normal; - line-height: 160%; - text-align: right; -} - -ul.dropdowns { +div.hostinfo { float: left; margin: 0; padding: 0; width: auto; - list-style: none; -} - -html>body ul.dropdowns { - position: relative; -} - -ul.dropdowns li, -ul.dropdowns ul { - margin: 0; - padding: 0; - list-style: none; -} - -ul.dropdowns li { - float: left; - position: relative; - white-space: nowrap; -} - -ul.dropdowns li ul { - position: absolute; - z-index: 1000; - top: auto; - min-width: 10em; -} - -ul.dropdowns li li { - float: none; - position: relative; -} - -ul.dropdowns li a { - display: block; -} - -ul.dropdowns ul li ul { - top: 0; -} - -ul.dropdowns li ul, -ul.dropdowns li.over ul ul, -ul.dropdowns li.focus ul ul, -ul.dropdowns li:hover ul ul, -ul.dropdowns li.over ul ul ul, -ul.dropdowns li.focus ul ul ul, -ul.dropdowns li:hover ul ul ul, -ul.dropdowns li.over ul ul ul ul, -ul.dropdowns li.focus ul ul ul ul, -ul.dropdowns li:hover ul ul ul ul { - left: -3000px; -} - -ul.dropdowns li.over ul, -ul.dropdowns li.focus ul, -ul.dropdowns li:hover ul { - left: 0; -} - -ul.dropdowns ul li.over ul, -ul.dropdowns ul li.focus ul, -ul.dropdowns ul li:hover ul, -ul.dropdowns ul ul li.over ul, -ul.dropdowns ul ul li.focus ul, -ul.dropdowns ul ul li:hover ul, -ul.dropdowns ul ul ul li.over ul, -ul.dropdowns ul ul ul li.focus ul, -ul.dropdowns ul ul ul li:hover ul { - left: 100%; + font-size: 80%; + padding: 0.5em; } #menubar { @@ -193,24 +165,6 @@ ul.dropdowns ul ul ul li:hover ul { background-color: #557788; } -#menubar ul.dropdowns { - min-height: 1.8em; - background: #000000; - color: #ffffff; -} - -#menubar ul.dropdowns li ul { - background: #000000; - color: #ffffff; - border-width: 0 1px 1px 1px; - border-style: solid; - border-color: #444444; -} - -#menubar ul.dropdowns ul li ul { - border-width: 1px; -} - html #menubar a:link, html #menubar a:visited { position: relative; @@ -251,63 +205,6 @@ html #menubar a:visited.warning { font-weight: bold; } -#menubar ul.dropdowns li.over>a, -#menubar ul.dropdowns li.focus>a, -#menubar ul.dropdowns li:hover>a { - font-weight: bold; -} - -.lang_de #submenu_mini_system { min-width: 13.3em; } -* html .lang_de #submenu_mini_system { width: 13.3em; } - -.lang_pt-br #submenu_mini_network { min-width: 14em; } -* html .lang_pt-br #submenu_mini_network { width: 14em; } - -.lang_pt-br #submenu_mini_system { min-width: 11.5em; } -* html .lang_pt-br #submenu_mini_system { width: 11.5em; } - -.lang_ru #submenu_mini_system { min-width: 18em; } -* html .lang_ru #submenu_mini_system { width: 18em; } - -.lang_pt-br #submenu_admin_index { min-width: 11em; } -* html .lang_pt-br #submenu_admin_index { width: 11em; } - -.lang_ru #submenu_admin_index { min-width: 15.5em; } -* html .lang_ru #submenu_admin_index { width: 15.5em; } - -.lang_ru #submenu_admin_status { min-width: 10.5em; } -* html .lang_ru #submenu_admin_status { width: 10.5em; } - -.lang_de #submenu_admin_system { min-width: 13.3em; } -* html .lang_de #submenu_admin_system { width: 13.3em; } - -.lang_fr #submenu_admin_system { min-width: 14.5em; } -* html .lang_fr #submenu_admin_system { width: 14.5em; } - -.lang_pt-br #submenu_admin_system { min-width: 11.5em; } -* html .lang_pt-br #submenu_admin_system { width: 11.5em; } - -.lang_ru #submenu_admin_system { min-width: 18em; } -* html .lang_ru #submenu_admin_system { width: 18em; } - -#submenu_admin_services_chillispot { min-width: 15.5em; } -* html #submenu_admin_services_chillispot { width: 15.5em; } - -#submenu_admin_services_coovachilli { min-width: 15em; } -* html #submenu_admin_services_coovachilli { width: 15em; } - -.lang_ru #submenu_admin_network_routes { min-width: 15.3em; } -* html .lang_ru #submenu_admin_network_routes { width: 15.3em; } - -#submenu_admin_network_firewall { min-width: 14em; } -* html #submenu_admin_network_firewall { width: 14em; } - -.lang_de #submenu_admin_network_firewall { min-width: 16.5em; } -* html .lang_de #submenu_admin_network_firewall { width: 16.5em; } - -.lang_pt-br #submenu_admin_network_firewall { min-width: 15em; } -* html .lang_pt-br #submenu_admin_network_firewall { width: 15em; } - #modemenu { width: auto; background: #000000; @@ -342,17 +239,20 @@ textarea#syslog { font-family: monospace; } -#maincontent { +#maincontainer { clear: both; width: 80%; margin: 0 auto; +} + +#maincontent { padding: 0.5em; background: #f5f5f5; color: #000000; + font-size: 80%; border-width: 0 1px 1px 1px; border-style: solid; border-color: #444444; - font-size: 80%; } #maincontent h2 { diff --git a/themes/openwrt/htdocs/luci-static/openwrt.org/tabbg.png b/themes/openwrt/htdocs/luci-static/openwrt.org/tabbg.png Binary files differnew file mode 100644 index 000000000..c84c437cd --- /dev/null +++ b/themes/openwrt/htdocs/luci-static/openwrt.org/tabbg.png diff --git a/themes/openwrt/luasrc/view/themes/openwrt.org/footer.htm b/themes/openwrt/luasrc/view/themes/openwrt.org/footer.htm index 8df68b14c..736644fba 100644 --- a/themes/openwrt/luasrc/view/themes/openwrt.org/footer.htm +++ b/themes/openwrt/luasrc/view/themes/openwrt.org/footer.htm @@ -14,8 +14,8 @@ $Id$ -%> <div class="clear"></div> </div> +</div> <p class="luci"><a href="<%=controller%>/about">Powered by <%= luci.__appname__ .. " (v" .. luci.__version__ .. ")" %></a></p> </body> </html> - diff --git a/themes/openwrt/luasrc/view/themes/openwrt.org/header.htm b/themes/openwrt/luasrc/view/themes/openwrt.org/header.htm index 0a32055f8..11f6793b7 100644 --- a/themes/openwrt/luasrc/view/themes/openwrt.org/header.htm +++ b/themes/openwrt/luasrc/view/themes/openwrt.org/header.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-2010 Jo-Philipp Wich <xm@subsignal.org> Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. @@ -17,6 +17,8 @@ require("luci.sys") local load1, load5, load15 = luci.sys.loadavg() local request = require("luci.dispatcher").context.path local category = request[1] +local request2 = require("luci.dispatcher").context.request +local leaf = request2[#request2] local tree = luci.dispatcher.node() local cattree = category and luci.dispatcher.node(category) local node = luci.dispatcher.context.dispatched @@ -33,6 +35,72 @@ end require("luci.i18n").loadc("base") require("luci.http").prepare_content("application/xhtml+xml") + + local function nodeurl(prefix, name, query) + local url = controller .. prefix .. name .. "/" + if query then + url = url .. luci.http.build_querystring(query) + end + return pcdata(url) + end + + local function subtree(prefix, node, level) + if not node.nodes or node.hidden then + return false + end + + if not level then + level = 1 + end + + local index = {} + local count = 0 + for k, n in pairs(node.nodes) do + if n.title and n.target then + table.insert(index, {name=k, order=n.order or 100}) + count = count + 1 + end + end + + table.sort(index, function(a, b) return a.order < b.order end) + + if count > 0 then +%> + <div class="tabmenu<%=level%>"> + <ul class="tabmenu l<%=level%>"> + <% + local selected_node + local selected_name + + for j, v in pairs(index) do + if #v.name > 0 then + local nnode = node.nodes[v.name] + + if nnode._menu_selected then + selected_node = nnode + selected_name = v.name + end + %> + <li<% if nnode._menu_selected or v.name == leaf then %> class="active"<% end %>> + <a href="<%=nodeurl(prefix, v.name, nnode.query)%>"><%=striptags(nnode.title)%></a> + </li> + <% + end + end + %> + </ul> + <br style="clear:both" /> +<% + if selected_node then + subtree(prefix .. selected_name .. "/", selected_node, level + 1) + end +%> + </div> +<% + end + end + + -%> <?xml version="1.0" encoding="utf-8"?> @@ -59,77 +127,13 @@ require("luci.http").prepare_content("application/xhtml+xml") <span id="skiplink2"><a href="#content"><%:Skip to content%></a></span> </p> -<div id="header"> -<h1><%=luci.version.distname%></h1> -<p> -<%=luci.version.distversion%><br /> -<%:Load%>: <%="%.2f" % load1%> <%="%.2f" % load5%> <%="%.2f" % load15%><br /> -<%:Hostname%>: <%=hostname%> -</p> -</div> - <div id="menubar"> <h2 class="navigation"><a id="navigation" name="navigation"><%:Navigation%></a></h2> -<ul id="mainmenu" class="dropdowns"> -<%- -local function submenu(prefix, node) - if not node.nodes or node.hidden then - return false - end - local index = {} - local count = 0 - for k, n in pairs(node.nodes) do - if n.title and n.target then - table.insert(index, {name=k, order=n.order or 100}) - count = count + 1 - end - end - - table.sort(index, function(a, b) return a.order < b.order end) - - if count > 0 then -%> -<ul id="submenu_<%=string.gsub(string.gsub(prefix, "/", "_"), "^_(.-)_$", "%1")%>"> -<%- - for j, v in pairs(index) do - if #v.name > 0 then - local nnode = node.nodes[v.name] - local href = controller .. prefix .. v.name .. "/" - href = (nnode.query) and href .. luci.http.build_querystring(nnode.query) or href -%> -<li><a<% if nnode._menu_selected then %> class="active"<%end%> href="<%=pcdata(href)%>"><%=striptags(nnode.title)%></a><%- -submenu(prefix .. v.name .. "/", nnode) -%></li> -<%- - end - end -%> -</ul> -<% - end -end - -if cattree and cattree.nodes then - local index = {} - for k, node in pairs(cattree.nodes) do - table.insert(index, {name=k, order=node.order or 100}) - end - table.sort(index, function(a, b) return a.order < b.order end) - - for i, k in ipairs(index) do - node = cattree.nodes[k.name] - if node.title and node.target and not node.hidden then - local href = controller.."/"..category.."/"..k.name.."/" - href = (k.query) and href .. luci.http.build_querystring(k.query) or href -%> -<li><a<% if node._menu_selected then %> class="preactive"<%end%> href="<%=pcdata(href)%>"><%=striptags(node.title)%></a><% -submenu("/" .. category .. "/" .. k.name .. "/", node) -%></li><% end - end -end -%> -</ul> +<div class="hostinfo"> + <%=hostname%> | <%=luci.version.distversion%> | + <%:Load%>: <%="%.2f" % load1%> <%="%.2f" % load5%> <%="%.2f" % load15%> +</div> <ul id="modemenu"><% for k,node in pairs(tree.nodes) do @@ -151,27 +155,33 @@ if tree.nodes[category] and tree.nodes[category].ucidata then end end -%> -<ul id="savemenu" class="dropdowns"> -<li><% if ucic > 0 then %><a class="warning" href="<%=controller%>/<%=category%>/uci/changes/"><%:Unsaved Changes%>: <%=ucic%></a><% -submenu("/" .. category .. "/uci/", tree.nodes[category].nodes["uci"]) -else -%> -<a href="#"><%:Changes%>: 0</a><% end -%> -</li> -</ul><% end %> +<div id="savemenu"> + <% if ucic > 0 then %> + <a class="warning" href="<%=controller%>/<%=category%>/uci/changes/?redir=<%=luci.http.urlencode(tree.nodes[category].nodes["uci"].query)%>"><%:Unsaved Changes%>: <%=ucic%></a> + <%- else -%> + <a href="#"><%:Changes%>: 0</a> + <% end -%> +</div><% end %> <div class="clear"></div> </div> -<div id="maincontent"> - <noscript> - <div class="errorbox"> - <strong><%:Java Script required!%></strong><br /> - <%:You must enable Java Script in your browser or LuCI will not work properly.%> - </div> - </noscript> - <%- if not luci.sys.user.getpasswd("root") then -%> - <div class="errorbox"> - <strong><%:No password set!%></strong><br /> - <%:There is no password set on this router. Please configure a root password to protect the web interface and enable SSH.%> +<div id="maincontainer"> + <div id="tabmenu"> + <% if category then subtree("/" .. category .. "/", cattree) end %> </div> - <%- end -%> + + <div id="maincontent"> + <noscript> + <div class="errorbox"> + <strong><%:Java Script required!%></strong><br /> + <%:You must enable Java Script in your browser or LuCI will not work properly.%> + </div> + </noscript> + + <%- if not luci.sys.user.getpasswd("root") then -%> + <div class="errorbox"> + <strong><%:No password set!%></strong><br /> + <%:There is no password set on this router. Please configure a root password to protect the web interface and enable SSH.%> + </div> + <%- end -%> |
