X-Git-Url: https://git.archive.openwrt.org/?p=project%2Fluci.git;a=blobdiff_plain;f=themes%2Fopenwrt%2Fhtdocs%2Fluci-static%2Fopenwrt.org%2Fcascade.css;h=cbc62b18f6cece8a33d635c9a4e5c0d3c97e987a;hp=9c351aebf7168ec99fc6dab7aa6755b325964808;hb=8e44175a79f9085284d843d8fab3225ff18bf5eb;hpb=6738c80c0a239e94784ad2b56bd6b279e90d8dc4 diff --git a/themes/openwrt/htdocs/luci-static/openwrt.org/cascade.css b/themes/openwrt/htdocs/luci-static/openwrt.org/cascade.css index 9c351aebf..cbc62b18f 100644 --- a/themes/openwrt/htdocs/luci-static/openwrt.org/cascade.css +++ b/themes/openwrt/htdocs/luci-static/openwrt.org/cascade.css @@ -5,16 +5,16 @@ html { min-height: 100%; height: auto; + position:relative; } body { color: #ffffff; background-color: #4a6b7c; - background-image: url(bg.jpg); background-position: bottom center; background-repeat: repeat-x; font-family: Verdana, Arial, sans-serif; - font-size: 101%; + font-size: 11pt; line-height: 100%; padding-bottom: 1.5em; } @@ -24,6 +24,84 @@ body { padding: 0; } +a img { + border: none; + text-decoration: none; +} + +small { + white-space: nowrap; +} + +ul.tabmenu { + margin: 0; + clear: both; + display: block; + vertical-align: bottom; + font-size: 10pt; + 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; +} + +ul.l1 li.tabmenu-item-logout a { + margin-left: 30px; +} + abbr, acronym { font-style: normal; @@ -79,106 +157,27 @@ 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; + font-size: 80%; + padding: 0.5em; } -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; +#xhr_poll_status { + cursor: pointer; } -ul.dropdowns li.over ul, -ul.dropdowns li.focus ul, -ul.dropdowns li:hover ul { - left: 0; +#xhr_poll_status #xhr_poll_status_off { + font-weight: bold; + color: #FF0000; } -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%; +#xhr_poll_status #xhr_poll_status_on { + font-weight: bold; + color: #00FF00; } #menubar { @@ -193,24 +192,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,69 +232,14 @@ 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; color: #ffffff; list-style: none; margin-right: 1px; + margin-left: 2em; + float: right; } #modemenu li { @@ -323,7 +249,6 @@ html #menubar a:visited.warning { #savemenu { float: right; - margin-right: 2em; } .lang_de #submenu_admin_uci { @@ -342,17 +267,21 @@ textarea#syslog { font-family: monospace; } -#maincontent { +#maincontainer { clear: both; - width: 80%; + width: 96%; margin: 0 auto; + height:100%; +} + +#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 { @@ -424,13 +353,25 @@ ul.cbi-apply { font-size: 90%; } +input:-webkit-input-placeholder { + color: #AAAAAA; +} + +input:-moz-placeholder { + color: #AAAAAA; +} + +input:-ms-input-placeholder { + color: #AAAAAA; +} + input[type=submit], input[type=reset], -input[type=image] { +input[type=image], +input[type=button] { cursor: pointer; } - select, input, textarea { @@ -447,9 +388,7 @@ input[type=image] { input:focus, input:hover, select:focus, -select:hover, -textarea:focus, -textarea:hover { +select:hover { background-color: #ffffff; color: #000000; } @@ -466,38 +405,63 @@ td input[type=password] { width: 99%; } +img.cbi-image-button { + cursor: pointer; + margin: 0 2px; + vertical-align: middle; +} + +input.cbi-button { + background-color: #EEEEEE; + background-repeat: no-repeat; + background-position: 1px center; + border: 1px solid #CCCCCC; + border-radius: 3px; +} + +input.cbi-button:hover { + border-color: #4A6B7C; + background-color: #FFFFFF; +} + +input.cbi-button[disabled] { + color: #CCCCCC; + border-color: #CCCCCC; + background-color: #EEEEEE; + cursor: default; +} + input.cbi-input-user { - background: url('../resources/cbi/user.gif') no-repeat scroll 1px center; - background-color: inherit; + background-image: url('../resources/cbi/user.gif'); + background-repeat: no-repeat; + background-position: 1px center; color: #000000; text-indent: 17px; } input.cbi-input-password { - background: url('../resources/cbi/key.gif') no-repeat scroll 1px center; - background-color: inherit; + background-image: url('../resources/cbi/key.gif'); + background-repeat: no-repeat; + background-position: 1px center; color: #000000; text-indent: 17px; } input.cbi-input-find { - background: url('../resources/cbi/find.gif') no-repeat scroll 1px center; - background-color: inherit; + background-image: url('../resources/cbi/find.gif'); color: #000000; padding-left: 17px; } input.cbi-input-reload { - background: url('../resources/cbi/reload.gif') no-repeat scroll 1px center; - background-color: inherit; + background-image: url('../resources/cbi/reload.gif'); color: #000000; padding-left: 17px; } input.cbi-input-add, input.cbi-button-add { - background: url('../resources/cbi/add.gif') no-repeat scroll 1px center; - background-color: inherit; + background-image: url('../resources/cbi/add.gif'); color: #000000; padding-left: 17px; padding-right: 1px; @@ -505,8 +469,7 @@ input.cbi-button-add { input.cbi-input-fieldadd, input.cbi-button-fieldadd { - background: url(../resources/cbi/fieldadd.gif) no-repeat scroll 1px center; - background-color: inherit; + background-image: url(../resources/cbi/fieldadd.gif); color: #000000; padding-left: 17px; padding-right: 1px; @@ -514,8 +477,7 @@ input.cbi-button-fieldadd { input.cbi-input-reset, input.cbi-button-reset { - background: url('../resources/cbi/reset.gif') no-repeat scroll 1px center; - background-color: inherit; + background-image: url('../resources/cbi/reset.gif'); color: #000000; padding-left: 17px; padding-right: 1px; @@ -523,8 +485,7 @@ input.cbi-button-reset { input.cbi-input-save, input.cbi-button-save { - background: url('../resources/cbi/save.gif') no-repeat scroll 1px center; - background-color: inherit; + background-image: url('../resources/cbi/save.gif'); color: #000000; padding-left: 17px; padding-right: 1px; @@ -532,8 +493,15 @@ input.cbi-button-save { input.cbi-input-apply, input.cbi-button-apply { - background: url('../resources/cbi/apply.gif') no-repeat scroll 1px center; - background-color: inherit; + background-image: url('../resources/cbi/apply.gif'); + color: #000000; + padding-left: 17px; + padding-right: 1px; +} + +input.cbi-input-link, +input.cbi-button-link { + background-image: url('../resources/cbi/link.gif'); color: #000000; padding-left: 17px; padding-right: 1px; @@ -541,13 +509,24 @@ input.cbi-button-apply { input.cbi-input-remove, div.cbi-section-remove input { - background: url('../resources/cbi/remove.gif') no-repeat scroll 1px center; - background-color: inherit; + background-image: url('../resources/cbi/remove.gif'); color: #000000; padding-left: 17px; padding-right: 1px; } +input.cbi-button-up { + background-image: url('../resources/cbi/up.gif'); + padding-left: 11px; + padding-right: 1px; +} + +input.cbi-button-down { + background-image: url('../resources/cbi/down.gif'); + padding-left: 11px; + padding-right: 1px; +} + .cbi-input-invalid { background-image: url('../resources/cbi/reset.gif'); background-repeat: no-repeat; @@ -606,12 +585,17 @@ table.smalltext tr td { border-left: 1px solid #666666; } -table.cbi-section-table .cbi-rowstyle-1, -table.cbi-section-table .cbi-rowstyle-1 * { +table.cbi-section-table .cbi-rowstyle-1 { background-color: #eeeeff; color: #000000; } +table.cbi-section-table .cbi-rowstyle-1:hover, +table.cbi-section-table .cbi-rowstyle-2:hover { + background-color: #b2c8d4; + color: #000000; +} + .cbi-section .cbi-rowstyle-1 h3 { background-color: #eeeeff; color: #555555; @@ -624,7 +608,7 @@ table.cbi-section-table .cbi-rowstyle-1 * { div.cbi-value { clear: left; vertical-align: middle; - padding: 0.25em; + padding: 0.25em 0.6em; border-bottom: 1px dotted #bbbbbb; } @@ -656,10 +640,6 @@ div.cbi-section-create { vertical-align: top; } -div.cbi-tblsection-create { - border-bottom: 1px dotted #bbbbbb; -} - div.cbi-section-create .cbi-button { margin: 0.25em; } @@ -683,11 +663,18 @@ div.cbi-section-remove { .cbi-section-node { clear: both; - border-top: 1px dotted #bbbbbb; - border-left: 1px dotted #bbbbbb; - border-right: 1px dotted #bbbbbb; - border-bottom: none; + border: 1px solid #BBBBBB; + border-radius: 3px; padding-bottom: 0; + position: relative; +} + +.cbi-section-node-tabbed { + border-top-left-radius: 0; +} + +.cbi-section-node .cbi-value-last { + border-bottom: none; } .cbi-section-node table div { @@ -749,11 +736,18 @@ td.cbi-value-error { padding: 3px; } +.cbi-value-field var { + color: #2222FF; +} + ul.cbi-tabmenu { padding: 3px 0; margin-left: 0 !important; - margin-bottom: -1px; list-style-type: none; + position: relative; + z-index: 10; + top: 4px; + line-height: 20px; } ul.cbi-tabmenu li.cbi-tab, @@ -767,8 +761,9 @@ ul.cbi-tabmenu li.cbi-tab-disabled a { text-decoration: none; padding: 3px 7px; margin-right: 3px; - border: 1px outset #000000; + border: 1px solid #BBBBBB; border-bottom: none; + border-radius: 3px 3px 0 0; background-color: #EEEEEE; color: #BBBBBB; } @@ -783,8 +778,6 @@ ul.cbi-tabmenu li a:hover { } ul.cbi-tabmenu li.cbi-tab a { - position: relative; - top: 1px; padding-top: 4px; color: #000000; background-color: #FFFFFF; @@ -799,15 +792,20 @@ div.cbi-tab-descr { padding: 0.5em 0.5em 0.5em 2em; } +.left { + text-align: left !important; +} + .right { - text-align: right; + text-align: right !important; } .luci { - position: fixed; + position: absolute; bottom: 0; - left: 0; - text-align: right; + left: 1em; + height: 1.5em; + font-size: 80%; } .luci a:link, @@ -837,6 +835,11 @@ div.cbi-tab-descr { margin-bottom: 5px; } +.errorbox a { + color: #000000 !important; +} + + .uci-change-list { font-family: monospace; } @@ -906,33 +909,4 @@ div.cbi-tab-descr { } -#memorybar { - width: 200px; - height: 8px; - border: 1px solid #bbb; - color: black; - background-color: red; -} - -#memfree, #membuffers, #memcached { - float: right; - border: 1px solid #bbb; - height: 6px; -} - -#memfree { - background-color: green; - color: black; -} - -#membuffers { - background-color: yellow; - color: black; -} - -#memcached { - background-color: #ffa500; - color: black; -} - }