diff options
5 files changed, 498 insertions, 259 deletions
diff --git a/themes/openwrt-light/htdocs/luci-static/openwrt-light/cascade.css b/themes/openwrt-light/htdocs/luci-static/openwrt-light/cascade.css index a78326c79..93b0a32ea 100644 --- a/themes/openwrt-light/htdocs/luci-static/openwrt-light/cascade.css +++ b/themes/openwrt-light/htdocs/luci-static/openwrt-light/cascade.css @@ -1,149 +1,329 @@ -* { - margin: 0; - padding: 0; -} +@charset "utf-8"; +@media all { + +html, body { background-color: #4a6b7c; color: #ffffff; +} + +body { font-family: Verdana, Arial, sans-serif; - font-size: 100%; + font-size: 101%; line-height: 100%; } +* { + margin: 0; + padding: 0; +} + +abbr, +acronym { + font-style: normal; + font-variant: normal; +} + +abbr[title], +acronym[title] { + border-bottom: 1px dotted; + cursor: help; +} + +a:link abbr[title], +a:visited abbr[title], +a:link acronym[title], +a:visited acronym[title] { + cursor: pointer; +} + code { font-family: monospace; white-space: pre; } -div#maincontent ul { +#maincontent ul { margin-left: 2em; } .warning { - color: red !important; + color: red; + background-color: white; font-weight: bold; } .clear { clear: both; - height: 1px; } +.skiplink, +.navigation, .hidden { - display: none; + position: absolute; + left: -1000px; + top: -1000px; + width: 0px; + height: 0px; + overflow: hidden; + display: inline; } .error { color: #ff0000; + background-color: white; } #header { background-color: #557788; + color: #ffffff; text-align: right; + padding: 0.5em; } -#header .info { - padding: 1em 1em; +#header h1 { + display: inline; +} + +#header p { + display: inline; +} + +#header h1, +#header p { font-size: 70%; + font-weight: normal; line-height: 160%; + text-align: right; } -#header .title { - display: none; +ul.dropdowns { + float: left; + margin: 0; + padding: 0; + width: auto; + list-style: none; } -.pathbar { - display: none; +html>body ul.dropdowns { + position: relative; } -.menubar { - width: 100%; - min-height: 1.8em; - background: #000000; - color: #ffffff; +ul.dropdowns li, +ul.dropdowns ul { + margin: 0; + padding: 0; + list-style: none; } -.mainmenu { +ul.dropdowns li { float: left; - width: auto; - min-height: 1.8em; + 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%; +} + +#menubar { + position: relative; + width: 100%; background: #000000; color: #ffffff; } -.mainmenu div { - float: left; +#menubar .warning { + color: red; + background-color: #557788; } -.mainmenu li { - white-space: nowrap; +#menubar ul.dropdowns { + min-height: 1.8em; + background: #000000; + color: #ffffff; } -.mainmenu div ul { - display: none; - position: absolute; +#menubar ul.dropdowns li ul { background: #000000; color: #ffffff; border-width: 0 1px 1px 1px; border-style: solid; border-color: #444444; - list-style-type: none; } -.mainmenu ul li:hover > ul, -.mainmenu div:hover > ul { - display: block; -} - -.mainmenu ul li > ul { - left: 100%; - margin-top: -1.8em; +#menubar ul.dropdowns ul li ul { border-width: 1px; } -.modemenu a, -.mainmenu a { +html #menubar a:link, +html #menubar a:visited { + position: relative; display: block; padding: 0.5em; + background: #000000; color: #ffffff; text-decoration: none; font-size: 80%; + font-weight: normal; } -.mainmenu .active a, -.modemenu .active a { + +html #menubar a:link:hover, +html #menubar a:visited:hover, +html #menubar a:link:active, +html #menubar a:visited:active, +#menubar a:link:focus, +#menubar a:visited:focus { + background: #000000; color: #ffff00; font-weight: bold; } -.mainmenu li:hover > span > a, -.mainmenu div:hover > a { +html #menubar a:link.active, +html #menubar a:visited.active, +html #menubar a:link.preactive, +html #menubar a:visited.preactive { + background: #000000; + color: #ffff00; font-weight: bold; } -.modemenu a:hover, -.modemenu a:focus, -.mainmenu a:hover, -.mainmenu a:focus { - color: #ffff00; +html #menubar a:link.warning, +html #menubar a:visited.warning { + background: #000000; + color: red; font-weight: bold; } -.mainmenu div.preactive > a { - color: #ffff00; +#menubar ul.dropdowns li.over>a, +#menubar ul.dropdowns li.focus>a, +#menubar ul.dropdowns li:hover>a { font-weight: bold; } -.modemenu ul { +.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; color: #ffffff; - list-style-type: none; + list-style: none; + margin-right: 1px; } -.modemenu li { +#modemenu li { float: right; + list-style: none; +} + +#savemenu { + float: right; + margin-right: 2em; +} + +.lang_de #submenu_admin_uci { + width: 12em; +} + +.lang_ru #submenu_admin_uci { + width: 11.5em; } #maincontent { @@ -181,6 +361,7 @@ div#maincontent ul { padding: 0.5em 1em; border: 1px dotted #555555; background-color: #ffffff; + color: #000000; } .cbi-section legend { @@ -188,6 +369,7 @@ div#maincontent ul { font-weight: bold; height: 1em; padding: 0 0.25em; + background-color: transparent; color: #555555; } @@ -196,9 +378,11 @@ div#maincontent ul { } .cbi-section h3 { - height: 1.5em; - font-size: 90%; - color: #555555; + text-decoration: none !important; + font-weight: bold !important; + color: #555555 !important; + margin: 0.25em !important; + font-size: 100% !important; } .cbi-section-descr { @@ -214,10 +398,13 @@ div#maincontent ul { background-color: inherit; } +ul.cbi-apply { + font-size: 90%; +} + input[type=submit], input[type=reset], -input[type=image], -label { +input[type=image] { cursor: pointer; } @@ -242,6 +429,7 @@ select:hover, textarea:focus, textarea:hover { background-color: #ffffff; + color: #000000; } select, @@ -259,24 +447,28 @@ td input[type=password] { input.cbi-input-user { background: url('../resources/cbi/user.gif') no-repeat scroll 1px center; background-color: inherit; + color: #000000; padding-left: 17px; } input.cbi-input-password { background: url('../resources/cbi/key.gif') no-repeat scroll 1px center; background-color: inherit; + color: #000000; padding-left: 17px; } input.cbi-input-find { background: url('../resources/cbi/find.gif') no-repeat scroll 1px center; background-color: inherit; + color: #000000; padding-left: 17px; } input.cbi-input-reload { background: url('../resources/cbi/reload.gif') no-repeat scroll 1px center; background-color: inherit; + color: #000000; padding-left: 17px; } @@ -284,6 +476,7 @@ input.cbi-input-add, input.cbi-button-add { background: url('../resources/cbi/add.gif') no-repeat scroll 1px center; background-color: inherit; + color: #000000; padding-left: 17px; padding-right: 1px; } @@ -292,6 +485,7 @@ input.cbi-input-fieldadd, input.cbi-button-fieldadd { background: url(../resources/cbi/fieldadd.gif) no-repeat scroll 1px center; background-color: inherit; + color: #000000; padding-left: 17px; padding-right: 1px; } @@ -300,6 +494,7 @@ input.cbi-input-reset, input.cbi-button-reset { background: url('../resources/cbi/reset.gif') no-repeat scroll 1px center; background-color: inherit; + color: #000000; padding-left: 17px; padding-right: 1px; } @@ -308,6 +503,7 @@ input.cbi-input-save, input.cbi-button-save { background: url('../resources/cbi/save.gif') no-repeat scroll 1px center; background-color: inherit; + color: #000000; padding-left: 17px; padding-right: 1px; } @@ -316,6 +512,7 @@ input.cbi-input-apply, input.cbi-button-apply { background: url('../resources/cbi/apply.gif') no-repeat scroll 1px center; background-color: inherit; + color: #000000; padding-left: 17px; padding-right: 1px; } @@ -324,6 +521,7 @@ input.cbi-input-remove, div.cbi-section-remove input { background: url('../resources/cbi/remove.gif') no-repeat scroll 1px center; background-color: inherit; + color: #000000; padding-left: 17px; padding-right: 1px; } @@ -343,8 +541,14 @@ form > div > input[type=reset] { margin-left: 0.5em; } +table td, +table th { + color: #000000; +} + table.smalltext { background: #f5f5f5; + color: #000000; border-top: 1px solid #666666; border-right: 1px solid #666666; border-bottom: 1px solid #666666; @@ -357,6 +561,7 @@ table.smalltext { table.smalltext tr:hover td { background-color: #bbddee; + color: #000000; } table.smalltext tr th { @@ -371,12 +576,19 @@ table.smalltext tr td { border-left: 1px solid #666666; } -.cbi-rowstyle-1 { +table.cbi-section-table .cbi-rowstyle-1, +table.cbi-section-table .cbi-rowstyle-1 * { background-color: #eeeeff; + color: #000000; } -.cbi-rowstyle-2 { +.cbi-section .cbi-rowstyle-1 h3 { + background-color: #eeeeff; + color: #555555; +} +.cbi-rowstyle-2 { + color: #000000; } div.cbi-value { @@ -388,37 +600,42 @@ div.cbi-value { div.cbi-value:hover { background: #f8f8f8; -} - -div.cbi-value:last-child { - border: none; + color: #000000; } .cbi-value-title { float: left; width: 40%; + line-height: 1.8em; } div.cbi-value-field { width: 58%; - margin: 0.25em 0 0.25em 40%; + margin-left: 40%; + padding: 0.25em 0; } div.cbi-value-description { font-size: 90%; + display: inline; } -div.cbi-value-field > div.cbi-value-description { - display: none; +div.cbi-section-create { + clear: left; + white-space: nowrap; + vertical-align: top; } -div.cbi-value:hover div.cbi-value-field > div.cbi-value-description { - display: block; +div.cbi-tblsection-create { + border-bottom: 1px dotted #bbbbbb; } -div.cbi-section-create { - clear: left; - white-space: nowrap; +div.cbi-section-create .cbi-button { + margin: 0.25em; +} + +input.cbi-section-create-name { + margin-right: -0.25em; } div.cbi-map-descr { @@ -426,8 +643,8 @@ div.cbi-map-descr { } div.cbi-optionals { - margin: 0.5em 0; - padding: 0 0.25em; + padding: 0.25em; + border-bottom: 1px dotted #bbbbbb; } div.cbi-section-remove { @@ -436,8 +653,16 @@ div.cbi-section-remove { .cbi-section-node { clear: both; - border: 1px dotted #bbbbbb; + border-top: 1px dotted #bbbbbb; + border-left: 1px dotted #bbbbbb; + border-right: 1px dotted #bbbbbb; + border-bottom: none; + padding-bottom: 0; +} + +.cbi-section-node table div { padding-bottom: 0; + border-bottom: none; } .cbi-section-node div.cbi-section-table-row { @@ -471,31 +696,29 @@ td.cbi-section-table-optionals { div.cbi-error { font-size: 95%; font-weight: bold; - color: #FF0000; + color: #ff0000; + background-color: #ffffff; } td.cbi-value-error { - border-color: red !important; + border-color: red; } .cbi-value-error input, .cbi-value-error select { - color: red !important; - background-color: #FFCCCC; + color: red; + background-color: #ffcccc; } .cbi-section-error { color: red; + background-color: white; font-size: 95%; border: 1px dotted red; margin: 3px; padding: 3px; } -ul.cbi-apply { - font-size: 90%; -} - .right { text-align: right; } @@ -507,7 +730,9 @@ ul.cbi-apply { text-align: right; } -.luci a { +.luci a:link, +.luci a:visited { + background-color: transparent; color: #666666; text-decoration: none; font-size: 70%; @@ -519,85 +744,39 @@ ul.cbi-apply { .error500 { white-space: normal; - border: 1px dotted #FF0000; - background-color: #FFFFFF; + border: 1px dotted #ff0000; + background-color: #ffffff; + color: #000000; padding: 0.5em; } #memorybar { - width:200px; - height:8px; - border:1px solid #bbb; - background-color:red + width: 200px; + height: 8px; + border: 1px solid #bbb; + color: black; + background-color: red; } #memfree, #membuffers, #memcached { - float:right; - border:1px solid #bbb; - height:6px; + float: right; + border: 1px solid #bbb; + height: 6px; } #memfree { - background-color:green; + background-color: green; + color: black; } #membuffers { - background-color:yellow; + background-color: yellow; + color: black; } #memcached { - background-color:orange; -} - - -/* obligatory IE6 Voodoo Code */ -* html body { - padding-left: 50% !important; -} - -* html div#header { - margin-left: -100% !important; -} - -* html div.menubar { - margin-left: -100% !important; - width: 200% !important; -} - -* html div#maincontent { - margin-left: -80% !important; - width: 160% !important; -} - -* html div.mainmenu div.hover ul, -* html div.mainmenu div li.hover ul, -* html div.mainmenu div li li.hover ul, -* html div.mainmenu div li li li.hover ul, -* html div.mainmenu div li li li li.hover ul { - display: block !important; - margin-left: 3em; -} - -* html div.mainmenu div.hover ul { - margin-left: 0; -} - -* html div.mainmenu .hover ul ul, -* html div.mainmenu .hover ul ul ul, -* html div.mainmenu .hover ul ul ul ul, -* html div.mainmenu .hover ul ul ul ul ul { - display: none !important; -} - -* html div.mainmenu li { - height: 1em !important; - width: 10em !important; + background-color: #ffa500; + color: black; } -* html .mainmenu { - height: 1.8em; -} - -* html div.cbi-value-description { - margin-left: 40%; } diff --git a/themes/openwrt-light/htdocs/luci-static/openwrt-light/ie6.css b/themes/openwrt-light/htdocs/luci-static/openwrt-light/ie6.css new file mode 100644 index 000000000..d65da4a19 --- /dev/null +++ b/themes/openwrt-light/htdocs/luci-static/openwrt-light/ie6.css @@ -0,0 +1,71 @@ +/* obligatory IE6 Voodoo Code */ + +* html body { + padding-left: 50% !important; +} + +* html div#header { + margin-left: -100% !important; +} + +* html div#menubar { + margin-left: -100% !important; + width: 200% !important; +} + +* html ul.dropdowns li ul { + width: 10em; +} + +* html ul.dropdowns li li { + clear: both; + float: left; +} + +* html ul.dropdowns li li { + width: 100%; +} + +* html ul.dropdowns li li a { + height: 1%; +} + +* html div#maincontent { + margin-left: -80% !important; + width: 160% !important; +} + +* html div.cbi-value-description { + width: auto !important; +} + +* html div.cbi-value-field { + margin-left: 0 !important; + width: 100% !important; +} + +* html .cbi-input-text, +* html .cbi-input-user, +* html .cbi-input-select, +* html .cbi-input-password { + width: 50% !important; +} + +* html .cbi-section legend { + background-color: #ffffff; + color: #555555; +} + +* html table.cbi-section-table td .cbi-input-text, +* html table.cbi-section-table td .cbi-input-select { + width: 100% !important; +} + +* html div.cbi-page-actions { + text-align: right !important; +} + +* html div.cbi-value-field input, +* html div.cbi-value-field select { + font-size: 90% !important; +} diff --git a/themes/openwrt-light/htdocs/luci-static/openwrt-light/ie7.css b/themes/openwrt-light/htdocs/luci-static/openwrt-light/ie7.css new file mode 100644 index 000000000..c410f11ff --- /dev/null +++ b/themes/openwrt-light/htdocs/luci-static/openwrt-light/ie7.css @@ -0,0 +1,13 @@ +div.cbi-value-field { + margin-left: 0 !important; +} + +.cbi-section legend { + background-color: #ffffff; + color: #555555; +} + +table.cbi-section-table td .cbi-input-text, +table.cbi-section-table td .cbi-input-select { + width: 95% !important; +} diff --git a/themes/openwrt-light/luasrc/view/themes/openwrt-light/footer.htm b/themes/openwrt-light/luasrc/view/themes/openwrt-light/footer.htm index d1a8d43fe..f8ea5ad57 100644 --- a/themes/openwrt-light/luasrc/view/themes/openwrt-light/footer.htm +++ b/themes/openwrt-light/luasrc/view/themes/openwrt-light/footer.htm @@ -12,11 +12,10 @@ You may obtain a copy of the License at $Id$ -%> - <br class="clear" /> - </div> -</div></div> +<div class="clear"></div> </div> -<div class="luci separator black whitetext bold"><a href="<%=controller%>/about">Powered by <%= luci.__appname__ .. " " .. luci.__version__%></a></div> +<p class="luci"><a href="<%=controller%>/about">Powered by <%= luci.__appname__ .. " " .. luci.__version__%></a></p> </body> </html> + diff --git a/themes/openwrt-light/luasrc/view/themes/openwrt-light/header.htm b/themes/openwrt-light/luasrc/view/themes/openwrt-light/header.htm index cbfdba14e..7972c93f9 100644 --- a/themes/openwrt-light/luasrc/view/themes/openwrt-light/header.htm +++ b/themes/openwrt-light/luasrc/view/themes/openwrt-light/header.htm @@ -31,69 +31,48 @@ for i,r in ipairs(request) do end require("luci.i18n").loadc("default") -require("luci.http").prepare_content("text/html") +require("luci.http").prepare_content("application/xhtml+xml") -%> <?xml version="1.0" encoding="utf-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> -<html xmlns="http://www.w3.org/1999/xhtml"> +<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<%=luci.i18n.context.lang%>" lang="<%=luci.i18n.context.lang%>"> <head> - <link rel="stylesheet" type="text/css" href="<%=media%>/cascade.css" /> - <% if node and node.css then %><link rel="stylesheet" type="text/css" href="<%=resource%>/<%=node.css%>" /><% end %> - <meta http-equiv="content-type" content="application/xhtml+xml; charset=utf-8" /> - <meta http-equiv="content-script-type" content="text/javascript" /> - <title><%=striptags( hostname .. ( (node and node.title) and ' - ' .. node.title or '')) %> - LuCI</title> - - <!--[if lt IE 7]> - <script type="text/javascript"> - function setup_hover() { - function ie_hover(e) { - e.onmouseover = function() { this.className = "hover" } - e.onmouseout = function() { this.className = null } - } - - var lis = document.getElementById("mainmenu").getElementsByTagName("LI"); - var divs = document.getElementById("mainmenu").getElementsByTagName("DIV"); - - for( var i = 0; i < lis.length; i++ ) ie_hover( lis[i] ); - for( var i = 0; i < divs.length; i++ ) ie_hover( divs[i] ); - } - </script> - <![endif]--> +<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> +<meta http-equiv="Content-Script-Type" content="text/javascript" /> +<link rel="stylesheet" type="text/css" media="screen" href="<%=media%>/cascade.css" /> +<!--[if lt IE 7]><link rel="stylesheet" type="text/css" media="screen" href="<%=media%>/ie6.css" /><![endif]--> +<!--[if IE 7]><link rel="stylesheet" type="text/css" media="screen" href="<%=media%>/ie7.css" /><![endif]--> +<% if node and node.css then %><link rel="stylesheet" type="text/css" media="screen" href="<%=resource%>/<%=node.css%>" /> +<% end -%> +<script type="text/javascript" src="<%=resource%>/VarType.js"></script> +<script type="text/javascript" src="<%=resource%>/XHTML1.js"></script> +<script type="text/javascript" src="<%=resource%>/Dropdowns.js"></script> +<title><%=striptags( hostname .. ( (node and node.title) and ' - ' .. node.title or '')) %> - LuCI</title> </head> -<body onload="window.setup_hover && setup_hover()"> -<div id="header"> - <div class="info whitetext smalltext bold right"> - <%=luci.config.brand.firmware%> (<%=luci.config.brand.distro%>) | - <%:load%>: <%=load1%> <%=load5%> <%=load15%> | - <%:hostname%>: <%=hostname%> - </div> - <div class="title"> - <span class="headertitle"><%=luci.config.brand.title%></span><br /> - <span class="whitetext bold"><%=luci.config.brand.subtitle%></span> - </div> -</div> +<body class="lang_<%=luci.i18n.context.lang%>"> -<div class="pathbar separator black whitetext bold"> -<%:path%>: <% -local c = tree -local url = controller -for k,v in pairs(request) do - if c.nodes and c.nodes[v] then - c = c.nodes[v] - url = url .. "/" .. v - %><a href="<%=url%>"><%=c.title or v%></a> <% if k ~= #request then %>» <% end - end -end -%> +<p class="skiplink"> +<span id="skiplink1"><a href="#navigation"><%:skiplink1 Skip to navigation%></a></span> +<span id="skiplink2"><a href="#content"><%:skiplink2 Skip to content%></a></span> +</p> + +<div id="header"> +<h1><%=luci.config.brand.firmware%></h1> +<p> +(<%=luci.config.brand.distro%>) | +<%:load%>: <%=load1%> <%=load5%> <%=load15%> | +<%:hostname%>: <%=hostname%> +</p> </div> -<div class="menubar"> - <div id="mainmenu" class="mainmenu"> +<div id="menubar"> +<h2 class="navigation"><a id="navigation" name="navigation"><%:navigation Navigation%></a></h2> +<ul id="mainmenu" class="dropdowns"> <%- local function submenu(prefix, node) - if node.hidden or not node.nodes then + if not node.nodes or node.hidden then return false end local index = {} @@ -109,21 +88,23 @@ local function submenu(prefix, node) if count > 0 then %> - <ul> - <%- for j, v in pairs(index) do - if not v.hidden and #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> - <span<% if nnode._menu_selected then %> class="active"<%end%>><a href="<%=luci.util.pcdata(href)%>"><%=nnode.title%></a></span> - <%- submenu(prefix .. v.name .. "/", nnode) %> - </li> - <%- end %> - <%- end %> - </ul> +<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="<%=luci.util.pcdata(href)%>"><%=nnode.title%></a><%- +submenu(prefix .. v.name .. "/", nnode) +%></li> <%- + end + end +%> +</ul> +<% end end @@ -137,50 +118,46 @@ if cattree and cattree.nodes then for i, k in ipairs(index) do node = cattree.nodes[k.name] - if not node.hidden and node.title and node.target then - local href = controller.."/"..category.."/"..k.name - href = (k.query) and href .. luci.http.build_querystring(k.query) or href %> - <div<% if node._menu_selected then %> class="preactive"<%end%>><a href="<%=href%>"><%=node.title%></a> - <%submenu("/" .. category .. "/" .. k.name .. "/", node)%> - </div> -<% end + 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="<%=href%>"><%=node.title%></a><% +submenu("/" .. category .. "/" .. k.name .. "/", node) +%></li><% end + end +end +%> +</ul> + +<ul id="modemenu"><% +for k,node in pairs(tree.nodes) do + if node.title and not node.hidden then %> +<li><a<% if request[1] == k then %> class="active"<%end%> href="<%=controller%>/<%=k%>/"><%=node.title%></a></li><% end end %> - </div> - <div class="modemenu"> - <ul><% - for k,node in pairs(tree.nodes) do - if node.title and not node.hidden then %> - <li<% if request[1] == k then %> class="active"<%end%>><a href="<%=controller%>/<%=k%>"><%=node.title%></a></li> -<% end - end%> - </ul> - </div> - - <% - if tree.nodes[category] and tree.nodes[category].ucidata then - local ucic = 0 - for i, j in pairs(require("luci.model.uci").cursor():changes()) do - for k, l in pairs(j) do - for m, n in pairs(l) do - ucic = ucic + 1; - end - end +</ul> + +<% +if tree.nodes[category] and tree.nodes[category].ucidata then + local ucic = 0 + for i, j in pairs(require("luci.model.uci").cursor():changes()) do + for k, l in pairs(j) do + for m, n in pairs(l) do + ucic = ucic + 1; end - %> - <div class="mainmenu" style="float:right; margin-right:2em"> - <div> - <% if ucic > 0 then %> - <a class="warning" href="<%=controller%>/<%=category%>/uci/changes"><%:unsavedchanges%>: <%=ucic%></a> - <% submenu("/" .. category .. "/uci/", tree.nodes[category].nodes["uci"]) -%> - <% else %> - <a href="#"><%:changes%>: 0</a> - <% end %> - </div> - </div> - <% end %> - - <br class="clear" /> + end + end +-%> +<ul id="savemenu" class="dropdowns"> +<li><% if ucic > 0 then %><a class="warning" href="<%=controller%>/<%=category%>/uci/changes/"><%:unsavedchanges%>: <%=ucic%></a><% +submenu("/" .. category .. "/uci/", tree.nodes[category].nodes["uci"]) +else -%> +<a href="#"><%:changes%>: 0</a><% end -%> +</li> +</ul><% end %> + +<div class="clear"></div> </div> <div id="maincontent"> |