diff --git a/luci-theme-design/LICENSE b/luci-theme-design/LICENSE new file mode 100644 index 00000000..261eeb9e --- /dev/null +++ b/luci-theme-design/LICENSE @@ -0,0 +1,201 @@ + Apache License + Version 2.0, January 2004 + http://www.apache.org/licenses/ + + TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION + + 1. Definitions. + + "License" shall mean the terms and conditions for use, reproduction, + and distribution as defined by Sections 1 through 9 of this document. + + "Licensor" shall mean the copyright owner or entity authorized by + the copyright owner that is granting the License. + + "Legal Entity" shall mean the union of the acting entity and all + other entities that control, are controlled by, or are under common + control with that entity. For the purposes of this definition, + "control" means (i) the power, direct or indirect, to cause the + direction or management of such entity, whether by contract or + otherwise, or (ii) ownership of fifty percent (50%) or more of the + outstanding shares, or (iii) beneficial ownership of such entity. + + "You" (or "Your") shall mean an individual or Legal Entity + exercising permissions granted by this License. + + "Source" form shall mean the preferred form for making modifications, + including but not limited to software source code, documentation + source, and configuration files. + + "Object" form shall mean any form resulting from mechanical + transformation or translation of a Source form, including but + not limited to compiled object code, generated documentation, + and conversions to other media types. + + "Work" shall mean the work of authorship, whether in Source or + Object form, made available under the License, as indicated by a + copyright notice that is included in or attached to the work + (an example is provided in the Appendix below). + + "Derivative Works" shall mean any work, whether in Source or Object + form, that is based on (or derived from) the Work and for which the + editorial revisions, annotations, elaborations, or other modifications + represent, as a whole, an original work of authorship. For the purposes + of this License, Derivative Works shall not include works that remain + separable from, or merely link (or bind by name) to the interfaces of, + the Work and Derivative Works thereof. + + "Contribution" shall mean any work of authorship, including + the original version of the Work and any modifications or additions + to that Work or Derivative Works thereof, that is intentionally + submitted to Licensor for inclusion in the Work by the copyright owner + or by an individual or Legal Entity authorized to submit on behalf of + the copyright owner. For the purposes of this definition, "submitted" + means any form of electronic, verbal, or written communication sent + to the Licensor or its representatives, including but not limited to + communication on electronic mailing lists, source code control systems, + and issue tracking systems that are managed by, or on behalf of, the + Licensor for the purpose of discussing and improving the Work, but + excluding communication that is conspicuously marked or otherwise + designated in writing by the copyright owner as "Not a Contribution." + + "Contributor" shall mean Licensor and any individual or Legal Entity + on behalf of whom a Contribution has been received by Licensor and + subsequently incorporated within the Work. + + 2. Grant of Copyright License. Subject to the terms and conditions of + this License, each Contributor hereby grants to You a perpetual, + worldwide, non-exclusive, no-charge, royalty-free, irrevocable + copyright license to reproduce, prepare Derivative Works of, + publicly display, publicly perform, sublicense, and distribute the + Work and such Derivative Works in Source or Object form. + + 3. Grant of Patent License. Subject to the terms and conditions of + this License, each Contributor hereby grants to You a perpetual, + worldwide, non-exclusive, no-charge, royalty-free, irrevocable + (except as stated in this section) patent license to make, have made, + use, offer to sell, sell, import, and otherwise transfer the Work, + where such license applies only to those patent claims licensable + by such Contributor that are necessarily infringed by their + Contribution(s) alone or by combination of their Contribution(s) + with the Work to which such Contribution(s) was submitted. If You + institute patent litigation against any entity (including a + cross-claim or counterclaim in a lawsuit) alleging that the Work + or a Contribution incorporated within the Work constitutes direct + or contributory patent infringement, then any patent licenses + granted to You under this License for that Work shall terminate + as of the date such litigation is filed. + + 4. Redistribution. You may reproduce and distribute copies of the + Work or Derivative Works thereof in any medium, with or without + modifications, and in Source or Object form, provided that You + meet the following conditions: + + (a) You must give any other recipients of the Work or + Derivative Works a copy of this License; and + + (b) You must cause any modified files to carry prominent notices + stating that You changed the files; and + + (c) You must retain, in the Source form of any Derivative Works + that You distribute, all copyright, patent, trademark, and + attribution notices from the Source form of the Work, + excluding those notices that do not pertain to any part of + the Derivative Works; and + + (d) If the Work includes a "NOTICE" text file as part of its + distribution, then any Derivative Works that You distribute must + include a readable copy of the attribution notices contained + within such NOTICE file, excluding those notices that do not + pertain to any part of the Derivative Works, in at least one + of the following places: within a NOTICE text file distributed + as part of the Derivative Works; within the Source form or + documentation, if provided along with the Derivative Works; or, + within a display generated by the Derivative Works, if and + wherever such third-party notices normally appear. The contents + of the NOTICE file are for informational purposes only and + do not modify the License. You may add Your own attribution + notices within Derivative Works that You distribute, alongside + or as an addendum to the NOTICE text from the Work, provided + that such additional attribution notices cannot be construed + as modifying the License. + + You may add Your own copyright statement to Your modifications and + may provide additional or different license terms and conditions + for use, reproduction, or distribution of Your modifications, or + for any such Derivative Works as a whole, provided Your use, + reproduction, and distribution of the Work otherwise complies with + the conditions stated in this License. + + 5. Submission of Contributions. Unless You explicitly state otherwise, + any Contribution intentionally submitted for inclusion in the Work + by You to the Licensor shall be under the terms and conditions of + this License, without any additional terms or conditions. + Notwithstanding the above, nothing herein shall supersede or modify + the terms of any separate license agreement you may have executed + with Licensor regarding such Contributions. + + 6. Trademarks. This License does not grant permission to use the trade + names, trademarks, service marks, or product names of the Licensor, + except as required for reasonable and customary use in describing the + origin of the Work and reproducing the content of the NOTICE file. + + 7. Disclaimer of Warranty. Unless required by applicable law or + agreed to in writing, Licensor provides the Work (and each + Contributor provides its Contributions) on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or + implied, including, without limitation, any warranties or conditions + of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A + PARTICULAR PURPOSE. You are solely responsible for determining the + appropriateness of using or redistributing the Work and assume any + risks associated with Your exercise of permissions under this License. + + 8. Limitation of Liability. In no event and under no legal theory, + whether in tort (including negligence), contract, or otherwise, + unless required by applicable law (such as deliberate and grossly + negligent acts) or agreed to in writing, shall any Contributor be + liable to You for damages, including any direct, indirect, special, + incidental, or consequential damages of any character arising as a + result of this License or out of the use or inability to use the + Work (including but not limited to damages for loss of goodwill, + work stoppage, computer failure or malfunction, or any and all + other commercial damages or losses), even if such Contributor + has been advised of the possibility of such damages. + + 9. Accepting Warranty or Additional Liability. While redistributing + the Work or Derivative Works thereof, You may choose to offer, + and charge a fee for, acceptance of support, warranty, indemnity, + or other liability obligations and/or rights consistent with this + License. However, in accepting such obligations, You may act only + on Your own behalf and on Your sole responsibility, not on behalf + of any other Contributor, and only if You agree to indemnify, + defend, and hold each Contributor harmless for any liability + incurred by, or claims asserted against, such Contributor by reason + of your accepting any such warranty or additional liability. + + END OF TERMS AND CONDITIONS + + APPENDIX: How to apply the Apache License to your work. + + To apply the Apache License to your work, attach the following + boilerplate notice, with the fields enclosed by brackets "[]" + replaced with your own identifying information. (Don't include + the brackets!) The text should be enclosed in the appropriate + comment syntax for the file format. We also recommend that a + file or class name and description of purpose be included on the + same "printed page" as the copyright notice for easier + identification within third-party archives. + + Copyright [yyyy] [name of copyright owner] + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. diff --git a/luci-theme-design/Makefile b/luci-theme-design/Makefile new file mode 100644 index 00000000..87dba76a --- /dev/null +++ b/luci-theme-design/Makefile @@ -0,0 +1,14 @@ +# This program is free software; you can redistribute it and/or +# modify it under the terms of the GNU General Public License +# as published by the Free Software Foundation; either version 2 +# of the License, or (at your option) any later version. + +include $(TOPDIR)/rules.mk + +LUCI_TITLE:=Design Theme +LUCI_DEPENDS:= +PKG_VERSION:=5.8.0-20240106 + +include $(TOPDIR)/feeds/luci/luci.mk + +# call BuildPackage - OpenWrt buildroot signature diff --git a/luci-theme-design/README.md b/luci-theme-design/README.md new file mode 100644 index 00000000..966fefbb --- /dev/null +++ b/luci-theme-design/README.md @@ -0,0 +1,107 @@ +
+

+ LuCI design theme for OpenWrt +

+ + + + + + + + + + + + +
+
+ +
简体中文 | [English](README_en.md) + +# luci-theme-design + + luci-theme-design 是一个针对移动端和PC端的沉浸式WebApp体验和优化的OpenWrt LuCI主题 +- **luci-theme-design**基于luci-theme-neobird二次开发, 适用于[lede](https://github.com/coolsnowwolf/lede) +- main支持lede源码的lua版本 +- js分支开始由[papagaye744](https://github.com/papagaye744)维护 + +- 你可以使用[插件](https://github.com/gngpp/luci-app-design-config)定义一些设置 + - 支持更改主题深色/浅色模式 + - 支持显示/隐藏导航栏 + - 支持更换常用的代理图标 + +- 感谢 [JetBrains](https://www.jetbrains.com/) 提供的非商业开源软件开发授权! + + +### 主要特点 + +- 适配移动端响应式优化,适合手机端做为WebApp使用 +- 修改和优化了很多插件显示,完善的设备icon图标,视觉统一 +- 简洁的登录界面,底部导航栏,类App的沉浸式体验 +- 适配深色模式,适配系统自动切换,插件式自定义模式 +- 支持插件式配置主题 +- 流畅度比肩bootstrap + +### 体验WebApp方法 + +- 在移动端(iOS/iPadOS、Android谷歌)浏览器打开设置管理,添加到主屏幕即可。 + +### 优化 + +- 修复安装package提示信息背景泛白 +- 优化菜单折叠和缩放 +- 优化显示网口down状态显示图标 +- 优化logo显示 +- 新增各设备状态图标显示 +- 更换logo显示为字体"OpenWrt",支持以主机名显示logo +- 修复部分插件显示bug +- 修复vssr状态bar +- 修复诸多bug +- 修复兼容部分插件样式 +- 修复aliyundrive-webdav样式 +- 修复vssr在iOS/iPadOS WebApp模式下显示异常 +- 修复openclash插件在iOS/iPadOS WebApp 模式下env(safe-area-inset-bottom) = 0 +- 优化菜单hover action状态分辨 +- 支持luci-app-wizard向导菜单 +- Update header box-shadow style +- Update uci-change overflow +- Fix nlbw component +- 支持QWRT(QSDK)、iStore向导导航 +- 适配OpenWrt 21/22 +... + +### 编译 + +``` +git clone https://github.com/kenzok78/luci-theme-design.git package/luci-theme-design +make menuconfig # choose LUCI->Theme->Luci-theme-design +make V=s +``` + +### Q&A + +- 有bug欢迎提issue +- 主题个人配色可能会不符合大众胃口,欢迎提配色建议 + +### 预览 + +
iOS + + +
+ +
iPadOS + + +
+ + + + + + + + + + diff --git a/luci-theme-design/README_en.md b/luci-theme-design/README_en.md new file mode 100644 index 00000000..54edc2ea --- /dev/null +++ b/luci-theme-design/README_en.md @@ -0,0 +1,98 @@ +
+

+ LuCI design theme for OpenWrt +

+ + + + + + + + + + + + +
+
+ +
English | [简体中文](README.md) + +# luci-theme-design + +### luci-theme-design is an OpenWrt LuCI theme for immersive WebApp experience and optimization on mobile and PC +- **luci-theme-design** based on luci-theme-neobird, for [lede](https://github.com/coolsnowwolf/lede) / [OpenWrt](https://github.com/openwrt/ openwrt) +- The default branch only supports the lua version of the lede source code. If you use openwrt 21/22, please pull the [js](https://github.com/gngpp/luci-theme-design/tree/js) version (development stage). + +- You can define some settings using [plugin](https://github.com/gngpp/luci-app-design-config) + - Support changing theme dark/light mode + - Support show/hide navigation bar + - Support replacing commonly used proxy icons + +### If you find it useful, please click a star, your support is the driving force for my long-term updates, thank you. + +- Thanks for non-commercial open source development authorization by [JetBrains](https://www.jetbrains.com/)! + + +### Release version + +- Lua version select 5.x version +- JS version select 6.x version + +### Features + +- Adapt to the responsive optimization of the mobile terminal, suitable for use as a WebApp on the mobile terminal +- Modified and optimized the display of many plug-ins, improved icon icons, and unified visuals as much as possible +- Simple login interface, bottom navigation bar, immersive app-like experience +- Adapt to dark mode, adapt to system automatic switching, support custom mode +- Adapt to openwrt 21/22, lede + +### Experience WebApp method + +- Open the settings management in the mobile browser (iOS/iPadOS, Android Google) and add it to the home screen. +- If the SSL certificate is not used, iOS/iPadOS will display the menu bar at the top of the browser after opening a new page for security reasons. + +### Optimization + +- Optimize menu collapsing and zooming +- Optimized to display network port down state display icon +- Support QWRT (QSDK), iStore wizard navigation +- Adapt to OpenWrt 21/22 +- Adapt to linkease series icons + +### Compile + +``` +git clone https://github.com/gngpp/luci-theme-design.git package/luci-theme-design +make menuconfig # choose LUCI->Theme->Luci-theme-design +make V=s +``` + +### Q&A + +- The resource interface icon is not perfect. If you have the ability to draw a picture, you are welcome to pr, but please make sure it is consistent with the existing icon color style +- If there is a bug, please raise an issue +- The theme's personal color matching may not meet the public's appetite, welcome to provide color matching suggestions + +### Preview + +
iOS + + +
+ +
iPadOS + + +
+ + + + + + + + + + diff --git a/luci-theme-design/dev/design.js b/luci-theme-design/dev/design.js new file mode 100644 index 00000000..044b4d78 --- /dev/null +++ b/luci-theme-design/dev/design.js @@ -0,0 +1,266 @@ +/* + * xhr.js - XMLHttpRequest helper class + * (c) 2008-2010 Jo-Philipp Wich + */ + +XHR = function() +{ + this.reinit = function() + { + if (window.XMLHttpRequest) { + this._xmlHttp = new XMLHttpRequest(); + } + else if (window.ActiveXObject) { + this._xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); + } + else { + alert("xhr.js: XMLHttpRequest is not supported by this browser!"); + } + } + + this.busy = function() { + if (!this._xmlHttp) + return false; + + switch (this._xmlHttp.readyState) + { + case 1: + case 2: + case 3: + return true; + + default: + return false; + } + } + + this.abort = function() { + if (this.busy()) + this._xmlHttp.abort(); + } + + this.get = function(url,data,callback) + { + this.reinit(); + + var xhr = this._xmlHttp; + var code = this._encode(data); + + url = location.protocol + '//' + location.host + url; + + if (code) + if (url.substr(url.length-1,1) == '&') + url += code; + else + url += '?' + code; + + xhr.open('GET', url, true); + + xhr.onreadystatechange = function() + { + if (xhr.readyState == 4) { + var json = null; + if (xhr.getResponseHeader("Content-Type") == "application/json") { + try { + json = eval('(' + xhr.responseText + ')'); + } + catch(e) { + json = null; + } + } + + callback(xhr, json); + } + } + + xhr.send(null); + } + + this.post = function(url,data,callback) + { + this.reinit(); + + var xhr = this._xmlHttp; + var code = this._encode(data); + + xhr.onreadystatechange = function() + { + if (xhr.readyState == 4) + callback(xhr); + } + + xhr.open('POST', url, true); + xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded'); + xhr.send(code); + } + + this.cancel = function() + { + this._xmlHttp.onreadystatechange = function(){}; + this._xmlHttp.abort(); + } + + this.send_form = function(form,callback,extra_values) + { + var code = ''; + + for (var i = 0; i < form.elements.length; i++) + { + var e = form.elements[i]; + + if (e.options) + { + code += (code ? '&' : '') + + form.elements[i].name + '=' + encodeURIComponent( + e.options[e.selectedIndex].value + ); + } + else if (e.length) + { + for (var j = 0; j < e.length; j++) + if (e[j].name) { + code += (code ? '&' : '') + + e[j].name + '=' + encodeURIComponent(e[j].value); + } + } + else + { + code += (code ? '&' : '') + + e.name + '=' + encodeURIComponent(e.value); + } + } + + if (typeof extra_values == 'object') + for (var key in extra_values) + code += (code ? '&' : '') + + key + '=' + encodeURIComponent(extra_values[key]); + + return( + (form.method == 'get') + ? this.get(form.getAttribute('action'), code, callback) + : this.post(form.getAttribute('action'), code, callback) + ); + } + + this._encode = function(obj) + { + obj = obj ? obj : { }; + obj['_'] = Math.random(); + + if (typeof obj == 'object') + { + var code = ''; + var self = this; + + for (var k in obj) + code += (code ? '&' : '') + + k + '=' + encodeURIComponent(obj[k]); + + return code; + } + + return obj; + } +} + +XHR.get = function(url, data, callback) +{ + (new XHR()).get(url, data, callback); +} + +XHR.poll = function(interval, url, data, callback) +{ + if (isNaN(interval) || interval < 1) + interval = 5; + + if (!XHR._q) + { + XHR._t = 0; + XHR._q = [ ]; + XHR._r = function() { + for (var i = 0, e = XHR._q[0]; i < XHR._q.length; e = XHR._q[++i]) + { + if (!(XHR._t % e.interval) && !e.xhr.busy()) + e.xhr.get(e.url, e.data, e.callback); + } + + XHR._t++; + }; + } + + XHR._q.push({ + interval: interval, + callback: callback, + url: url, + data: data, + xhr: new XHR() + }); + + XHR.run(); +} + +XHR.halt = function() +{ + if (XHR._i) + { + /* show & set poll indicator */ + try { + document.getElementById('xhr_poll_status').style.display = ''; + document.getElementById('xhr_poll_status_on').style.display = 'none'; + document.getElementById('xhr_poll_status_off').style.display = ''; + document.getElementById('notice_status').style.marginRight = '30px' + } catch(e) { } + + window.clearInterval(XHR._i); + XHR._i = null; + } +} + +XHR.run = function() +{ + if (XHR._r && !XHR._i) + { + /* show & set poll indicator */ + try { + document.getElementById('xhr_poll_status').style.display = ''; + document.getElementById('xhr_poll_status_on').style.display = ''; + document.getElementById('xhr_poll_status_off').style.display = 'none'; + document.getElementById('notice_status').style.marginRight = '30px' + } catch(e) { } + + /* kick first round manually to prevent one second lag when setting up + * the poll interval */ + XHR._r(); + XHR._i = window.setInterval(XHR._r, 1000); + } +} + +XHR.running = function() +{ + return !!(XHR._r && XHR._i); +} + +;(function ($) { + // Fixed status realtime table overflow style + function settingsStatusRealtimeOverflow() { + if (self.location.pathname.includes("status/realtime")) { + const nodeStatusRealtime = $('.node-status-realtime'); + const selectorValues = ['bandwidth', 'wifirate', 'wireless']; + // .node-status-realtime embed[src="/luci-static/resources/bandwidth.svg"] + div + br + table + // .node-status-realtime embed[src="/luci-static/resources/wifirate.svg"] + div + br + table + // .node-status-realtime embed[src="/luci-static/resources/wireless.svg"] + div + br + table + for (let i = 0; i < selectorValues.length; i++) { + const value = selectorValues[i]; + const target = nodeStatusRealtime.find(`embed[src="/luci-static/resources/${value}.svg"] + div + br + table`); + if (target.length) { + target.wrap('
'); + } + } + } + } + + $(document).ready(() => { + settingsStatusRealtimeOverflow(); + }); + +})(jQuery); diff --git a/luci-theme-design/dev/script.js b/luci-theme-design/dev/script.js new file mode 100644 index 00000000..6fd5052f --- /dev/null +++ b/luci-theme-design/dev/script.js @@ -0,0 +1,247 @@ +/** + * Material is a clean HTML5 theme for LuCI. It is based on luci-theme-bootstrap and MUI + * + * luci-theme-argon + * Copyright 2023 gngpp + * + * Have a bug? Please create an issue here on GitHub! + * https://github.com/LuttyYang/luci-theme-material/issues + * + * luci-theme-bootstrap: + * Copyright 2008 Steven Barth + * Copyright 2008 Jo-Philipp Wich + * Copyright 2012 David Menting + * + * MUI: + * https://github.com/muicss/mui + * + * luci-theme-material: + * https://github.com/LuttyYang/luci-theme-material/ + * + * + * Licensed to the public under the Apache License 2.0 + */ +(function ($) { + + $(".main > .loading").fadeOut(); + + /** + * trim text, Remove spaces, wrap + * @param text + * @returns {string} + */ + function trimText(text) { + return text.replace(/[ \t\n\r]+/g, " "); + } + + var lastNode = undefined; + var mainNodeName = undefined; + + var nodeUrl = ""; + (function (node) { + if (node[0] == "admin") { + luciLocation = [node[1], node[2]]; + } else { + luciLocation = node; + } + + for (var i in luciLocation) { + nodeUrl += luciLocation[i]; + if (i != luciLocation.length - 1) { + nodeUrl += "/"; + } + } + })(luciLocation); + + /** + * get the current node by Burl (primary) + * @returns {boolean} success? + */ + function getCurrentNodeByUrl() { + if (!$('body').hasClass('logged-in')) { + luciLocation = ["Main", "Login"]; + return true; + } + const urlReg = new RegExp(nodeUrl + "$") + var ret = false; + $(".main > .main-left > .nav > .slide > .active").next(".slide-menu").stop(true).slideUp("fast"); + $(".main > .main-left > .nav > .slide > .menu").removeClass("active"); + $(".main > .main-left > .nav > .slide > .menu").each(function () { + var ulNode = $(this); + + ulNode.next().find("a").each(function () { + var that = $(this); + var href = that.attr("href"); + + if (urlReg.test(href)) { + ulNode.click(); + ulNode.next(".slide-menu").stop(true, true); + lastNode = that.parent(); + lastNode.addClass("active"); + ret = true; + return true; + } + }); + }); + return ret; + } + + /** + * menu click + */ + $(".main > .main-left > .nav > .slide > .menu").click(function () { + var ul = $(this).next(".slide-menu"); + var menu = $(this); + if (!menu.hasClass("exit")) { + $(".main > .main-left > .nav > .slide > .active").next(".slide-menu").stop(true).slideUp("fast"); + $(".main > .main-left > .nav > .slide > .menu").removeClass("active"); + if (!ul.is(":visible")) { + menu.addClass("active"); + ul.addClass("active"); + ul.stop(true).slideDown("fast"); + } else { + ul.stop(true).slideUp("fast", function () { + menu.removeClass("active"); + ul.removeClass("active"); + }); + } + + return false; + } + }); + + /** + * hook menu click and add the hash + */ + $(".main > .main-left > .nav > .slide > .slide-menu > li > a").click(function () { + if (lastNode != undefined) + lastNode.removeClass("active"); + $(this).parent().addClass("active"); + $(".main > .loading").fadeIn("fast"); + return true; + }); + + /** + * fix menu click + */ + $(".main > .main-left > .nav > .slide > .slide-menu > li").click(function () { + if (lastNode != undefined) + lastNode.removeClass("active"); + $(this).addClass("active"); + $(".main > .loading").fadeIn("fast"); + window.location = $($(this).find("a")[0]).attr("href"); + return false; + }); + + /** + * get current node and open it + */ + if (getCurrentNodeByUrl()) { + mainNodeName = "node-" + luciLocation[0] + "-" + luciLocation[1]; + mainNodeName = mainNodeName.replace(/[ \t\n\r\/]+/g, "_").toLowerCase(); + $("body").addClass(mainNodeName); + } + + /** + * hook other "A Label" and add hash to it. + */ + $("#maincontent > .container").find("a").each(function () { + var that = $(this); + var onclick = that.attr("onclick"); + if (onclick == undefined || onclick == "") { + that.click(function () { + var href = that.attr("href"); + if (href.indexOf("#") == -1) { + $(".main > .loading").fadeIn("fast"); + return true; + } + }); + } + }); + + /** + * Sidebar expand + */ + var showSide = false; + + $(".showSide").click(function () { + if (showSide) { + $(".darkMask").stop(true).fadeOut("fast"); + $(".main-left").stop(true).animate({ + width: "0" + }, "fast"); + $(".main-right").css("overflow-y", "auto"); + $("header>.container>.brand").css("padding", "0 4.5rem") + showSide = false; + } else { + $(".darkMask").stop(true).fadeIn("fast"); + $(".main-left").stop(true).animate({ + width: "18rem" + }, "fast"); + $(".main-right").css("overflow-y", "hidden"); + $(".showSide").css("display", "none"); + $("header").css("box-shadow", "18rem 2px 4px rgb(0 0 0 / 8%)") + $("header>.container>.brand").css("padding", '0rem') + showSide = true; + } + }); + + $(".darkMask").click(function () { + if (showSide) { + $(".darkMask").stop(true).fadeOut("fast"); + $(".main-left").stop(true).animate({ + width: "0" + }, "fast"); + $(".main-right").css("overflow-y", "auto"); + $(".showSide").css("display", ""); + $("header").css("box-shadow", "0 2px 4px rgb(0 0 0 / 8%)") + $("header>.container>.brand").css("padding", "0 4.5rem") + showSide = false; + } + }); + + $(window).resize(function () { + if ($(window).width() > 992) { + showSide = false; + $(".showSide").css("display", ""); + $(".main-left").css("width", ""); + $(".darkMask").stop(true); + $(".darkMask").css("display", "none"); + $("header").css("box-shadow", "18rem 2px 4px rgb(0 0 0 / 8%)") + $("header>.container>.brand").css("padding", '0rem') + } else { + $("header").css("box-shadow", "0 2px 4px rgb(0 0 0 / 8%)") + $("header>.container>.brand").css("padding", "0 4.5rem") + } + if (showSide) { + $("header").css("box-shadow", "18rem 2px 4px rgb(0 0 0 / 8%)") + $("header>.container>.brand").css("padding", '0rem') + } + }); + + $(".main-right").focus(); + $(".main-right").blur(); + $("input").attr("size", "0"); + + if (mainNodeName != undefined) { + switch (mainNodeName) { + case "node-status-system_log": + case "node-status-kernel_log": + $("#syslog").focus(function () { + $("#syslog").blur(); + $(".main-right").focus(); + $(".main-right").blur(); + }); + break; + case "node-status-firewall": + var button = $(".node-status-firewall > .main fieldset li > a"); + button.addClass("cbi-button cbi-button-reset a-to-btn"); + break; + case "node-system-reboot": + var button = $(".node-system-reboot > .main > .main-right p > a"); + button.addClass("cbi-button cbi-input-reset a-to-btn"); + break; + } + } + +})(jQuery); diff --git a/luci-theme-design/dev/style.css b/luci-theme-design/dev/style.css new file mode 100644 index 00000000..c77147dd --- /dev/null +++ b/luci-theme-design/dev/style.css @@ -0,0 +1,3522 @@ +/** + * Design is a clean HTML5 theme for LuCI. It is based on luci-theme-material and luci-theme-neobird + * + * luci-theme-material + * Copyright 2015 Lutty Yang + * + * luci-theme-Neobird + * Copyright 2021 2smile + * + * Licensed to the public under the Apache License 2.0 + */ + :root { + --commonRadius0: 8px; + --commonRadius1: 5px + } + + [data-theme='light'] { + --bg: #f1f4f5; + --mainbg: #fff; + --bgwhite: #fff; + --activeColor: #5ea69b; + --activeBottom: #5ea69b 2px solid; + --textColor: rgb(132,119,116); + --borderColor: rgba(0,0,0,.15); + --navbgColor: rgba(255, 255, 255, .7); + --navBorder: 1px solid #f2f2f2; + --sectionbgColor: #fff; + --sectionbgColor2: #fff; + --sectionShaddow: 3px 3px 3px rgba(0,0,0,.05); + --sectionBorder: none; + --sectiontabBorder: none; + --tabmenuBorderLR: none; + --tabmenubgColor: none; + --tabmenuBottom: #e4eaec 1px solid; + --tabmenuRadius: 6px 6px 0 0; + --sectionnodeBorder: #f7f7f7 1px solid; + --cbilineColor: #f7f7f7 1px solid; + --tabbgColor: #fff; + --inputbgColor: #f8f8f8; + --inputtextColor: #76838f; + --inputBorder: 1px solid #e4eaec; + --mainleftbgColor: rgb(255,255,255); + --bttextColor: #fff; + --badgebgColor: #f7f7f7; + --badgeBorder: #e4eaec 1px solid; + --progressbarColor: #c8c8c8; + --progressbar: #5ea69b; + --progressbartxtColor: #fff; + /* --logo: url('/luci-static/design/images/logo.png'); + --mlogo: url('/luci-static/design/images/mlogo.png'); */ + --logo_color: #222b36; + --alertColor: #000000; + --alertBackground: rgb(230 230 230); + --scrollbarColor:#c5c5c5; + --ifaceboxBorderColor: #b8b8b8bd; + --ifaceboxFontColor: #404040; + --liSelectedColor: #c5c5c5; + --vssrStatusColor: #525f7f; + --vssrBoxShadow: 0 0 2rem 0 rgb(136 152 170 / 30%); +} + +[data-theme='dark'] { + --bg: #000; + --bgwhite: #000; + --textColor: #fefefe; + --activeColor: #5ea69b; + --activeBottom: #5ea69b 2px solid; + --borderColor: #2C2C3A; + --navbgColor: hsla(0, 0%, 7%, .8); + --navBorder: 1px solid #1c1c1e; + --sectionbgColor: #1c1c1e; + --sectionbgColor2: #1c1c1e; + --sectionShaddow: 3px 3px 3px rgba(0,0,0,.05); + --sectionBorder: none; + --sectiontabBorder: none; + --sectionnodeBorder: #3d3d41 1px solid; + --cbilineColor: #2d2d2d 1px solid; + --tabbgColor: #1c1c1e; + --tabmenuBorderLR: none; + --tabmenubgColor: none; + --tabmenuBottom: #2d2d2d 1px solid; + --tabmenuRadius: 6px 6px 0 0; + --inputbgColor: #2f2f2f; + --inputtextColor: #fefefe; + --inputBorder: 1px solid #4d4d4d; + --mainleftbgColor: #000; + --bttextColor: #fefefe; + --badgebgColor: #fefefe; + --badgeBorder: #3d3d40 1px solid; + --progressbarColor: #6d6d6d; + --progressbar: #5ea69b; + --progressbartxtColor: #fefefe; + /* --logo: url('/luci-static/design/images/logod.png'); + --mlogo: url('/luci-static/design/images/mlogod.png'); */ + --logo_color: #fefefe; + --alertColor: #ffffff; + --alertBackground: rgb(30 30 30); + --scrollbarColor:#2f2f2f; + --ifaceboxBorderColor: #636363bd; + --ifaceboxFontColor: #404040; + --liSelectedColor: #2f2f2f; + --vssrStatusColor: rgb(204, 204, 204); + --vssrBoxShadow: 0 0 1rem 0 rgb(0 0 0 / 30%); +} + +@font-face { + font-family: 'icomoon'; + src: url('../fonts/font.eot'); + src: url('../fonts/font.eot') format('embedded-opentype'), + url('../fonts/font.ttf') format('truetype'), + url('../fonts/font.woff') format('woff'), + url('../fonts/font.svg') format('svg'); + font-weight: normal; + font-style: normal; +} + +@font-face { + font-family: 'design'; + src: url(''); + src: url('?#iefix') format('embedded-opentype'), + url('../fonts/iconfont-Regular.woff2') format('woff2'), + url('../fonts/iconfont-Regular.woff') format('woff'), + url('../fonts/iconfont-Regular.ttf') format('truetype'), + url('#iconfont') format('svg'); +} + +@font-face{ + font-family: 'GenJyuuGothic-Medium'; + src : url('../fonts/GenJyuuGothic-Medium.otf') format('opentype'); +} + +*::-webkit-scrollbar { + width: 5px; + height: 5px; + } + *::-webkit-scrollbar-thumb { + background: var(--scrollbarColor) ; + border-radius: 2px; + } + +div{ + font-family: 'HYk2gj'; +} + +html { + -webkit-text-size-adjust: 100%; + -ms-text-size-adjust: 100%; +} + +html, body { + margin: 0px; + padding: 0px; + height: 100%; + font-family: -apple-system, 'Microsoft Yahei' !important; + font-size: 0.92rem; + line-height: 150%; + background-color: var(--bg); + color:var(--textColor); +} + +body div { + line-height:150%; +} + +a { + color: var(--textColor); + text-decoration: none; +} + +em { + font-style:normal !important; + line-height: 1.5; + padding-left: 10px; +} + +* { + margin: 0; + padding: 0; + box-sizing: border-box; + -webkit-tap-highlight-color: transparent; +} + +select { + overflow: hidden !important; + width: 100%; + appearance: none; + -webkit-appearance: none; + -moz-appearance: none; + padding: 0 25px 0 10px !important; + background-size: 24px 16px; + background-repeat: no-repeat; + background-position: right center; + background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABGCAYAAAA6hjFpAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDcuMS1jMDAwIDc5LmRhYmFjYmIsIDIwMjEvMDQvMTQtMDA6Mzk6NDQgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjhDNzA0QUE0NjE2QTExRUNCMjJFQkQyRkIyNURDNjE3IiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjhDNzA0QUEzNjE2QTExRUNCMjJFQkQyRkIyNURDNjE3IiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCAyMi41IChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6QzNBNTYzNTY2MTUxMTFFQ0IyMkVCRDJGQjI1REM2MTciIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QzNBNTYzNTc2MTUxMTFFQ0IyMkVCRDJGQjI1REM2MTciLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6YjzxlAAACsklEQVR42uyaXUsVURSG51T0U/obfUvhhYF0U0HQhZQVIWVJCAkiSUXfRRcaBFbXQVBBRCASFCJBpQQipw+RREkpCa9aG95gs0DMOp6Z7TwvvAxnzczaa6/nzDnzVTndfSVDxdE6WgAQBBCAIIAABAEEIAggAEEAQQABCAIIQBBAAIIAAhAEEAQQgCCAAAStGSAbzA/N+wvSiwPmB6or16bkoY2afLN5r+q4l2MfDpr7zetV2z7zYpmOkAHByNSE0IxDOdUSxr2rOjLVNVC2n6z77hsYmtFnbqlzHS0aN+7DouorFZBH+ibGUCrmO+YjdaqhVeNVHIxm1Ve6P/XH5ibzLwfllvn4Ko8d8t90MEIde1RXaU97n6oJCw7KNXPbKo3ZpvwxjAXV8YTrkCx7piPFQ7lsbq/xWO3K62E0qQ4uDKXn5kbzTxe/YO6o0Rgdypc5GI0anyt1p5fm3eYfLn7e3PmfuTuVJ1YYZ5fG5Up9CQ2qSfMu3m3u+secXdo/1rzGGeTWyfIaUrPmXPycuWeFuXq0X6w55R8q4NwLe3PxlXmn+buLnzX3/mWOXm0fK+RrUP4MICvTG/MO86yLnzFfWmbfi9ou1qzyvS7wnAt/+31YTZxx8ZPmq+709c/pcoifcvEZ5Rku+HyTeB4yYt5unnbxE+YbEZSwvK54rGntP5LAXJN5QPXWvNX8zcWPmm9rHmF5zK0P22/T/hlAaqv35i3mKRc/bB7VMtaUIL5LaI7JPcIdVZMnXXyT+zyp7T4kNr8kn6mPqdlfllj/VevHEpxbsi85fNTP1ycX/2zerPUZQOqrcUGp6nNVMMYTnlPyrwFNCMILLScSn0++r7zUSFVdZ6wJ8aIcQBBAAIIAAhAEEIAggAAEAQQBBCAIIABBAAEIAghAEEAQQJLQbwEGAK/reX2gh5gQAAAAAElFTkSuQmCC'); +} + +select, +input { + color: var(--inputtextColor); + padding: 5px 10px; + font-size: 0.92rem; + font-family: -apple-system, 'Microsoft Yahei', sans-serif, Helvetica, Arial, sans-serif; + border: var(--inputBorder); + background-color: var(--inputbgColor); + transition: color 100ms ease, border-color 100ms ease, opacity 100ms ease; + -webkit-transition: color 100ms ease, border-color 100ms ease, opacity 100ms ease; + outline-style: none; + vertical-align: middle; + border-radius: var(--commonRadius0); + margin: 3px 3px 3px 0; + height: 2.8rem; + line-height: 2.8rem; + max-width: 550px; +} + +select:not([multiple="multiple"]):focus, +input:focus { + border-color: #948FE1; + box-shadow:0 0 6px #948FE1; + -webkit-box-shadow:0 0 6px #948FE1; + -moz-box-shadow:0 0 6px #948FE1; +} + +input[type='file'] { + border: none; + background: none; + height: auto; + line-height: 1rem; +} + +input[type='checkbox'] { + height: 1.2rem; + width: 1.2rem; +} +input[type='radio'] { + height: 1.2rem; + width: 1.2rem; + box-shadow: var(--bg); +} + +select[multiple="multiple"] { + height: auto; +} + +.node-docker-images input[type='text'] { + width: auto !important; +} + +input[type='text'],input[type='password'] { + width: 100%; +} + +code { + color: #0099CC; +} + +/* img[src*="/images/logo.png"] + { + height: 60px; + background-image: var(--logo); + background-size: 220px; + background-repeat: no-repeat; + padding: 0 0 0 250px; + width: 0; + background-position-x: 10px; + background-position-y: 10px; + background-color: var(--mainleftbgColor); +} */ + +abbr { + text-decoration: underline; + cursor: help; +} + +br { + display: block; + margin-bottom: 0.2px; + content: ''; +} + +hr{ + margin: 1rem 0; + border-color: #EEE; + opacity: 0.1; +} + +/* .cbi-section-table-cell br, #cbi-system br, #cbi-dropbear br, .node-status-routes br { + display: none; +} */ + +header, .main { + width: 100%; + position: absolute; +} + +header { + background-color: var(--bgwhite); + box-shadow: 18rem 2px 4px rgba(0, 0, 0, 0.08); + transition: box-shadow 0.1s; + height: 55px; + float: left; + position: fixed; + z-index: 101; +} + +footer { + text-align: right; + padding: 1rem; + color: #aaa; + font-size: 11px; + height: 80px; + visibility:hidden; + /*text-shadow: 0px 0px 2px #BBB;*/ +} + +footer > a { + color: rgb(154,37,143); + text-decoration: none; +} + +text, line { + font-family: Verdana !important; +} + +.cbi-button-up, +.cbi-button-down, +.cbi-value-helpicon, +.showSide, +.main > .loading > span { + font-family: 'icomoon' !important; + font-size:10px; + speak: none; + font-style: normal !important; + font-weight: normal !important; + font-variant: normal !important; + text-transform: none !important; + line-height: 1; + + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +/* fix luci-app-passwall2 button style */ +.node-services-passwall2 #cbi-passwall2 { + text-align: center; +} +.node-services-passwall2 input.cbi-button.cbi-button { + max-width: unset; +} +/* fix luci-app-passwall/luci-app-passwall2 node_div style */ +.node-services-passwall #set_node_div, +.node-services-passwall2 #set_node_div, +.node-services-passwall #add_link_div, +.node-services-passwall2 #add_link_div { + background: var(--sectionbgColor); + border-radius: var(--commonRadius0); +} +.node-services-passwall #add_link_div #nodes_link, +.node-services-passwall2 #add_link_div #nodes_link { + width: 100% !important; +} + +.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 { + font-family: -apple-system, 'Microsoft Yahei'; + font-weight: 600; + line-height: 1.1; + color: inherit; + clear:both; + text-transform: capitalize; +} + +label.zonebadge.zonebadge-empty { + background-color: #03abe8 !important; +} + +label.zonebadge{ + border-radius: var(--commonRadius1); + padding: 2px 5px 2px 5px !important; + /* background-color: #5bdeae !important; */ + display: inline-block; + cursor: pointer; + color: #666666; +} +.zonebadge { + /* background-color: var(--tabmenubgColor) !important; */ + border-radius: 6px; + padding: 5px; +} + +.zonebadge em { + padding:3px; +} + +svg { + background-color: var(--sectionbgColor); +} + +/* fix .cbi-section .cbi-section */ +.cbi-section .cbi-section { + margin: 10px; +} + +/* fix node-services-vssr */ +.node-services-vssr .status-bar { + bottom:calc(var(--vssrBottom) + constant(safe-area-inset-bottom)); + bottom:calc(var(--vssrBottom) + env(safe-area-inset-bottom)); + background-color: var(--navbgColor); + box-shadow: var(--vssrBoxShadow) !important; + color: var(--vssrStatusColor) !important; +} +.node-services-vssr .container { + padding-bottom:calc(var(--vssrBottom) + constant(safe-area-inset-bottom)); + padding-bottom:calc(var(--vssrBottom) + env(safe-area-inset-bottom)); +} + +.node-services-vssr .ssr-button { + min-width: 30px; +} +.node-services-vssr #cbi-vssr .panel-title { + padding: 10px 0 10px 10px !important; + letter-spacing: 0 !important; +} + +.node-services-vssr .status .block { + border-radius: 10px !important; + box-shadow: none !important; + background-color: var(--sectionbgColor) !important; +} + +.node-services-vssr button { + border-radius: 10px !important; + } + +#cbi-vssr-servers .cbi-section-table-row { + position: relative; + margin: 10px !important; + padding: 8px 15px 8px 70px; + box-shadow: none !important; + border-radius: 10px !important; + border: 0; + color: var(--textColor) !important; + text-align: left; + line-height: 1.7em; + overflow: hidden; + letter-spacing: normal; + background-color: var(--inputbgColor) !important; +} +.cbi-section-table-row.fast { + background-color: #add8e6 !important; +} +.incon .tp { + text-transform: uppercase; + color: var(--bg) !important; +} + +/* file selector upload button */ +::file-selector-button { + transition: all .1s ease-in-out; + border-radius: var(--commonRadius1); + border: 3px solid #337ab7!important; + color: #fff!important; + background-color: #337ab7!important; + box-sizing: border-box; + cursor: pointer; +} +::file-selector-button:hover, +::file-selector-button:focus, +::file-selector-button:active { + color: #fff!important; + background-color: #6a65d6!important; + border-color: #6a65d6!important +} + +/** img retina **/ +img[src*="/luci-static/resources/icons/port_up.png"] { + background-image: url(../images/port_up.png); + background-size: 32px 32px; + height: 32px; + padding: 0 0 0 32px; + width: 0; +} + +img[src*="/luci-static/resources/icons/port_down.png"] { + background-image: url(../images/port_down.png); + background-size: 32px 32px; + height: 32px; + padding: 0 0 0 32px; + width: 0; +} + +#wan4_i img[src*="/luci-static/resources/icons/ethernet.png"], +#wan6_i img[src*="/luci-static/resources/icons/ethernet.png"], +img[src*="/luci-static/resources/icons/ethernet.png"] { + background-image: url(../images/ethernet.png); + background-size: 32px 32px; + height: 32px; + width: 32px; + padding: 0 0 0 32px; + width: 0; +} +#cbi-network-lan-ifname_multi img[src*="/luci-static/resources/icons/ethernet.png"], +#cbi-network-1-_ifname img[src*="/luci-static/resources/icons/ethernet.png"], +.ifacebadge img[src*="/luci-static/resources/icons/ethernet.png"], +li img[src*="/luci-static/resources/icons/ethernet.png"] + { + background-size: 16px 16px; + height: 16px; + width: 16px; + padding: 0 0 0 16px; +} +#__status-ifc-signal img[src*="/luci-static/resources/icons/ethernet.png"] +{ + background-size: 32px 32px!important; + height: 32px !important; + width: 32px!important; + padding: 0 0 0 32px!important; + width: 0; +} + +#wan4_i img[src*="/luci-static/resources/icons/ethernet_disabled.png"], +#wan6_i img[src*="/luci-static/resources/icons/ethernet_disabled.png"], +img[src*="/luci-static/resources/icons/ethernet_disabled.png"] { + background-image: url(../images/ethernet_disabled.png); + background-size: 32px 32px; + height: 32px; + width: 32px; + padding: 0 0 0 32px; + width: 0; +} +#cbi-network-lan-ifname_multi img[src*="/luci-static/resources/icons/ethernet_disabled.png"], +#cbi-network-1-_ifname img[src*="/luci-static/resources/icons/ethernet_disabled.png"], +.ifacebadge img[src*="/luci-static/resources/icons/ethernet_disabled.png"], +li img[src*="/luci-static/resources/icons/ethernet_disabled.png"] +{ + background-size: 16px 16px; + height: 16px; + width: 16px; + padding: 0 0 0 16px; +} +#__status-ifc-signal img[src*="/luci-static/resources/icons/ethernet_disabled.png"] +{ + background-size: 32px 32px!important; + height: 32px !important; + width: 32px!important; + padding: 0 0 0 32px!important; + width: 0; +} + +#wan4_i img[src*="/luci-static/resources/icons/switch.png"], +#wan6_i img[src*="/luci-static/resources/icons/switch.png"], +img[src*="/luci-static/resources/icons/switch.png"] { + background-image: url(../images/switch.png); + background-size: 32px 32px; + height: 32px; + width: 32px; + padding: 0 0 0 32px; + width: 0; +} +#cbi-network-lan-ifname_multi img[src*="/luci-static/resources/icons/switch.png"], +#cbi-network-1-_ifname img[src*="/luci-static/resources/icons/switch.png"], +.ifacebadge img[src*="/luci-static/resources/icons/switch.png"], +li img[src*="/luci-static/resources/icons/switch.png"] + { + background-size: 16px 16px; + height: 16px; + width: 16px; + padding: 0 0 0 16px; +} +#__status-ifc-signal img[src*="/luci-static/resources/icons/switch.png"] +{ + background-size: 32px 32px!important; + height: 32px !important; + width: 32px!important; + padding: 0 0 0 32px!important; + width: 0; +} + +#wan4_i img[src*="/luci-static/resources/icons/switch_disabled.png"], +#wan6_i img[src*="/luci-static/resources/icons/switch_disabled.png"], +img[src*="/luci-static/resources/icons/switch_disabled.png"] { + background-image: url(../images/switch_disabled.png); + background-size: 32px 32px; + height: 32px; + width: 32px; + padding: 0 0 0 32px; + width: 0; +} +#cbi-network-lan-ifname_multi img[src*="/luci-static/resources/icons/switch_disabled.png"], +#cbi-network-1-_ifname img[src*="/luci-static/resources/icons/switch_disabled.png"], +.ifacebadge img[src*="/luci-static/resources/icons/switch_disabled.png"], +li img[src*="/luci-static/resources/icons/switch_disabled.png"] + { + background-size: 16px 16px; + height: 16px; + width: 16px; + padding: 0 0 0 16px; +} +#__status-ifc-signal img[src*="/luci-static/resources/icons/switch_disabled.png"] +{ + background-size: 32px 32px!important; + height: 32px !important; + width: 32px!important; + padding: 0 0 0 32px!important; + width: 0; +} + +#wan4_i img[src*="/luci-static/resources/icons/wifi.png"], +#wan6_i img[src*="/luci-static/resources/icons/wifi.png"], +img[src*="/luci-static/resources/icons/wifi.png"] { + background-image: url(../images/wifi.png); + background-size: 32px 32px; + height: 32px; + width: 32px; + padding: 0 0 0 32px; + width: 0; +} +#cbi-network-lan-ifname_multi img[src*="/luci-static/resources/icons/wifi.png"], +#cbi-network-1-_ifname img[src*="/luci-static/resources/icons/wifi.png"], +.ifacebadge img[src*="/luci-static/resources/icons/wifi.png"], +li img[src*="/luci-static/resources/icons/wifi.png"] +{ + background-size: 16px 16px; + height: 16px; + width: 16px; + padding: 0 0 0 16px; +} +#__status-ifc-signal img[src*="/luci-static/resources/icons/wifi.png"] +{ + background-size: 32px 32px!important; + height: 32px !important; + width: 32px!important; + padding: 0 0 0 32px!important; + width: 0; +} + +#wan4_i img[src*="/luci-static/resources/icons/wifi_disabled.png"], +#wan6_i img[src*="/luci-static/resources/icons/wifi_disabled.png"], +img[src*="/luci-static/resources/icons/wifi_disabled.png"] { + background-image: url(../images/wifi_disabled.png); + background-size: 32px 32px; + height: 32px; + width: 32px; + padding: 0 0 0 32px; + width: 0; +} +#cbi-network-lan-ifname_multi img[src*="/luci-static/resources/icons/wifi_disabled.png"], +#cbi-network-1-_ifname img[src*="/luci-static/resources/icons/wifi_disabled.png"], +.ifacebadge img[src*="/luci-static/resources/icons/wifi_disabled.png"], +li img[src*="/luci-static/resources/icons/wifi_disabled.png"] +{ + background-size: 16px 16px; + height: 16px; + width: 16px; + padding: 0 0 0 16px; +} +#__status-ifc-signal img[src*="/luci-static/resources/icons/wifi_disabled.png"] +{ + background-size: 32px 32px!important; + height: 32px !important; + width: 32px!important; + padding: 0 0 0 32px!important; + width: 0; +} + +#wan4_i img[src*="/luci-static/resources/icons/vlan.png"], +#wan6_i img[src*="/luci-static/resources/icons/vlan.png"], +img[src*="/luci-static/resources/icons/vlan.png"] { + background-image: url(../images/vlan.png); + background-size: 32px 32px; + height: 32px; + width: 32px; + padding: 0 0 0 32px; + width: 0; +} +.ifacebadge img[src*="/luci-static/resources/icons/vlan.png"], +li img[src*="/luci-static/resources/icons/vlan.png"] +{ + background-size: 16px 16px; + height: 16px; + width: 16px; + padding: 0 0 0 16px; +} +#__status-ifc-signal img[src*="/luci-static/resources/icons/vlan.png"] +{ + background-size: 32px 32px!important; + height: 32px !important; + width: 32px!important; + padding: 0 0 0 32px!important; + width: 0; +} + +#wan4_i img[src*="/luci-static/resources/icons/vlan_disabled.png"], +#wan6_i img[src*="/luci-static/resources/icons/vlan_disabled.png"], +img[src*="/luci-static/resources/icons/vlan_disabled.png"] { + background-image: url(../images/vlan_disabled.png); + background-size: 32px 32px; + height: 32px; + width: 32px; + padding: 0 0 0 32px; + width: 0; +} +.ifacebadge img[src*="/luci-static/resources/icons/vlan_disabled.png"], +li img[src*="/luci-static/resources/icons/vlan_disabled.png"] +{ + background-size: 16px 16px; + height: 16px; + width: 16px; + padding: 0 0 0 16px; +} +#__status-ifc-signal img[src*="/luci-static/resources/icons/vlan_disabled.png"] +{ + background-size: 32px 32px!important; + height: 32px !important; + width: 32px!important; + padding: 0 0 0 32px!important; + width: 0; +} + +#wan4_i img[src*="/luci-static/resources/icons/bridge.png"], +#wan6_i img[src*="/luci-static/resources/icons/bridge.png"], +img[src*="/luci-static/resources/icons/bridge.png"] { + background-image: url(../images/bridge.png); + background-size: 32px 32px; + height: 32px; + width: 32px; + padding: 0 0 0 32px; + width: 0; +} +.ifacebadge img[src*="/luci-static/resources/icons/bridge.png"], +li img[src*="/luci-static/resources/icons/bridge.png"] { + background-image: url(../images/bridge.png); + background-size: 16px 16px; + height: 16px; + width: 16px; + padding: 0 0 0 16px; + width: 0; +} +#__status-ifc-signal img[src*="/luci-static/resources/icons/bridge.png"] +{ + background-size: 32px 32px!important; + height: 32px !important; + width: 32px!important; + padding: 0 0 0 32px!important; + width: 0; +} + +#wan4_i img[src*="/luci-static/resources/icons/bridge_disabled.png"], +#wan6_i img[src*="/luci-static/resources/icons/bridge_disabled.png"], +img[src*="/luci-static/resources/icons/bridge_disabled.png"] { + background-image: url(../images/bridge_disabled.png); + background-size: 32px 32px; + height: 32px; + width: 32px; + padding: 0 0 0 32px; + width: 0; +} +.ifacebadge img[src*="/luci-static/resources/icons/bridge_disabled.png"], +li img[src*="/luci-static/resources/icons/bridge_disabled.png"] { + background-image: url(../images/bridge_disabled.png); + background-size: 16px 16px; + height: 16px; + width: 16px; + padding: 0 0 0 16px; + width: 0; +} +#__status-ifc-signal img[src*="/luci-static/resources/icons/bridge_disabled.png"] +{ + background-size: 32px 32px!important; + height: 32px !important; + width: 32px!important; + padding: 0 0 0 32px!important; + width: 0; +} + +#wan4_i img[src*="/luci-static/resources/icons/tunnel.png"], +#wan6_i img[src*="/luci-static/resources/icons/tunnel.png"], +img[src*="/luci-static/resources/icons/tunnel.png"] { + background-image: url(../images/tunnel.png); + background-size: 32px 32px; + height: 32px; + width: 32px; + padding: 0 0 0 32px; + width: 0; +} +.ifacebadge img[src*="/luci-static/resources/icons/tunnel.png"], +li img[src*="/luci-static/resources/icons/tunnel.png"] +{ + background-size: 16px 16px; + height: 16px; + width: 16px; + padding: 0 0 0 16px; +} +#__status-ifc-signal img[src*="/luci-static/resources/icons/tunnel.png"] +{ + background-size: 32px 32px!important; + height: 32px !important; + width: 32px!important; + padding: 0 0 0 32px!important; + width: 0; +} + +#wan4_i img[src*="/luci-static/resources/icons/tunnel_disabled.png"], +#wan6_i img[src*="/luci-static/resources/icons/tunnel_disabled.png"], +img[src*="/luci-static/resources/icons/tunnel_disabled.png"] { + background-image: url(../images/tunnel_disabled.png); + background-size: 32px 32px; + height: 32px; + width: 32px; + padding: 0 0 0 32px; + width: 0; +} +.ifacebadge img[src*="/luci-static/resources/icons/tunnel_disabled.png"], +li img[src*="/luci-static/resources/icons/tunnel_disabled.png"] +{ + background-size: 16px 16px; + height: 16px; + width: 16px; + padding: 0 0 0 16px; +} +#__status-ifc-signal img[src*="/luci-static/resources/icons/tunnel_disabled.png"] +{ + background-size: 32px 32px!important; + height: 32px !important; + width: 32px!important; + padding: 0 0 0 32px!important; + width: 0; +} + +img[src*="/luci-static/resources/icons/wifi_big.png"] { + background-image: url(../images/wifi_big.png); + background-size: 64px 64px; + height: 64px; + padding: 0 0 0 64px; + width: 0; +} + +img[src*="/luci-static/resources/icons/wifi_big_disabled.png"] { + background-image: url(../images/wifi_big_disabled.png); + background-size: 64px 64px; + height: 64px; + padding: 0 0 0 64px; + width: 0; +} + +img[src*="/luci-static/resources/icons/loading.gif"] { + background-image: url(../images/loading.gif); + background-size: 32px 32px; + height: 32px; + width: 32px; + padding: 0 0 0 32px; + width: 0; +} + +.ifacebox-body img { + background-size: 20px 20px; + width:20px !important; + height:20px !important; + padding: 0 0 0 20px !important; +} +.ifacebox-head { + /* background-color: #337ab7 !important; */ + border-radius: 4px 4px 0 0; +} + + +img[src*="/luci-static/resources/cbi/add.gif"] { + background-image: url(../images/add.png); + background-size: 20px 20px; + height: 20px; + padding: 0 0 0 20px; + width: 0; + z-index: 2; + +} +img[src*="/luci-static/resources/cbi/remove.gif"] { + background-image: url(../images/remove.png); + background-size: 20px 20px; + height: 20px; + padding: 0 0 0 20px; + width: 0; + z-index: 2; +} + +img[src*="/luci-static/resources/cbi/reload.gif"] { + background-image: url(../images/reload.png); + background-size: 20px 20px; + height: 20px; + padding: 0 0 0 20px; + width: 0; + z-index: 2; +} + +img[src*="/luci-static/resources/icons/signal-75-100.png"] +{ + background-image: url(../images/signal-75-100.png); + image-rendering: pixelated; + background-size: 24px 24px; + height: 24px; + width: 24px; + padding: 0 0 0 24px; + z-index: 2; +} + +img[src*="/luci-static/resources/icons/signal-50-75.png"] +{ + background-image: url(../images/signal-50-75.png); + image-rendering: pixelated; + background-size: 24px 24px; + height: 24px; + width: 24px; + padding: 0 0 0 24px; + z-index: 2; +} + +img[src*="/luci-static/resources/icons/signal-25-50.png"] +{ + background-image: url(../images/signal-25-50.png); + image-rendering: pixelated; + background-size: 24px 24px; + height: 24px; + width: 24px; + padding: 0 0 0 24px; + z-index: 2; +} + +img[src*="/luci-static/resources/icons/signal-0-25.png"] +{ + background-image: url(../images/signal-0-25.png); + image-rendering: pixelated; + background-size: 24px 24px; + height: 24px; + width: 24px; + padding: 0 0 0 24px; + z-index: 2; +} + +img[src*="/luci-static/resources/icons/signal-0.png"] +{ + background-image: url(../images/signal-0.png); + image-rendering: pixelated; + background-size: 24px 24px; + height: 24px; + width: 24px; + padding: 0 0 0 24px; + z-index: 2; +} + +img[src*="/luci-static/resources/icons/signal-none.png"] +{ + background-image: url(../images/signal-none.png); + image-rendering: pixelated; + background-size: 24px 24px; + height: 24px; + width: 24px; + padding: 0 0 0 24px; + z-index: 2; +} + + +.myIcon{ + font-family: "design" !important; + font-style: normal !important; + font-variant: normal !important; + text-transform: none !important; +} + +.myIcon-logout:after{ + content: "\e005"; +} + +.myIcon-reboot:after{ + content: "\e02a"; +} + +.myIcon-wifi:after{ + content: "\e00c"; +} + +.main { + top: 50px; + bottom: 0rem; + position: relative; + height: 100%; + height: calc(100% - 4rem); +} + +.main > .loading { + position: fixed; + width: 100%; + height: 100%; + z-index: 1000; + display: block; + background-color: rgb(240, 240, 240); + top: 0; +} + +.main > .loading > span { + display: block; + text-align: center; + margin-top: 2rem; + color: #888; + font-size: 1rem; +} + +.main > .loading > span > .loading-img:before { + content: "\e603"; +} + +.main > .loading > span > .loading-img { + animation: anim-rotate 2s infinite linear; + margin-right: 0.2rem; + display: inline-block; +} + +/* fix Main Login*/ + +.node-main-login { + text-align: center; + background-color: var(--bgwhite) !important; +} +.node-main-login .cbi-section-node > .cbi-value:nth-of-type(2n) { + background: none; +} +.node-main-login h2 { + font-size: 1.5rem; +} + +.node-main-login header { + display: none; +} +.node-main-login > .main > .main-left { + display: none; +} + +.node-main-login > .main > .main-right { + width: 100%; +} + +.node-main-login > .main fieldset { + padding: 0px !important; + margin-bottom: 1rem; + display: inline; + background: none; + border: none; + box-shadow: none; + overflow: hidden; +} + +.node-main-login > .main fieldset .cbi-value-title { + display: none !important; +} + +.node-main-login > .main .cbi-section { + margin-top: 10px !important; +} + +.node-main-login > .main .cbi-map { +} + +.node-main-login > .main fieldset .cbi-value { +} + +.node-main-login > .main fieldset .cbi-value-title { + padding: 10px 0 10px 5px !important; +} + +.node-main-login > .main .cbi-value { + border: none; +} + +.node-main-login > .main .cbi-value-title { + width: 7rem; +} + +.node-main-login > .main #maincontent { + display: flex; + height: 100%; + text-align: center; + align-items: center; + align-content: center; + justify-content: center; +} + +/* .node-main-login > .main .container { + background-image: var(--logo); + background-repeat: no-repeat; + background-size: 300px auto; + width: 300px; + padding: 80px 0 0 0; +} */ + +.node-main-login > .main form > div:nth-last-child(1) { +} + +.node-main-login > .main .cbi-value > * { + display: inline-block !important; +} + +.node-main-login > .main .cbi-input-user, +.node-main-login > .main .cbi-input-password { + appearance: none; + outline: 0; + padding: 0 0 0 35px; + background-repeat: no-repeat; + background-position: 10px 10px; + background-size: 18px 18px; + min-width: 15rem; +} + +.node-main-login > .main .cbi-input-user { + background-image: url('data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="24" height="24" viewBox="0 0 24 24"%3E%3Cpath fill="%23627386" d="M12 4a4 4 0 0 1 4 4a4 4 0 0 1-4 4a4 4 0 0 1-4-4a4 4 0 0 1 4-4m0 10c4.42 0 8 1.79 8 4v2H4v-2c0-2.21 3.58-4 8-4Z"%2F%3E%3C%2Fsvg%3E'); +} +.node-main-login > .main .cbi-input-password { + background-image: url('data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="24" height="24" viewBox="0 0 24 24"%3E%3Cpath fill="%23627386" d="M12 17a2 2 0 0 0 2-2a2 2 0 0 0-2-2a2 2 0 0 0-2 2a2 2 0 0 0 2 2m6-9a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V10a2 2 0 0 1 2-2h1V6a5 5 0 0 1 5-5a5 5 0 0 1 5 5v2h1m-6-5a3 3 0 0 0-3 3v2h6V6a3 3 0 0 0-3-3Z"%2F%3E%3C%2Fsvg%3E'); +} +.node-main-login footer { + bottom: 0; + position: absolute; + width: 100%; +} + +.navbar { + overflow: hidden; + position: fixed; + bottom: 0; + width: 100%; + border-top: var(--navBorder); + text-align: center; + height:calc(50px + constant(safe-area-inset-bottom)); + height:calc(50px + env(safe-area-inset-bottom)); + background-color: var(--navbgColor); + -webkit-backdrop-filter: blur(10px); + backdrop-filter: blur(10px); +} + +.navbar a { + float: left; + text-align: center; + padding: 8px 0; + width: 20%; + text-decoration: none; + max-width: 100px; +} + +.cbi-map { + margin-top: 10px; +} + +#cbi-shadowsocksr .cbi-map-descr { + display: none; +} + +.navbar a img { + width: 28px; +} + +@keyframes anim-rotate { + 0% { + -webkit-transform: rotate(0); + -ms-transform: rotate(0); + transform: rotate(0); + } + 100% { + -webkit-transform: rotate(360deg); + -ms-transform: rotate(360deg); + transform: rotate(360deg) + } +} + + +.main-left { + float: left; + width: 18rem; + background-color: var(--mainleftbgColor); + overflow-x: auto; + height: calc(100% - 3.5rem); + position: fixed; + padding-top: 15px; + box-shadow: 0 0px 4px rgb(0 0 0 / 8%); + transition: visibility 100ms, width 100ms; +} + +.main-right { + width: 85%; + width: calc(100% - 18rem); + float: right; + height: 100%; + border-left: var(--sectionBorder); +} + +.main-right > #maincontent { +} + +.pull-right { + position: absolute; + top: -2px; + right: 30px; + cursor: pointer; +} + +.pull-left { + float: left; +} + + +header > .container { +margin:0; +padding:0; +} + +header > .container > .brand { + font-size: 25px; + font-family: "GenJyuuGothic-Medium"; + /*font-weight:bold;*/ + line-height:60px; + /*color: white;*/ + color: var(--logo_color); + cursor: default; + /*background: #51c291;*/ + display:block; + width:18rem; + /* padding-left: 30px; */ + height:60px; + text-align:center; + float:left; + font-weight:900; + letter-spacing:1px; + padding: 0 4.5rem; + transition: 0.1s ease-in-out; + position: absolute; +} +header > .container > a[class="brand"]:after { + content:""; + font-size:14px; + font-family:Tahoma; + position: absolute; + top:-10px; + font-weight:normal !important; +} + +header > .container > .brand-hostname { + font-size: 14px; + line-height:60px; + color: #555555; + cursor: default; + display:block; + width:18rem; + padding-right: 10px; + height:60px; + text-align:left; + float:left; + margin-top: 7px; + font-weight:300; + margin-left: -15px; +} + +.warning { + background-color: #FF7D60 !important; + color: #FFF; +} + +.errorbox, +.alert-message { + margin: 0 0 10px 0; + padding: 20px; + line-height: 1.5; + font-family: inherit; + min-width: inherit; + overflow: auto; + border-radius: 10px; + color: var(--alertColor); + background-color: var(--alertBackground); +} + +.errorbox { + color: #fff; + background-color: #ff6767; + border-radius: 10px; +} + +.error { + color: red; +} +p#shadowsocksr_status { + padding: 3px; +} + + +#maincontent > .container > div:nth-child(1).alert-message.warning > a { + font: inherit; + overflow: visible; + text-transform: none; + display: inline-block; + margin-bottom: 0; + font-weight: 400; + text-align: center; + white-space: nowrap; + vertical-align: middle; + touch-action: manipulation; + cursor: pointer; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + background-image: none; + min-width: 6rem; + padding: 0.5rem 1rem; + font-size: 14px; + line-height: 1.42857143; + color: #fff; + background-color: #5bc0de; + border-color: #46b8da; + margin-top: 2rem; + text-decoration: inherit; +} + +.main > .main-left > .nav { + overflow-y: visible !important; + font-size: 1rem; + width: 90%; + margin: auto; + margin-bottom: 90px; +} + +.main > .main-left > .nav > li a { + color: var(--activeColor); + display: block; + border-radius: 6px; + cursor: pointer; + font-weight: bold; + font-size: 1.1rem; + transition: all 0.1s; +} + +/* +.main > .main-left > .nav > li:nth-last-child(1) { + font-size: 11pt; + height:40px; + padding-top:6px; +} +*/ + +.main > .main-left > .nav > li { + cursor: pointer; + padding-top:6px; +} + +.main > .main-left > .nav > .slide { + padding: 0; + padding-top:8px; +} + +.main > .main-left > .nav > .slide > a:before { + display: inline-block; + left:-10px; + top: 1px; + position: relative; + font-family: "design" !important; + font-weight: bold !important; + text-transform: none !important; + speak: none; + font-size: 1.2rem !important; + -webkit-font-smoothing: antialiased; +} + +.main > .main-left > .nav > .slide > .menu::after { + right: 0.5rem; + top: 0.8rem; + font-family: "design" !important; + font-style: normal !important; + font-variant: normal !important; + content: "\eb03"; + float: right; + padding-right: 5px; + line-height: 1.6; + /* Better Font Rendering =========== */ + -moz-osx-font-smoothing: grayscale; + transition: all 0.1s ease; + text-rendering: auto; + -webkit-font-smoothing: antialiased; +} + +.main .main-left .nav li.slide .menu.active::after { + transform: rotate(90deg); +} + +.main > .main-left > .nav > .slide > a[data-title="Status"]:before { + content: "\e6b8"; +} + +.main > .main-left > .nav > .slide > a[data-title="System"]:before { + content: "\e645"; +} + +.main>.main-left>.nav>.slide>a[data-title=Modem]:before { + content: "\e67e" +} + +.main > .main-left > .nav > .slide > a[data-title="Services"]:before { + content: "\e6cb"; +} + +.main > .main-left > .nav > .slide > a[data-title="Docker"]:before { + content: "\44"; +} + +.main > .main-left > .nav > .slide > a[data-title="NAS"]:before { + content: "\eb04"; +} + +.main > .main-left > .nav > .slide > a[data-title="VPN"]:before { + content: "\56"; +} + +.main > .main-left > .nav > .slide > a[data-title="Network"]:before { + content: "\72"; +} + +.main > .main-left > .nav > .slide > a[data-title="Bandwidth Monitor"]:before { + content: "\e764"; +} +.main .main-left .nav li.slide .menu[data-title="Statistics"]:before { + content: "\e604"; +} + +.main .main-left .nav li.slide .menu[data-title="Control"]:before { + content: "\e67a"; +} + +.main .main-left .nav li.slide .menu[data-title="Asterisk"]:before { + content: "\e7dd"; +} + +.main > .main-left > .nav > .slide > a[data-title="QuickStart"]:before, +.main > .main-left > .nav > li > a[data-title="Inital Setup"]:before, +.main > .main-left > .nav > li > a[data-title="NetworkGuide"]:before, +.main > .main-left > .nav > li > a[href="/cgi-bin/luci//admin/wizard"]:before { + content: "\e719"; +} + +.main > .main-left > .nav > li > a[data-title="iStore"]:before { + content: "\e676"; +} + + +.main > .main-left > .nav > li > a[data-title="Logout"] { + padding: 0.675rem 0 0.675rem 2.5rem; +} + +.main > .main-left > .nav > li > a[data-title="Logout"]:before { + content: "\e641"; +} + +.main > .main-left > .nav > li > a[data-title="Reboot"] { + padding: 6px 25px; +} +.main > .main-left > .nav > li > a[data-title="Reboot"]:before { + content: "\e004"; +} + +.main > .main-left > .nav > .slide > ul { + display: none; + list-style:dotted; +} + +.main > .main-left > .nav > .slide > .menu { + display: block; + padding: 0.675rem 0 0.675rem 2.5rem; + text-decoration: none; + cursor: pointer;; +} + +.main > .main-left > .nav > .slide > .menu2 { + display: block; + padding: 0.675rem 0 0.675rem 2.5rem; + text-decoration: none; + cursor: pointer;; +} +.main > .main-left > .nav > li:hover, +.main > .main-left > .nav > .slide > .menu:hover { + background: var(--activeColor); + color:white; +} +.main > .main-left > .nav > .slide > .menu2:hover { + background: var(--activeColor); + color:white; +} + +.main > .main-left > .nav > .slide:hover { + background: none; +} +.slide-menu { + overflow:hidden; + } +.main > .main-left > .nav > .slide > .slide-menu > li { + margin-top: 8px; + border-radius: 6px; +} + +.main > .main-left > .nav > .slide > .slide-menu > .active { + background-color: var(--activeColor); +} + +.main > .main-left > .nav > .slide > .slide-menu > li > a { + position: relative; + display: block; + color: var(--textColor); + vertical-align: middle; + background:none !important; + border: none !important; + text-transform: capitalize; + font-size: 1rem; + margin: 0.1rem 0.5rem 0.1rem 0.5rem; + padding: 0.675rem 0 0.675rem 3.2rem; +} +.main .main-left .nav li.slide .slide-menu .active a { + color: #000; + } + +.main > .main-left > .nav > .slide > .slide-menu > li > a:hover { + color:white; +} + +.main > .main-left > .nav > .slide > .slide-menu > .active > a { + color: white; +} + +.main > .main-left > .nav > .slide > .slide-menu > li:hover { + background: var(--activeColor); + color:white !important; + transition: all 0.1s; +} + +.main > .main-left > .nav > .slide > .slide-menu > .active:hover { + background-color: var(--activeColor); + cursor: pointer; +} + +.cbi-tab-descr { + padding:10px; +} + +li { + list-style-type: none; +} + +#maincontent > .container { + margin:30px 30px 50px 30px; +} + +h1 { + color: var(--activeColor); + font-size: 20px; + padding-bottom: 10px; + border-bottom: 1px solid #eee; +} + +h2 { + color: var(--activeColor); + padding: 0 12px 6px 12px; + text-transform: capitalize; +} + +h3 { + font-size: 1.2rem; + color: var(--activeColor); + font-weight:bold; + padding: 0 12px 10px 12px; +} + +h4 { + +} + +label { + display: inline-block; + vertical-align: middle; +} +fieldset { + /* margin: 10px 0 0 0; */ + padding: 10px; + border: 1px; + font-weight: normal; + font-style: normal; + line-height: 1; + font-family: inherit; + text-align: left; + min-width: inherit; + overflow-x: auto; + overflow-y: hidden; + background-color: var(--sectionbgColor); + /* box-shadow: var(--sectionShaddow); */ + -webkit-overflow-scrolling: touch; +} + +fieldset > legend { + display: none !important; +} + +fieldset > fieldset { + /* margin: 0; */ + padding: 0; + /* border: none; */ + /* box-shadow: none; */ +} + +.panel-title { + width: 100%; + display: block; + padding: 10px; + font-weight: bold; + font-size: 1rem; +} + +table { + border-spacing: 0; + border-collapse: collapse; + width: 100%; + border: 0px solid #eee !important; + margin: 0 !important; +} + +strong { + font-weight: bold; + padding: 2px; +} + +#lb_load01_cur, +#lb_load01_peak, +#lb_load05_cur, +#lb_load15_cur{ + text-align:right !important; +} + +#lb_load01_peak { + text-align:left !important; + } +#lb_load01_cur { + +} + +table > tbody > tr > td, table > tbody > tr > th, table > tfoot > tr > td, table > tfoot > tr > th, table > thead > tr > td, table > thead > tr > th { + padding: 12px; + white-space: nowrap; + line-height:1.5; + vertical-align: middle !important; +} + +.node-services-appfilter table > tbody > tr > th, +.node-services-appfilter table > tbody > tr > td, +.node-nlbw-usage table > tbody > tr > th, +.node-nlbw-usage table > tbody > tr > td { + text-align: center; +} + + +table > tbody > tr { + border-bottom: var(--cbilineColor) !important; +} + +table > tbody > tr:last-child { + border-bottom: none !important; +} + +.cbi-section-table-cell { + text-align: center; +} + +.cbi-section-table-row { + text-align: center; +} + +.cbi-section-remove{ + margin-bottom: 2px; +} +.cbi-section-remove > input { + background-color: #cc0066; +} +fieldset > table > tbody > tr:nth-of-type(odd) { + background-color: var(--sectionbgColor2); +} + +/* fixed DHCPv6 lease table host names incorrectly displayed */ +#lease6_status_table > tbody > .cbi-section-table-row.cbi-rowstyle-1 div, +#lease6_status_table > tbody > .cbi-section-table-row.cbi-rowstyle-2 div{ + min-width:100%; +} + +/* fix status overview */ +.node-status-overview > .main fieldset:nth-child(6) td:nth-child(2), +.node-status-overview table[id="wifi_status_table"] > tbody > tr > td { + white-space: normal; +} + +/* fix progress bar */ +#swaptotal > div, +#swapfree > div, +#swapcache > div, +#memfree > div, +#membuff > div, +#conns > div, +#memcache > div, +#memtotal > div { + width: 100% !important; + border-color: var(--progressbarColor) !important; + background-color:var(--progressbarColor) !important; + border-radius: 3px; +} + +#swaptotal > div > div, +#swapfree > div > div, +#swapcache > div > div, +#memfree > div > div, +#membuff > div > div, +#conns > div > div, +#memcache > div > div, +#memtotal > div > div { + background-color: var(--progressbar) !important; + color: var(--progressbartxtColor) !important; + border-radius: 3px; +} + +#swaptotal div div, +#swapfree div div, +#swapcache div div, +#memfree div div, +#membuff div div, +#conns div div, +#memcache div div, +#memtotal div div { + align-items: center; + align-content: center; + justify-content: center; + display: flex; +} + +#swaptotal div div small, +#swapfree div div small, +#swapcache div div small, +#memfree div div small, +#membuff div div small, +#conns div div small, +#memcache div div small, +#memtotal div div small{ + font-size: 0.75rem !important; + line-height: 130%; + color: var(--progressbartxtColor) !important; +} + +.cbi-value-field { + width: 65%; +} +/* fix node-system-admin */ +.node-system-admin .cbi-value-field li div { + padding: 0 !important; +} + +.node-system-admin em { + padding: 0 !important; +} + +/* fix node-nlbw-display */ +.node-nlbw-display hr { + display: none; +} + +.node-nlbw-display p { + line-height: 1.5; + padding: 0 10px 5px 10px; +} + + +/* fix node-network-network */ + +/* #cbi-network-lan-__status table { + width: auto; +} + +#cbi-network-lan-__status table td { + width: 0; + padding: 0; + +} +#cbi-network-lan-__status table td small { + font-size: 11px; + white-space: nowrap; +} */ + +/* node-network-network ul list overflow */ +#cbi-network .cbi-value-field ul, +#cbi-wireless .cbi-value-field ul, +#cbi-firewall .cbi-value-field ul { + overflow-x: auto; + white-space: nowrap; +} + +#cbi-network .cbi-value-field ul input[type="text"], +#cbi-wireless .cbi-value-field ul input[type="text"], +#cbi-firewall .cbi-value-field ul input[type="text"] { + max-width: 10rem; + width: 100% !important; +} + +div [id*="cbi-network-"] [id*="-__status"] table, +div [id*="cbi-wireless"] [id*="-__status"] table { + width: auto; +} + +div [id*="cbi-network-"] [id*="-__status"] table td, +div [id*="cbi-wireless"] [id*="-__status"] table td { + width: auto; + padding: 0 !important; +} +div [id*="cbi-network-"] [id*="-__status"] table td small, +div [id*="cbi-wireless"] [id*="-__status"] table td small { + width: auto; +} + +/* adapt to mt798x series closed source wireless driver page */ +/* open source wireless style */ +.node-network-wifi .cbi-section-table tr .cbi-value-field, +.node-network-wireless .cbi-section-table tr .cbi-value-field { + width: unset !important; + text-align: right; +} +.node-network-wireless #iw-assoclist .cbi-section-table-row td[colspan="6"], +.node-network-wireless .cbi-section-table .cbi-section-table-row td[colspan="6"], +.node-network-wifi .cbi-section-table .cbi-section-table-row td[colspan="8"] { + text-align: center !important; +} +.node-network-wireless #iw-assoclist .cbi-section-table-row td div { + max-width: unset !important; +} +.node-network-wifi table, td, th { + border-top: unset !important; +} +.node-network-wifi .cbi-section-table td[colspan="2"] { + padding-left: unset !important +} + +/* fix node-status-routes */ +.node-status-routes .cbi-section-node{ + max-height: 500px; + overflow-y: auto; + overflow-x: auto; +} + +/* fix multiple table */ +table table { + border: none; +} + +.cbi-value-field table { + border: none; +} +.cbi-value-field label { + padding: 0 ; +} +td > table > tbody > tr > td { + border: none; +} + +.cbi-value-field > table > tbody > tr > td { + border: none; +} + +#container\.nlbw\.traffic th, +#container\.nlbw\.traffic td, +#container\.nlbw\.layer7 th, +#container\.nlbw\.layer7 td, +#container\.nlbw\.ipv6 th, +#container\.nlbw\.ipv6 td, +#container\.nlbw\.export th, +#container\.nlbw\.export td { + padding: 12px !important; + border-top: none; + border: unset; + text-align: center; + /* border-left: #ccc 1px solid; + border-right: #ccc 1px solid; + border-bottom: #ccc 1px solid; */ + } + + #container\.nlbw\.traffic tr td:nth-child(4), + #container\.nlbw\.layer7 tr td:nth-child(3), + #container\.nlbw\.ipv6 tr td:nth-child(4), + #container\.nlbw\.export tr td:nth-child(4), + #container\.nlbw\.traffic tr td:nth-child(6), + #container\.nlbw\.layer7 tr td:nth-child(5), + #container\.nlbw\.ipv6 tr td:nth-child(6), + #container\.nlbw\.export tr td:nth-child(6) { + text-align: right !important; +} + + #container\.nlbw\.traffic tr td:nth-child(5), + #container\.nlbw\.layer7 tr td:nth-child(4), + #container\.nlbw\.ipv6 tr td:nth-child(5), + #container\.nlbw\.export tr td:nth-child(5), + #container\.nlbw\.traffic tr td:nth-child(7), + #container\.nlbw\.layer7 tr td:nth-child(6), + #container\.nlbw\.ipv6 tr td:nth-child(7), + #container\.nlbw\.export tr td:nth-child(7){ + text-align: left !important; +} + +td#__status-ifc-signal { + width: 60px !important; +} + +/* button style */ + +.cbi-button { + -webkit-appearance: none; + text-transform: uppercase; + color: #fff; + background-color: #337ab7; + transition: all 0.1s ease-in-out; + display: inline-block; + border: none; + cursor: pointer; + -ms-touch-action: manipulation; + touch-action: manipulation; + background-image: none; + text-align: center; + white-space: nowrap; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + width: auto !important; + min-width: 80px; + padding: 0px 8px 0px 8px; + /* max-width: 160px; */ + border-radius: var(--commonRadius0); + height: 35px; + line-height: 35px; +} + +.cbi-button:hover, +.cbi-button:focus, +.cbi-button:active { + color: #fff; + outline: 0; + text-decoration: none; + background-color: rgb(106,101,214); +} + +.cbi-button:hover, +.cbi-button:focus { + box-shadow: 0 1px 1px rgba(0,0,0,.05); +} + +.cbi-button:active { + box-shadow: 0 1px 1px rgba(0,0,0,.05); +} + +.cbi-button:disabled { + cursor: not-allowed; + pointer-events: none; + opacity: 0.60; + box-shadow: none; +} + +form.inline + form.inline, +.cbi-button + .cbi-button { +} + +.cbi-button-reset, +.cbi-input-remove { + color: #fff !important; + background-color: #617486 !important; +} + +.cbi-button-reset:hover, +.cbi-input-remove:hover, +.cbi-button-remove:hover{ + color: #fff !important; + background-color: rgb(83,100,115) !important; +} + +.cbi-button-link, +.cbi-input-find, +.cbi-input-save, +.cbi-button-add, +.cbi-button-save, +.cbi-button-find, +.cbi-input-reload, +.cbi-button-reload { + color: var(--bttextColor); + background-color: #337ab7 !important; + border-color: #337ab7 !important; +} + +.cbi-button-link:hover, +.cbi-input-find:hover, +.cbi-input-save:hover, +.cbi-button-add:hover, +.cbi-button-save:hover, +.cbi-button-find:hover, +.cbi-input-reload:hover, +.cbi-button-reload:hover{ + color: #fff !important; + background-color: #6A82AE!important; + border-color: #6A82AE !important; +} + + +.cbi-input-apply, +.cbi-button-apply, +.cbi-button-edit { + color: #fff !important; + background-color: var(--activeColor); +} + +.cbi-input-reset, +.cbi-button-remove { + color: #fff !important; + background: #617486; +} + + +.a-to-btn { + text-decoration: none; +} + +/* table */ +.tabs { + margin: 15px 0; + overflow-x: auto; +} + +.cbi-tabmenu > li, +.tabs > li { + display: table-cell; +} + +.cbi-tabmenu > li { + border-radius: var(--tabmenuRadius); +} + +.tabs > li > a { + text-decoration: none; + padding: 0 6px 0 6px; + float: left; + display: block; + white-space: nowrap; + height: 2.5rem; + line-height: 2.5rem; + font-size: 0.92rem; +} + +.cbi-tabmenu > li > a { + text-decoration: none; + float: left; + display: block; + white-space: nowrap; + height: 2.5rem; + line-height: 2.5rem; + font-size: 0.92rem; + margin: 0 10px; +} + +.tabs > li[class~="active"], +.tabs > li:hover{ + cursor: pointer; + +} + +.tabs > li[class~="active"] > a { + color: var(--activeColor) !important; + padding-bottom: 8px; + border-bottom: var(--activeColor) 2px solid; +} + +.tabs > li:hover { + /*border-bottom: 0.18751rem solid rgb(133,129,216);*/ +} + +.cbi-tabmenu { + border-top: var(--sectiontabBorder); + border-left: var(--tabmenuBorderLR); + border-right: var(--tabmenuBorderLR); + border-bottom: var(--tabmenuBottom); + background-color: var(--tabmenubgColor); + width: 100%; + overflow-x: auto; + margin-top: 5px; + margin-bottom: 10px; +} + +.cbi-tabmenu > li:hover { + background-color: none; +} + +.cbi-tabmenu > li[class~="cbi-tab"] { + background-color: none; +} + +.cbi-tabmenu > li[class~="cbi-tab"] a { + color: var(--activeColor) !important; + border-bottom: 2px solid var(--activeColor) !important; +} + +.cbi-section-node-tabbed { + margin-top: 0; + border-bottom: var(--sectiontabBorder); + border-left: var(--sectiontabBorder); + border-right: var(--sectiontabBorder); + border-radius: 0 0; +} + + +.cbi-tabcontainer { + clear:both; +} +.cbi-tabcontainer > .cbi-value:nth-of-type(2n) { + background-color: var(--sectionbgColor2); +} + +.cbi-section-node > .cbi-value:nth-of-type(2n) { + background-color: var(--sectionbgColor2); +} +div > .cbi-value:nth-of-type(2n) { + background-color: var(--sectionbgColor2); +} + +.cbi-value-field, +.cbi-value-description { + display: table-cell; +} + +.cbi-value-field { + /* padding: 10px 10px 10px 0; */ +} + +.cbi-value-helpicon > img { + display: none; +} + +.cbi-value-helpicon:before { + content: "\f059"; +} + +.cbi-value-description { + opacity: 0.6; + padding-left: 4px; +} + +.cbi-value-title { + word-wrap: break-word; + display: table-cell; + width: 35%; + float: left; + padding: 13px 10px 5px 3px; +} + +.cbi-value { + display: flex; + width: 100%; + align-items: center; + align-content: center; + justify-content: flex-start; + min-height: 40px; + padding: 8px 10px; + flex-flow:row wrap; + border-bottom: var(--cbilineColor); +} + +.cbi-value:last-child { + border-bottom: none; +} + +.cbi-value strong { + font-weight: normal; +} + +.cbi-section-table-descr > .cbi-section-table-cell, +.cbi-section-table-titles > .cbi-section-table-cell { + border: none; +} + +.cbi-rowstyle-2 { + background-color: var(--sectionbgColor2); +} + +.cbi-rowstyle-2 .cbi-button-up, +.cbi-rowstyle-2 .cbi-button-down{ +} + +.cbi-section-table .cbi-section-table-titles .cbi-section-table-cell { + width: auto !important; +} +.cbi-section-table tr .cbi-value-field { + text-align: center ; + width: 20% !important; + padding: 10px !important; +} +.cbi-section-table tr .cbi-value-field input { + width: auto; +} +.cbi-section-table tr .cbi-value-field .ifacebox { + margin: auto; + width: fit-content; + min-width: 60px; +} + +/* desc */ +.cbi-section-descr { + padding: 3px 10px; +} + +.cbi-map-descr { + padding: 5px 5px 5px 12px; +} + +.cbi-map-descr h3 { + font-size: 0.92rem; + font-weight: normal; + color: #666; +} + +#cbi-vsftpd .cbi-map-descr { + color: var(--activeColor); + padding: 0 12px 0px 12px; + font-size: 1.2rem; + font-weight: bold; +} + + +/* luci */ + +.hidden { + display: none +} + +.left { + text-align: left !important; +} + +.right { + text-align: right !important; +} + +.right .cbi-button { + height: 20px; + line-height: 20px; + min-width: 60px; + /* padding: 0; */ + margin: 0; +} + +.inline { + display: inline; +} + +.cbi-page-actions { + text-align: center; +} + +/* input */ +.cbi-value input[type="password"], +.cbi-value input[type="text"] { + +} + +/* select */ + + +.ifacebadge { + display: inline-flex; + padding: 5px; + background-color: var(--badgebgColor); + align-content: center; + align-items: center; + border-radius: var(--commonRadius1); + border: var(--badgeBorder); + color: #666666 +} + +#content_syslog { + padding: 5px; + margin-top:10px; + border-radius: 10px; + background-color: var(--sectionbgColor); + box-shadow: 3px 3px 3px rgb(0 0 0 / 5%); +} + +.ifacebadge > img { + float: right; + margin-left: 0.3rem; +} + +img.cbi-image-button { + vertical-align: middle; + +} + +fieldset.cbi-section{ + border: var(--sectionBorder); + margin-bottom: 20px; + border-radius: 10px; + margin-top: 5px; +} + +/*textarea*/ + +.cbi-input-textarea, textarea { + color: var(--inputtextColor); + padding: 10px; + line-height: normal; + border: var(--sectionBorder); + background-color: var(--inputbgColor); + transition: color 150ms ease, border-color 150ms ease, opacity 150ms ease; + -webkit-transition: color 150ms ease, border-color 150ms ease, opacity 150ms ease; + outline-style: none; + vertical-align: baseline; + border-radius: 10px; + font-family: Menlo, Mono; + font-size: 0.9rem; + white-space: pre; + margin-bottom: 5px; +} + +#syslog { + width: 100%; + min-height: 15rem; + padding: 10px; + margin-bottom: 20px; + border-radius: 0; + background-color: var(--sectionbgColor); + border: none; +} + +/* change */ +#wan4_i, #wan6_i { +width:50px !important; +} + +.uci-change-list { + font-family: monospace; +} + +.uci-change-list *:first-child { + border-top-left-radius: 5px; + border-top-right-radius: 5px; +} + +.uci-change-list *:nth-last-child(2) { + border-bottom-left-radius: 5px; + border-bottom-right-radius: 5px; +} + +.uci-change-list ins, +.uci-change-legend-label ins { + text-decoration: none; + border: 1px solid #00FF00; + background-color: #CCFFCC; + display: block; + padding: 2px; + color: black; + overflow-x: auto; +} +.uci-change-legend .uci-change-legend-label ins { + overflow-x: unset; + border-radius: var(--commonRadius1); +} + +.uci-change-list del, +.uci-change-legend-label del { + text-decoration: none; + border: 1px solid #FF0000; + background-color: #FFCCCC; + display: block; + font-style: normal; + padding: 2px; + color:black; + overflow-x: auto; +} +.uci-change-legend .uci-change-legend-label del { + overflow-x: unset; + border-radius: var(--commonRadius1); +} + +.uci-change-list var, +.uci-change-legend-label var { + text-decoration: none; + border: 1px solid #CCCCCC; + background-color: #EEEEEE; + display: block; + font-style: normal; + padding: 2px; + color:black; + + overflow-x: auto; +} +.uci-change-legend .uci-change-legend-label var { + overflow-x: unset; + border-radius: var(--commonRadius1); +} + +.uci-change-list var ins, +.uci-change-list var del { + border: none; + white-space: pre; + font-style: normal; + padding: 0px; + color:black; + /* border-radius: var(--commonRadius1); */ + overflow-x: auto; +} + +.uci-change-legend { + padding: 5px; +} + +.uci-change-legend-label { + width: 150px; + float: left; + display: flex; + /* align-content: center; */ + align-items: center; +} + +.uci-change-legend-label > ins, +.uci-change-legend-label > del, +.uci-change-legend-label > var { + float: left; + margin-right: 4px; + width: 10px; + height: 10px; + display: block; +} + +.uci-change-legend-label var ins, +.uci-change-legend-label var del { + border: none; + height: 10px; + width: 10px; +} + +.uci-change-list var, +.uci-change-list del, +.uci-change-list ins { + padding: 0.5rem; +} + +/* other fix */ +#iwsvg, +#iwsvg2, +#bwsvg { + border: var(--sectionBorder) !important; + font-family: -apple-system; + background: none !important; +} + +.ifacebox { + border: var(--ifaceboxBorderColor) 1px solid; + border-radius: var(--commonRadius1); + font-size:0.92rem; + font-weight:normal; +} +.ifacebox-head { + color:#fff; +} +.ifacebox-body small { + font-size:0.8rem !important; + padding: 5px +} + +.ifacebox-body strong { + color:#f7f7f7; + font-size: 0px !important; +} + +.cbi-image-button { + +} + + +.zonebadge > .ifacebadge { + padding: 3px 5px; + margin: 5px; +} + +.zonebadge > input[type="text"] { + padding: 0.16rem 1rem; + min-width: 10rem; + margin-top: 0.3rem; +} + +.cbi-value-field .cbi-input-checkbox, +.cbi-value-field .cbi-input-radio { + vertical-align: middle; +} + +.cbi-section-table-row > .cbi-value-field .cbi-input-select { + min-width: 7rem; +} + +.cbi-section-create { + padding: 0 10px; +} +.cbi-section-create > .cbi-button-add { + margin: 10px 0 10px 0 +} + +div.cbi-value var, td.cbi-value-field var { + font-style: italic; + color: #0069D6; +} + +small { + font-size: small; + font-weight: normal !important; + white-space: normal; +} + +.cbi-button-up, +.cbi-button-down { + display: inline-block; + min-width: 0; + font-size: 0.9rem; +} + +.cbi-optionals { + padding: 1rem 1rem 0 1rem; + border-top: 1px solid #CCC; +} + +#diag-rc-output > pre { + display: block; + padding: 10px; + line-height: 1.5rem; + -moz-border-radius: 3px; + white-space: pre-wrap; + word-wrap: break-word; + color: #76838f; +} + +input[name="ping"], +input[name="traceroute"], +input[name="nslookup"] { + width: 80%; +} + +table.cbi-section-table select { + width: auto !important; +} + +header > .container > .pull-right > * { + +} + +#xhr_poll_status > .label.success { + padding: 0.7rem 0; + border-radius: 20px; +} + +#xhr_poll_status_off { + padding: 0.7rem 0; + border-radius: 20px; +} + +.label { + padding: 0 3px 0 3px; + white-space: nowrap; + border-radius: 3px; + position: absolute; + right: 5px; + top: 15px; + line-height: 150%; +} + +.notice { + color: var(--activeColor); + font-size: .8rem; + /* padding: 0.15rem; */ + padding-right: 0.5rem; + border-radius: 10px; + z-index: 10; + /* top: 1.45rem; */ + font-size: 1.8rem; + font-family: design; +} + +#refresh_on, #refresh_off { + font-size: 1.5rem; + font-family: design; +} + +#refresh_on { + color: var(--activeColor); +} +#refresh_off { + color: var(--progressbarColor); +} + +.darkMask { + width: 100%; + height: 100%; + position: fixed; + background-color: rgba(0, 0, 0, 0.56); + content: ""; + z-index: 99; + display: none; +} + +/* fix node-services-shadowsocksr */ + +.node-services-shadowsocksr .cbi-input-textarea, +.node-nlbw-config .cbi-input-textarea { + /* margin: 10px; */ +} + +.node-services-shadowsocksr #cbi-logview .cbi-section { + padding: 0; +} + +/* fix node-network-diagnostics */ +.node-network-diagnostics .cbi-section { + border-radius: 10px; +} + +/* fix status processes */ +.node-status-processes > .main table tr td:nth-child(3) { + white-space: normal; +} + +.cbi-map fieldset h3 { + } + +.cbi-map fieldset ul li { + margin-right:0 !important; +} +/* fix system reboot */ + +.node-system-reboot > .main > .main-right p, +.node-system-reboot > .main > .main-right h3 { + margin-left: 12px; +} + +.node-system-reboot #maincontent { +} + +/* fix Services Network Shares*/ +.node-services-samba > .main .cbi-tabcontainer:nth-child(3) .cbi-value-title { + margin-bottom: 1rem; +} + +.node-services-samba > .main .cbi-tabcontainer:nth-child(3) .cbi-value-field { + display: list-item; +} + +.node-services-samba > .main .cbi-tabcontainer:nth-child(3) .cbi-value-description { + padding-top: 1rem; + line-height:150%; +} + +/* fix System Software*/ +.node-system-packages > .main table tr td:nth-child(1) { + width: auto !important; +} + +.node-system-packages .cbi-section-node .cbi-value-last { + /* padding: 8px 12px; */ +} + +.node-system-packages .cbi-section-node .cbi-value-last > div { + border: none !important; + border-radius: 3px; +} + +.node-system-packages .cbi-section-node .cbi-value-last > div > div { + border: none !important; + border-radius: 3px; +} + +.node-system-packages .cbi-section-node .cbi-value-last:nth-last-child(1) { + padding: auto; +} + +.node-system-packages > .main table tr td:nth-last-child(1) { + white-space: normal; + font-size: small; + color: #76838f; +} + +.node-system-packages > .main .cbi-value > pre { + /* background-color: var(--inputbgColor); */ + padding: 10px; + overflow: auto; + /* border: var(--inputBorder); */ + border-radius: 10px; +} + +.node-system-packages #cbi-distfeedconf .cbi-section, +.node-system-packages #cbi-customfeedconf .cbi-section { + border-radius: 10px; +} + +.node-system-packages .cbi-value-field { + width: 58%; +} + +#container\.nlbw\.traffic, #container\.nlbw\.layer7, #container\.nlbw\.ipv6, #container\.nlbw\.export { + margin-top: 0; + margin-top: 0; + padding: 10px; + text-align: center; + border-bottom: var(--sectionBorder); + border-left: var(--sectionBorder); + border-right: var(--sectionBorder); + background-color: var(--sectionbgColor); + border-radius: 10px; +} + +#container\.nlbw\.export ul li { + + padding: 5px; + width: 150px; + margin: 10px; + border-radius: var(--commonRadius1); + border: #ccc 1px solid; + +} + +.cbi-tabmenu + .cbi-section ul { + text-align: left; +} + +/* fix network firewall*/ +.node-network-firewall > .main .cbi-section-table-row > .cbi-value-field .cbi-input-select { + min-width: 4rem; +} + +.node-status-iptables > .main div > .cbi-map > form { + position: static !important; + margin: 10px 0 20px 0; + padding: 12px; + border: 0; + font-weight: normal; + font-style: normal; + line-height: 1; + font-family: inherit; + min-width: inherit; + overflow-x: auto; + overflow-y: hidden; + box-shadow: 3px 3px 3px rgb(0 0 0 / 5%); + border-radius: 10px; + background-color: var(--bgwhite); + -webkit-overflow-scrolling: touch; +} + + + +/** fix system packages +.node-system-packages .cbi-section { + border-radius: 0 0 10px 10px; +} + + +#cbi-ipkgconf .cbi-section { + border-radius: 0 0 10px 10px; +} + +**/ + + +.node-system-flashops fieldset fieldset { + border: none; +} +.node-system-flashops br { + display: none; +} + +.node-system-flashops .cbi-section { + /* padding: 0; */ +} +.node-system-flashops .cbi-section-descr { + padding: 12px; + line-height: 1.5; + border-radius: 6px; + /* border: var(--sectiontabBorder); + background-color: var(--sectionbgColor2); */ +} + + +.node-status-iptables .cbi-tabmenu, +.node-system-packages .cbi-tabmenu, +.node-system-flashops .cbi-tabmenu { + /* border: none; **/ +} + +#cbi-firewall-redirect .cbi-section-table-titles .cbi-section-table-cell { + text-align: left; +} + +#cbi-firewall-redirect table *, +#cbi-network-switch_vlan table *, +#cbi-firewall-zone table *{ + font-size: small; +} + +#cbi-firewall-redirect table input[type="text"], +#cbi-network-switch_vlan table input[type="text"], +#cbi-firewall-zone table input[type="text"]{ + width: 5rem; +} + +#cbi-firewall-redirect table select, +#cbi-network-switch_vlan table select, +#cbi-firewall-zone table select{ + min-width: 3.5rem; +} + +/** fix node-status-realtime **/ +.node-status-realtime table > tbody > tr > td { + text-align: left !important; + padding: 10px 3px 10px 3px; +} +.node-status-realtime table[id=connections] > tbody > tr > td { + padding: 10px 3px 10px 3px; + text-align: center !important; +} + +.node-status-realtime table { + table-layout: auto !important; +} +/* fix node-status-realtime connections */ +.node-status-realtime fieldset[id="cbi-table-table"] { + background-color: unset !important; +} +.node-status-realtime fieldset[id="cbi-table-table"] > table > tbody > tr:nth-of-type(odd), +.node-status-realtime fieldset[id="cbi-table-table"] table[id="connections"] tr.cbi-section-table-row.cbi-rowstyle-2 { + background-color: unset; +} +/* fix luci-app-appfilter table overflow style */ +/* fix node-nas-fileassistant table overflow style */ +/* fix node-status-realtime table style */ +.node-services-appfilter .cbi-section.cbi-tblsection, +.node-nas-fileassistant #list-content, +.node-status-realtime fieldset[id="cbi-table-table"] .cbi-section-node { + overflow: auto; +} + +select#cbi\.combobox\.cbid\.shadowsocksr\.cfg013fd6\.tunnel_forward { + overflow: hidden; + +} + +/* language fix */ +body.lang_pl.node-main-login .cbi-value-title { + width: 12rem; +} + +/* fix nlbw component */ +#detail-bubble { + /* left: unset !important; */ + width: unset!important; +} +#detail-bubble.in { + color: #000; + padding-bottom: calc(60px + env(safe-area-inset-bottom)); + left: 19rem !important; + width: calc(100vw - 21.25rem)!important; +} +#detail-bubble .head { + display: block; + overflow: auto; +} +#detail-bubble #bubble-table { + display: inline-table; + overflow: auto; +} + +@media screen and (max-width: 1280px) { + header { + /*height: 3.5rem;*/ + } + + header > .container { + /*margin-top: 0.25rem;*/ + } + + .main { + height: calc(100% - 3.5rem); + } + + .main-left { + width: calc(0% + 18rem); + top: 50px; + } + + .main-right { + width: calc(100% - 18rem); + } + + + table { + font-size: 0.9rem !important; + width: 100% !important; + } + + .main > .main-left > .nav > li, + .main > .main-left > .nav > li a, + .main > .main-left > .nav > .slide > .menu { + font-size: 1.1rem; + } + + .main > .main-left > .nav > .slide > .slide-menu > li > a { + font-size: 1rem; + text-transform: capitalize; + } + + img[src*="/luci-static/resources/cbi/add.gif"] { + right: 55px; + display: block; + position: absolute; + margin-top: -34px; + } + img[src*="/luci-static/resources/cbi/remove.gif"] { + right: 55px; + display: block; + position: absolute; + margin-top: -34px; + } + + img[src*="/luci-static/resources/cbi/reload.gif"] { + right: 55px; + display: block; + position: absolute; + margin-top: -34px; + } + /* fix nlbw component */ + #detail-bubble { + /* left: unset !important; */ + width: unset!important; + } + #detail-bubble.in { + color: #000; + padding-bottom: calc(60px + env(safe-area-inset-bottom)); + left: 19rem !important; + width: calc(100vw - 21.25rem)!important; + } + #detail-bubble .head { + display: block; + overflow: auto; + } + #detail-bubble #bubble-table { + display: inline-table; + overflow: auto; + } + .node-nlbw-usage table { + display: block; + overflow: auto; + } + #container\.nlbw\.traffic table, + #container\.nlbw\.layer7 table, + #container\.nlbw\.ipv6 table, + #container\.nlbw\.export table { + display: block; + overflow: auto; + } +} + +@media screen and (max-width: 992px) { + + /* img[src*="/images/logo.png"] { + background-color: var(--mainleftbgColor); + height: 50px; + background-image: var(--mlogo); + background-size: 310px; + background-repeat: no-repeat; + padding: 0 0 0 310px; + width: 0; + margin: 0; + background-position: 0; + } */ + + .main-left { + width: 0; + position: fixed; + z-index: 100; + } + + .main-right { + width: 100%; + } + + .showSide { + margin: 0; + padding: 0; + display: inline-block; + position: absolute; + width: 18.75rem; + height: 2.8125rem; + padding: 1.15rem 2rem; + z-index: 100; + } + + .showSide:before { + content: "\e20e"; + font-size: 1.7rem; + } + + #maincontent > .container { + margin: 20px 20px; + } + + .node-main-login .showSide { + display: none !important; + } + + .cbi-value-title { + width:35%; + } + + .node-network-diagnostics > .main .cbi-map fieldset > div * { + width: 100% !important; + } + + .node-network-diagnostics > .main .cbi-map fieldset > div input[type="text"] { + } + + .node-network-diagnostics > .main .cbi-map fieldset > div:nth-child(4) input[type="text"] { + margin: 0 !important; + } + + .node-network-diagnostics > .main .cbi-map fieldset > div select, + .node-network-diagnostics > .main .cbi-map fieldset > div input[type="button"] { + margin: 1rem 0 0 0; + } + + .node-network-diagnostics > .main .cbi-map fieldset > div { + width: 100% !important; + } + + .node-main-login > .main .cbi-value-title { + text-align: left; + } + + img[src*="/luci-static/resources/cbi/add.gif"] { + right: 45px; + display: block; + position: absolute; + margin-top: -34px; + } + img[src*="/luci-static/resources/cbi/remove.gif"] { + right: 45px; + display: block; + position: absolute; + margin-top: -34px; + } + + img[src*="/luci-static/resources/cbi/reload.gif"] { + right: 45px; + display: block; + position: absolute; + margin-top: -34px; + } + /* fix nlbw component */ + #detail-bubble { + left: unset !important; + width: unset!important; + } + #detail-bubble.in { + color: #000; + padding-bottom: calc(60px + env(safe-area-inset-bottom)); + left: unset !important; + width: calc(100vw)!important; + } + #detail-bubble .head { + display: block; + overflow: auto; + /* text-align: unset !important; */ + } + #detail-bubble #bubble-table { + display: inline-table; + overflow: auto; + } + header { + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08); + } +} + +@media screen and (max-width: 700px) { + + #cbi-vssr-servers .cbi-button-add { + position: static !important; + width: auto !important; + height: 2rem !important; + line-height: 2rem !important; + color: #fff; + display: block; + padding: 0 !important; + font-size: 0.92rem; + border-radius: 10px !important; + box-shadow: none ; + background-image: none; + } + #cbi-vssr-servers .cbi-section-table-row { + margin:10px 0 !important; + } + #cbi-vssr-servers .p-in5 { + padding-bottom: 10px !important; + margin: 0 !important; + } + + #cbi-vssr-servers .cbi-page-actions { + padding-bottom: 10px !important; + } + + #maincontent > .container { + margin: 20px 20px; + } + /* fix nlbw component */ + #detail-bubble { + left: unset !important; + width: unset!important; + } + #detail-bubble.in { + color: #000; + padding-bottom: calc(60px + env(safe-area-inset-bottom)); + left: unset !important; + width: calc(100vw)!important; + } + #detail-bubble .head { + display: block; + overflow: auto; + /* text-align: unset !important; */ + } + #detail-bubble #bubble-table { + display: inline-table; + overflow: auto; + } +} + +@media screen and (max-width: 470px) { + /* fix nlbw component */ + #detail-bubble { + left: unset !important; + width: unset!important; + } + #detail-bubble.in { + color: #000; + padding-bottom: calc(60px + env(safe-area-inset-bottom)); + left: unset !important; + width: calc(100vw)!important; + } + #detail-bubble .head { + display: block; + overflow: auto; + /* text-align: unset !important; */ + } + #detail-bubble #bubble-table { + display: block; + overflow: auto; + } + /* fix node-status-realtime table */ + .main-right > #maincontent { + overflow: auto; + } + /* network and wireless table status icon */ + div [id*="cbi-network-"] [id*="-__status"] table td, + div [id*="cbi-wireless"] [id*="-__status"] table td { + white-space: normal; + } + + .node-system-leds .cbi-section em, + .node-network-network #cbi-network .cbi-map .cbi-section-table cbi-section-table-row, + .node-network-network #cbi-network .cbi-map .cbi-section-table td { + display: block; + } + .node-network-network #cbi-network .cbi-map .cbi-section-table td { + width: 100%!important; + text-align: center!important; + white-space: normal; + } + .node-network-network #cbi-network .cbi-map .cbi-button { + min-width: 60px !important; + } + .node-network-network .cbi-section-table .cbi-section-table-titles .cbi-section-table-cell { + flex: 1!important + } + .node-network-network .cbi-section-table .cbi-section-table-titles th:nth-child(2) { + text-align: center !important; + } + .node-network-network .cbi-section-table .cbi-section-table-titles { + display: flex + } + .node-network-wireless fieldset:nth-child(1) table > tbody > tr > td, + .node-network-wireless fieldset:nth-child(2) table > tbody > tr > td { + white-space: normal; + } +} + +@media screen and (max-width: 370px) { + + fieldset { + /* overflow-x: auto; */ + } + + select { + width: 100%; + } + + header { + height: 55px; + } + + h3 { + padding: 0 10px 10px 10px; + } + + /* img[src*="/images/logo.png"] + { + height: 45px; + background-image: var(--mlogo); + background-size: 310px; + background-repeat: no-repeat; + padding: 0 0 0 310px; + width: 0; + margin: 0; + background-position: 0; + } */ + + .showSide { + height: 45px; + } + + #maincontent > .container { + margin: 20px 20px; + } + + .main { + top: 45px; + } + + .main-left{ + top: 45px; + } + .main > .main-left > .nav > .slide > .menu { + } + + .main > .main-left > .nav > .slide > .slide-menu > li > a { + } + + .cbi-value { + margin-bottom: 20px; + display: table; + padding: 0px; + border-bottom: none; + } + + .cbi-value-title { + width: 100%; + font-weight: 700; + float: left; + padding: 0; + margin: 0; + margin-bottom: .25rem; + } + + .cbi-section-node { + padding: 10px !important; + } + + .cbi-value-description { + width: 100%; + display: block; + } + + .cbi-value > .cbi-value-field { + display: block; + float: left; + width: 100%; + } + img[src*="/luci-static/resources/cbi/add.gif"] { + right: 45px; + display: block; + position: absolute; + margin-top: -34px; + } + img[src*="/luci-static/resources/cbi/remove.gif"] { + right: 45px; + display: block; + position: absolute; + margin-top: -34px; + } + + img[src*="/luci-static/resources/cbi/reload.gif"] { + right: 45px; + display: block; + position: absolute; + margin-top: -34px; + } + .cbi-section-node > .cbi-value:nth-of-type(2n) { + background-color: var(--sectionbgColor); + } + + .cbi-tabcontainer > .cbi-value:nth-of-type(2n) { + background-color: var(--sectionbgColor); + } + + div > .cbi-value:nth-of-type(2n) { + background-color: var(--sectionbgColor); + } + + .node-main-login > .main .cbi-value { + padding: 0; + } + + .node-main-login > .main form > div:nth-last-child(1) { + margin-top: 2rem; + } + + .node-main-login > .main fieldset { + margin: 0; + padding: 0.5rem; + } + + #container\.network\.lan\.physical .cbi-value-title, + #cbi-network-1-_ifname .cbi-value-title + { + width: 35%; + } + #cbi-network-1-_ifname .cbi-value-field + { + width: 65%; + } + + h2 { + font-size: 1.2rem; + text-transform: capitalize; + } + + select, + input { + /* max-width: 200px; */ + } + + input[type='checkbox'] { + height: 1.2rem !important; + width: 1.2rem !important; + } + + #swaptotal div div small, + #swapfree div div small, + #swapcache div div small, + #memfree div div small, + #membuff div div small, + #conns div div small, + #memcache div div small, + #memtotal div div small{ + } + #swaptotal div div, + #swapfree div div, + #swapcache div div, + #memfree div div, + #membuff div div, + #conns div div, + #memcache div div, + #memtotal div div{ + } + + .node-status-iptables > .main div > .cbi-map > form input[type="submit"]{ + margin: 0; + } + + #cbi-samba-cfg010f89-_tmpl .cbi-value-title{ + width: 15%; + + } + #cbi-samba-cfg010f89-_tmpl .cbi-value-field{ + width: 95%; + } + /* fix nlbw component */ + #detail-bubble { + left: unset !important; + width: unset!important; + } + #detail-bubble.in { + color: #000; + padding-bottom: calc(60px + env(safe-area-inset-bottom)); + left: unset !important; + width: calc(100vw)!important; + } + #detail-bubble .head { + display: block; + overflow: auto; + /* text-align: unset !important; */ + } + #detail-bubble #bubble-table { + display: block; + overflow: auto; + } +} + +@media screen and (max-width: 315px) { + .label { + position: absolute; + right: 5px; + top: -70px; + } +} + +/* fix http://192.168.2.1/cgi-bin/luci/admin/nlbw/usage */ +#intervalSelect { + height: 40px !important; +} + +/* fix luci-app-commands */ +.commandbox div { + position: unset !important; +} + +/* fix luci-app-netspeedtest */ +#cbi-netspeedtest-homebox- { + display: unset !important; +} + +/* fix node-status-realtime */ +.node-status-realtime .container { + overflow:auto +} + +/* fix node-network-network */ +.node-network-network div[onclick*="document.getElementById('cbid.network."], +#cbi-network div[onclick*="document.getElementById('cbid.network."] { + background-color: unset !important; +} + +/* fix wireless_join list button */ +form[action="/cgi-bin/luci/admin/network/wireless"] input[class="cbi-button cbi-button-reset"], +form[action="/cgi-bin/luci/admin/network/wireless_join"] input[class="cbi-button cbi-input-find"] { + height: 25px; + min-width: 80px; +} +/* fix node-services-aliyundrive-webdav mask-box background style */ +.node-services-aliyundrive-webdav #mask-box { + background: rgb(64 64 64 / 0%); +} +/* fix node-servces-ddns input style */ +.node-services-ddns #cbi-ddns-service input { + width: unset; +} +.node-services-ddns .cbi-value input[type="password"], +.node-services-ddns .cbi-value input[type="text"] { + width: 100% !important; +} +/* fix luci-app-fileassistant botton style */ +.fb-container .cbi-button { + border-radius: var(--commonRadius0); + margin: 3px 3px 3px 0; + height: unset !important; +} +/* update node-system-commands style */ +.node-system-commands h3 { + text-transform: unset; +} +.node-system-commands .commandbox { + width: auto; + display: inline-block; + float: none; +} +.node-system-commands .commandbox p { + word-break:keep-all; + white-space:nowrap; +} +.node-system-commands div.cbi-map fieldset.cbi-section { + align-items: center; + text-align: center; +} +.node-system-commands #cbi-luci.cbi-map fieldset.cbi-section { + align-items: unset; + text-align: unset; +} +/* network */ +.node-network-network .ifacebox strong{ + color: var(--ifaceboxFontColor); + padding: 5px; +} +.node-network-firewall .zonebadge strong, +.node-network-firewall label strong { + color: var(--ifaceboxFontColor); +} + +/* fix new version luci-app-openclash style */ +.node-services-openclash ul li.selected { + background-color: var(--liSelectedColor) !important; +} +.node-services-openclash .cbi-button-reset, +.node-services-openclash .cbi-input-remove { + max-width: unset !important; +} +.node-services-openclash #tab-header ul li.selected, +.node-services-openclash #tab-header ul li { + color: black !important; + background-color: unset !important +} +/* fix qBittorrent status style*/ +.node-nas-qbittorrent p#qBittorrent_status input { + line-height: unset; +} + +/* fix node-system-diskman dialog-format-active */ +.node-system-diskman.dialog-format-active #dialog_format .dialog_box { + background: var(--alertBackground); + border-radius: var(--commonRadius1); +} +/* adaption plug-in luci-app-watchcat-plus */ +.node-services-watchcat-plus select[id*="cbi.opt.watchcat"] { + width: auto; +} +/* fix node-nas-fileassistant table cell style */ +.node-nas-fileassistant .fb-container .cbi-value-owner, +.node-nas-fileassistant .fb-container .cbi-value-perm { + display: table-cell; +} +/* fix luci-app-adguardhome style */ +.node-services-adguardhome input[onclick*="window.open('http://'+window.location.hostname+':"] { + line-height: 0; +} diff --git a/luci-theme-design/htdocs/luci-static/design/css/style.css b/luci-theme-design/htdocs/luci-static/design/css/style.css new file mode 100644 index 00000000..03a1f550 --- /dev/null +++ b/luci-theme-design/htdocs/luci-static/design/css/style.css @@ -0,0 +1,2 @@ +:root{--commonRadius0: 8px;--commonRadius1: 5px + }[data-theme=light]{--bg: #f1f4f5;--mainbg: #fff;--bgwhite: #fff;--activeColor: #5ea69b;--activeBottom: #5ea69b 2px solid;--textColor: rgb(132,119,116);--borderColor: rgba(0,0,0,.15);--navbgColor: rgba(255, 255, 255, .7);--navBorder: 1px solid #f2f2f2;--sectionbgColor: #fff;--sectionbgColor2: #fff;--sectionShaddow: 3px 3px 3px rgba(0,0,0,.05);--sectionBorder: none;--sectiontabBorder: none;--tabmenuBorderLR: none;--tabmenubgColor: none;--tabmenuBottom: #e4eaec 1px solid;--tabmenuRadius: 6px 6px 0 0;--sectionnodeBorder: #f7f7f7 1px solid;--cbilineColor: #f7f7f7 1px solid;--tabbgColor: #fff;--inputbgColor: #f8f8f8;--inputtextColor: #76838f;--inputBorder: 1px solid #e4eaec;--mainleftbgColor: rgb(255,255,255);--bttextColor: #fff;--badgebgColor: #f7f7f7;--badgeBorder: #e4eaec 1px solid;--progressbarColor: #c8c8c8;--progressbar: #5ea69b;--progressbartxtColor: #fff;--logo_color: #222b36;--alertColor: #000000;--alertBackground: rgb(230 230 230);--scrollbarColor:#c5c5c5;--ifaceboxBorderColor: #b8b8b8bd;--ifaceboxFontColor: #404040;--liSelectedColor: #c5c5c5;--vssrStatusColor: #525f7f;--vssrBoxShadow: 0 0 2rem 0 rgb(136 152 170 / 30%)}[data-theme=dark]{--bg: #000;--bgwhite: #000;--textColor: #fefefe;--activeColor: #5ea69b;--activeBottom: #5ea69b 2px solid;--borderColor: #2C2C3A;--navbgColor: hsla(0, 0%, 7%, .8);--navBorder: 1px solid #1c1c1e;--sectionbgColor: #1c1c1e;--sectionbgColor2: #1c1c1e;--sectionShaddow: 3px 3px 3px rgba(0,0,0,.05);--sectionBorder: none;--sectiontabBorder: none;--sectionnodeBorder: #3d3d41 1px solid;--cbilineColor: #2d2d2d 1px solid;--tabbgColor: #1c1c1e;--tabmenuBorderLR: none;--tabmenubgColor: none;--tabmenuBottom: #2d2d2d 1px solid;--tabmenuRadius: 6px 6px 0 0;--inputbgColor: #2f2f2f;--inputtextColor: #fefefe;--inputBorder: 1px solid #4d4d4d;--mainleftbgColor: #000;--bttextColor: #fefefe;--badgebgColor: #fefefe;--badgeBorder: #3d3d40 1px solid;--progressbarColor: #6d6d6d;--progressbar: #5ea69b;--progressbartxtColor: #fefefe;--logo_color: #fefefe;--alertColor: #ffffff;--alertBackground: rgb(30 30 30);--scrollbarColor:#2f2f2f;--ifaceboxBorderColor: #636363bd;--ifaceboxFontColor: #404040;--liSelectedColor: #2f2f2f;--vssrStatusColor: rgb(204, 204, 204);--vssrBoxShadow: 0 0 1rem 0 rgb(0 0 0 / 30%)}@font-face{font-family:icomoon;src:url(../fonts/font.eot);src:url(../fonts/font.eot) format('embedded-opentype'),url(../fonts/font.ttf) format('truetype'),url(../fonts/font.woff) format('woff'),url(../fonts/font.svg) format('svg');font-weight:400;font-style:normal}@font-face{font-family:design;src:url('');src:url(?#iefix) format('embedded-opentype'),url(../fonts/iconfont-Regular.woff2) format('woff2'),url(../fonts/iconfont-Regular.woff) format('woff'),url(../fonts/iconfont-Regular.ttf) format('truetype'),url(#iconfont) format('svg')}@font-face{font-family:genjyuugothic-medium;src:url(../fonts/GenJyuuGothic-Medium.otf) format('opentype')}*::-webkit-scrollbar{width:5px;height:5px}*::-webkit-scrollbar-thumb{background:var(--scrollbarColor);border-radius:2px}div{font-family:hyk2gj}html{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}html,body{margin:0;padding:0;height:100%;font-family:-apple-system,microsoft yahei!important;font-size:.92rem;line-height:150%;background-color:var(--bg);color:var(--textColor)}body div{line-height:150%}a{color:var(--textColor);text-decoration:none}em{font-style:normal!important;line-height:1.5;padding-left:10px}*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}select{overflow:hidden!important;width:100%;appearance:none;-webkit-appearance:none;-moz-appearance:none;padding:0 25px 0 10px!important;background-size:24px 16px;background-repeat:no-repeat;background-position:100%;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABGCAYAAAA6hjFpAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDcuMS1jMDAwIDc5LmRhYmFjYmIsIDIwMjEvMDQvMTQtMDA6Mzk6NDQgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjhDNzA0QUE0NjE2QTExRUNCMjJFQkQyRkIyNURDNjE3IiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjhDNzA0QUEzNjE2QTExRUNCMjJFQkQyRkIyNURDNjE3IiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCAyMi41IChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6QzNBNTYzNTY2MTUxMTFFQ0IyMkVCRDJGQjI1REM2MTciIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QzNBNTYzNTc2MTUxMTFFQ0IyMkVCRDJGQjI1REM2MTciLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6YjzxlAAACsklEQVR42uyaXUsVURSG51T0U/obfUvhhYF0U0HQhZQVIWVJCAkiSUXfRRcaBFbXQVBBRCASFCJBpQQipw+RREkpCa9aG95gs0DMOp6Z7TwvvAxnzczaa6/nzDnzVTndfSVDxdE6WgAQBBCAIIAABAEEIAggAEEAQQABCAIIQBBAAIIAAhAEEAQQgCCAAAStGSAbzA/N+wvSiwPmB6or16bkoY2afLN5r+q4l2MfDpr7zetV2z7zYpmOkAHByNSE0IxDOdUSxr2rOjLVNVC2n6z77hsYmtFnbqlzHS0aN+7DouorFZBH+ibGUCrmO+YjdaqhVeNVHIxm1Ve6P/XH5ibzLwfllvn4Ko8d8t90MEIde1RXaU97n6oJCw7KNXPbKo3ZpvwxjAXV8YTrkCx7piPFQ7lsbq/xWO3K62E0qQ4uDKXn5kbzTxe/YO6o0Rgdypc5GI0anyt1p5fm3eYfLn7e3PmfuTuVJ1YYZ5fG5Up9CQ2qSfMu3m3u+secXdo/1rzGGeTWyfIaUrPmXPycuWeFuXq0X6w55R8q4NwLe3PxlXmn+buLnzX3/mWOXm0fK+RrUP4MICvTG/MO86yLnzFfWmbfi9ou1qzyvS7wnAt/+31YTZxx8ZPmq+709c/pcoifcvEZ5Rku+HyTeB4yYt5unnbxE+YbEZSwvK54rGntP5LAXJN5QPXWvNX8zcWPmm9rHmF5zK0P22/T/hlAaqv35i3mKRc/bB7VMtaUIL5LaI7JPcIdVZMnXXyT+zyp7T4kNr8kn6mPqdlfllj/VevHEpxbsi85fNTP1ycX/2zerPUZQOqrcUGp6nNVMMYTnlPyrwFNCMILLScSn0++r7zUSFVdZ6wJ8aIcQBBAAIIAAhAEEIAggAAEAQQBBCAIIABBAAEIAghAEEAQQJLQbwEGAK/reX2gh5gQAAAAAElFTkSuQmCC)}select,input{color:var(--inputtextColor);padding:5px 10px;font-size:.92rem;font-family:-apple-system,microsoft yahei,sans-serif,Helvetica,Arial,sans-serif;border:var(--inputBorder);background-color:var(--inputbgColor);transition:color 100ms ease,border-color 100ms ease,opacity 100ms ease;-webkit-transition:color 100ms ease,border-color 100ms ease,opacity 100ms ease;outline-style:none;vertical-align:middle;border-radius:var(--commonRadius0);margin:3px 3px 3px 0;height:2.8rem;line-height:2.8rem;max-width:550px}select:not([multiple=multiple]):focus,input:focus{border-color:#948fe1;box-shadow:0 0 6px #948fe1;-webkit-box-shadow:0 0 6px #948fe1;-moz-box-shadow:0 0 6px #948fe1}input[type=file]{border:none;background:0 0;height:auto;line-height:1rem}input[type=checkbox]{height:1.2rem;width:1.2rem}input[type=radio]{height:1.2rem;width:1.2rem;box-shadow:var(--bg)}select[multiple=multiple]{height:auto}.node-docker-images input[type=text]{width:auto!important}input[type=text],input[type=password]{width:100%}code{color:#09c}abbr{text-decoration:underline;cursor:help}br{display:block;margin-bottom:.2px;content:''}hr{margin:1rem 0;border-color:#eee;opacity:.1}header,.main{width:100%;position:absolute}header{background-color:var(--bgwhite);box-shadow:18rem 2px 4px rgba(0,0,0,.08);transition:box-shadow .1s;height:55px;float:left;position:fixed;z-index:101}footer{text-align:right;padding:1rem;color:#aaa;font-size:11px;height:80px;visibility:hidden}footer>a{color:#9a258f;text-decoration:none}text,line{font-family:Verdana!important}.cbi-button-up,.cbi-button-down,.cbi-value-helpicon,.showSide,.main>.loading>span{font-family:icomoon!important;font-size:10px;speak:none;font-style:normal!important;font-weight:400!important;font-variant:normal!important;text-transform:none!important;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.node-services-passwall2 #cbi-passwall2{text-align:center}.node-services-passwall2 input.cbi-button.cbi-button{max-width:unset}.node-services-passwall #set_node_div,.node-services-passwall2 #set_node_div,.node-services-passwall #add_link_div,.node-services-passwall2 #add_link_div{background:var(--sectionbgColor);border-radius:var(--commonRadius0)}.node-services-passwall #add_link_div #nodes_link,.node-services-passwall2 #add_link_div #nodes_link{width:100%!important}.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6{font-family:-apple-system,microsoft yahei;font-weight:600;line-height:1.1;color:inherit;clear:both;text-transform:capitalize}label.zonebadge.zonebadge-empty{background-color:#03abe8!important}label.zonebadge{border-radius:var(--commonRadius1);padding:2px 5px!important;display:inline-block;cursor:pointer;color:#666}.zonebadge{border-radius:6px;padding:5px}.zonebadge em{padding:3px}svg{background-color:var(--sectionbgColor)}.cbi-section .cbi-section{margin:10px}.node-services-vssr .status-bar{bottom:calc(var(--vssrBottom) + constant(safe-area-inset-bottom));bottom:calc(var(--vssrBottom) + env(safe-area-inset-bottom));background-color:var(--navbgColor);box-shadow:var(--vssrBoxShadow)!important;color:var(--vssrStatusColor)!important}.node-services-vssr .container{padding-bottom:calc(var(--vssrBottom) + constant(safe-area-inset-bottom));padding-bottom:calc(var(--vssrBottom) + env(safe-area-inset-bottom))}.node-services-vssr .ssr-button{min-width:30px}.node-services-vssr #cbi-vssr .panel-title{padding:10px 0 10px 10px!important;letter-spacing:0!important}.node-services-vssr .status .block{border-radius:10px!important;box-shadow:none!important;background-color:var(--sectionbgColor)!important}.node-services-vssr button{border-radius:10px!important}#cbi-vssr-servers .cbi-section-table-row{position:relative;margin:10px!important;padding:8px 15px 8px 70px;box-shadow:none!important;border-radius:10px!important;border:0;color:var(--textColor)!important;text-align:left;line-height:1.7em;overflow:hidden;letter-spacing:normal;background-color:var(--inputbgColor)!important}.cbi-section-table-row.fast{background-color:#add8e6!important}.incon .tp{text-transform:uppercase;color:var(--bg)!important}::file-selector-button{transition:all .1s ease-in-out;border-radius:var(--commonRadius1);border:3px solid #337ab7!important;color:#fff!important;background-color:#337ab7!important;box-sizing:border-box;cursor:pointer}::file-selector-button:hover,::file-selector-button:focus,::file-selector-button:active{color:#fff!important;background-color:#6a65d6!important;border-color:#6a65d6!important}img[src*="/luci-static/resources/icons/port_up.png"]{background-image:url(../images/port_up.png);background-size:32px 32px;height:32px;padding:0 0 0 32px;width:0}img[src*="/luci-static/resources/icons/port_down.png"]{background-image:url(../images/port_down.png);background-size:32px 32px;height:32px;padding:0 0 0 32px;width:0}#wan4_i img[src*="/luci-static/resources/icons/ethernet.png"],#wan6_i img[src*="/luci-static/resources/icons/ethernet.png"],img[src*="/luci-static/resources/icons/ethernet.png"]{background-image:url(../images/ethernet.png);background-size:32px 32px;height:32px;width:32px;padding:0 0 0 32px;width:0}#cbi-network-lan-ifname_multi img[src*="/luci-static/resources/icons/ethernet.png"],#cbi-network-1-_ifname img[src*="/luci-static/resources/icons/ethernet.png"],.ifacebadge img[src*="/luci-static/resources/icons/ethernet.png"],li img[src*="/luci-static/resources/icons/ethernet.png"]{background-size:16px 16px;height:16px;width:16px;padding:0 0 0 16px}#__status-ifc-signal img[src*="/luci-static/resources/icons/ethernet.png"]{background-size:32px 32px!important;height:32px!important;width:32px!important;padding:0 0 0 32px!important;width:0}#wan4_i img[src*="/luci-static/resources/icons/ethernet_disabled.png"],#wan6_i img[src*="/luci-static/resources/icons/ethernet_disabled.png"],img[src*="/luci-static/resources/icons/ethernet_disabled.png"]{background-image:url(../images/ethernet_disabled.png);background-size:32px 32px;height:32px;width:32px;padding:0 0 0 32px;width:0}#cbi-network-lan-ifname_multi img[src*="/luci-static/resources/icons/ethernet_disabled.png"],#cbi-network-1-_ifname img[src*="/luci-static/resources/icons/ethernet_disabled.png"],.ifacebadge img[src*="/luci-static/resources/icons/ethernet_disabled.png"],li img[src*="/luci-static/resources/icons/ethernet_disabled.png"]{background-size:16px 16px;height:16px;width:16px;padding:0 0 0 16px}#__status-ifc-signal img[src*="/luci-static/resources/icons/ethernet_disabled.png"]{background-size:32px 32px!important;height:32px!important;width:32px!important;padding:0 0 0 32px!important;width:0}#wan4_i img[src*="/luci-static/resources/icons/switch.png"],#wan6_i img[src*="/luci-static/resources/icons/switch.png"],img[src*="/luci-static/resources/icons/switch.png"]{background-image:url(../images/switch.png);background-size:32px 32px;height:32px;width:32px;padding:0 0 0 32px;width:0}#cbi-network-lan-ifname_multi img[src*="/luci-static/resources/icons/switch.png"],#cbi-network-1-_ifname img[src*="/luci-static/resources/icons/switch.png"],.ifacebadge img[src*="/luci-static/resources/icons/switch.png"],li img[src*="/luci-static/resources/icons/switch.png"]{background-size:16px 16px;height:16px;width:16px;padding:0 0 0 16px}#__status-ifc-signal img[src*="/luci-static/resources/icons/switch.png"]{background-size:32px 32px!important;height:32px!important;width:32px!important;padding:0 0 0 32px!important;width:0}#wan4_i img[src*="/luci-static/resources/icons/switch_disabled.png"],#wan6_i img[src*="/luci-static/resources/icons/switch_disabled.png"],img[src*="/luci-static/resources/icons/switch_disabled.png"]{background-image:url(../images/switch_disabled.png);background-size:32px 32px;height:32px;width:32px;padding:0 0 0 32px;width:0}#cbi-network-lan-ifname_multi img[src*="/luci-static/resources/icons/switch_disabled.png"],#cbi-network-1-_ifname img[src*="/luci-static/resources/icons/switch_disabled.png"],.ifacebadge img[src*="/luci-static/resources/icons/switch_disabled.png"],li img[src*="/luci-static/resources/icons/switch_disabled.png"]{background-size:16px 16px;height:16px;width:16px;padding:0 0 0 16px}#__status-ifc-signal img[src*="/luci-static/resources/icons/switch_disabled.png"]{background-size:32px 32px!important;height:32px!important;width:32px!important;padding:0 0 0 32px!important;width:0}#wan4_i img[src*="/luci-static/resources/icons/wifi.png"],#wan6_i img[src*="/luci-static/resources/icons/wifi.png"],img[src*="/luci-static/resources/icons/wifi.png"]{background-image:url(../images/wifi.png);background-size:32px 32px;height:32px;width:32px;padding:0 0 0 32px;width:0}#cbi-network-lan-ifname_multi img[src*="/luci-static/resources/icons/wifi.png"],#cbi-network-1-_ifname img[src*="/luci-static/resources/icons/wifi.png"],.ifacebadge img[src*="/luci-static/resources/icons/wifi.png"],li img[src*="/luci-static/resources/icons/wifi.png"]{background-size:16px 16px;height:16px;width:16px;padding:0 0 0 16px}#__status-ifc-signal img[src*="/luci-static/resources/icons/wifi.png"]{background-size:32px 32px!important;height:32px!important;width:32px!important;padding:0 0 0 32px!important;width:0}#wan4_i img[src*="/luci-static/resources/icons/wifi_disabled.png"],#wan6_i img[src*="/luci-static/resources/icons/wifi_disabled.png"],img[src*="/luci-static/resources/icons/wifi_disabled.png"]{background-image:url(../images/wifi_disabled.png);background-size:32px 32px;height:32px;width:32px;padding:0 0 0 32px;width:0}#cbi-network-lan-ifname_multi img[src*="/luci-static/resources/icons/wifi_disabled.png"],#cbi-network-1-_ifname img[src*="/luci-static/resources/icons/wifi_disabled.png"],.ifacebadge img[src*="/luci-static/resources/icons/wifi_disabled.png"],li img[src*="/luci-static/resources/icons/wifi_disabled.png"]{background-size:16px 16px;height:16px;width:16px;padding:0 0 0 16px}#__status-ifc-signal img[src*="/luci-static/resources/icons/wifi_disabled.png"]{background-size:32px 32px!important;height:32px!important;width:32px!important;padding:0 0 0 32px!important;width:0}#wan4_i img[src*="/luci-static/resources/icons/vlan.png"],#wan6_i img[src*="/luci-static/resources/icons/vlan.png"],img[src*="/luci-static/resources/icons/vlan.png"]{background-image:url(../images/vlan.png);background-size:32px 32px;height:32px;width:32px;padding:0 0 0 32px;width:0}.ifacebadge img[src*="/luci-static/resources/icons/vlan.png"],li img[src*="/luci-static/resources/icons/vlan.png"]{background-size:16px 16px;height:16px;width:16px;padding:0 0 0 16px}#__status-ifc-signal img[src*="/luci-static/resources/icons/vlan.png"]{background-size:32px 32px!important;height:32px!important;width:32px!important;padding:0 0 0 32px!important;width:0}#wan4_i img[src*="/luci-static/resources/icons/vlan_disabled.png"],#wan6_i img[src*="/luci-static/resources/icons/vlan_disabled.png"],img[src*="/luci-static/resources/icons/vlan_disabled.png"]{background-image:url(../images/vlan_disabled.png);background-size:32px 32px;height:32px;width:32px;padding:0 0 0 32px;width:0}.ifacebadge img[src*="/luci-static/resources/icons/vlan_disabled.png"],li img[src*="/luci-static/resources/icons/vlan_disabled.png"]{background-size:16px 16px;height:16px;width:16px;padding:0 0 0 16px}#__status-ifc-signal img[src*="/luci-static/resources/icons/vlan_disabled.png"]{background-size:32px 32px!important;height:32px!important;width:32px!important;padding:0 0 0 32px!important;width:0}#wan4_i img[src*="/luci-static/resources/icons/bridge.png"],#wan6_i img[src*="/luci-static/resources/icons/bridge.png"],img[src*="/luci-static/resources/icons/bridge.png"]{background-image:url(../images/bridge.png);background-size:32px 32px;height:32px;width:32px;padding:0 0 0 32px;width:0}.ifacebadge img[src*="/luci-static/resources/icons/bridge.png"],li img[src*="/luci-static/resources/icons/bridge.png"]{background-image:url(../images/bridge.png);background-size:16px 16px;height:16px;width:16px;padding:0 0 0 16px;width:0}#__status-ifc-signal img[src*="/luci-static/resources/icons/bridge.png"]{background-size:32px 32px!important;height:32px!important;width:32px!important;padding:0 0 0 32px!important;width:0}#wan4_i img[src*="/luci-static/resources/icons/bridge_disabled.png"],#wan6_i img[src*="/luci-static/resources/icons/bridge_disabled.png"],img[src*="/luci-static/resources/icons/bridge_disabled.png"]{background-image:url(../images/bridge_disabled.png);background-size:32px 32px;height:32px;width:32px;padding:0 0 0 32px;width:0}.ifacebadge img[src*="/luci-static/resources/icons/bridge_disabled.png"],li img[src*="/luci-static/resources/icons/bridge_disabled.png"]{background-image:url(../images/bridge_disabled.png);background-size:16px 16px;height:16px;width:16px;padding:0 0 0 16px;width:0}#__status-ifc-signal img[src*="/luci-static/resources/icons/bridge_disabled.png"]{background-size:32px 32px!important;height:32px!important;width:32px!important;padding:0 0 0 32px!important;width:0}#wan4_i img[src*="/luci-static/resources/icons/tunnel.png"],#wan6_i img[src*="/luci-static/resources/icons/tunnel.png"],img[src*="/luci-static/resources/icons/tunnel.png"]{background-image:url(../images/tunnel.png);background-size:32px 32px;height:32px;width:32px;padding:0 0 0 32px;width:0}.ifacebadge img[src*="/luci-static/resources/icons/tunnel.png"],li img[src*="/luci-static/resources/icons/tunnel.png"]{background-size:16px 16px;height:16px;width:16px;padding:0 0 0 16px}#__status-ifc-signal img[src*="/luci-static/resources/icons/tunnel.png"]{background-size:32px 32px!important;height:32px!important;width:32px!important;padding:0 0 0 32px!important;width:0}#wan4_i img[src*="/luci-static/resources/icons/tunnel_disabled.png"],#wan6_i img[src*="/luci-static/resources/icons/tunnel_disabled.png"],img[src*="/luci-static/resources/icons/tunnel_disabled.png"]{background-image:url(../images/tunnel_disabled.png);background-size:32px 32px;height:32px;width:32px;padding:0 0 0 32px;width:0}.ifacebadge img[src*="/luci-static/resources/icons/tunnel_disabled.png"],li img[src*="/luci-static/resources/icons/tunnel_disabled.png"]{background-size:16px 16px;height:16px;width:16px;padding:0 0 0 16px}#__status-ifc-signal img[src*="/luci-static/resources/icons/tunnel_disabled.png"]{background-size:32px 32px!important;height:32px!important;width:32px!important;padding:0 0 0 32px!important;width:0}img[src*="/luci-static/resources/icons/wifi_big.png"]{background-image:url(../images/wifi_big.png);background-size:64px 64px;height:64px;padding:0 0 0 64px;width:0}img[src*="/luci-static/resources/icons/wifi_big_disabled.png"]{background-image:url(../images/wifi_big_disabled.png);background-size:64px 64px;height:64px;padding:0 0 0 64px;width:0}img[src*="/luci-static/resources/icons/loading.gif"]{background-image:url(../images/loading.gif);background-size:32px 32px;height:32px;width:32px;padding:0 0 0 32px;width:0}.ifacebox-body img{background-size:20px 20px;width:20px!important;height:20px!important;padding:0 0 0 20px!important}.ifacebox-head{border-radius:4px 4px 0 0}img[src*="/luci-static/resources/cbi/add.gif"]{background-image:url(../images/add.png);background-size:20px 20px;height:20px;padding:0 0 0 20px;width:0;z-index:2}img[src*="/luci-static/resources/cbi/remove.gif"]{background-image:url(../images/remove.png);background-size:20px 20px;height:20px;padding:0 0 0 20px;width:0;z-index:2}img[src*="/luci-static/resources/cbi/reload.gif"]{background-image:url(../images/reload.png);background-size:20px 20px;height:20px;padding:0 0 0 20px;width:0;z-index:2}img[src*="/luci-static/resources/icons/signal-75-100.png"]{background-image:url(../images/signal-75-100.png);image-rendering:pixelated;background-size:24px 24px;height:24px;width:24px;padding:0 0 0 24px;z-index:2}img[src*="/luci-static/resources/icons/signal-50-75.png"]{background-image:url(../images/signal-50-75.png);image-rendering:pixelated;background-size:24px 24px;height:24px;width:24px;padding:0 0 0 24px;z-index:2}img[src*="/luci-static/resources/icons/signal-25-50.png"]{background-image:url(../images/signal-25-50.png);image-rendering:pixelated;background-size:24px 24px;height:24px;width:24px;padding:0 0 0 24px;z-index:2}img[src*="/luci-static/resources/icons/signal-0-25.png"]{background-image:url(../images/signal-0-25.png);image-rendering:pixelated;background-size:24px 24px;height:24px;width:24px;padding:0 0 0 24px;z-index:2}img[src*="/luci-static/resources/icons/signal-0.png"]{background-image:url(../images/signal-0.png);image-rendering:pixelated;background-size:24px 24px;height:24px;width:24px;padding:0 0 0 24px;z-index:2}img[src*="/luci-static/resources/icons/signal-none.png"]{background-image:url(../images/signal-none.png);image-rendering:pixelated;background-size:24px 24px;height:24px;width:24px;padding:0 0 0 24px;z-index:2}.myIcon{font-family:design!important;font-style:normal!important;font-variant:normal!important;text-transform:none!important}.myIcon-logout:after{content:"\e005"}.myIcon-reboot:after{content:"\e02a"}.myIcon-wifi:after{content:"\e00c"}.main{top:50px;bottom:0;position:relative;height:100%;height:calc(100% - 4rem)}.main>.loading{position:fixed;width:100%;height:100%;z-index:1000;display:block;background-color:#f0f0f0;top:0}.main>.loading>span{display:block;text-align:center;margin-top:2rem;color:#888;font-size:1rem}.main>.loading>span>.loading-img:before{content:"\e603"}.main>.loading>span>.loading-img{animation:anim-rotate 2s infinite linear;margin-right:.2rem;display:inline-block}.node-main-login{text-align:center;background-color:var(--bgwhite)!important}.node-main-login .cbi-section-node>.cbi-value:nth-of-type(2n){background:0 0}.node-main-login h2{font-size:1.5rem}.node-main-login header{display:none}.node-main-login>.main>.main-left{display:none}.node-main-login>.main>.main-right{width:100%}.node-main-login>.main fieldset{padding:0!important;margin-bottom:1rem;display:inline;background:0 0;border:none;box-shadow:none;overflow:hidden}.node-main-login>.main fieldset .cbi-value-title{display:none!important}.node-main-login>.main .cbi-section{margin-top:10px!important}.node-main-login>.main .cbi-map{}.node-main-login>.main fieldset .cbi-value{}.node-main-login>.main fieldset .cbi-value-title{padding:10px 0 10px 5px!important}.node-main-login>.main .cbi-value{border:none}.node-main-login>.main .cbi-value-title{width:7rem}.node-main-login>.main #maincontent{display:flex;height:100%;text-align:center;align-items:center;align-content:center;justify-content:center}.node-main-login>.main form>div:nth-last-child(1){}.node-main-login>.main .cbi-value>*{display:inline-block!important}.node-main-login>.main .cbi-input-user,.node-main-login>.main .cbi-input-password{appearance:none;outline:0;padding:0 0 0 35px;background-repeat:no-repeat;background-position:10px 10px;background-size:18px 18px;min-width:15rem}.node-main-login>.main .cbi-input-user{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBmaWxsPSIjNjI3Mzg2IiBkPSJNMTIgNGE0IDQgMCAwIDEgNCA0IDQgNCAwIDAgMS00IDQgNCA0IDAgMCAxLTQtNCA0IDQgMCAwIDEgNC00bTAgMTBjNC40Mi4wIDggMS43OSA4IDR2Mkg0di0yYzAtMi4yMSAzLjU4LTQgOC00eiIvPjwvc3ZnPg==)}.node-main-login>.main .cbi-input-password{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBmaWxsPSIjNjI3Mzg2IiBkPSJNMTIgMTdhMiAyIDAgMCAwIDItMiAyIDIgMCAwIDAtMi0yIDIgMiAwIDAgMC0yIDIgMiAyIDAgMCAwIDIgMm02LTlhMiAyIDAgMCAxIDIgMnYxMGEyIDIgMCAwIDEtMiAySDZhMiAyIDAgMCAxLTItMlYxMGEyIDIgMCAwIDEgMi0yaDFWNmE1IDUgMCAwIDEgNS01IDUgNSAwIDAgMSA1IDV2MmgxbS02LTVhMyAzIDAgMCAwLTMgM3YyaDZWNmEzIDMgMCAwIDAtMy0zeiIvPjwvc3ZnPg==)}.node-main-login footer{bottom:0;position:absolute;width:100%}.navbar{overflow:hidden;position:fixed;bottom:0;width:100%;border-top:var(--navBorder);text-align:center;height:calc(50px + constant(safe-area-inset-bottom));height:calc(50px + env(safe-area-inset-bottom));background-color:var(--navbgColor);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.navbar a{float:left;text-align:center;padding:8px 0;width:20%;text-decoration:none;max-width:100px}.cbi-map{margin-top:10px}#cbi-shadowsocksr .cbi-map-descr{display:none}.navbar a img{width:28px}@keyframes anim-rotate{0%{-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg)}}.main-left{float:left;width:18rem;background-color:var(--mainleftbgColor);overflow-x:auto;height:calc(100% - 3.5rem);position:fixed;padding-top:15px;box-shadow:0 0 4px transparent;transition:visibility 100ms,width 100ms}.main-right{width:85%;width:calc(100% - 18rem);float:right;height:100%;border-left:var(--sectionBorder)}.main-right>#maincontent{}.pull-right{position:absolute;top:-2px;right:30px;cursor:pointer}.pull-left{float:left}header>.container{margin:0;padding:0}header>.container>.brand{font-size:25px;font-family:genjyuugothic-medium;line-height:60px;color:var(--logo_color);cursor:default;display:block;width:18rem;height:60px;text-align:center;float:left;font-weight:900;letter-spacing:1px;padding:0 4.5rem;transition:.1s ease-in-out;position:absolute}header>.container>a[class=brand]:after{content:"";font-size:14px;font-family:Tahoma;position:absolute;top:-10px;font-weight:400!important}header>.container>.brand-hostname{font-size:14px;line-height:60px;color:#555;cursor:default;display:block;width:18rem;padding-right:10px;height:60px;text-align:left;float:left;margin-top:7px;font-weight:300;margin-left:-15px}.warning{background-color:#ff7d60!important;color:#fff}.errorbox,.alert-message{margin:0 0 10px;padding:20px;line-height:1.5;font-family:inherit;min-width:inherit;overflow:auto;border-radius:10px;color:var(--alertColor);background-color:var(--alertBackground)}.errorbox{color:#fff;background-color:#ff6767;border-radius:10px}.error{color:red}p#shadowsocksr_status{padding:3px}#maincontent>.container>div:nth-child(1).alert-message.warning>a{font:inherit;overflow:visible;text-transform:none;display:inline-block;margin-bottom:0;font-weight:400;text-align:center;white-space:nowrap;vertical-align:middle;touch-action:manipulation;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;background-image:none;min-width:6rem;padding:.5rem 1rem;font-size:14px;line-height:1.42857143;color:#fff;background-color:#5bc0de;border-color:#46b8da;margin-top:2rem;text-decoration:inherit}.main>.main-left>.nav{overflow-y:visible!important;font-size:1rem;width:90%;margin:auto;margin-bottom:90px}.main>.main-left>.nav>li a{color:var(--activeColor);display:block;border-radius:6px;cursor:pointer;font-weight:700;font-size:1.1rem;transition:all .1s}.main>.main-left>.nav>li{cursor:pointer;padding-top:6px}.main>.main-left>.nav>.slide{padding:0;padding-top:8px}.main>.main-left>.nav>.slide>a:before{display:inline-block;left:-10px;top:1px;position:relative;font-family:design!important;font-weight:700!important;text-transform:none!important;speak:none;font-size:1.2rem!important;-webkit-font-smoothing:antialiased}.main>.main-left>.nav>.slide>.menu::after{right:.5rem;top:.8rem;font-family:design!important;font-style:normal!important;font-variant:normal!important;content:"\eb03";float:right;padding-right:5px;line-height:1.6;-moz-osx-font-smoothing:grayscale;transition:all .1s ease;text-rendering:auto;-webkit-font-smoothing:antialiased}.main .main-left .nav li.slide .menu.active::after{transform:rotate(90deg)}.main>.main-left>.nav>.slide>a[data-title=Status]:before{content:"\e6b8"}.main>.main-left>.nav>.slide>a[data-title=System]:before{content:"\e645"}.main>.main-left>.nav>.slide>a[data-title=Modem]:before{content:"\e67e"}.main>.main-left>.nav>.slide>a[data-title=Services]:before{content:"\e6cb"}.main>.main-left>.nav>.slide>a[data-title=Docker]:before{content:"\44"}.main>.main-left>.nav>.slide>a[data-title=NAS]:before{content:"\eb04"}.main>.main-left>.nav>.slide>a[data-title=VPN]:before{content:"\56"}.main>.main-left>.nav>.slide>a[data-title=Network]:before{content:"\72"}.main>.main-left>.nav>.slide>a[data-title="Bandwidth Monitor"]:before{content:"\e764"}.main .main-left .nav li.slide .menu[data-title=Statistics]:before{content:"\e604"}.main .main-left .nav li.slide .menu[data-title=Control]:before{content:"\e67a"}.main .main-left .nav li.slide .menu[data-title=Asterisk]:before{content:"\e7dd"}.main>.main-left>.nav>.slide>a[data-title=QuickStart]:before,.main>.main-left>.nav>li>a[data-title="Inital Setup"]:before,.main>.main-left>.nav>li>a[data-title=NetworkGuide]:before,.main>.main-left>.nav>li>a[href="/cgi-bin/luci//admin/wizard"]:before{content:"\e719"}.main>.main-left>.nav>li>a[data-title=iStore]:before{content:"\e676"}.main>.main-left>.nav>li>a[data-title=Logout]{padding:.675rem 0 .675rem 2.5rem}.main>.main-left>.nav>li>a[data-title=Logout]:before{content:"\e641"}.main>.main-left>.nav>li>a[data-title=Reboot]{padding:6px 25px}.main>.main-left>.nav>li>a[data-title=Reboot]:before{content:"\e004"}.main>.main-left>.nav>.slide>ul{display:none;list-style:dotted}.main>.main-left>.nav>.slide>.menu{display:block;padding:.675rem 0 .675rem 2.5rem;text-decoration:none;cursor:pointer}.main>.main-left>.nav>.slide>.menu2{display:block;padding:.675rem 0 .675rem 2.5rem;text-decoration:none;cursor:pointer}.main>.main-left>.nav>li:hover,.main>.main-left>.nav>.slide>.menu:hover{background:var(--activeColor);color:#fff}.main>.main-left>.nav>.slide>.menu2:hover{background:var(--activeColor);color:#fff}.main>.main-left>.nav>.slide:hover{background:0 0}.slide-menu{overflow:hidden}.main>.main-left>.nav>.slide>.slide-menu>li{margin-top:8px;border-radius:6px}.main>.main-left>.nav>.slide>.slide-menu>.active{background-color:var(--activeColor)}.main>.main-left>.nav>.slide>.slide-menu>li>a{position:relative;display:block;color:var(--textColor);vertical-align:middle;background:0 0!important;border:none!important;text-transform:capitalize;font-size:1rem;margin:.1rem .5rem;padding:.675rem 0 .675rem 3.2rem}.main .main-left .nav li.slide .slide-menu .active a{color:#000}.main>.main-left>.nav>.slide>.slide-menu>li>a:hover{color:#fff}.main>.main-left>.nav>.slide>.slide-menu>.active>a{color:#fff}.main>.main-left>.nav>.slide>.slide-menu>li:hover{background:var(--activeColor);color:#fff!important;transition:all .1s}.main>.main-left>.nav>.slide>.slide-menu>.active:hover{background-color:var(--activeColor);cursor:pointer}.cbi-tab-descr{padding:10px}li{list-style-type:none}#maincontent>.container{margin:30px 30px 50px}h1{color:var(--activeColor);font-size:20px;padding-bottom:10px;border-bottom:1px solid #eee}h2{color:var(--activeColor);padding:0 12px 6px;text-transform:capitalize}h3{font-size:1.2rem;color:var(--activeColor);font-weight:700;padding:0 12px 10px}h4{}label{display:inline-block;vertical-align:middle}fieldset{padding:10px;border:1px;font-weight:400;font-style:normal;line-height:1;font-family:inherit;text-align:left;min-width:inherit;overflow-x:auto;overflow-y:hidden;background-color:var(--sectionbgColor);-webkit-overflow-scrolling:touch}fieldset>legend{display:none!important}fieldset>fieldset{padding:0}.panel-title{width:100%;display:block;padding:10px;font-weight:700;font-size:1rem}table{border-spacing:0;border-collapse:collapse;width:100%;border:0 solid #eee!important;margin:0!important}strong{font-weight:700;padding:2px}#lb_load01_cur,#lb_load01_peak,#lb_load05_cur,#lb_load15_cur{text-align:right!important}#lb_load01_peak{text-align:left!important}#lb_load01_cur{}table>tbody>tr>td,table>tbody>tr>th,table>tfoot>tr>td,table>tfoot>tr>th,table>thead>tr>td,table>thead>tr>th{padding:12px;white-space:nowrap;line-height:1.5;vertical-align:middle!important}.node-services-appfilter table>tbody>tr>th,.node-services-appfilter table>tbody>tr>td,.node-nlbw-usage table>tbody>tr>th,.node-nlbw-usage table>tbody>tr>td{text-align:center}table>tbody>tr{border-bottom:var(--cbilineColor)!important}table>tbody>tr:last-child{border-bottom:none!important}.cbi-section-table-cell{text-align:center}.cbi-section-table-row{text-align:center}.cbi-section-remove{margin-bottom:2px}.cbi-section-remove>input{background-color:#c06}fieldset>table>tbody>tr:nth-of-type(odd){background-color:var(--sectionbgColor2)}#lease6_status_table>tbody>.cbi-section-table-row.cbi-rowstyle-1 div,#lease6_status_table>tbody>.cbi-section-table-row.cbi-rowstyle-2 div{min-width:100%}.node-status-overview>.main fieldset:nth-child(6) td:nth-child(2),.node-status-overview table[id=wifi_status_table]>tbody>tr>td{white-space:normal}#swaptotal>div,#swapfree>div,#swapcache>div,#memfree>div,#membuff>div,#conns>div,#memcache>div,#memtotal>div{width:100%!important;border-color:var(--progressbarColor)!important;background-color:var(--progressbarColor)!important;border-radius:3px}#swaptotal>div>div,#swapfree>div>div,#swapcache>div>div,#memfree>div>div,#membuff>div>div,#conns>div>div,#memcache>div>div,#memtotal>div>div{background-color:var(--progressbar)!important;color:var(--progressbartxtColor)!important;border-radius:3px}#swaptotal div div,#swapfree div div,#swapcache div div,#memfree div div,#membuff div div,#conns div div,#memcache div div,#memtotal div div{align-items:center;align-content:center;justify-content:center;display:flex}#swaptotal div div small,#swapfree div div small,#swapcache div div small,#memfree div div small,#membuff div div small,#conns div div small,#memcache div div small,#memtotal div div small{font-size:.75rem!important;line-height:130%;color:var(--progressbartxtColor)!important}.cbi-value-field{width:65%}.node-system-admin .cbi-value-field li div{padding:0!important}.node-system-admin em{padding:0!important}.node-nlbw-display hr{display:none}.node-nlbw-display p{line-height:1.5;padding:0 10px 5px}#cbi-network .cbi-value-field ul,#cbi-wireless .cbi-value-field ul,#cbi-firewall .cbi-value-field ul{overflow-x:auto;white-space:nowrap}#cbi-network .cbi-value-field ul input[type=text],#cbi-wireless .cbi-value-field ul input[type=text],#cbi-firewall .cbi-value-field ul input[type=text]{max-width:10rem;width:100%!important}div [id*=cbi-network-] [id*=-__status] table,div [id*=cbi-wireless] [id*=-__status] table{width:auto}div [id*=cbi-network-] [id*=-__status] table td,div [id*=cbi-wireless] [id*=-__status] table td{width:auto;padding:0!important}div [id*=cbi-network-] [id*=-__status] table td small,div [id*=cbi-wireless] [id*=-__status] table td small{width:auto}.node-network-wifi .cbi-section-table tr .cbi-value-field,.node-network-wireless .cbi-section-table tr .cbi-value-field{width:unset!important;text-align:right}.node-network-wireless #iw-assoclist .cbi-section-table-row td[colspan="6"],.node-network-wireless .cbi-section-table .cbi-section-table-row td[colspan="6"],.node-network-wifi .cbi-section-table .cbi-section-table-row td[colspan="8"]{text-align:center!important}.node-network-wireless #iw-assoclist .cbi-section-table-row td div{max-width:unset!important}.node-network-wifi table,td,th{border-top:unset!important}.node-network-wifi .cbi-section-table td[colspan="2"]{padding-left:unset!important}.node-status-routes .cbi-section-node{max-height:500px;overflow-y:auto;overflow-x:auto}table table{border:none}.cbi-value-field table{border:none}.cbi-value-field label{padding:0}td>table>tbody>tr>td{border:none}.cbi-value-field>table>tbody>tr>td{border:none}#container\.nlbw\.traffic th,#container\.nlbw\.traffic td,#container\.nlbw\.layer7 th,#container\.nlbw\.layer7 td,#container\.nlbw\.ipv6 th,#container\.nlbw\.ipv6 td,#container\.nlbw\.export th,#container\.nlbw\.export td{padding:12px!important;border-top:none;border:unset;text-align:center}#container\.nlbw\.traffic tr td:nth-child(4),#container\.nlbw\.layer7 tr td:nth-child(3),#container\.nlbw\.ipv6 tr td:nth-child(4),#container\.nlbw\.export tr td:nth-child(4),#container\.nlbw\.traffic tr td:nth-child(6),#container\.nlbw\.layer7 tr td:nth-child(5),#container\.nlbw\.ipv6 tr td:nth-child(6),#container\.nlbw\.export tr td:nth-child(6){text-align:right!important}#container\.nlbw\.traffic tr td:nth-child(5),#container\.nlbw\.layer7 tr td:nth-child(4),#container\.nlbw\.ipv6 tr td:nth-child(5),#container\.nlbw\.export tr td:nth-child(5),#container\.nlbw\.traffic tr td:nth-child(7),#container\.nlbw\.layer7 tr td:nth-child(6),#container\.nlbw\.ipv6 tr td:nth-child(7),#container\.nlbw\.export tr td:nth-child(7){text-align:left!important}td#__status-ifc-signal{width:60px!important}.cbi-button{-webkit-appearance:none;text-transform:uppercase;color:#fff;background-color:#337ab7;transition:all .1s ease-in-out;display:inline-block;border:none;cursor:pointer;-ms-touch-action:manipulation;touch-action:manipulation;background-image:none;text-align:center;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:auto!important;min-width:80px;padding:0 8px;border-radius:var(--commonRadius0);height:35px;line-height:35px}.cbi-button:hover,.cbi-button:focus,.cbi-button:active{color:#fff;outline:0;text-decoration:none;background-color:#6a65d6}.cbi-button:hover,.cbi-button:focus{box-shadow:0 1px 1px rgba(0,0,0,.05)}.cbi-button:active{box-shadow:0 1px 1px rgba(0,0,0,.05)}.cbi-button:disabled{cursor:not-allowed;pointer-events:none;opacity:.6;box-shadow:none}form.inline+form.inline,.cbi-button+.cbi-button{}.cbi-button-reset,.cbi-input-remove{color:#fff!important;background-color:#617486!important}.cbi-button-reset:hover,.cbi-input-remove:hover,.cbi-button-remove:hover{color:#fff!important;background-color:#536473!important}.cbi-button-link,.cbi-input-find,.cbi-input-save,.cbi-button-add,.cbi-button-save,.cbi-button-find,.cbi-input-reload,.cbi-button-reload{color:var(--bttextColor);background-color:#337ab7!important;border-color:#337ab7!important}.cbi-button-link:hover,.cbi-input-find:hover,.cbi-input-save:hover,.cbi-button-add:hover,.cbi-button-save:hover,.cbi-button-find:hover,.cbi-input-reload:hover,.cbi-button-reload:hover{color:#fff!important;background-color:#6a82ae!important;border-color:#6a82ae!important}.cbi-input-apply,.cbi-button-apply,.cbi-button-edit{color:#fff!important;background-color:var(--activeColor)}.cbi-input-reset,.cbi-button-remove{color:#fff!important;background:#617486}.a-to-btn{text-decoration:none}.tabs{margin:15px 0;overflow-x:auto}.cbi-tabmenu>li,.tabs>li{display:table-cell}.cbi-tabmenu>li{border-radius:var(--tabmenuRadius)}.tabs>li>a{text-decoration:none;padding:0 6px;float:left;display:block;white-space:nowrap;height:2.5rem;line-height:2.5rem;font-size:.92rem}.cbi-tabmenu>li>a{text-decoration:none;float:left;display:block;white-space:nowrap;height:2.5rem;line-height:2.5rem;font-size:.92rem;margin:0 10px}.tabs>li[class~=active],.tabs>li:hover{cursor:pointer}.tabs>li[class~=active]>a{color:var(--activeColor)!important;padding-bottom:8px;border-bottom:var(--activeColor) 2px solid}.tabs>li:hover{}.cbi-tabmenu{border-top:var(--sectiontabBorder);border-left:var(--tabmenuBorderLR);border-right:var(--tabmenuBorderLR);border-bottom:var(--tabmenuBottom);background-color:var(--tabmenubgColor);width:100%;overflow-x:auto;margin-top:5px;margin-bottom:10px}.cbi-tabmenu>li:hover{background-color:none}.cbi-tabmenu>li[class~=cbi-tab]{background-color:none}.cbi-tabmenu>li[class~=cbi-tab] a{color:var(--activeColor)!important;border-bottom:2px solid var(--activeColor)!important}.cbi-section-node-tabbed{margin-top:0;border-bottom:var(--sectiontabBorder);border-left:var(--sectiontabBorder);border-right:var(--sectiontabBorder);border-radius:0 0}.cbi-tabcontainer{clear:both}.cbi-tabcontainer>.cbi-value:nth-of-type(2n){background-color:var(--sectionbgColor2)}.cbi-section-node>.cbi-value:nth-of-type(2n){background-color:var(--sectionbgColor2)}div>.cbi-value:nth-of-type(2n){background-color:var(--sectionbgColor2)}.cbi-value-field,.cbi-value-description{display:table-cell}.cbi-value-field{}.cbi-value-helpicon>img{display:none}.cbi-value-helpicon:before{content:"\f059"}.cbi-value-description{opacity:.6;padding-left:4px}.cbi-value-title{word-wrap:break-word;display:table-cell;width:35%;float:left;padding:13px 10px 5px 3px}.cbi-value{display:flex;width:100%;align-items:center;align-content:center;justify-content:flex-start;min-height:40px;padding:8px 10px;flex-flow:row wrap;border-bottom:var(--cbilineColor)}.cbi-value:last-child{border-bottom:none}.cbi-value strong{font-weight:400}.cbi-section-table-descr>.cbi-section-table-cell,.cbi-section-table-titles>.cbi-section-table-cell{border:none}.cbi-rowstyle-2{background-color:var(--sectionbgColor2)}.cbi-rowstyle-2 .cbi-button-up,.cbi-rowstyle-2 .cbi-button-down{}.cbi-section-table .cbi-section-table-titles .cbi-section-table-cell{width:auto!important}.cbi-section-table tr .cbi-value-field{text-align:center;width:20%!important;padding:10px!important}.cbi-section-table tr .cbi-value-field input{width:auto}.cbi-section-table tr .cbi-value-field .ifacebox{margin:auto;width:fit-content;min-width:60px}.cbi-section-descr{padding:3px 10px}.cbi-map-descr{padding:5px 5px 5px 12px}.cbi-map-descr h3{font-size:.92rem;font-weight:400;color:#666}#cbi-vsftpd .cbi-map-descr{color:var(--activeColor);padding:0 12px 0;font-size:1.2rem;font-weight:700}.hidden{display:none}.left{text-align:left!important}.right{text-align:right!important}.right .cbi-button{height:20px;line-height:20px;min-width:60px;margin:0}.inline{display:inline}.cbi-page-actions{text-align:center}.cbi-value input[type=password],.cbi-value input[type=text]{}.ifacebadge{display:inline-flex;padding:5px;background-color:var(--badgebgColor);align-content:center;align-items:center;border-radius:var(--commonRadius1);border:var(--badgeBorder);color:#666}#content_syslog{padding:5px;margin-top:10px;border-radius:10px;background-color:var(--sectionbgColor);box-shadow:3px 3px 3px transparent}.ifacebadge>img{float:right;margin-left:.3rem}img.cbi-image-button{vertical-align:middle}fieldset.cbi-section{border:var(--sectionBorder);margin-bottom:20px;border-radius:10px;margin-top:5px}.cbi-input-textarea,textarea{color:var(--inputtextColor);padding:10px;line-height:normal;border:var(--sectionBorder);background-color:var(--inputbgColor);transition:color 150ms ease,border-color 150ms ease,opacity 150ms ease;-webkit-transition:color 150ms ease,border-color 150ms ease,opacity 150ms ease;outline-style:none;vertical-align:baseline;border-radius:10px;font-family:Menlo,Mono;font-size:.9rem;white-space:pre;margin-bottom:5px}#syslog{width:100%;min-height:15rem;padding:10px;margin-bottom:20px;border-radius:0;background-color:var(--sectionbgColor);border:none}#wan4_i,#wan6_i{width:50px!important}.uci-change-list{font-family:monospace}.uci-change-list *:first-child{border-top-left-radius:5px;border-top-right-radius:5px}.uci-change-list *:nth-last-child(2){border-bottom-left-radius:5px;border-bottom-right-radius:5px}.uci-change-list ins,.uci-change-legend-label ins{text-decoration:none;border:1px solid #0f0;background-color:#cfc;display:block;padding:2px;color:#000;overflow-x:auto}.uci-change-legend .uci-change-legend-label ins{overflow-x:unset;border-radius:var(--commonRadius1)}.uci-change-list del,.uci-change-legend-label del{text-decoration:none;border:1px solid red;background-color:#fcc;display:block;font-style:normal;padding:2px;color:#000;overflow-x:auto}.uci-change-legend .uci-change-legend-label del{overflow-x:unset;border-radius:var(--commonRadius1)}.uci-change-list var,.uci-change-legend-label var{text-decoration:none;border:1px solid #ccc;background-color:#eee;display:block;font-style:normal;padding:2px;color:#000;overflow-x:auto}.uci-change-legend .uci-change-legend-label var{overflow-x:unset;border-radius:var(--commonRadius1)}.uci-change-list var ins,.uci-change-list var del{border:none;white-space:pre;font-style:normal;padding:0;color:#000;overflow-x:auto}.uci-change-legend{padding:5px}.uci-change-legend-label{width:150px;float:left;display:flex;align-items:center}.uci-change-legend-label>ins,.uci-change-legend-label>del,.uci-change-legend-label>var{float:left;margin-right:4px;width:10px;height:10px;display:block}.uci-change-legend-label var ins,.uci-change-legend-label var del{border:none;height:10px;width:10px}.uci-change-list var,.uci-change-list del,.uci-change-list ins{padding:.5rem}#iwsvg,#iwsvg2,#bwsvg{border:var(--sectionBorder)!important;font-family:-apple-system;background:0 0!important}.ifacebox{border:var(--ifaceboxBorderColor) 1px solid;border-radius:var(--commonRadius1);font-size:.92rem;font-weight:400}.ifacebox-head{color:#fff}.ifacebox-body small{font-size:.8rem!important;padding:5px}.ifacebox-body strong{color:#f7f7f7;font-size:0!important}.cbi-image-button{}.zonebadge>.ifacebadge{padding:3px 5px;margin:5px}.zonebadge>input[type=text]{padding:.16rem 1rem;min-width:10rem;margin-top:.3rem}.cbi-value-field .cbi-input-checkbox,.cbi-value-field .cbi-input-radio{vertical-align:middle}.cbi-section-table-row>.cbi-value-field .cbi-input-select{min-width:7rem}.cbi-section-create{padding:0 10px}.cbi-section-create>.cbi-button-add{margin:10px 0}div.cbi-value var,td.cbi-value-field var{font-style:italic;color:#0069d6}small{font-size:small;font-weight:400!important;white-space:normal}.cbi-button-up,.cbi-button-down{display:inline-block;min-width:0;font-size:.9rem}.cbi-optionals{padding:1rem 1rem 0;border-top:1px solid #ccc}#diag-rc-output>pre{display:block;padding:10px;line-height:1.5rem;-moz-border-radius:3px;white-space:pre-wrap;word-wrap:break-word;color:#76838f}input[name=ping],input[name=traceroute],input[name=nslookup]{width:80%}table.cbi-section-table select{width:auto!important}header>.container>.pull-right>*{}#xhr_poll_status>.label.success{padding:.7rem 0;border-radius:20px}#xhr_poll_status_off{padding:.7rem 0;border-radius:20px}.label{padding:0 3px;white-space:nowrap;border-radius:3px;position:absolute;right:5px;top:15px;line-height:150%}.notice{color:var(--activeColor);font-size:.8rem;padding-right:.5rem;border-radius:10px;z-index:10;font-size:1.8rem;font-family:design}#refresh_on,#refresh_off{font-size:1.5rem;font-family:design}#refresh_on{color:var(--activeColor)}#refresh_off{color:var(--progressbarColor)}.darkMask{width:100%;height:100%;position:fixed;background-color:rgba(0,0,0,.56);content:"";z-index:99;display:none}.node-services-shadowsocksr .cbi-input-textarea,.node-nlbw-config .cbi-input-textarea{}.node-services-shadowsocksr #cbi-logview .cbi-section{padding:0}.node-network-diagnostics .cbi-section{border-radius:10px}.node-status-processes>.main table tr td:nth-child(3){white-space:normal}.cbi-map fieldset h3{}.cbi-map fieldset ul li{margin-right:0!important}.node-system-reboot>.main>.main-right p,.node-system-reboot>.main>.main-right h3{margin-left:12px}.node-system-reboot #maincontent{}.node-services-samba>.main .cbi-tabcontainer:nth-child(3) .cbi-value-title{margin-bottom:1rem}.node-services-samba>.main .cbi-tabcontainer:nth-child(3) .cbi-value-field{display:list-item}.node-services-samba>.main .cbi-tabcontainer:nth-child(3) .cbi-value-description{padding-top:1rem;line-height:150%}.node-system-packages>.main table tr td:nth-child(1){width:auto!important}.node-system-packages .cbi-section-node .cbi-value-last{}.node-system-packages .cbi-section-node .cbi-value-last>div{border:none!important;border-radius:3px}.node-system-packages .cbi-section-node .cbi-value-last>div>div{border:none!important;border-radius:3px}.node-system-packages .cbi-section-node .cbi-value-last:nth-last-child(1){padding:auto}.node-system-packages>.main table tr td:nth-last-child(1){white-space:normal;font-size:small;color:#76838f}.node-system-packages>.main .cbi-value>pre{padding:10px;overflow:auto;border-radius:10px}.node-system-packages #cbi-distfeedconf .cbi-section,.node-system-packages #cbi-customfeedconf .cbi-section{border-radius:10px}.node-system-packages .cbi-value-field{width:58%}#container\.nlbw\.traffic,#container\.nlbw\.layer7,#container\.nlbw\.ipv6,#container\.nlbw\.export{margin-top:0;margin-top:0;padding:10px;text-align:center;border-bottom:var(--sectionBorder);border-left:var(--sectionBorder);border-right:var(--sectionBorder);background-color:var(--sectionbgColor);border-radius:10px}#container\.nlbw\.export ul li{padding:5px;width:150px;margin:10px;border-radius:var(--commonRadius1);border:#ccc 1px solid}.cbi-tabmenu+.cbi-section ul{text-align:left}.node-network-firewall>.main .cbi-section-table-row>.cbi-value-field .cbi-input-select{min-width:4rem}.node-status-iptables>.main div>.cbi-map>form{position:static!important;margin:10px 0 20px;padding:12px;border:0;font-weight:400;font-style:normal;line-height:1;font-family:inherit;min-width:inherit;overflow-x:auto;overflow-y:hidden;box-shadow:3px 3px 3px transparent;border-radius:10px;background-color:var(--bgwhite);-webkit-overflow-scrolling:touch}.node-system-flashops fieldset fieldset{border:none}.node-system-flashops br{display:none}.node-system-flashops .cbi-section{}.node-system-flashops .cbi-section-descr{padding:12px;line-height:1.5;border-radius:6px}.node-status-iptables .cbi-tabmenu,.node-system-packages .cbi-tabmenu,.node-system-flashops .cbi-tabmenu{}#cbi-firewall-redirect .cbi-section-table-titles .cbi-section-table-cell{text-align:left}#cbi-firewall-redirect table *,#cbi-network-switch_vlan table *,#cbi-firewall-zone table *{font-size:small}#cbi-firewall-redirect table input[type=text],#cbi-network-switch_vlan table input[type=text],#cbi-firewall-zone table input[type=text]{width:5rem}#cbi-firewall-redirect table select,#cbi-network-switch_vlan table select,#cbi-firewall-zone table select{min-width:3.5rem}.node-status-realtime table>tbody>tr>td{text-align:left!important;padding:10px 3px}.node-status-realtime table[id=connections]>tbody>tr>td{padding:10px 3px;text-align:center!important}.node-status-realtime table{table-layout:auto!important}.node-status-realtime fieldset[id=cbi-table-table]{background-color:unset!important}.node-status-realtime fieldset[id=cbi-table-table]>table>tbody>tr:nth-of-type(odd),.node-status-realtime fieldset[id=cbi-table-table] table[id=connections] tr.cbi-section-table-row.cbi-rowstyle-2{background-color:unset}.node-services-appfilter .cbi-section.cbi-tblsection,.node-nas-fileassistant #list-content,.node-status-realtime fieldset[id=cbi-table-table] .cbi-section-node{overflow:auto}select#cbi\.combobox\.cbid\.shadowsocksr\.cfg013fd6\.tunnel_forward{overflow:hidden}body.lang_pl.node-main-login .cbi-value-title{width:12rem}#detail-bubble{width:unset!important}#detail-bubble.in{color:#000;padding-bottom:calc(60px + env(safe-area-inset-bottom));left:19rem!important;width:calc(100vw - 21.25rem)!important}#detail-bubble .head{display:block;overflow:auto}#detail-bubble #bubble-table{display:inline-table;overflow:auto}@media screen and (max-width:1280px){header{}header>.container{}.main{height:calc(100% - 3.5rem)}.main-left{width:calc(0% + 18rem);top:50px}.main-right{width:calc(100% - 18rem)}table{font-size:.9rem!important;width:100%!important}.main>.main-left>.nav>li,.main>.main-left>.nav>li a,.main>.main-left>.nav>.slide>.menu{font-size:1.1rem}.main>.main-left>.nav>.slide>.slide-menu>li>a{font-size:1rem;text-transform:capitalize}img[src*="/luci-static/resources/cbi/add.gif"]{right:55px;display:block;position:absolute;margin-top:-34px}img[src*="/luci-static/resources/cbi/remove.gif"]{right:55px;display:block;position:absolute;margin-top:-34px}img[src*="/luci-static/resources/cbi/reload.gif"]{right:55px;display:block;position:absolute;margin-top:-34px}#detail-bubble{width:unset!important}#detail-bubble.in{color:#000;padding-bottom:calc(60px + env(safe-area-inset-bottom));left:19rem!important;width:calc(100vw - 21.25rem)!important}#detail-bubble .head{display:block;overflow:auto}#detail-bubble #bubble-table{display:inline-table;overflow:auto}.node-nlbw-usage table{display:block;overflow:auto}#container\.nlbw\.traffic table,#container\.nlbw\.layer7 table,#container\.nlbw\.ipv6 table,#container\.nlbw\.export table{display:block;overflow:auto}}@media screen and (max-width:992px){.main-left{width:0;position:fixed;z-index:100}.main-right{width:100%}.showSide{margin:0;padding:0;display:inline-block;position:absolute;width:18.75rem;height:2.8125rem;padding:1.15rem 2rem;z-index:100}.showSide:before{content:"\e20e";font-size:1.7rem}#maincontent>.container{margin:20px}.node-main-login .showSide{display:none!important}.cbi-value-title{width:35%}.node-network-diagnostics>.main .cbi-map fieldset>div *{width:100%!important}.node-network-diagnostics>.main .cbi-map fieldset>div input[type=text]{}.node-network-diagnostics>.main .cbi-map fieldset>div:nth-child(4) input[type=text]{margin:0!important}.node-network-diagnostics>.main .cbi-map fieldset>div select,.node-network-diagnostics>.main .cbi-map fieldset>div input[type=button]{margin:1rem 0 0}.node-network-diagnostics>.main .cbi-map fieldset>div{width:100%!important}.node-main-login>.main .cbi-value-title{text-align:left}img[src*="/luci-static/resources/cbi/add.gif"]{right:45px;display:block;position:absolute;margin-top:-34px}img[src*="/luci-static/resources/cbi/remove.gif"]{right:45px;display:block;position:absolute;margin-top:-34px}img[src*="/luci-static/resources/cbi/reload.gif"]{right:45px;display:block;position:absolute;margin-top:-34px}#detail-bubble{left:unset!important;width:unset!important}#detail-bubble.in{color:#000;padding-bottom:calc(60px + env(safe-area-inset-bottom));left:unset!important;width:calc(100vw)!important}#detail-bubble .head{display:block;overflow:auto}#detail-bubble #bubble-table{display:inline-table;overflow:auto}header{box-shadow:0 2px 4px rgba(0,0,0,.08)}}@media screen and (max-width:700px){#cbi-vssr-servers .cbi-button-add{position:static!important;width:auto!important;height:2rem!important;line-height:2rem!important;color:#fff;display:block;padding:0!important;font-size:.92rem;border-radius:10px!important;box-shadow:none;background-image:none}#cbi-vssr-servers .cbi-section-table-row{margin:10px 0!important}#cbi-vssr-servers .p-in5{padding-bottom:10px!important;margin:0!important}#cbi-vssr-servers .cbi-page-actions{padding-bottom:10px!important}#maincontent>.container{margin:20px}#detail-bubble{left:unset!important;width:unset!important}#detail-bubble.in{color:#000;padding-bottom:calc(60px + env(safe-area-inset-bottom));left:unset!important;width:calc(100vw)!important}#detail-bubble .head{display:block;overflow:auto}#detail-bubble #bubble-table{display:inline-table;overflow:auto}}@media screen and (max-width:470px){#detail-bubble{left:unset!important;width:unset!important}#detail-bubble.in{color:#000;padding-bottom:calc(60px + env(safe-area-inset-bottom));left:unset!important;width:calc(100vw)!important}#detail-bubble .head{display:block;overflow:auto}#detail-bubble #bubble-table{display:block;overflow:auto}.main-right>#maincontent{overflow:auto}div [id*=cbi-network-] [id*=-__status] table td,div [id*=cbi-wireless] [id*=-__status] table td{white-space:normal}.node-system-leds .cbi-section em,.node-network-network #cbi-network .cbi-map .cbi-section-table cbi-section-table-row,.node-network-network #cbi-network .cbi-map .cbi-section-table td{display:block}.node-network-network #cbi-network .cbi-map .cbi-section-table td{width:100%!important;text-align:center!important;white-space:normal}.node-network-network #cbi-network .cbi-map .cbi-button{min-width:60px!important}.node-network-network .cbi-section-table .cbi-section-table-titles .cbi-section-table-cell{flex:1!important}.node-network-network .cbi-section-table .cbi-section-table-titles th:nth-child(2){text-align:center!important}.node-network-network .cbi-section-table .cbi-section-table-titles{display:flex}.node-network-wireless fieldset:nth-child(1) table>tbody>tr>td,.node-network-wireless fieldset:nth-child(2) table>tbody>tr>td{white-space:normal}}@media screen and (max-width:370px){fieldset{}select{width:100%}header{height:55px}h3{padding:0 10px 10px}.showSide{height:45px}#maincontent>.container{margin:20px}.main{top:45px}.main-left{top:45px}.main>.main-left>.nav>.slide>.menu{}.main>.main-left>.nav>.slide>.slide-menu>li>a{}.cbi-value{margin-bottom:20px;display:table;padding:0;border-bottom:none}.cbi-value-title{width:100%;font-weight:700;float:left;padding:0;margin:0;margin-bottom:.25rem}.cbi-section-node{padding:10px!important}.cbi-value-description{width:100%;display:block}.cbi-value>.cbi-value-field{display:block;float:left;width:100%}img[src*="/luci-static/resources/cbi/add.gif"]{right:45px;display:block;position:absolute;margin-top:-34px}img[src*="/luci-static/resources/cbi/remove.gif"]{right:45px;display:block;position:absolute;margin-top:-34px}img[src*="/luci-static/resources/cbi/reload.gif"]{right:45px;display:block;position:absolute;margin-top:-34px}.cbi-section-node>.cbi-value:nth-of-type(2n){background-color:var(--sectionbgColor)}.cbi-tabcontainer>.cbi-value:nth-of-type(2n){background-color:var(--sectionbgColor)}div>.cbi-value:nth-of-type(2n){background-color:var(--sectionbgColor)}.node-main-login>.main .cbi-value{padding:0}.node-main-login>.main form>div:nth-last-child(1){margin-top:2rem}.node-main-login>.main fieldset{margin:0;padding:.5rem}#container\.network\.lan\.physical .cbi-value-title,#cbi-network-1-_ifname .cbi-value-title{width:35%}#cbi-network-1-_ifname .cbi-value-field{width:65%}h2{font-size:1.2rem;text-transform:capitalize}select,input{}input[type=checkbox]{height:1.2rem!important;width:1.2rem!important}#swaptotal div div small,#swapfree div div small,#swapcache div div small,#memfree div div small,#membuff div div small,#conns div div small,#memcache div div small,#memtotal div div small{}#swaptotal div div,#swapfree div div,#swapcache div div,#memfree div div,#membuff div div,#conns div div,#memcache div div,#memtotal div div{}.node-status-iptables>.main div>.cbi-map>form input[type=submit]{margin:0}#cbi-samba-cfg010f89-_tmpl .cbi-value-title{width:15%}#cbi-samba-cfg010f89-_tmpl .cbi-value-field{width:95%}#detail-bubble{left:unset!important;width:unset!important}#detail-bubble.in{color:#000;padding-bottom:calc(60px + env(safe-area-inset-bottom));left:unset!important;width:calc(100vw)!important}#detail-bubble .head{display:block;overflow:auto}#detail-bubble #bubble-table{display:block;overflow:auto}}@media screen and (max-width:315px){.label{position:absolute;right:5px;top:-70px}}#intervalSelect{height:40px!important}.commandbox div{position:unset!important}#cbi-netspeedtest-homebox-{display:unset!important}.node-status-realtime .container{overflow:auto}.node-network-network div[onclick*="document.getElementById('cbid.network."],#cbi-network div[onclick*="document.getElementById('cbid.network."]{background-color:unset!important}form[action="/cgi-bin/luci/admin/network/wireless"] input[class="cbi-button cbi-button-reset"],form[action="/cgi-bin/luci/admin/network/wireless_join"] input[class="cbi-button cbi-input-find"]{height:25px;min-width:80px}.node-services-aliyundrive-webdav #mask-box{background:transparent}.node-services-ddns #cbi-ddns-service input{width:unset}.node-services-ddns .cbi-value input[type=password],.node-services-ddns .cbi-value input[type=text]{width:100%!important}.fb-container .cbi-button{border-radius:var(--commonRadius0);margin:3px 3px 3px 0;height:unset!important}.node-system-commands h3{text-transform:unset}.node-system-commands .commandbox{width:auto;display:inline-block;float:none}.node-system-commands .commandbox p{word-break:keep-all;white-space:nowrap}.node-system-commands div.cbi-map fieldset.cbi-section{align-items:center;text-align:center}.node-system-commands #cbi-luci.cbi-map fieldset.cbi-section{align-items:unset;text-align:unset}.node-network-network .ifacebox strong{color:var(--ifaceboxFontColor);padding:5px}.node-network-firewall .zonebadge strong,.node-network-firewall label strong{color:var(--ifaceboxFontColor)}.node-services-openclash ul li.selected{background-color:var(--liSelectedColor)!important}.node-services-openclash .cbi-button-reset,.node-services-openclash .cbi-input-remove{max-width:unset!important}.node-services-openclash #tab-header ul li.selected,.node-services-openclash #tab-header ul li{color:#000!important;background-color:unset!important}.node-nas-qbittorrent p#qBittorrent_status input{line-height:unset}.node-system-diskman.dialog-format-active #dialog_format .dialog_box{background:var(--alertBackground);border-radius:var(--commonRadius1)}.node-services-watchcat-plus select[id*="cbi.opt.watchcat"]{width:auto}.node-nas-fileassistant .fb-container .cbi-value-owner,.node-nas-fileassistant .fb-container .cbi-value-perm{display:table-cell}.node-services-adguardhome input[onclick*="window.open('http://'+window.location.hostname+':"]{line-height:0} diff --git a/luci-theme-design/htdocs/luci-static/design/favicon.ico b/luci-theme-design/htdocs/luci-static/design/favicon.ico new file mode 100644 index 00000000..e65f2031 Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/favicon.ico differ diff --git a/luci-theme-design/htdocs/luci-static/design/fonts/GenJyuuGothic-Medium.otf b/luci-theme-design/htdocs/luci-static/design/fonts/GenJyuuGothic-Medium.otf new file mode 100644 index 00000000..916b4a11 Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/fonts/GenJyuuGothic-Medium.otf differ diff --git a/luci-theme-design/htdocs/luci-static/design/fonts/font.eot b/luci-theme-design/htdocs/luci-static/design/fonts/font.eot new file mode 100644 index 00000000..9e6ffc9b Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/fonts/font.eot differ diff --git a/luci-theme-design/htdocs/luci-static/design/fonts/font.svg b/luci-theme-design/htdocs/luci-static/design/fonts/font.svg new file mode 100644 index 00000000..d38d057d --- /dev/null +++ b/luci-theme-design/htdocs/luci-static/design/fonts/font.svg @@ -0,0 +1,16 @@ + + + +Generated by IcoMoon + + + + + + + + + + + + \ No newline at end of file diff --git a/luci-theme-design/htdocs/luci-static/design/fonts/font.ttf b/luci-theme-design/htdocs/luci-static/design/fonts/font.ttf new file mode 100644 index 00000000..84669323 Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/fonts/font.ttf differ diff --git a/luci-theme-design/htdocs/luci-static/design/fonts/font.woff b/luci-theme-design/htdocs/luci-static/design/fonts/font.woff new file mode 100644 index 00000000..00cf84ea Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/fonts/font.woff differ diff --git a/luci-theme-design/htdocs/luci-static/design/fonts/iconfont-Regular.ttf b/luci-theme-design/htdocs/luci-static/design/fonts/iconfont-Regular.ttf new file mode 100644 index 00000000..033794e5 Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/fonts/iconfont-Regular.ttf differ diff --git a/luci-theme-design/htdocs/luci-static/design/fonts/iconfont-Regular.woff b/luci-theme-design/htdocs/luci-static/design/fonts/iconfont-Regular.woff new file mode 100644 index 00000000..45714f9e Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/fonts/iconfont-Regular.woff differ diff --git a/luci-theme-design/htdocs/luci-static/design/fonts/iconfont-Regular.woff2 b/luci-theme-design/htdocs/luci-static/design/fonts/iconfont-Regular.woff2 new file mode 100644 index 00000000..1de5ca50 Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/fonts/iconfont-Regular.woff2 differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/add.png b/luci-theme-design/htdocs/luci-static/design/images/add.png new file mode 100644 index 00000000..c85ee10a Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/add.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/apple-touch-icon.png b/luci-theme-design/htdocs/luci-static/design/images/apple-touch-icon.png new file mode 100644 index 00000000..1baa5c7e Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/apple-touch-icon.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/bridge.png b/luci-theme-design/htdocs/luci-static/design/images/bridge.png new file mode 100644 index 00000000..cd0ce109 Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/bridge.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/bridge_disabled.png b/luci-theme-design/htdocs/luci-static/design/images/bridge_disabled.png new file mode 100644 index 00000000..c603b970 Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/bridge_disabled.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/ethernet.png b/luci-theme-design/htdocs/luci-static/design/images/ethernet.png new file mode 100644 index 00000000..eae05cc5 Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/ethernet.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/ethernet_disabled.png b/luci-theme-design/htdocs/luci-static/design/images/ethernet_disabled.png new file mode 100644 index 00000000..66246809 Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/ethernet_disabled.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/home.png b/luci-theme-design/htdocs/luci-static/design/images/home.png new file mode 100644 index 00000000..c8e900a9 Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/home.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/icon.png b/luci-theme-design/htdocs/luci-static/design/images/icon.png new file mode 100644 index 00000000..c98e8883 Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/icon.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/link.png b/luci-theme-design/htdocs/luci-static/design/images/link.png new file mode 100644 index 00000000..e5307d9b Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/link.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/loading.gif b/luci-theme-design/htdocs/luci-static/design/images/loading.gif new file mode 100644 index 00000000..a84d1cac Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/loading.gif differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/openclash.png b/luci-theme-design/htdocs/luci-static/design/images/openclash.png new file mode 100644 index 00000000..8aed32ab Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/openclash.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/port_down.png b/luci-theme-design/htdocs/luci-static/design/images/port_down.png new file mode 100644 index 00000000..7e9edacb Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/port_down.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/port_up.png b/luci-theme-design/htdocs/luci-static/design/images/port_up.png new file mode 100644 index 00000000..2cca1be8 Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/port_up.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/rank.png b/luci-theme-design/htdocs/luci-static/design/images/rank.png new file mode 100644 index 00000000..eccc5c10 Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/rank.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/reload.png b/luci-theme-design/htdocs/luci-static/design/images/reload.png new file mode 100644 index 00000000..192b9add Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/reload.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/remove.png b/luci-theme-design/htdocs/luci-static/design/images/remove.png new file mode 100644 index 00000000..fce54d92 Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/remove.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/signal-0-25.png b/luci-theme-design/htdocs/luci-static/design/images/signal-0-25.png new file mode 100644 index 00000000..00eaf3d4 Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/signal-0-25.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/signal-0.png b/luci-theme-design/htdocs/luci-static/design/images/signal-0.png new file mode 100644 index 00000000..a24d883c Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/signal-0.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/signal-25-50.png b/luci-theme-design/htdocs/luci-static/design/images/signal-25-50.png new file mode 100644 index 00000000..ab12b5ef Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/signal-25-50.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/signal-50-75.png b/luci-theme-design/htdocs/luci-static/design/images/signal-50-75.png new file mode 100644 index 00000000..0329cc65 Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/signal-50-75.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/signal-75-100.png b/luci-theme-design/htdocs/luci-static/design/images/signal-75-100.png new file mode 100644 index 00000000..d033ab1c Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/signal-75-100.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/signal-none.png b/luci-theme-design/htdocs/luci-static/design/images/signal-none.png new file mode 100644 index 00000000..a03e99b7 Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/signal-none.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/ssr.png b/luci-theme-design/htdocs/luci-static/design/images/ssr.png new file mode 100644 index 00000000..ee9dfd71 Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/ssr.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/switch.png b/luci-theme-design/htdocs/luci-static/design/images/switch.png new file mode 100644 index 00000000..ade12a53 Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/switch.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/switch_disabled.png b/luci-theme-design/htdocs/luci-static/design/images/switch_disabled.png new file mode 100644 index 00000000..346d7527 Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/switch_disabled.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/tunnel.png b/luci-theme-design/htdocs/luci-static/design/images/tunnel.png new file mode 100644 index 00000000..b5ff65a6 Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/tunnel.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/tunnel_disabled.png b/luci-theme-design/htdocs/luci-static/design/images/tunnel_disabled.png new file mode 100644 index 00000000..ae4a60bb Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/tunnel_disabled.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/user.png b/luci-theme-design/htdocs/luci-static/design/images/user.png new file mode 100644 index 00000000..a0ffe2b4 Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/user.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/vlan.png b/luci-theme-design/htdocs/luci-static/design/images/vlan.png new file mode 100644 index 00000000..5df3667c Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/vlan.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/vlan_disabled.png b/luci-theme-design/htdocs/luci-static/design/images/vlan_disabled.png new file mode 100644 index 00000000..c0cef94f Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/vlan_disabled.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/wifi.png b/luci-theme-design/htdocs/luci-static/design/images/wifi.png new file mode 100644 index 00000000..4897d4a0 Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/wifi.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/wifi_big.png b/luci-theme-design/htdocs/luci-static/design/images/wifi_big.png new file mode 100644 index 00000000..f63c29ac Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/wifi_big.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/wifi_big_disabled.png b/luci-theme-design/htdocs/luci-static/design/images/wifi_big_disabled.png new file mode 100644 index 00000000..c0556b9a Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/wifi_big_disabled.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/images/wifi_disabled.png b/luci-theme-design/htdocs/luci-static/design/images/wifi_disabled.png new file mode 100644 index 00000000..b511e9bc Binary files /dev/null and b/luci-theme-design/htdocs/luci-static/design/images/wifi_disabled.png differ diff --git a/luci-theme-design/htdocs/luci-static/design/js/design.js b/luci-theme-design/htdocs/luci-static/design/js/design.js new file mode 100644 index 00000000..3bf754f2 --- /dev/null +++ b/luci-theme-design/htdocs/luci-static/design/js/design.js @@ -0,0 +1,69 @@ +XHR=function() +{this.reinit=function() +{if(window.XMLHttpRequest){this._xmlHttp=new XMLHttpRequest();} +else if(window.ActiveXObject){this._xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");} +else{alert("xhr.js: XMLHttpRequest is not supported by this browser!");}} +this.busy=function(){if(!this._xmlHttp) +return false;switch(this._xmlHttp.readyState) +{case 1:case 2:case 3:return true;default:return false;}} +this.abort=function(){if(this.busy()) +this._xmlHttp.abort();} +this.get=function(url,data,callback) +{this.reinit();var xhr=this._xmlHttp;var code=this._encode(data);url=location.protocol+'//'+location.host+url;if(code) +if(url.substr(url.length-1,1)=='&') +url+=code;else +url+='?'+code;xhr.open('GET',url,true);xhr.onreadystatechange=function() +{if(xhr.readyState==4){var json=null;if(xhr.getResponseHeader("Content-Type")=="application/json"){try{json=eval('('+xhr.responseText+')');} +catch(e){json=null;}} +callback(xhr,json);}} +xhr.send(null);} +this.post=function(url,data,callback) +{this.reinit();var xhr=this._xmlHttp;var code=this._encode(data);xhr.onreadystatechange=function() +{if(xhr.readyState==4) +callback(xhr);} +xhr.open('POST',url,true);xhr.setRequestHeader('Content-type','application/x-www-form-urlencoded');xhr.send(code);} +this.cancel=function() +{this._xmlHttp.onreadystatechange=function(){};this._xmlHttp.abort();} +this.send_form=function(form,callback,extra_values) +{var code='';for(var i=0;i');}}}} +$(document).ready(()=>{settingsStatusRealtimeOverflow();});})(jQuery); diff --git a/luci-theme-design/htdocs/luci-static/design/js/jquery.min.js b/luci-theme-design/htdocs/luci-static/design/js/jquery.min.js new file mode 100644 index 00000000..fde87142 --- /dev/null +++ b/luci-theme-design/htdocs/luci-static/design/js/jquery.min.js @@ -0,0 +1,2 @@ +/*! jQuery v3.6.4 | (c) OpenJS Foundation and other contributors | jquery.org/license */ +!function(e,t){"use strict";"object"==typeof module&&"object"==typeof module.exports?module.exports=e.document?t(e,!0):function(e){if(!e.document)throw new Error("jQuery requires a window with a document");return t(e)}:t(e)}("undefined"!=typeof window?window:this,function(C,e){"use strict";var t=[],r=Object.getPrototypeOf,s=t.slice,g=t.flat?function(e){return t.flat.call(e)}:function(e){return t.concat.apply([],e)},u=t.push,i=t.indexOf,n={},o=n.toString,y=n.hasOwnProperty,a=y.toString,l=a.call(Object),v={},m=function(e){return"function"==typeof e&&"number"!=typeof e.nodeType&&"function"!=typeof e.item},x=function(e){return null!=e&&e===e.window},E=C.document,c={type:!0,src:!0,nonce:!0,noModule:!0};function b(e,t,n){var r,i,o=(n=n||E).createElement("script");if(o.text=e,t)for(r in c)(i=t[r]||t.getAttribute&&t.getAttribute(r))&&o.setAttribute(r,i);n.head.appendChild(o).parentNode.removeChild(o)}function w(e){return null==e?e+"":"object"==typeof e||"function"==typeof e?n[o.call(e)]||"object":typeof e}var f="3.6.4",S=function(e,t){return new S.fn.init(e,t)};function p(e){var t=!!e&&"length"in e&&e.length,n=w(e);return!m(e)&&!x(e)&&("array"===n||0===t||"number"==typeof t&&0+~]|"+M+")"+M+"*"),U=new RegExp(M+"|>"),X=new RegExp(F),V=new RegExp("^"+I+"$"),G={ID:new RegExp("^#("+I+")"),CLASS:new RegExp("^\\.("+I+")"),TAG:new RegExp("^("+I+"|[*])"),ATTR:new RegExp("^"+W),PSEUDO:new RegExp("^"+F),CHILD:new RegExp("^:(only|first|last|nth|nth-last)-(child|of-type)(?:\\("+M+"*(even|odd|(([+-]|)(\\d*)n|)"+M+"*(?:([+-]|)"+M+"*(\\d+)|))"+M+"*\\)|)","i"),bool:new RegExp("^(?:"+R+")$","i"),needsContext:new RegExp("^"+M+"*[>+~]|:(even|odd|eq|gt|lt|nth|first|last)(?:\\("+M+"*((?:-\\d)?\\d*)"+M+"*\\)|)(?=[^-]|$)","i")},Y=/HTML$/i,Q=/^(?:input|select|textarea|button)$/i,J=/^h\d$/i,K=/^[^{]+\{\s*\[native \w/,Z=/^(?:#([\w-]+)|(\w+)|\.([\w-]+))$/,ee=/[+~]/,te=new RegExp("\\\\[\\da-fA-F]{1,6}"+M+"?|\\\\([^\\r\\n\\f])","g"),ne=function(e,t){var n="0x"+e.slice(1)-65536;return t||(n<0?String.fromCharCode(n+65536):String.fromCharCode(n>>10|55296,1023&n|56320))},re=/([\0-\x1f\x7f]|^-?\d)|^-$|[^\0-\x1f\x7f-\uFFFF\w-]/g,ie=function(e,t){return t?"\0"===e?"\ufffd":e.slice(0,-1)+"\\"+e.charCodeAt(e.length-1).toString(16)+" ":"\\"+e},oe=function(){T()},ae=be(function(e){return!0===e.disabled&&"fieldset"===e.nodeName.toLowerCase()},{dir:"parentNode",next:"legend"});try{H.apply(t=O.call(p.childNodes),p.childNodes),t[p.childNodes.length].nodeType}catch(e){H={apply:t.length?function(e,t){L.apply(e,O.call(t))}:function(e,t){var n=e.length,r=0;while(e[n++]=t[r++]);e.length=n-1}}}function se(t,e,n,r){var i,o,a,s,u,l,c,f=e&&e.ownerDocument,p=e?e.nodeType:9;if(n=n||[],"string"!=typeof t||!t||1!==p&&9!==p&&11!==p)return n;if(!r&&(T(e),e=e||C,E)){if(11!==p&&(u=Z.exec(t)))if(i=u[1]){if(9===p){if(!(a=e.getElementById(i)))return n;if(a.id===i)return n.push(a),n}else if(f&&(a=f.getElementById(i))&&v(e,a)&&a.id===i)return n.push(a),n}else{if(u[2])return H.apply(n,e.getElementsByTagName(t)),n;if((i=u[3])&&d.getElementsByClassName&&e.getElementsByClassName)return H.apply(n,e.getElementsByClassName(i)),n}if(d.qsa&&!N[t+" "]&&(!y||!y.test(t))&&(1!==p||"object"!==e.nodeName.toLowerCase())){if(c=t,f=e,1===p&&(U.test(t)||z.test(t))){(f=ee.test(t)&&ve(e.parentNode)||e)===e&&d.scope||((s=e.getAttribute("id"))?s=s.replace(re,ie):e.setAttribute("id",s=S)),o=(l=h(t)).length;while(o--)l[o]=(s?"#"+s:":scope")+" "+xe(l[o]);c=l.join(",")}try{return H.apply(n,f.querySelectorAll(c)),n}catch(e){N(t,!0)}finally{s===S&&e.removeAttribute("id")}}}return g(t.replace(B,"$1"),e,n,r)}function ue(){var r=[];return function e(t,n){return r.push(t+" ")>b.cacheLength&&delete e[r.shift()],e[t+" "]=n}}function le(e){return e[S]=!0,e}function ce(e){var t=C.createElement("fieldset");try{return!!e(t)}catch(e){return!1}finally{t.parentNode&&t.parentNode.removeChild(t),t=null}}function fe(e,t){var n=e.split("|"),r=n.length;while(r--)b.attrHandle[n[r]]=t}function pe(e,t){var n=t&&e,r=n&&1===e.nodeType&&1===t.nodeType&&e.sourceIndex-t.sourceIndex;if(r)return r;if(n)while(n=n.nextSibling)if(n===t)return-1;return e?1:-1}function de(t){return function(e){return"input"===e.nodeName.toLowerCase()&&e.type===t}}function he(n){return function(e){var t=e.nodeName.toLowerCase();return("input"===t||"button"===t)&&e.type===n}}function ge(t){return function(e){return"form"in e?e.parentNode&&!1===e.disabled?"label"in e?"label"in e.parentNode?e.parentNode.disabled===t:e.disabled===t:e.isDisabled===t||e.isDisabled!==!t&&ae(e)===t:e.disabled===t:"label"in e&&e.disabled===t}}function ye(a){return le(function(o){return o=+o,le(function(e,t){var n,r=a([],e.length,o),i=r.length;while(i--)e[n=r[i]]&&(e[n]=!(t[n]=e[n]))})})}function ve(e){return e&&"undefined"!=typeof e.getElementsByTagName&&e}for(e in d=se.support={},i=se.isXML=function(e){var t=e&&e.namespaceURI,n=e&&(e.ownerDocument||e).documentElement;return!Y.test(t||n&&n.nodeName||"HTML")},T=se.setDocument=function(e){var t,n,r=e?e.ownerDocument||e:p;return r!=C&&9===r.nodeType&&r.documentElement&&(a=(C=r).documentElement,E=!i(C),p!=C&&(n=C.defaultView)&&n.top!==n&&(n.addEventListener?n.addEventListener("unload",oe,!1):n.attachEvent&&n.attachEvent("onunload",oe)),d.scope=ce(function(e){return a.appendChild(e).appendChild(C.createElement("div")),"undefined"!=typeof e.querySelectorAll&&!e.querySelectorAll(":scope fieldset div").length}),d.cssHas=ce(function(){try{return C.querySelector(":has(*,:jqfake)"),!1}catch(e){return!0}}),d.attributes=ce(function(e){return e.className="i",!e.getAttribute("className")}),d.getElementsByTagName=ce(function(e){return e.appendChild(C.createComment("")),!e.getElementsByTagName("*").length}),d.getElementsByClassName=K.test(C.getElementsByClassName),d.getById=ce(function(e){return a.appendChild(e).id=S,!C.getElementsByName||!C.getElementsByName(S).length}),d.getById?(b.filter.ID=function(e){var t=e.replace(te,ne);return function(e){return e.getAttribute("id")===t}},b.find.ID=function(e,t){if("undefined"!=typeof t.getElementById&&E){var n=t.getElementById(e);return n?[n]:[]}}):(b.filter.ID=function(e){var n=e.replace(te,ne);return function(e){var t="undefined"!=typeof e.getAttributeNode&&e.getAttributeNode("id");return t&&t.value===n}},b.find.ID=function(e,t){if("undefined"!=typeof t.getElementById&&E){var n,r,i,o=t.getElementById(e);if(o){if((n=o.getAttributeNode("id"))&&n.value===e)return[o];i=t.getElementsByName(e),r=0;while(o=i[r++])if((n=o.getAttributeNode("id"))&&n.value===e)return[o]}return[]}}),b.find.TAG=d.getElementsByTagName?function(e,t){return"undefined"!=typeof t.getElementsByTagName?t.getElementsByTagName(e):d.qsa?t.querySelectorAll(e):void 0}:function(e,t){var n,r=[],i=0,o=t.getElementsByTagName(e);if("*"===e){while(n=o[i++])1===n.nodeType&&r.push(n);return r}return o},b.find.CLASS=d.getElementsByClassName&&function(e,t){if("undefined"!=typeof t.getElementsByClassName&&E)return t.getElementsByClassName(e)},s=[],y=[],(d.qsa=K.test(C.querySelectorAll))&&(ce(function(e){var t;a.appendChild(e).innerHTML="",e.querySelectorAll("[msallowcapture^='']").length&&y.push("[*^$]="+M+"*(?:''|\"\")"),e.querySelectorAll("[selected]").length||y.push("\\["+M+"*(?:value|"+R+")"),e.querySelectorAll("[id~="+S+"-]").length||y.push("~="),(t=C.createElement("input")).setAttribute("name",""),e.appendChild(t),e.querySelectorAll("[name='']").length||y.push("\\["+M+"*name"+M+"*="+M+"*(?:''|\"\")"),e.querySelectorAll(":checked").length||y.push(":checked"),e.querySelectorAll("a#"+S+"+*").length||y.push(".#.+[+~]"),e.querySelectorAll("\\\f"),y.push("[\\r\\n\\f]")}),ce(function(e){e.innerHTML="";var t=C.createElement("input");t.setAttribute("type","hidden"),e.appendChild(t).setAttribute("name","D"),e.querySelectorAll("[name=d]").length&&y.push("name"+M+"*[*^$|!~]?="),2!==e.querySelectorAll(":enabled").length&&y.push(":enabled",":disabled"),a.appendChild(e).disabled=!0,2!==e.querySelectorAll(":disabled").length&&y.push(":enabled",":disabled"),e.querySelectorAll("*,:x"),y.push(",.*:")})),(d.matchesSelector=K.test(c=a.matches||a.webkitMatchesSelector||a.mozMatchesSelector||a.oMatchesSelector||a.msMatchesSelector))&&ce(function(e){d.disconnectedMatch=c.call(e,"*"),c.call(e,"[s!='']:x"),s.push("!=",F)}),d.cssHas||y.push(":has"),y=y.length&&new RegExp(y.join("|")),s=s.length&&new RegExp(s.join("|")),t=K.test(a.compareDocumentPosition),v=t||K.test(a.contains)?function(e,t){var n=9===e.nodeType&&e.documentElement||e,r=t&&t.parentNode;return e===r||!(!r||1!==r.nodeType||!(n.contains?n.contains(r):e.compareDocumentPosition&&16&e.compareDocumentPosition(r)))}:function(e,t){if(t)while(t=t.parentNode)if(t===e)return!0;return!1},j=t?function(e,t){if(e===t)return l=!0,0;var n=!e.compareDocumentPosition-!t.compareDocumentPosition;return n||(1&(n=(e.ownerDocument||e)==(t.ownerDocument||t)?e.compareDocumentPosition(t):1)||!d.sortDetached&&t.compareDocumentPosition(e)===n?e==C||e.ownerDocument==p&&v(p,e)?-1:t==C||t.ownerDocument==p&&v(p,t)?1:u?P(u,e)-P(u,t):0:4&n?-1:1)}:function(e,t){if(e===t)return l=!0,0;var n,r=0,i=e.parentNode,o=t.parentNode,a=[e],s=[t];if(!i||!o)return e==C?-1:t==C?1:i?-1:o?1:u?P(u,e)-P(u,t):0;if(i===o)return pe(e,t);n=e;while(n=n.parentNode)a.unshift(n);n=t;while(n=n.parentNode)s.unshift(n);while(a[r]===s[r])r++;return r?pe(a[r],s[r]):a[r]==p?-1:s[r]==p?1:0}),C},se.matches=function(e,t){return se(e,null,null,t)},se.matchesSelector=function(e,t){if(T(e),d.matchesSelector&&E&&!N[t+" "]&&(!s||!s.test(t))&&(!y||!y.test(t)))try{var n=c.call(e,t);if(n||d.disconnectedMatch||e.document&&11!==e.document.nodeType)return n}catch(e){N(t,!0)}return 0":{dir:"parentNode",first:!0}," ":{dir:"parentNode"},"+":{dir:"previousSibling",first:!0},"~":{dir:"previousSibling"}},preFilter:{ATTR:function(e){return e[1]=e[1].replace(te,ne),e[3]=(e[3]||e[4]||e[5]||"").replace(te,ne),"~="===e[2]&&(e[3]=" "+e[3]+" "),e.slice(0,4)},CHILD:function(e){return e[1]=e[1].toLowerCase(),"nth"===e[1].slice(0,3)?(e[3]||se.error(e[0]),e[4]=+(e[4]?e[5]+(e[6]||1):2*("even"===e[3]||"odd"===e[3])),e[5]=+(e[7]+e[8]||"odd"===e[3])):e[3]&&se.error(e[0]),e},PSEUDO:function(e){var t,n=!e[6]&&e[2];return G.CHILD.test(e[0])?null:(e[3]?e[2]=e[4]||e[5]||"":n&&X.test(n)&&(t=h(n,!0))&&(t=n.indexOf(")",n.length-t)-n.length)&&(e[0]=e[0].slice(0,t),e[2]=n.slice(0,t)),e.slice(0,3))}},filter:{TAG:function(e){var t=e.replace(te,ne).toLowerCase();return"*"===e?function(){return!0}:function(e){return e.nodeName&&e.nodeName.toLowerCase()===t}},CLASS:function(e){var t=m[e+" "];return t||(t=new RegExp("(^|"+M+")"+e+"("+M+"|$)"))&&m(e,function(e){return t.test("string"==typeof e.className&&e.className||"undefined"!=typeof e.getAttribute&&e.getAttribute("class")||"")})},ATTR:function(n,r,i){return function(e){var t=se.attr(e,n);return null==t?"!="===r:!r||(t+="","="===r?t===i:"!="===r?t!==i:"^="===r?i&&0===t.indexOf(i):"*="===r?i&&-1:\x20\t\r\n\f]*)[\x20\t\r\n\f]*\/?>(?:<\/\1>|)$/i;function j(e,n,r){return m(n)?S.grep(e,function(e,t){return!!n.call(e,t,e)!==r}):n.nodeType?S.grep(e,function(e){return e===n!==r}):"string"!=typeof n?S.grep(e,function(e){return-1)[^>]*|#([\w-]+))$/;(S.fn.init=function(e,t,n){var r,i;if(!e)return this;if(n=n||D,"string"==typeof e){if(!(r="<"===e[0]&&">"===e[e.length-1]&&3<=e.length?[null,e,null]:q.exec(e))||!r[1]&&t)return!t||t.jquery?(t||n).find(e):this.constructor(t).find(e);if(r[1]){if(t=t instanceof S?t[0]:t,S.merge(this,S.parseHTML(r[1],t&&t.nodeType?t.ownerDocument||t:E,!0)),N.test(r[1])&&S.isPlainObject(t))for(r in t)m(this[r])?this[r](t[r]):this.attr(r,t[r]);return this}return(i=E.getElementById(r[2]))&&(this[0]=i,this.length=1),this}return e.nodeType?(this[0]=e,this.length=1,this):m(e)?void 0!==n.ready?n.ready(e):e(S):S.makeArray(e,this)}).prototype=S.fn,D=S(E);var L=/^(?:parents|prev(?:Until|All))/,H={children:!0,contents:!0,next:!0,prev:!0};function O(e,t){while((e=e[t])&&1!==e.nodeType);return e}S.fn.extend({has:function(e){var t=S(e,this),n=t.length;return this.filter(function(){for(var e=0;e\x20\t\r\n\f]*)/i,he=/^$|^module$|\/(?:java|ecma)script/i;ce=E.createDocumentFragment().appendChild(E.createElement("div")),(fe=E.createElement("input")).setAttribute("type","radio"),fe.setAttribute("checked","checked"),fe.setAttribute("name","t"),ce.appendChild(fe),v.checkClone=ce.cloneNode(!0).cloneNode(!0).lastChild.checked,ce.innerHTML="",v.noCloneChecked=!!ce.cloneNode(!0).lastChild.defaultValue,ce.innerHTML="",v.option=!!ce.lastChild;var ge={thead:[1,"","
"],col:[2,"","
"],tr:[2,"","
"],td:[3,"","
"],_default:[0,"",""]};function ye(e,t){var n;return n="undefined"!=typeof e.getElementsByTagName?e.getElementsByTagName(t||"*"):"undefined"!=typeof e.querySelectorAll?e.querySelectorAll(t||"*"):[],void 0===t||t&&A(e,t)?S.merge([e],n):n}function ve(e,t){for(var n=0,r=e.length;n",""]);var me=/<|&#?\w+;/;function xe(e,t,n,r,i){for(var o,a,s,u,l,c,f=t.createDocumentFragment(),p=[],d=0,h=e.length;d\s*$/g;function je(e,t){return A(e,"table")&&A(11!==t.nodeType?t:t.firstChild,"tr")&&S(e).children("tbody")[0]||e}function De(e){return e.type=(null!==e.getAttribute("type"))+"/"+e.type,e}function qe(e){return"true/"===(e.type||"").slice(0,5)?e.type=e.type.slice(5):e.removeAttribute("type"),e}function Le(e,t){var n,r,i,o,a,s;if(1===t.nodeType){if(Y.hasData(e)&&(s=Y.get(e).events))for(i in Y.remove(t,"handle events"),s)for(n=0,r=s[i].length;n").attr(n.scriptAttrs||{}).prop({charset:n.scriptCharset,src:n.url}).on("load error",i=function(e){r.remove(),i=null,e&&t("error"===e.type?404:200,e.type)}),E.head.appendChild(r[0])},abort:function(){i&&i()}}});var Ut,Xt=[],Vt=/(=)\?(?=&|$)|\?\?/;S.ajaxSetup({jsonp:"callback",jsonpCallback:function(){var e=Xt.pop()||S.expando+"_"+Ct.guid++;return this[e]=!0,e}}),S.ajaxPrefilter("json jsonp",function(e,t,n){var r,i,o,a=!1!==e.jsonp&&(Vt.test(e.url)?"url":"string"==typeof e.data&&0===(e.contentType||"").indexOf("application/x-www-form-urlencoded")&&Vt.test(e.data)&&"data");if(a||"jsonp"===e.dataTypes[0])return r=e.jsonpCallback=m(e.jsonpCallback)?e.jsonpCallback():e.jsonpCallback,a?e[a]=e[a].replace(Vt,"$1"+r):!1!==e.jsonp&&(e.url+=(Et.test(e.url)?"&":"?")+e.jsonp+"="+r),e.converters["script json"]=function(){return o||S.error(r+" was not called"),o[0]},e.dataTypes[0]="json",i=C[r],C[r]=function(){o=arguments},n.always(function(){void 0===i?S(C).removeProp(r):C[r]=i,e[r]&&(e.jsonpCallback=t.jsonpCallback,Xt.push(r)),o&&m(i)&&i(o[0]),o=i=void 0}),"script"}),v.createHTMLDocument=((Ut=E.implementation.createHTMLDocument("").body).innerHTML="
",2===Ut.childNodes.length),S.parseHTML=function(e,t,n){return"string"!=typeof e?[]:("boolean"==typeof t&&(n=t,t=!1),t||(v.createHTMLDocument?((r=(t=E.implementation.createHTMLDocument("")).createElement("base")).href=E.location.href,t.head.appendChild(r)):t=E),o=!n&&[],(i=N.exec(e))?[t.createElement(i[1])]:(i=xe([e],t,o),o&&o.length&&S(o).remove(),S.merge([],i.childNodes)));var r,i,o},S.fn.load=function(e,t,n){var r,i,o,a=this,s=e.indexOf(" ");return-1").append(S.parseHTML(e)).find(r):e)}).always(n&&function(e,t){a.each(function(){n.apply(this,o||[e.responseText,t,e])})}),this},S.expr.pseudos.animated=function(t){return S.grep(S.timers,function(e){return t===e.elem}).length},S.offset={setOffset:function(e,t,n){var r,i,o,a,s,u,l=S.css(e,"position"),c=S(e),f={};"static"===l&&(e.style.position="relative"),s=c.offset(),o=S.css(e,"top"),u=S.css(e,"left"),("absolute"===l||"fixed"===l)&&-1<(o+u).indexOf("auto")?(a=(r=c.position()).top,i=r.left):(a=parseFloat(o)||0,i=parseFloat(u)||0),m(t)&&(t=t.call(e,n,S.extend({},s))),null!=t.top&&(f.top=t.top-s.top+a),null!=t.left&&(f.left=t.left-s.left+i),"using"in t?t.using.call(e,f):c.css(f)}},S.fn.extend({offset:function(t){if(arguments.length)return void 0===t?this:this.each(function(e){S.offset.setOffset(this,t,e)});var e,n,r=this[0];return r?r.getClientRects().length?(e=r.getBoundingClientRect(),n=r.ownerDocument.defaultView,{top:e.top+n.pageYOffset,left:e.left+n.pageXOffset}):{top:0,left:0}:void 0},position:function(){if(this[0]){var e,t,n,r=this[0],i={top:0,left:0};if("fixed"===S.css(r,"position"))t=r.getBoundingClientRect();else{t=this.offset(),n=r.ownerDocument,e=r.offsetParent||n.documentElement;while(e&&(e===n.body||e===n.documentElement)&&"static"===S.css(e,"position"))e=e.parentNode;e&&e!==r&&1===e.nodeType&&((i=S(e).offset()).top+=S.css(e,"borderTopWidth",!0),i.left+=S.css(e,"borderLeftWidth",!0))}return{top:t.top-i.top-S.css(r,"marginTop",!0),left:t.left-i.left-S.css(r,"marginLeft",!0)}}},offsetParent:function(){return this.map(function(){var e=this.offsetParent;while(e&&"static"===S.css(e,"position"))e=e.offsetParent;return e||re})}}),S.each({scrollLeft:"pageXOffset",scrollTop:"pageYOffset"},function(t,i){var o="pageYOffset"===i;S.fn[t]=function(e){return B(this,function(e,t,n){var r;if(x(e)?r=e:9===e.nodeType&&(r=e.defaultView),void 0===n)return r?r[i]:e[t];r?r.scrollTo(o?r.pageXOffset:n,o?n:r.pageYOffset):e[t]=n},t,e,arguments.length)}}),S.each(["top","left"],function(e,n){S.cssHooks[n]=_e(v.pixelPosition,function(e,t){if(t)return t=Be(e,n),Pe.test(t)?S(e).position()[n]+"px":t})}),S.each({Height:"height",Width:"width"},function(a,s){S.each({padding:"inner"+a,content:s,"":"outer"+a},function(r,o){S.fn[o]=function(e,t){var n=arguments.length&&(r||"boolean"!=typeof e),i=r||(!0===e||!0===t?"margin":"border");return B(this,function(e,t,n){var r;return x(e)?0===o.indexOf("outer")?e["inner"+a]:e.document.documentElement["client"+a]:9===e.nodeType?(r=e.documentElement,Math.max(e.body["scroll"+a],r["scroll"+a],e.body["offset"+a],r["offset"+a],r["client"+a])):void 0===n?S.css(e,t,i):S.style(e,t,n,i)},s,n?e:void 0,n)}})}),S.each(["ajaxStart","ajaxStop","ajaxComplete","ajaxError","ajaxSuccess","ajaxSend"],function(e,t){S.fn[t]=function(e){return this.on(t,e)}}),S.fn.extend({bind:function(e,t,n){return this.on(e,null,t,n)},unbind:function(e,t){return this.off(e,null,t)},delegate:function(e,t,n,r){return this.on(t,e,n,r)},undelegate:function(e,t,n){return 1===arguments.length?this.off(e,"**"):this.off(t,e||"**",n)},hover:function(e,t){return this.mouseenter(e).mouseleave(t||e)}}),S.each("blur focus focusin focusout resize scroll click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup contextmenu".split(" "),function(e,n){S.fn[n]=function(e,t){return 0 .loading").fadeOut();function trimText(text){return text.replace(/[ \t\n\r]+/g," ");} +var lastNode=undefined;var mainNodeName=undefined;var nodeUrl="";(function(node){if(node[0]=="admin"){luciLocation=[node[1],node[2]];}else{luciLocation=node;} +for(var i in luciLocation){nodeUrl+=luciLocation[i];if(i!=luciLocation.length-1){nodeUrl+="/";}}})(luciLocation);function getCurrentNodeByUrl(){if(!$('body').hasClass('logged-in')){luciLocation=["Main","Login"];return true;} +const urlReg=new RegExp(nodeUrl+"$") +var ret=false;$(".main > .main-left > .nav > .slide > .active").next(".slide-menu").stop(true).slideUp("fast");$(".main > .main-left > .nav > .slide > .menu").removeClass("active");$(".main > .main-left > .nav > .slide > .menu").each(function(){var ulNode=$(this);ulNode.next().find("a").each(function(){var that=$(this);var href=that.attr("href");if(urlReg.test(href)){ulNode.click();ulNode.next(".slide-menu").stop(true,true);lastNode=that.parent();lastNode.addClass("active");ret=true;return true;}});});return ret;} +$(".main > .main-left > .nav > .slide > .menu").click(function(){var ul=$(this).next(".slide-menu");var menu=$(this);if(!menu.hasClass("exit")){$(".main > .main-left > .nav > .slide > .active").next(".slide-menu").stop(true).slideUp("fast");$(".main > .main-left > .nav > .slide > .menu").removeClass("active");if(!ul.is(":visible")){menu.addClass("active");ul.addClass("active");ul.stop(true).slideDown("fast");}else{ul.stop(true).slideUp("fast",function(){menu.removeClass("active");ul.removeClass("active");});} +return false;}});$(".main > .main-left > .nav > .slide > .slide-menu > li > a").click(function(){if(lastNode!=undefined) +lastNode.removeClass("active");$(this).parent().addClass("active");$(".main > .loading").fadeIn("fast");return true;});$(".main > .main-left > .nav > .slide > .slide-menu > li").click(function(){if(lastNode!=undefined) +lastNode.removeClass("active");$(this).addClass("active");$(".main > .loading").fadeIn("fast");window.location=$($(this).find("a")[0]).attr("href");return false;});if(getCurrentNodeByUrl()){mainNodeName="node-"+luciLocation[0]+"-"+luciLocation[1];mainNodeName=mainNodeName.replace(/[ \t\n\r\/]+/g,"_").toLowerCase();$("body").addClass(mainNodeName);} +$("#maincontent > .container").find("a").each(function(){var that=$(this);var onclick=that.attr("onclick");if(onclick==undefined||onclick==""){that.click(function(){var href=that.attr("href");if(href.indexOf("#")==-1){$(".main > .loading").fadeIn("fast");return true;}});}});var showSide=false;$(".showSide").click(function(){if(showSide){$(".darkMask").stop(true).fadeOut("fast");$(".main-left").stop(true).animate({width:"0"},"fast");$(".main-right").css("overflow-y","auto");$("header>.container>.brand").css("padding","0 4.5rem") +showSide=false;}else{$(".darkMask").stop(true).fadeIn("fast");$(".main-left").stop(true).animate({width:"18rem"},"fast");$(".main-right").css("overflow-y","hidden");$(".showSide").css("display","none");$("header").css("box-shadow","18rem 2px 4px rgb(0 0 0 / 8%)") +$("header>.container>.brand").css("padding",'0rem') +showSide=true;}});$(".darkMask").click(function(){if(showSide){$(".darkMask").stop(true).fadeOut("fast");$(".main-left").stop(true).animate({width:"0"},"fast");$(".main-right").css("overflow-y","auto");$(".showSide").css("display","");$("header").css("box-shadow","0 2px 4px rgb(0 0 0 / 8%)") +$("header>.container>.brand").css("padding","0 4.5rem") +showSide=false;}});$(window).resize(function(){if($(window).width()>992){showSide=false;$(".showSide").css("display","");$(".main-left").css("width","");$(".darkMask").stop(true);$(".darkMask").css("display","none");$("header").css("box-shadow","18rem 2px 4px rgb(0 0 0 / 8%)") +$("header>.container>.brand").css("padding",'0rem')}else{$("header").css("box-shadow","0 2px 4px rgb(0 0 0 / 8%)") +$("header>.container>.brand").css("padding","0 4.5rem")} +if(showSide){$("header").css("box-shadow","18rem 2px 4px rgb(0 0 0 / 8%)") +$("header>.container>.brand").css("padding",'0rem')}});$(".main-right").focus();$(".main-right").blur();$("input").attr("size","0");if(mainNodeName!=undefined){switch(mainNodeName){case "node-status-system_log":case "node-status-kernel_log":$("#syslog").focus(function(){$("#syslog").blur();$(".main-right").focus();$(".main-right").blur();});break;case "node-status-firewall":var button=$(".node-status-firewall > .main fieldset li > a");button.addClass("cbi-button cbi-button-reset a-to-btn");break;case "node-system-reboot":var button=$(".node-system-reboot > .main > .main-right p > a");button.addClass("cbi-button cbi-input-reset a-to-btn");break;}}})(jQuery); diff --git a/luci-theme-design/htdocs/luci-static/design/manifest.json b/luci-theme-design/htdocs/luci-static/design/manifest.json new file mode 100644 index 00000000..ab331a61 --- /dev/null +++ b/luci-theme-design/htdocs/luci-static/design/manifest.json @@ -0,0 +1,25 @@ +{ +"name":"Design", +"short_name":"Design", +"description":"Design for OpenWRT by gngpp.", +"start_url":"/", +"scope": "/", +"orientation":"portrait", +"display":"standalone", +"prompt_message":"在主屏幕添加图标,以便快速访问 Design", +"icons":[ +{ +"src":"images/icon.png", +"sizes":"144x144", +"type":"image/png" +}, +{ +"src":"images/icon.png", +"sizes":"192x192", +"type":"image/png" +} +], +"gcm_sender_id":"524223308106", +"gcm_user_visible_only":true, +"status":"ok" +} \ No newline at end of file diff --git a/luci-theme-design/luasrc/view/themes/design/footer.htm b/luci-theme-design/luasrc/view/themes/design/footer.htm new file mode 100644 index 00000000..d7df2075 --- /dev/null +++ b/luci-theme-design/luasrc/view/themes/design/footer.htm @@ -0,0 +1,69 @@ +<%# + Material is a clean HTML5 theme for LuCI. It is based on luci-theme-bootstrap and MUI + + luci-theme-material + Copyright 2015 Lutty Yang + + luci-theme-neobird + Copyright 2021 2smile + + luci-theme-design + Copyright 2023 gngpp + + Have a bug? Please create an issue here on GitHub! + https://github.com/LuttyYang/luci-theme-material/issues + + luci-theme-bootstrap: + Copyright 2008 Steven Barth + Copyright 2008 Jo-Philipp Wich + Copyright 2012 David Menting + + MUI: + https://github.com/muicss/mui + + Licensed to the public under the Apache License 2.0 +-%> + +<% + local ver = require "luci.version" + local disp = require "luci.dispatcher" + local request = disp.context.path + local category = request[1] + local tree = disp.node() + local categories = disp.node_childs(tree) +%> + + + + + + + + diff --git a/luci-theme-design/luasrc/view/themes/design/header.htm b/luci-theme-design/luasrc/view/themes/design/header.htm new file mode 100644 index 00000000..d491c4a8 --- /dev/null +++ b/luci-theme-design/luasrc/view/themes/design/header.htm @@ -0,0 +1,323 @@ +<%# + Material is a clean HTML5 theme for LuCI. It is based on luci-theme-bootstrap and MUI + + luci-theme-material + Copyright 2015 Lutty Yang + + luci-theme-neobird + Copyright 2021 2smile + + luci-theme-design + Copyright 2023 2smile + + Have a bug? Please create an issue here on GitHub! + https://github.com/gngpp/luci-theme-design + + luci-theme-bootstrap: + Copyright 2008 Steven Barth + Copyright 2008 Jo-Philipp Wich + Copyright 2012 David Menting + + MUI: + https://github.com/muicss/mui + + Licensed to the public under the Apache License 2.0 +-%> + +<% + local ver = require "luci.version" + local sys = require "luci.sys" + local util = require "luci.util" + local http = require "luci.http" + local disp = require "luci.dispatcher" + local uci = require 'luci.model.uci'.cursor() + local fs = require "nixio.fs" + + local boardinfo = util.ubus("system", "board") + local boardinfo={} + boardinfo.hostname=sys.hostname() + + local request = disp.context.path + local request2 = disp.context.request + + local category = request[1] + local cattree = category and disp.node(category) + + local leaf = request2[#request2] + + local tree = disp.node() + local node = disp.context.dispatched + + local categories = disp.node_childs(tree) + + local c = tree + local i, r + + -- tag all nodes leading to this page + for i, r in ipairs(request) do + if c.nodes and c.nodes[r] then + c = c.nodes[r] + c._menu_selected = true + end + end + + -- send as HTML5 + http.prepare_content("text/html") + + local function nodeurl(prefix, name, query) + local url = controller .. prefix .. name .. "/" + if query then + url = url .. http.build_querystring(query) + end + return pcdata(url) + end + + local function subtree(prefix, node, level) + if not level then + level = 1 + end + + local childs = disp.node_childs(node) + if #childs > 0 then + + if level > 2 then +%> +
    + <% + end + + local selected_node + local selected_name + local i, v + + for i, v in ipairs(childs) do + local nnode = node.nodes[v] + if nnode._menu_selected then + selected_node = nnode + selected_name = v + end + if level > 2 then + %> +
  • + <%=striptags(translate(nnode.title))%> +
  • + <% end + end + + if level > 2 then + %> +
+<% end + + if selected_node then + subtree(prefix .. selected_name .. "/", selected_node, level + 1) + end + end + + end + + -- Custom settings + local mode = 'normal' + local navbar = 'display' + local navbar_proxy = 'shadowsocksr' + if fs.access('/etc/config/design') then + mode = uci:get_first('design', 'global', 'mode') + navbar = uci:get_first('design', 'global', 'navbar') + navbar_proxy = uci:get_first('design', 'global', 'navbar_proxy') + end +-%> + + + + + + + <%=striptags( (boardinfo.hostname or "?") .. ( (node and node.title) and ' - ' .. translate(node.title) or '')) %> - LuCI + + + + + + + + "> + "> + + + + + + + + + + + + <% if node and node.css then %> + + <% end -%> + <% if css then %> + + <% end -%> + + + + + + data-theme = "<%= mode %>" + <% end -%> + > + +
+ <% if mode == 'normal' then %> + + <% end -%> + +<% if navbar == 'display' then %> + +
+ +
+
+ +
+
+
+
+
+ <%- if luci.sys.process.info("uid") == 0 and luci.sys.user.getuser("root") and not luci.sys.user.getpasswd("root") then -%> +
+

<%:No password set!%>

+ <%:There is no password set on this router. Please configure a root password to protect the web interface and enable SSH.%>
+ "><%:Go to password configuration...%> +
+ <%- end -%> + <% if category then subtree("/" .. category .. "/", cattree) end %> + + + \ No newline at end of file diff --git a/luci-theme-design/preview/IMG_0328.PNG b/luci-theme-design/preview/IMG_0328.PNG new file mode 100644 index 00000000..598e7b7a Binary files /dev/null and b/luci-theme-design/preview/IMG_0328.PNG differ diff --git a/luci-theme-design/preview/IMG_0329.PNG b/luci-theme-design/preview/IMG_0329.PNG new file mode 100644 index 00000000..86bb01ed Binary files /dev/null and b/luci-theme-design/preview/IMG_0329.PNG differ diff --git a/luci-theme-design/preview/firewall.png b/luci-theme-design/preview/firewall.png new file mode 100644 index 00000000..a7e9af83 Binary files /dev/null and b/luci-theme-design/preview/firewall.png differ diff --git a/luci-theme-design/preview/home.png b/luci-theme-design/preview/home.png new file mode 100644 index 00000000..5922ac04 Binary files /dev/null and b/luci-theme-design/preview/home.png differ diff --git a/luci-theme-design/preview/home1.png b/luci-theme-design/preview/home1.png new file mode 100644 index 00000000..3a727e1e Binary files /dev/null and b/luci-theme-design/preview/home1.png differ diff --git a/luci-theme-design/preview/iface.png b/luci-theme-design/preview/iface.png new file mode 100644 index 00000000..91f7f7c5 Binary files /dev/null and b/luci-theme-design/preview/iface.png differ diff --git a/luci-theme-design/preview/light.png b/luci-theme-design/preview/light.png new file mode 100644 index 00000000..834de371 Binary files /dev/null and b/luci-theme-design/preview/light.png differ diff --git a/luci-theme-design/preview/login.png b/luci-theme-design/preview/login.png new file mode 100644 index 00000000..bfd402f1 Binary files /dev/null and b/luci-theme-design/preview/login.png differ diff --git a/luci-theme-design/preview/login1.png b/luci-theme-design/preview/login1.png new file mode 100644 index 00000000..c76eee65 Binary files /dev/null and b/luci-theme-design/preview/login1.png differ diff --git a/luci-theme-design/preview/page.png b/luci-theme-design/preview/page.png new file mode 100644 index 00000000..e20a579d Binary files /dev/null and b/luci-theme-design/preview/page.png differ diff --git a/luci-theme-design/preview/webapp_home.PNG b/luci-theme-design/preview/webapp_home.PNG new file mode 100644 index 00000000..90c0a443 Binary files /dev/null and b/luci-theme-design/preview/webapp_home.PNG differ diff --git a/luci-theme-design/preview/webapp_vssr.PNG b/luci-theme-design/preview/webapp_vssr.PNG new file mode 100644 index 00000000..4214d2da Binary files /dev/null and b/luci-theme-design/preview/webapp_vssr.PNG differ diff --git a/luci-theme-design/preview/wifi.png b/luci-theme-design/preview/wifi.png new file mode 100644 index 00000000..76dd255a Binary files /dev/null and b/luci-theme-design/preview/wifi.png differ diff --git a/luci-theme-design/root/etc/uci-defaults/30_luci-theme-design b/luci-theme-design/root/etc/uci-defaults/30_luci-theme-design new file mode 100644 index 00000000..15ada671 --- /dev/null +++ b/luci-theme-design/root/etc/uci-defaults/30_luci-theme-design @@ -0,0 +1,11 @@ +#!/bin/sh + +if [ "$PKG_UPGRADE" != 1 ]; then + uci batch <<-EOF + set luci.themes.Design=/luci-static/design + set luci.main.mediaurlbase=/luci-static/design + commit luci + EOF +fi + +exit 0 \ No newline at end of file