update 2023-05-04 13:38:33

This commit is contained in:
github-actions[bot] 2023-05-04 13:38:33 +08:00
parent dfe83636e3
commit 3f1ac37704
73 changed files with 1818 additions and 525 deletions

View File

@ -1,17 +1,17 @@
include $(TOPDIR)/rules.mk
PKG_NAME:=luci-app-argonne-config
PKG_NAME:=luci-app-argone-config
PKG_VERSION:=1.2
PKG_RELEASE:=2
PKG_MAINTAINER:=jerrykuku <jerrykuku@qq.com>
LUCI_TITLE:=LuCI page for Argonne Config
LUCI_TITLE:=LuCI page for Argone Config
LUCI_PKGARCH:=all
LUCI_DEPENDS:=+luci-compat +luci-theme-argonne
LUCI_DEPENDS:=+luci-compat
define Package/$(PKG_NAME)/conffiles
/etc/config/argonne
/etc/config/argone
endef
include $(TOPDIR)/feeds/luci/luci.mk

View File

@ -1,8 +1,8 @@
# luci-app-argonne-config
argonne Theme Config Plugin
# luci-app-argone-config
argone Theme Config Plugin
You can set the blur and transparency of the login page of argonne theme, and manage the background pictures and videos.
+ 修改为argonne 用于配合luci-app-argonne主题
+ 修改为argone 用于配合luci-app-argone主题
+ 编译时无需再去删除源码自带的argon主题。

View File

@ -0,0 +1,10 @@
module("luci.controller.argone-config", package.seeall)
function index()
if not nixio.fs.access('/www/luci-static/argone/css/cascade.css') then
return
end
local page = entry({"admin", "system", "argone-config"}, form("argone-config"), _("Argonne Config"), 90)
page.acl_depends = { "luci-app-argone-config" }
end

View File

@ -4,7 +4,7 @@ local opkg = require 'luci.model.ipkg'
local sys = require 'luci.sys'
local http = require 'luci.http'
local nutil = require 'nixio.util'
local name = 'argonne'
local name = 'argone'
local uci = require 'luci.model.uci'.cursor()
local fstat = nxfs.statvfs(opkg.overlay_root())
@ -15,15 +15,15 @@ local space_used = space_total - space_free
local free_byte = space_free * fstat.frsize
local primary, dark_primary, blur_radius, blur_radius_dark, blur_opacity, mode
if nxfs.access('/etc/config/argonne') then
primary = uci:get_first('argonne', 'global', 'primary')
dark_primary = uci:get_first('argonne', 'global', 'dark_primary')
blur_radius = uci:get_first('argonne', 'global', 'blur')
blur_radius_dark = uci:get_first('argonne', 'global', 'blur_dark')
blur_opacity = uci:get_first('argonne', 'global', 'transparency')
blur_opacity_dark = uci:get_first('argonne', 'global', 'transparency_dark')
mode = uci:get_first('argonne', 'global', 'mode')
bing_background = uci:get_first('argonne', 'global', 'bing_background')
if nxfs.access('/etc/config/argone') then
primary = uci:get_first('argone', 'global', 'primary')
dark_primary = uci:get_first('argone', 'global', 'dark_primary')
blur_radius = uci:get_first('argone', 'global', 'blur')
blur_radius_dark = uci:get_first('argone', 'global', 'blur_dark')
blur_opacity = uci:get_first('argone', 'global', 'transparency')
blur_opacity_dark = uci:get_first('argone', 'global', 'transparency_dark')
mode = uci:get_first('argone', 'global', 'mode')
bing_background = uci:get_first('argone', 'global', 'bing_background')
end
function glob(...)
@ -50,7 +50,7 @@ local transparency_sets = {
}
-- [[ 模糊设置 ]]--
br = SimpleForm('config', translate('Argonne Config'), translate('Here you can set the blur and transparency of the login page of argonne theme, and manage the background pictures and videos.[Chrome is recommended]'))
br = SimpleForm('config', translate('Argonne Config'), translate('Here you can set the blur and transparency of the login page of argone theme, and manage the background pictures and videos.[Chrome is recommended]'))
br.reset = false
br.submit = false
s = br:section(SimpleSection)
@ -114,9 +114,9 @@ function br.handle(self, state, data)
if (state == FORM_VALID and data.blur ~= nil and data.blur_dark ~= nil and data.transparency ~= nil and data.transparency_dark ~= nil and data.mode ~= nil) then
nxfs.writefile('/tmp/aaa', data)
for key, value in pairs(data) do
uci:set('argonne','@global[0]',key,value)
uci:set('argone','@global[0]',key,value)
end
uci:commit('argonne')
uci:commit('argone')
end
return true
end
@ -125,14 +125,14 @@ ful = SimpleForm('upload', translate('Upload (Free: ') .. wa.byte_format(free_b
ful.reset = false
ful.submit = false
sul = ful:section(SimpleSection, '', translate("Upload file to '/www/luci-static/argonne/background/'"))
sul = ful:section(SimpleSection, '', translate("Upload file to '/www/luci-static/argone/background/'"))
fu = sul:option(FileUpload, '')
fu.template = 'argonne-config/other_upload'
fu.template = 'argone-config/other_upload'
um = sul:option(DummyValue, '', nil)
um.template = 'argonne-config/other_dvalue'
um.template = 'argone-config/other_dvalue'
local dir, fd
dir = '/www/luci-static/argonne/background/'
dir = '/www/luci-static/argone/background/'
nxfs.mkdir(dir)
http.setfilehandler(
function(meta, chunk, eof)
@ -156,7 +156,7 @@ http.setfilehandler(
if eof and fd then
fd:close()
fd = nil
um.value = translate('File saved to') .. ' "/www/luci-static/argonne/background/' .. meta.file .. '"'
um.value = translate('File saved to') .. ' "/www/luci-static/argone/background/' .. meta.file .. '"'
end
end
)

View File

@ -1,6 +1,6 @@
{
"luci-app-argonne-config": {
"description": "Grant UCI access for luci-app-argonne-config",
"luci-app-argone-config": {
"description": "Grant UCI access for luci-app-argone-config",
"read": {
"uci": [ "argonne" ]
},

View File

@ -1,10 +0,0 @@
module("luci.controller.argonne-config", package.seeall)
function index()
if not nixio.fs.access('/www/luci-static/argonne/css/cascade.css') then
return
end
local page = entry({"admin", "system", "argonne-config"}, form("argonne-config"), _("Argonne Config"), 90)
page.acl_depends = { "luci-app-argonne-config" }
end

View File

@ -6,19 +6,19 @@
include $(TOPDIR)/rules.mk
LUCI_TITLE:=Argonne kenzo
LUCI_DEPENDS:=
PKG_VERSION:=1.7.3
PKG_RELEASE:=2
LUCI_TITLE:=Argone kenzo
LUCI_DEPENDS:=+curl +jsonfilter
PKG_VERSION:=1.7.7
PKG_RELEASE:=3
include $(TOPDIR)/feeds/luci/luci.mk
define Package/luci-theme-argonne/postinst
define Package/luci-theme-Argone/postinst
#!/bin/sh
sed -i ":a;$!N;s/tmpl.render.*sysauth_template.*return/local scope = { duser = default_user, fuser = user }\nlocal ok, res = luci.util.copcall\(luci.template.render_string, [[<% include\(\"themes\/\" .. theme .. \"\/sysauth\"\) %>]], scope\)\nif ok then\nreturn res\nend\nreturn luci.template.render\(\"sysauth\", scope\)/;ba" /usr/lib/lua/luci/dispatcher.lua
sed -i ":a;$!N;s/t.render.*sysauth_template.*return/local scope = { duser = h, fuser = a }\nlocal ok, res = luci.util.copcall\(luci.template.render_string, [[<% include\(\"themes\/\" .. theme .. \"\/sysauth\"\) %>]], scope\)\nif ok then\nreturn res\nend\nreturn luci.template.render\(\"sysauth\", scope\)/;ba" /usr/lib/lua/luci/dispatcher.lua
[ -f /usr/lib/lua/luci/view/themes/argonne/out_header_login.htm ] && mv -f /usr/lib/lua/luci/view/themes/argonne/out_header_login.htm /usr/lib/lua/luci/view/header_login.htm
[ -f /usr/lib/lua/luci/view/themes/Argone/out_header_login.htm ] && mv -f /usr/lib/lua/luci/view/themes/Argone/out_header_login.htm /usr/lib/lua/luci/view/header_login.htm
rm -Rf /var/luci-modulecache
rm -Rf /var/luci-indexcache
exit 0

View File

@ -0,0 +1,10 @@
#### argon 原作者是jerrykuku
#### 改argone是为了编译方便
+ main默认支持luci-18.06
```bash
git clone https://github.com/kenzok78/luci-theme-argone
```
+ 21.02分支支持最新luci
```bash
git clone -b 21.02 https://github.com/kenzok78/luci-theme-argone
```

View File

@ -1,11 +1,11 @@
/**
* Argonne is a clean HTML5 theme for LuCI. It is based on luci-theme-material and Argonne Template
* Argon is a clean HTML5 theme for LuCI. It is based on luci-theme-material and Argon Template
*
* luci-theme-argonne
* luci-theme-argon
* Copyright 2020 Jerryk <jerrykuku@gmail.com>
*
* Have a bug? Please create an issue here on GitHub!
* https://github.com/kenzok78/luci-theme-argonne/issues
* https://github.com/jerrykuku/luci-theme-argon/issues
*
* luci-theme-bootstrap:
* Copyright 2008 Steven Barth <steven@midlink.org>
@ -18,7 +18,7 @@
* luci-theme-material:
* https://github.com/LuttyYang/luci-theme-material/
*
* Agron Theme
* Argon Theme
* https://demos.creative-tim.com/argon-dashboard/index.html
*
* Login background
@ -889,7 +889,7 @@ footer a {
box-shadow: 0 0px 2px rgba(0, 0, 0, 0.12), 0 2px 2px rgba(0, 0, 0, 0.2);
}
.cbi-button:active {
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.19), 0 5px 5px rgba(0, 0, 0, 0.23);
}
.cbi-button:disabled {
cursor: not-allowed;
@ -947,6 +947,34 @@ form.inline + form.inline,
.cbi-value-field .cbi-button-neutral {
min-width: 2.5rem !important;
}
/* Replace LuCI's default file and folder type icons */
img[src="/luci-static/resources/cbi/reload.gif"] {
content: url("/luci-static/argon/img/reload.webp");
}
img[src="/luci-static/resources/cbi/file.gif"] {
content: url("/luci-static/argon/img/file.webp");
}
img[src="/luci-static/resources/cbi/add.gif"] {
content: url("/luci-static/argon/img/add.webp");
}
img[src="/luci-static/resources/cbi/remove.gif"] {
content: url("/luci-static/argon/img/remove.webp");
}
img[src="/luci-static/resources/cbi/edit.gif"] {
content: url("/luci-static/argon/img/edit.webp");
}
img[src="/luci-static/resources/cbi/fieldadd.gif"] {
content: url("/luci-static/argon/img/fieldadd.webp");
}
img[src="/luci-static/resources/cbi/link.gif"] {
content: url("/luci-static/argon/img/link.webp");
}
img[src="/luci-static/resources/cbi/find.gif"] {
content: url("/luci-static/argon/img/find.webp");
}
img[src="/luci-static/resources/cbi/folder.gif"] {
content: url("/luci-static/argon/img/folder.webp");
}
/* input */
.cbi-value input[type="password"],
.cbi-value input[type="text"] {
@ -1055,12 +1083,13 @@ input[type="checkbox"] {
appearance: none !important;
-webkit-appearance: none !important;
border: 1px solid #dee2e6;
width: 16px !important;
height: 16px !important;
width: 17px !important;
height: 17px !important;
padding: 0;
cursor: pointer;
transition: all 0.2s;
margin: 0.9rem 0.25rem 0 0.25rem;
margin: 0.5rem 0.25rem 0.7rem 0.25rem;
vertical-align: middle;
}
input[type="checkbox"]:checked {
border: 1px solid #5e72e4;
@ -1073,7 +1102,8 @@ input[type="checkbox"]:checked {
background-position: center;
}
ul li .cbi-input-checkbox {
margin: 0.5rem 0.25rem !important;
margin: 0.5rem 0.25rem 0.7rem 0.25rem !important;
vertical-align: middle !important;
}
.cbi-input-radio {
appearance: none !important;
@ -1186,7 +1216,7 @@ ul li .cbi-input-checkbox {
}
.cbi-section-create {
margin: 0;
padding-left: 1rem;
padding-left: 0.5rem;
align-items: center;
}
.cbi-section-create > * {
@ -1245,10 +1275,41 @@ small {
.cbi-section > legend {
display: none !important;
}
.cbi-section-error {
padding: 1.5rem;
color: #fb6340;
/* Define the error text border breathe display animation */
@keyframes error-border-breathe {
0%{
border-color: #fb6340;
}
50%{
border-color: transparent;
}
100%{
border-color: #fb6340;
}
}
/* Center display error text box */
.cbi-section-error > ul{
text-align: center;
}
/* Add border for error text box, and border breathe display animation to make it more noticeable */
.cbi-section-error > ul > li {
font-weight: 600;
max-width: 60%;
color: #fb6340;
line-height: 1rem;
display: inline-block;
border: 2px solid #fb6340;
border-radius: 0.3rem;
animation: error-border-breathe 1.5s ease-in-out infinite;
padding-left: 4px;
padding-right: 4px;
padding-top: 2px;
padding-bottom: 2px;
}
.cbi-input-invalid,
.cbi-value-error input {
color: #fb6340;
border: 1px dashed #fb6340;
}
fieldset > fieldset {
margin: 0;
@ -1309,6 +1370,7 @@ input[name="nslookup"] {
height: 1.6rem !important;
line-height: 1.6rem;
border-radius: 0.25rem;
overflow: hidden;
}
#swaptotal > div > div,
#swapfree > div > div,
@ -1400,6 +1462,30 @@ td > table > tbody > tr > td,
.a-to-btn {
text-decoration: none;
}
/* file selector button */
::file-selector-button {
color: #fff;
border-radius: .25rem;
border: 1px solid #2e6da4;
padding: .4rem .5rem;
background-color: #337ab7;
box-sizing: border-box;
cursor: pointer;
transition: all 0.2s ease-in-out;
}
::file-selector-button:hover,
::file-selector-button:focus,
::file-selector-button:active {
outline: 0;
text-decoration: none;
}
::file-selector-button:hover,
::file-selector-button:focus {
box-shadow: 0 0px 2px rgba(0, 0, 0, 0.12), 0 2px 2px rgba(0, 0, 0, 0.2);
}
::file-selector-button:active {
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.19), 0 5px 5px rgba(0, 0, 0, 0.23);
}
/* table */
.cbi-section-table .cbi-section-table-titles .cbi-section-table-cell {
width: auto !important;
@ -1514,6 +1600,40 @@ td > table > tbody > tr > td,
#cbi-network-switch_vlan .td {
flex-basis: 12%;
}
/* Fix background color of table-titles */
.cbi-section-node > .cbi-section-table > tbody > .cbi-section-table-titles th {
background-color: var(--lighter);
border: none;
}
/* Fix background color of table-descr */
.cbi-section-node > .cbi-section-table > tbody > .cbi-section-table-descr th {
border: none;
}
/* Fix background color not change when the H tag is in the table rowstyle-1 */
.cbi-section-node > .cbi-section-table > tbody > .cbi-rowstyle-1 th {
background-color: #fff;
border-top: 1px solid #ddd;
border-bottom: none;
}
/* Fix background color not change when the H tag is in the table rowstyle-2 */
.cbi-section-node > .cbi-section-table > tbody > .cbi-rowstyle-2 th {
background-color: #f9f9f9;
border-top: 1px solid #ddd;
border-bottom: none;
}
/* Change the color of the H label in the table to make it more visible */
th h1, td h1,
th h2, td h2,
th h3, td h3,
th h4, td h4,
th h5, td h5,
th h6, td h6 {
background: var(--lighter);
}
/* OCD: Change the background color of the "now in use" node in PassWall */
.cbi-section-table > tbody > ._now_use {
background: #5e72e473 !important;
}
/* language fix */
body.lang_pl.node-main-login .cbi-value-title {
width: 12rem;
@ -1777,12 +1897,20 @@ table > thead > tr > th,
.cbi-section-table-row:last-child {
margin-bottom: 0;
}
.cbi-section-table-row > .cbi-value-field .cbi-dropdown,
.cbi-section-table-row > .cbi-value-field .cbi-input-select,
.cbi-section-table-row > .cbi-value-field .cbi-input-text,
.cbi-section-table-row > .cbi-value-field .cbi-input-password,
.cbi-section-table-row > .cbi-value-field .cbi-dropdown {
.cbi-section-table-row > .cbi-value-field .cbi-input-password {
width: 100%;
}
.cbi-section-table-row > .cbi-value-field .cbi-input-text,
.cbi-section-table-row > .cbi-value-field .cbi-input-password {
min-width: 100px;
}
#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%;
}
.cbi-section-table-row > .cbi-value-field [data-dynlist] > input,
.cbi-section-table-row > .cbi-value-field input.cbi-input-password {
width: calc(100% - 1.5rem);
@ -1800,10 +1928,27 @@ div > .table > .tbody > .tr:nth-of-type(2n) {
background-color: var(--danger) !important;
color: #fff !important;
}
.warning {
background-color: #fb6340 !important;
background-color: var(--warning) !important;
color: #fff !important;
/* Define the warning background-color breathe display animation */
@keyframes warning-background-color-breathe {
0%{
color: #fff;
background-color: #fb6340;
}
50%{
color: #32325d;
background-color: #fff;
}
100%{
color: #fff;
background-color: #fb6340;
}
}
.warning,
.warning * {
background-color: #fb6340;
background-color: var(--warning);
color: #fff;
animation: warning-background-color-breathe 1.5s ease-in-out infinite !important;
}
.notice {
background-color: #5e72e4 !important;
@ -1948,7 +2093,6 @@ table > thead > tr > th {
padding-top: 0.75rem;
padding-bottom: 0.75rem;
letter-spacing: 1px;
text-transform: uppercase;
border-bottom: 1px solid #e9ecef;
}
table > tbody > tr:first-child > td,
@ -2031,7 +2175,7 @@ td > table > tbody > tr > td {
}
.cbi-tabmenu {
color: white;
padding: 0.5rem 1rem 0 1rem;
padding: 0.5rem 0.5rem 0 0.5rem;
white-space: nowrap;
overflow-x: auto;
border-bottom: 1px solid #ddd !important;
@ -2297,7 +2441,7 @@ select[multiple="multiple"] {
overflow-y: visible;
}
.cbi-section-node .cbi-value {
padding: 0.3rem 1rem 0.3rem 1rem;
padding: 0.5rem 1rem 0.5rem 1rem !important;
}
.cbi-tabcontainer > .cbi-value:nth-of-type(2n) {
background-color: #f9f9f9;
@ -2308,6 +2452,18 @@ select[multiple="multiple"] {
line-height: 1.6;
font-size: 0.875rem;
}
/* Fix text position of the luci-app-filebrowser running state */
#cbi-filebrowser > .cbi-section > .cbi-section > .cbi-value > .cbi-value-field,
/* Fix text position of the luci-apps running state of the [Control] type */
form > .cbi-map > .cbi-section > .cbi-section-node > .cbi-value > .cbi-value-field font {
word-wrap: break-word;
font-size: 0.875rem;
line-height: 1.6;
padding: 0.7rem;
padding-left: 0;
text-align: right;
display: table-cell;
}
.cbi-value-helpicon > img {
display: none;
}
@ -2327,7 +2483,6 @@ select[multiple="multiple"] {
padding: 0.7rem;
padding-left: 0;
width: 23rem;
float: left;
text-align: right;
display: table-cell;
}
@ -2515,18 +2670,22 @@ td > .ifacebadge,
min-width: 10rem;
margin-top: 0.3rem;
}
.cbi-value-field .cbi-input-checkbox,
.cbi-value-field .cbi-input-radio {
margin: 0.9rem 0.25rem 0 0.25rem;
.cbi-value-field .cbi-input-checkbox {
margin: 0.5rem 0.25rem 0.7rem 0.25rem;
vertical-align: middle;
height: 1rem;
line-height: 1.6;
}
.cbi-input-checkbox {
margin: 0.9rem 0.25rem 0 0.25rem;
margin: 0.5rem 0.25rem 0.7rem 0.25rem;
vertical-align: middle;
}
.cbi-value-field .cbi-input-radio {
margin: 0rem 0.25rem;
}
.cbi-input-radio {
margin: 0rem 0.25rem;
}
.cbi-value-field > input + .cbi-value-description {
padding: 0;
}
@ -2547,7 +2706,7 @@ td > .ifacebadge,
min-width: 7rem;
}
.cbi-section-create > .cbi-button-add {
margin: 0.5rem 0.5rem 0.5rem 0.5rem;
margin: 0.75rem 0.75rem 0.75rem 0.25rem;
}
.cbi-section-remove {
padding: 0.5rem;
@ -2651,6 +2810,10 @@ input[name="nslookup"] {
border-right: 0 !important;
background-color: #5e72e4 !important;
background-color: var(--primary) !important;
height: 100% !important;
background-image: url(../img/trafficbar.png);
background-position: left top;
animation: sparkle 1500ms linear infinite;
}
.node-system-leds .cbi-section em {
display: block;
@ -2852,10 +3015,6 @@ input[name="nslookup"] {
header > .fill > .container > .brand {
display: inline-block;
}
.cbi-value-title {
width: 9rem;
padding-right: 1rem;
}
.node-network-diagnostics > .main .cbi-map fieldset > div * {
width: 100% !important;
}
@ -2963,12 +3122,6 @@ input[name="nslookup"] {
width: 100%;
position: relative;
}
.cbi-value-field .cbi-input-checkbox,
.cbi-value-field .cbi-input-radio {
margin: 0rem 0.25rem 0 0.25rem;
height: 1rem;
line-height: 1.6;
}
.cbi-page-actions > div > input {
display: none;
}
@ -3066,4 +3219,4 @@ input[name="nslookup"] {
width: 2.3rem !important;
height: auto;
}
}
}

View File

@ -0,0 +1,682 @@
body {
background: #1e1e1e;
color: #cccccc;
}
.login-page .login-container .login-form {
background-color: #1e1e1e;
}
.login-page .login-container .login-form .brand {
color: #adb5bd;
}
.login-page .login-container .login-form .form-login .input-group::before {
color: #adb5bd;
}
.login-page .login-container .login-form .form-login .input-group input {
background-color: transparent !important;
color: #adb5bd;
border-bottom: #adb5bd 1px solid !important;
border-radius: 0;
border-top: none !important;
border-left: none !important;
border-right: none !important;
box-shadow: none;
}
.login-page .login-container .login-form .form-login .input-group input:focus {
border-top: none !important;
border-left: none !important;
border-right: none !important;
}
.login-page .login-container .login-form .form-login .cbi-button-apply {
background-color: #483d8b !important;
background-color: var(--dark-primary) !important;
}
.login-page .login-container .login-form .form-login .cbi-button-apply:hover,
.login-page .login-container .login-form .form-login .cbi-button-apply:focus {
opacity: .9;
}
.login-page .login-container footer {
color: #adb5bd;
}
header::after {
background-color: #1e1e1e !important;
}
.main .main-left {
background-color: #333333 !important;
box-shadow: 0 0 .5rem 0 rgba(0,0,0,0.15);
}
.main .main-left .sidenav-header .brand {
color: #ccc;
}
.main .main-left .nav .slide .slide-menu .active a {
color: #cccccc;
}
.main .main-left .nav .slide .slide-menu .active a::after {
background-color: #cccccc !important;
}
.main .main-left .nav .slide .slide-menu li a {
color: #cccccc;
}
.main .main-left .nav .slide .slide-menu li a:hover {
background: none !important;
}
.main .main-left .nav .slide .menu.active {
background-color: #483d8b !important;
background-color: var(--dark-primary) !important;
color: #cccccc !important;
}
.main .main-left .nav .slide .menu.active a::after {
background-color: #cccccc !important;
}
.main .main-left .nav li a {
color: #cccccc !important;
}
.main .main-left .nav li a:hover {
background-color: #483d8b !important;
background-color: var(--dark-primary) !important;
color: #cccccc !important;
}
.main .main-left::-webkit-scrollbar-thumb {
background-color: #252526 !important;
}
.main .main-left::-webkit-scrollbar-track {
background-color: #333;
}
.main .main-right {
background-color: #1e1e1e;
}
h2 {
color: #ccc;
background: #333333;
}
h3 {
color: #ccc;
border-bottom: 0;
background: #333333;
}
a:-webkit-any-link {
color: -webkit-link;
cursor: pointer;
color: #483d8b;
color: var(--dark-primary);
}
input:-webkit-autofill {
background-color: #3c3c3c !important;
}
.cbi-value-field .cbi-input-apply,
.cbi-button-apply,
.cbi-button-edit {
color: #fff !important;
background-color: #483d8b !important;
background-color: var(--dark-primary) !important;
border-color: #483d8b !important;
border-color: var(--dark-primary) !important;
}
.cbi-section em {
color: #483d8b;
color: var(--dark-primary);
}
header.bg-primary {
background-color: #1e1e1e !important;
}
.cbi-map-descr {
color: #ccc;
}
.cbi-section {
background: none;
box-shadow: 0 0 .5rem 0 rgba(0,0,0,0.35);
}
.panel-title {
color: #ccc;
background-color: #333333;
border-bottom: 0px;
}
table>tbody>tr>td,
table>tfoot>tr>td,
table>thead>tr>td {
color: #ccc;
}
fieldset>table>tbody>tr:nth-of-type(2n) {
background-color: #252526;
}
table>tbody>tr>td,
table>tfoot>tr>td,
table>thead>tr>td {
border-top: 1px solid #252526;
}
#swaptotal>div>div,
#swapfree>div>div,
#memfree>div>div,
#membuff>div>div,
#conns>div>div,
#memtotal>div>div {
background-color: #483d8b !important;
background-color: var(--dark-primary) !important;
}
#swaptotal>div>div>div>small,
#swapfree>div>div>div>small,
#memfree>div>div>div>small,
#membuff>div>div>div>small,
#conns>div>div>div>small,
#memtotal>div>div>div>small {
color: #ccc !important;
}
.node-system-packages>.main .cbi-section-node:first-child .cbi-value-last {
line-height: 1.8em;
}
.node-system-packages>.main .cbi-section-node:first-child .cbi-value-last div[style="margin:3px 0; width:300px; height:10px; border:1px solid #000000; background-color:#80C080"] {
border: 1px solid #999999 !important;
background-color: transparent !important;
}
.node-system-packages>.main .cbi-section-node:first-child .cbi-value-last div[style="margin:3px 0; width:300px; height:10px; border:1px solid #000000; background-color:#80C080"] div {
background-color: #32325d !important;
background-color: var(--dark-primary) !important;
}
table>tbody>tr>th,
table>tfoot>tr>th,
table>thead>tr>th {
background-color: #252526;
border-bottom: black 1px solid !important;
}
.cbi-rowstyle-2 {
background-color: #2c2c2c !important;
}
.cbi-rowstyle-1 {
background-color: #252526;
}
.cbi-section>h3:first-child,
.panel-title {
color: #ccc;
border-bottom: 0;
}
.cbi-section-table .cbi-section-table-titles .cbi-section-table-cell {
background-color: #1e1e1f;
}
.cbi-button {
color: #ccc;
background-color: #2c2c2c;
}
.cbi-rowstyle-2 .cbi-button-up,
.cbi-rowstyle-2 .cbi-button-down {
background-color: #252526 !important;
}
.cbi-section-node {
background: none;
border-radius: 0 0 .375rem .375rem;
padding: 0rem;
}
abbr {
color: #483d8b;
color: var(--dark-primary);
}
div>table>tbody>tr:nth-of-type(2n),
div>.table>.tbody>.tr:nth-of-type(2n) {
background-color: #252526;
}
/* file selector button */
::file-selector-button {
border: 1px solid darkseagreen !important;
background-color: darkseagreen !important;
}
/* Fix background color of table-titles */
.cbi-section-node>.cbi-section-table>tbody>.cbi-section-table-titles th {
background-color: #1e1e1e;
border: none !important;
}
/* Fix background color of table-descr */
.cbi-section-node>.cbi-section-table>tbody>.cbi-section-table-descr th {
background-color: #333333;
border: none !important;
}
/* Fix background color not change when the H tag is in the table rowstyle-1 */
.cbi-section-node>.cbi-section-table>tbody>.cbi-rowstyle-1 th {
background-color: #252526;
border-top: 1px solid #252526;
border-bottom: none !important;
}
/* Fix background color not change when the H tag is in the table rowstyle-2 */
.cbi-section-node>.cbi-section-table>tbody>.cbi-rowstyle-2 th {
background-color: #2c2c2c;
border-top: 1px solid #252526;
border-bottom: none !important;
}
/* Change the color of the H label in the table to make it more visible */
th h1, td h1,
th h2, td h2,
th h3, td h3,
th h4, td h4,
th h5, td h5,
th h6, td h6 {
background: var(--gray-dark);
}
/* Improved the background color of each itemes in "UNSAVED CHANGES" (dark mode only) */
.uci-change-list del,
.uci-change-legend-label del {
background-color: #fb74008c;
}
.uci-change-list var,
.uci-change-legend-label var {
background-color: #333333;
}
.uci-change-list ins,
.uci-change-legend-label ins {
background-color: #00ff0a45 !important;
}
/* OCD: Compatible the background color of the "Add the node via the link" & "USE(node)" pop-up window in PassWall (dark mode only) */
#add_link_div,
#set_node_div {
background-color: #333333f0 !important;
box-shadow: #00000094 10px 10px 30px 5px !important;
}
#add_link_div>.cbi-value>.cbi-value-field>#nodes_link {
background: #ccc;
}
#content_syslog {
box-shadow: 0 0 .5rem 0 rgba(0,0,0,0.35);
}
#syslog {
color: #ccc;
background-color: #1e1e1e;
}
#iwsvg,
#iwsvg2,
#bwsvg {
overflow: hidden;
box-shadow: 0 0 .5rem 0 rgba(0,0,0,0.35);
background-color: #1e1e1e !important;
}
.tabs {
background-color: #252526;
}
.tabs>li[class~="active"]>a {
color: #ccc;
}
.tabs>li[class~="active"],
.tabs>li:hover {
border-bottom: .18751rem solid #483d8b;
border-bottom: .18751rem solid var(--dark-primary);
color: #ccc;
background-color: #181819;
}
.cbi-tabmenu>li>a,
.tabs>li>a {
color: #ccc;
}
.cbi-tabmenu>li>a:hover,
.tabs>li>a:hover {
color: #ccc;
}
.cbi-tabmenu>li {
background: #2d2d2d;
}
.cbi-tabmenu {
border-bottom: 0 solid #ddd !important;
}
.cbi-tabmenu li[class~="cbi-tab"] a {
color: #ccc;
}
.cbi-tabmenu>li:hover {
color: #ccc;
background: #2d2d2d;
}
.cbi-tabmenu>li[class~="cbi-tab"] {
background-color: #181819;
}
.cbi-tabcontainer>.cbi-value:nth-of-type(2n) {
background-color: #252526;
}
.cbi-value-title {
color: #ccc;
}
select,
input {
color: #ccc;
background-color: transparent;
border: 1px solid #3c3c3c !important;
box-shadow: 0 3px 2px rgba(0,0,0,0.05);
}
select:not([multiple="multiple"]):focus,
input:focus {
border-color: #483d8b !important;
border-color: var(--dark-primary) !important;
background-color: transparent;
outline: 0;
box-shadow: none;
}
select {
background-color: #1e1e1e !important;
}
#cbi-dropbear h2,
#cbi-dropbear .cbi-map-descr,
#cbi-dropbear .cbi-map-descr abbr,
#cbi-rc h2,
#cbi-rc .cbi-map-descr,
#cbi-distfeedconf h2,
#cbi-distfeedconf .cbi-map-descr,
#cbi-customfeedconf h2,
#cbi-customfeedconf .cbi-map-descr,
#cbi-download h2,
#cbi-filelist h2 {
color: #ccc !important;
}
.cbi-value-field>ul>li .ifacebadge {
background-color: #3c3c3c;
}
.cbi-section-descr {
color: #ccc;
}
.cbi-input-textarea {
background-color: #1e1e1e;
color: #ccc;
}
.cbi-section-remove:nth-of-type(2n),
.cbi-section-node:nth-of-type(2n) {
background-color: #1e1e1e;
}
.node-system-packages>.main table tr td:nth-last-child(1) {
color: #ccc;
}
.node-system-packages>.main .cbi-value>pre {
background-color: #333;
}
.cbi-section-node .cbi-value {
padding: 1rem 1rem .3rem 1rem;
}
.ifacebox {
background-color: #1e1e1e;
border: 1px solid #1e1e1e;
}
.ifacebox-head {
color: #666;
}
.ifacebox-body {
background-color: #333;
}
.zonebadge strong {
color: #333;
}
.zonebadge>.ifacebadge {
background-color: #3c3c3c;
}
/* Fix firewall zone: "unspecified -or- create: " background color (dark mode only) */
div[onclick$="._fwzone_new').checked=true"] {
border: 1px solid #3c3c3c;
background-color: transparent !important;
}
/* Improve the background color of "Any zone" and "Device" when ADD/EDIT Rules in Firewall > Traffic Rules (dark mode only) */
label[for$=".src_any"],
label[for$=".dest_empty"],
label[for$=".dest_any"] {
background-color: #2888db !important;
}
/* Fix/add background color of wireless signal strength badge for dark mode */
td>.ifacebadge,
.td>.ifacebadge {
background-color: #3c3c3c;
}
/* Improved loading process gif color (dark mode only) */
img[src="/luci-static/resources/icons/loading.gif"] {
filter: invert(1);
}
div.cbi-value var,
td.cbi-value-field var {
color: #483d8b;
color: var(--dark-primary);
}
#diag-rc-output>pre {
color: #ccc;
background-color: #1e1e1e;
}
.node-services-vssr .block {
background-color: #1e1e1e !important;
box-shadow: 0 0 .5rem 0 rgba(0,0,0,0.35);
}
.node-services-vssr .block h4 {
color: #ccc !important;
}
.node-services-vssr .status-bar {
color: #ccc;
box-shadow: 0 0 .5rem 0 rgba(0,0,0,0.35);
background-color: #1e1e1e;
}
.node-services-vssr .cbi-section-table-row {
color: #ccc;
background-color: #3c3c3c !important;
box-shadow: 0 0 5px 0 rgba(0,0,0,0.35);
}
.node-services-vssr .cbi-section-table-row.fast {
background: #483d8b !important;
background: var(--dark-primary) !important;
color: #fff;
}
.node-services-vssr .ssr-button {
color: #ccc;
}
.node-services-vssr .incon:nth-child(2) {
border-right: #1e1e1e 1px solid;
}
.main .main-right #maincontent .container p {
color: #ccc;
}
#xhr_poll_status>.label.success {
color: #ccc !important;
background-color: darkolivegreen !important;
}
/* Define the warning background-color breathe display animation (dark mode) */
@keyframes warning-background-color-breathe-dark {
0%{
color: #fff;
background-color: darkorange;
}
50%{
color: #ccc;
background-color: #333333;
}
100%{
color: #fff;
background-color: darkorange;
}
}
.warning,
.warning * {
animation: warning-background-color-breathe-dark 1.5s ease-in-out infinite !important;
}
.notice {
background-color: #483d8b !important;
background-color: var(--dark-primary) !important;
}
/* Improved the aleart-message background color during device restart (dark mode only) */
.errorbox,
.alert-message {
background-color: #333333;
}
.cbi-input-find,
.cbi-input-save,
.cbi-button-add,
.cbi-button-save,
.cbi-button-find,
.cbi-input-reload,
.cbi-button-reload {
background-color: darkseagreen !important;
border-color: darkseagreen !important;
}
.cbi-button-reset,
.cbi-input-remove {
color: #fff !important;
background-color: darkorange !important;
border-color: darkorange !important;
}
.cbi-page-actions .cbi-button-apply,
.cbi-section-actions .cbi-button-edit,
.cbi-button-edit.important,
.cbi-button-apply.important,
.cbi-button-reload.important,
.cbi-button-action.important {
border: 1px #483d8b solid !important;
border: 1px var(--dark-primary) solid !important;
}
fieldset[id^="cbi-apply-"] {
background-color: #333333;
}
#detail-bubble>div {
border: 1px solid #ccc;
border-radius: 2px;
padding: 5px;
background: #252525;
}
/* Define the error text border breathe display animation (dark mode) */
@keyframes error-border-breathe-dark {
0%{
border-color: darkorange;
}
50%{
border-color: transparent;
}
100%{
border-color: darkorange;
}
}
/* Add border for error text box, and border breathe display animation to make it more noticeable (dark mode) */
.cbi-section-error>ul>li {
color: darkorange;
border: 2px solid darkorange ;
animation: error-border-breathe-dark 1.5s ease-in-out infinite;
}
.cbi-input-invalid,
.cbi-value-error input {
color: darkorange;
border: 1px dashed darkorange !important;
}
.node-services-vssr .block h4 span {
color: #ccc !important;
}
@supports (-webkit-backdrop-filter: none) or (backdrop-filter: none) {
.login-page .login-container .login-form {
-webkit-backdrop-filter: blur(var(--blur-radius-dark));
backdrop-filter: blur(var(--blur-radius-dark));
background-color: rgba(0, 0, 0, var(--blur-opacity-dark));
}
}
@media screen and (max-width:480px) {
.node-status-iptables>.main div>.cbi-map>form {
background-color: #1e1e1e;
box-shadow: 0 0 .5rem 0 rgba(0,0,0,0.35);
}
}

View File

@ -1,11 +1,11 @@
/**
* Argonne is a clean HTML5 theme for LuCI. It is based on luci-theme-material and Argonne Template
* Argon is a clean HTML5 theme for LuCI. It is based on luci-theme-material and Argon Template
*
* luci-theme-argonne
* luci-theme-argon
* Copyright 2020 Jerryk <jerrykuku@gmail.com>
*
* Have a bug? Please create an issue here on GitHub!
* https://github.com/kenzok78/luci-theme-argonne/issues
* https://github.com/jerrykuku/luci-theme-argon/issues
*
* luci-theme-bootstrap:
* Copyright 2008 Steven Barth <steven@midlink.org>
@ -18,7 +18,7 @@
* luci-theme-material:
* https://github.com/LuttyYang/luci-theme-material/
*
* Agron Theme
* Argon Theme
* https://demos.creative-tim.com/argon-dashboard/index.html
*
* Login background

View File

Before

Width:  |  Height:  |  Size: 15 KiB

After

Width:  |  Height:  |  Size: 15 KiB

View File

Before

Width:  |  Height:  |  Size: 69 KiB

After

Width:  |  Height:  |  Size: 69 KiB

View File

Before

Width:  |  Height:  |  Size: 28 KiB

After

Width:  |  Height:  |  Size: 28 KiB

View File

Before

Width:  |  Height:  |  Size: 2.5 KiB

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

Before

Width:  |  Height:  |  Size: 2.8 KiB

After

Width:  |  Height:  |  Size: 2.8 KiB

View File

Before

Width:  |  Height:  |  Size: 1019 B

After

Width:  |  Height:  |  Size: 1019 B

View File

Before

Width:  |  Height:  |  Size: 1.7 KiB

After

Width:  |  Height:  |  Size: 1.7 KiB

View File

Before

Width:  |  Height:  |  Size: 3.6 KiB

After

Width:  |  Height:  |  Size: 3.6 KiB

View File

Before

Width:  |  Height:  |  Size: 5.1 KiB

After

Width:  |  Height:  |  Size: 5.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 690 B

View File

Before

Width:  |  Height:  |  Size: 4.9 KiB

After

Width:  |  Height:  |  Size: 4.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 156 KiB

View File

Before

Width:  |  Height:  |  Size: 938 B

After

Width:  |  Height:  |  Size: 938 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 632 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 664 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 566 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 674 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 252 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 480 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 848 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 682 B

View File

Before

Width:  |  Height:  |  Size: 6.4 KiB

After

Width:  |  Height:  |  Size: 6.4 KiB

View File

Before

Width:  |  Height:  |  Size: 1.7 KiB

After

Width:  |  Height:  |  Size: 1.7 KiB

View File

Before

Width:  |  Height:  |  Size: 1.3 KiB

After

Width:  |  Height:  |  Size: 1.3 KiB

View File

@ -1,11 +1,11 @@
/**
* Argonne is a clean HTML5 theme for LuCI. It is based on luci-theme-material and Argonne Template
* Argon is a clean HTML5 theme for LuCI. It is based on luci-theme-material and Argon Template
*
* luci-theme-argonne
* Copyright 2019 Jerrykuku <jerrykuku@qq.com>
* luci-theme-argon
* Copyright 2023 Jerrykuku <jerrykuku@qq.com>
*
* Have a bug? Please create an issue here on GitHub!
* https://github.com/kenzok78/luci-theme-argonne/issues
* https://github.com/jerrykuku/luci-theme-argon/issues
*
* luci-theme-bootstrap:
* Copyright 2008 Steven Barth <steven@midlink.org>
@ -18,7 +18,7 @@
* luci-theme-material:
* https://github.com/LuttyYang/luci-theme-material/
*
* Agron Theme
* Argon Theme
* https://demos.creative-tim.com/argon-dashboard/index.html
*
* Login background
@ -27,22 +27,6 @@
* Licensed to the public under the Apache License 2.0
*/
/*
* Font generate by Icomoon<icomoon.io>
*/
(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;
@ -68,6 +52,7 @@
*/
function getCurrentNodeByUrl() {
var ret = false;
const urlReg = new RegExp(nodeUrl + "$")
if (!$('body').hasClass('logged-in')) {
luciLocation = ["Main", "Login"];
return true;
@ -81,7 +66,7 @@
var that = $(this);
var href = that.attr("href");
if (href.indexOf(nodeUrl) != -1) {
if (urlReg.test(href)) {
ulNode.click();
ulNode.next(".slide-menu").stop(true, true);
lastNode = that.parent();
@ -119,18 +104,6 @@
});
// define what element should be observed by the observer
// and what types of mutations trigger the callback
if ($("#cbi-dhcp-lan-ignore").length > 0) {
observer.observe(document.getElementById("cbi-dhcp-lan-ignore"), {
subtree: true,
attributes: true
});
}
/**
* hook menu click and add the hash
*/
@ -153,7 +126,7 @@
window.location = $($(this).find("a")[0]).attr("href");
return false;
});
/**
* fix submenu click
*/
@ -166,91 +139,11 @@
/**
* get current node and open it
*/
$(".cbi-button-up").val("");
$(".cbi-button-down").val("");
/**
* 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").width(0);
$(".main-right").css("overflow-y", "auto");
showSide = false;
} else {
$(".darkMask").stop(true).fadeIn("fast");
$(".main-left").width("15rem");
$(".main-right").css("overflow-y", "hidden");
showSide = true;
}
});
$(".darkMask").click(function () {
if (showSide) {
showSide = false;
$(".darkMask").stop(true).fadeOut("fast");
$(".main-left").width(0);
$(".main-right").css("overflow-y", "auto");
}
});
$(window).resize(function () {
if ($(window).width() > 921) {
$(".main-left").css("width", "");
$(".darkMask").stop(true);
$(".darkMask").css("display", "none");
showSide = false;
}
});
/**
* fix legend position
*/
$("legend").each(function () {
var that = $(this);
that.after("<span class='panel-title'>" + that.text() + "</span>");
});
$(".cbi-section-table-titles, .cbi-section-table-descr, .cbi-section-descr").each(function () {
var that = $(this);
if (that.text().trim() == "") {
that.css("padding", "0px");
}
});
$(".node-main-login > .main .cbi-value.cbi-value-last .cbi-input-text").focus(function () {
//$(".node-main-login > .main > .main-right > .login-bg").addClass("blur");
});
$(".node-main-login > .main .cbi-value.cbi-value-last .cbi-input-text").blur(function () {
//$(".node-main-login > .main > .main-right > .login-bg").removeClass("blur");
});
$(".main-right").focus();
$(".main-right").blur();
$("input").attr("size", "0");
if (getCurrentNodeByUrl()) {
mainNodeName = "node-" + luciLocation[0] + "-" + luciLocation[1];
mainNodeName = mainNodeName.replace(/[ \t\n\r\/]+/g, "_").toLowerCase();
$("body").addClass(mainNodeName);
}
if (mainNodeName != undefined) {
console.log(mainNodeName);
@ -273,5 +166,3 @@
break;
}
}
})(jQuery);

View File

@ -0,0 +1,64 @@
/**
* Argon is a clean HTML5 theme for LuCI. It is based on luci-theme-material and Argon Template
*
* luci-theme-argon
* Copyright 2023 Jerrykuku <jerrykuku@qq.com>
*
* Have a bug? Please create an issue here on GitHub!
* https://github.com/jerrykuku/luci-theme-argon/issues
*
* luci-theme-bootstrap:
* Copyright 2008 Steven Barth <steven@midlink.org>
* Copyright 2008 Jo-Philipp Wich <jow@openwrt.org>
* Copyright 2012 David Menting <david@nut-bolt.nl>
*
* MUI:
* https://github.com/muicss/mui
*
* luci-theme-material:
* https://github.com/LuttyYang/luci-theme-material/
*
* Argon Theme
* https://demos.creative-tim.com/argon-dashboard/index.html
*
* Login background
* https://unsplash.com/
*
* Licensed to the public under the Apache License 2.0
*/
/**
* Sidebar expand
*/
var showSide = false;
$(".showSide").click(function () {
if (showSide) {
$(".darkMask").stop(true).fadeOut("fast");
$(".main-left").width(0);
$(".main-right").css("overflow-y", "auto");
showSide = false;
} else {
$(".darkMask").stop(true).fadeIn("fast");
$(".main-left").width("15rem");
$(".main-right").css("overflow-y", "hidden");
showSide = true;
}
});
$(".darkMask").click(function () {
if (showSide) {
showSide = false;
$(".darkMask").stop(true).fadeOut("fast");
$(".main-left").width(0);
$(".main-right").css("overflow-y", "auto");
}
});
$(window).resize(function () {
if ($(window).width() > 921) {
$(".main-left").css("width", "");
$(".darkMask").stop(true);
$(".darkMask").css("display", "none");
showSide = false;
}
});

View File

@ -0,0 +1,103 @@
/**
* Argon is a clean HTML5 theme for LuCI. It is based on luci-theme-material and Argon Template
*
* luci-theme-argon
* Copyright 2023 Jerrykuku <jerrykuku@qq.com>
*
* Have a bug? Please create an issue here on GitHub!
* https://github.com/jerrykuku/luci-theme-argon/issues
*
* luci-theme-bootstrap:
* Copyright 2008 Steven Barth <steven@midlink.org>
* Copyright 2008 Jo-Philipp Wich <jow@openwrt.org>
* Copyright 2012 David Menting <david@nut-bolt.nl>
*
* MUI:
* https://github.com/muicss/mui
*
* luci-theme-material:
* https://github.com/LuttyYang/luci-theme-material/
*
* Argon Theme
* https://demos.creative-tim.com/argon-dashboard/index.html
*
* Login background
* https://unsplash.com/
*
* Licensed to the public under the Apache License 2.0
*/
/*
* Font generate by Icomoon<icomoon.io>
*/
(function ($) {
$(".main > .loading").fadeOut();
/**
* trim text, Remove spaces, wrap
* @param text
* @returns {string}
*/
function trimText(text) {
return text.replace(/[ \t\n\r]+/g, " ");
}
// define what element should be observed by the observer
// and what types of mutations trigger the callback
const observer = new MutationObserver(() => {
console.log("callback that runs when observer is triggered");
});
if ($("#cbi-dhcp-lan-ignore").length > 0) {
observer.observe(document.getElementById("cbi-dhcp-lan-ignore"), {
subtree: true,
attributes: true
});
}
$(".cbi-button-up").val("");
$(".cbi-button-down").val("");
/**
* 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;
}
});
}
});
/**
* fix legend position
*/
$("legend").each(function () {
var that = $(this);
that.after("<span class='panel-title'>" + that.text() + "</span>");
});
$(".cbi-section-table-titles, .cbi-section-table-descr, .cbi-section-descr").each(function () {
var that = $(this);
if (that.text().trim() == "") {
that.css("padding", "0px");
}
});
$(".node-main-login > .main .cbi-value.cbi-value-last .cbi-input-text").focus(function () {
//$(".node-main-login > .main > .main-right > .login-bg").addClass("blur");
});
$(".node-main-login > .main .cbi-value.cbi-value-last .cbi-input-text").blur(function () {
//$(".node-main-login > .main > .main-right > .login-bg").removeClass("blur");
});
$(".main-right").focus();
$(".main-right").blur();
$("input").attr("size", "0");
})(jQuery);

View File

@ -1,12 +1,12 @@
// compress: false
/**
* Argonne is a clean HTML5 theme for LuCI. It is based on luci-theme-material and Argonne Template
* Argon is a clean HTML5 theme for LuCI. It is based on luci-theme-material and Argon Template
*
* luci-theme-argonne
* luci-theme-argon
* Copyright 2020 Jerryk <jerrykuku@gmail.com>
*
* Have a bug? Please create an issue here on GitHub!
* https://github.com/kenzok78/luci-theme-argonne/issues
* https://github.com/jerrykuku/luci-theme-argon/issues
*
* luci-theme-bootstrap:
* Copyright 2008 Steven Barth <steven@midlink.org>
@ -19,7 +19,7 @@
* luci-theme-material:
* https://github.com/LuttyYang/luci-theme-material/
*
* Agron Theme
* Argon Theme
* https://demos.creative-tim.com/argon-dashboard/index.html
*
* Login background
@ -1060,7 +1060,7 @@ footer {
}
.cbi-button:active {
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.19), 0 5px 5px rgba(0, 0, 0, 0.23);
}
.cbi-button:disabled {
@ -1134,6 +1134,34 @@ form.inline+form.inline,
min-width: 2.5rem !important;
}
/* Replace LuCI's default file and folder type icons */
img[src="/luci-static/resources/cbi/reload.gif"] {
content: url("/luci-static/argon/img/reload.webp");
}
img[src="/luci-static/resources/cbi/file.gif"] {
content: url("/luci-static/argon/img/file.webp");
}
img[src="/luci-static/resources/cbi/add.gif"] {
content: url("/luci-static/argon/img/add.webp");
}
img[src="/luci-static/resources/cbi/remove.gif"] {
content: url("/luci-static/argon/img/remove.webp");
}
img[src="/luci-static/resources/cbi/edit.gif"] {
content: url("/luci-static/argon/img/edit.webp");
}
img[src="/luci-static/resources/cbi/fieldadd.gif"] {
content: url("/luci-static/argon/img/fieldadd.webp");
}
img[src="/luci-static/resources/cbi/link.gif"] {
content: url("/luci-static/argon/img/link.webp");
}
img[src="/luci-static/resources/cbi/find.gif"] {
content: url("/luci-static/argon/img/find.webp");
}
img[src="/luci-static/resources/cbi/folder.gif"] {
content: url("/luci-static/argon/img/folder.webp");
}
/* input */
.cbi-value input[type="password"],
@ -1268,13 +1296,14 @@ input[type="checkbox"] {
-webkit-appearance: none !important;
border: 1px solid #dee2e6;
width: 16px !important;
height: 16px !important;
width: 17px !important;
height: 17px !important;
padding: 0;
cursor: pointer;
transition: all 0.2s;
margin: 0.9rem 0.25rem 0 0.25rem;
margin: 0.5rem 0.25rem 0.7rem 0.25rem;
vertical-align: middle;
}
input[type="checkbox"]:checked {
@ -1289,7 +1318,8 @@ input[type="checkbox"]:checked {
}
ul li .cbi-input-checkbox {
margin: 0.5rem 0.25rem !important;
margin: 0.5rem 0.25rem 0.7rem 0.25rem !important;
vertical-align: middle !important;
}
.cbi-input-radio {
@ -1422,7 +1452,7 @@ ul li .cbi-input-checkbox {
.cbi-section-create {
margin: 0;
padding-left: 1rem;
padding-left: 0.5rem;
align-items: center;
}
@ -1495,12 +1525,47 @@ small {
display: none !important;
}
.cbi-section-error {
padding: 1.5rem;
color: #fb6340;
font-weight: 600;
/* Define the error text border breathe display animation */
@keyframes error-border-breathe {
0%{
border-color: #fb6340;
}
50%{
border-color: transparent;
}
100%{
border-color: #fb6340;
}
}
/* Center display error text box */
.cbi-section-error > ul{
text-align: center;
}
/* Add border for error text box, and border breathe display animation to make it more noticeable */
.cbi-section-error > ul > li {
font-weight: 600;
max-width: 60%;
color: #fb6340;
line-height: 1rem;
display: inline-block;
border: 2px solid #fb6340;
border-radius: 0.3rem;
animation: error-border-breathe 1.5s ease-in-out infinite;
padding-left: 4px;
padding-right: 4px;
padding-top: 2px;
padding-bottom: 2px;
}
.cbi-input-invalid,
.cbi-value-error input {
color: #fb6340;
border: 1px dashed #fb6340;
}
fieldset>fieldset {
margin: 0;
padding: 0;
@ -1571,6 +1636,7 @@ input[name="nslookup"] {
height: 1.6rem !important;
line-height: 1.6rem;
border-radius: .25rem;
overflow: hidden;
}
#swaptotal>div>div,
@ -1683,6 +1749,31 @@ td>table>tbody>tr>td,
text-decoration: none;
}
/* file selector button */
::file-selector-button {
color: #fff;
border-radius: .25rem;
border: 1px solid #2e6da4;
padding: .4rem .5rem;
background-color: #337ab7;
box-sizing: border-box;
cursor: pointer;
transition: all 0.2s ease-in-out;
}
::file-selector-button:hover,
::file-selector-button:focus,
::file-selector-button:active {
outline: 0;
text-decoration: none;
}
::file-selector-button:hover,
::file-selector-button:focus {
box-shadow: 0 0px 2px rgba(0, 0, 0, 0.12), 0 2px 2px rgba(0, 0, 0, 0.2);
}
::file-selector-button:active {
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.19), 0 5px 5px rgba(0, 0, 0, 0.23);
}
/* table */
@ -1835,6 +1926,46 @@ td>table>tbody>tr>td,
flex-basis: 12%;
}
/* Fix background color of table-titles */
.cbi-section-node>.cbi-section-table>tbody>.cbi-section-table-titles th {
background-color: var(--lighter);
border: none;
}
/* Fix background color of table-descr */
.cbi-section-node>.cbi-section-table>tbody>.cbi-section-table-descr th {
border: none;
}
/* Fix background color not change when the H tag is in the table rowstyle-1 */
.cbi-section-node>.cbi-section-table>tbody>.cbi-rowstyle-1 th {
background-color: #fff;
border-top: 1px solid #ddd;
border-bottom: none;
}
/* Fix background color not change when the H tag is in the table rowstyle-2 */
.cbi-section-node>.cbi-section-table>tbody>.cbi-rowstyle-2 th {
background-color: #f9f9f9;
border-top: 1px solid #ddd;
border-bottom: none;
}
/* Change the color of the H label in the table to make it more visible */
th h1, td h1,
th h2, td h2,
th h3, td h3,
th h4, td h4,
th h5, td h5,
th h6, td h6 {
background: var(--lighter);
}
/* OCD: Change the background color of the "now in use" node in PassWall */
.cbi-section-table>tbody>._now_use {
background: #5e72e473 !important;
}
/* language fix */
body.lang_pl.node-main-login .cbi-value-title {
width: 12rem;
@ -2165,11 +2296,21 @@ table>thead>tr>th,
margin-bottom: 0;
}
.cbi-section-table-row>.cbi-value-field .cbi-dropdown,
.cbi-section-table-row>.cbi-value-field .cbi-input-select,
.cbi-section-table-row>.cbi-value-field .cbi-input-text,
.cbi-section-table-row>.cbi-value-field .cbi-input-password,
.cbi-section-table-row>.cbi-value-field .cbi-dropdown {
width: 100%;
.cbi-section-table-row>.cbi-value-field .cbi-input-password{
width:100%
}
.cbi-section-table-row>.cbi-value-field .cbi-input-text,
.cbi-section-table-row>.cbi-value-field .cbi-input-password{
min-width:100px
}
#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%;
}
.cbi-section-table-row>.cbi-value-field [data-dynlist]>input,
@ -2193,10 +2334,27 @@ div>.table>.tbody>.tr:nth-of-type(2n) {
color: #fff !important;
}
.warning {
background-color: #fb6340 !important;
background-color: var(--warning) !important;
color: #fff !important;
/* Define the warning background-color breathe display animation */
@keyframes warning-background-color-breathe {
0%{
color: #fff;
background-color: #fb6340;
}
50%{
color: #32325d;
background-color: #fff;
}
100%{
color: #fff;
background-color: #fb6340;
}
}
.warning,
.warning * {
background-color: #fb6340;
background-color: var(--warning);
color: #fff;
animation: warning-background-color-breathe 1.5s ease-in-out infinite !important;
}
.notice {
@ -2373,7 +2531,6 @@ table>thead>tr>th {
padding-top: .75rem;
padding-bottom: .75rem;
letter-spacing: 1px;
text-transform: uppercase;
border-bottom: 1px solid #e9ecef;
}
@ -2484,7 +2641,7 @@ td>table>tbody>tr>td {
.cbi-tabmenu {
color: white;
padding: 0.5rem 1rem 0 1rem;
padding: 0.5rem 0.5rem 0 0.5rem;
white-space: nowrap;
overflow-x: auto;
border-bottom: 1px solid #ddd !important;
@ -2811,7 +2968,7 @@ select[multiple="multiple"] {
.cbi-section-node .cbi-value {
padding: 0.3rem 1rem 0.3rem 1rem;
padding: 0.5rem 1rem 0.5rem 1rem !important;
}
@ -2827,6 +2984,18 @@ select[multiple="multiple"] {
}
/* Fix text position of the luci-app-filebrowser running state */
#cbi-filebrowser>.cbi-section>.cbi-section>.cbi-value>.cbi-value-field,
/* Fix text position of the luci-apps running state of the [Control] type */
form>.cbi-map>.cbi-section>.cbi-section-node>.cbi-value>.cbi-value-field font {
word-wrap: break-word;
font-size: 0.875rem;
line-height: 1.6;
padding: 0.7rem;
padding-left: 0;
text-align: right;
display: table-cell;
}
.cbi-value-helpicon>img {
@ -2851,7 +3020,6 @@ select[multiple="multiple"] {
padding: .7rem;
padding-left: 0;
width: 23rem;
float: left;
text-align: right;
display: table-cell;
}
@ -3097,21 +3265,25 @@ td>.ifacebadge,
margin-top: 0.3rem;
}
.cbi-value-field .cbi-input-checkbox,
.cbi-value-field .cbi-input-radio {
margin: 0.9rem 0.25rem 0 0.25rem;
.cbi-value-field .cbi-input-checkbox {
margin: 0.5rem 0.25rem 0.7rem 0.25rem;
vertical-align: middle;
height: 1rem;
line-height: 1.6;
}
.cbi-input-checkbox {
margin: 0.9rem 0.25rem 0 0.25rem;
margin: 0.5rem 0.25rem 0.7rem 0.25rem;
vertical-align: middle;
}
.cbi-value-field .cbi-input-radio {
margin: 0rem 0.25rem;
}
.cbi-input-radio {
margin: 0rem 0.25rem;
}
.cbi-value-field>input+.cbi-value-description {
padding: 0;
@ -3139,7 +3311,7 @@ td>.ifacebadge,
}
.cbi-section-create>.cbi-button-add {
margin: 0.5rem 0.5rem 0.5rem 0.5rem;
margin: 0.75rem 0.75rem 0.75rem 0.25rem;
}
.cbi-section-remove {
@ -3276,6 +3448,10 @@ input[name="nslookup"] {
border-right: 0 !important;
background-color: #5e72e4 !important;
background-color: var(--primary) !important;
height: 100% !important;
background-image: url(../img/trafficbar.png);
background-position: left top;
animation: sparkle 1500ms linear infinite;
}
}
@ -3555,17 +3731,10 @@ input[name="nslookup"] {
font-size: 1.7rem;
}
header>.fill>.container>.brand {
display: inline-block;
}
.cbi-value-title {
width: 9rem;
padding-right: 1rem;
}
.node-network-diagnostics>.main .cbi-map fieldset>div * {
width: 100% !important;
}
@ -3716,13 +3885,6 @@ input[name="nslookup"] {
position: relative;
}
.cbi-value-field .cbi-input-checkbox,
.cbi-value-field .cbi-input-radio {
margin: 0rem 0.25rem 0 0.25rem;
height: 1rem;
line-height: 1.6;
}
.cbi-page-actions>div>input {
display: none;
}

View File

@ -1,12 +1,12 @@
// compress: true
/**
* Argonne is a clean HTML5 theme for LuCI. It is based on luci-theme-material and Argonne Template
* Argon is a clean HTML5 theme for LuCI. It is based on luci-theme-material and Argon Template
*
* luci-theme-argonne
* luci-theme-argon
* Copyright 2020 Jerryk <jerrykuku@gmail.com>
*
* Have a bug? Please create an issue here on GitHub!
* https://github.com/kenzok78/luci-theme-argonne/issues
* https://github.com/jerrykuku/luci-theme-argon/issues
*
* luci-theme-bootstrap:
* Copyright 2008 Steven Barth <steven@midlink.org>
@ -19,7 +19,7 @@
* luci-theme-material:
* https://github.com/LuttyYang/luci-theme-material/
*
* Agron Theme
* Argon Theme
* https://demos.creative-tim.com/argon-dashboard/index.html
*
* Login background
@ -272,6 +272,7 @@ table>thead>tr>td {
div {
background-color: #32325d !important;
background-color: var(--dark-primary) !important;
}
}
@ -287,7 +288,7 @@ table>thead>tr>th {
}
.cbi-rowstyle-2 {
background-color: #1e1e1e;
background-color: #2c2c2c !important;
}
.cbi-rowstyle-1 {
@ -306,7 +307,12 @@ table>thead>tr>th {
.cbi-button {
color: #ccc;
background-color: #252526;
background-color: #2c2c2c;
}
.cbi-rowstyle-2 .cbi-button-up,
.cbi-rowstyle-2 .cbi-button-down {
background-color: #252526 !important;
}
.cbi-section-node {
@ -326,6 +332,72 @@ div>.table>.tbody>.tr:nth-of-type(2n) {
background-color: #252526;
}
/* file selector button */
::file-selector-button {
border: 1px solid darkseagreen !important;
background-color: darkseagreen !important;
}
/* Fix background color of table-titles */
.cbi-section-node>.cbi-section-table>tbody>.cbi-section-table-titles th {
background-color: #1e1e1e;
border: none !important;
}
/* Fix background color of table-descr */
.cbi-section-node>.cbi-section-table>tbody>.cbi-section-table-descr th {
background-color: #333333;
border: none !important;
}
/* Fix background color not change when the H tag is in the table rowstyle-1 */
.cbi-section-node>.cbi-section-table>tbody>.cbi-rowstyle-1 th {
background-color: #252526;
border-top: 1px solid #252526;
border-bottom: none !important;
}
/* Fix background color not change when the H tag is in the table rowstyle-2 */
.cbi-section-node>.cbi-section-table>tbody>.cbi-rowstyle-2 th {
background-color: #2c2c2c;
border-top: 1px solid #252526;
border-bottom: none !important;
}
/* Change the color of the H label in the table to make it more visible */
th h1, td h1,
th h2, td h2,
th h3, td h3,
th h4, td h4,
th h5, td h5,
th h6, td h6 {
background: var(--gray-dark);
}
/* Improved the background color of each itemes in "UNSAVED CHANGES" (dark mode only) */
.uci-change-list del,
.uci-change-legend-label del {
background-color: #fb74008c;
}
.uci-change-list var,
.uci-change-legend-label var {
background-color: #333333;
}
.uci-change-list ins,
.uci-change-legend-label ins {
background-color: #00ff0a45 !important;
}
/* OCD: Compatible the background color of the "Add the node via the link" & "USE(node)" pop-up window in PassWall (dark mode only) */
#add_link_div,
#set_node_div {
background-color: #333333f0 !important;
box-shadow: #00000094 10px 10px 30px 5px !important;
}
#add_link_div>.cbi-value>.cbi-value-field>#nodes_link {
background: #ccc;
}
#content_syslog {
box-shadow: 0 0 0.5rem 0 rgba(0, 0, 0, .35)
}
@ -464,7 +536,7 @@ select {
}
.ifacebox {
background-color: none;
background-color: #1e1e1e;
border: 1px solid #1e1e1e;
}
@ -484,6 +556,30 @@ select {
background-color: #3c3c3c;
}
/* Fix firewall zone: "unspecified -or- create: " background color (dark mode only) */
div[onclick$="._fwzone_new').checked=true"] {
border: 1px solid #3c3c3c;
background-color: transparent !important;
}
/* Improve the background color of "Any zone" and "Device" when ADD/EDIT Rules in Firewall > Traffic Rules (dark mode only) */
label[for$=".src_any"],
label[for$=".dest_empty"],
label[for$=".dest_any"] {
background-color: #2888db !important;
}
/* Fix/add background color of wireless signal strength badge for dark mode */
td>.ifacebadge,
.td>.ifacebadge {
background-color: #3c3c3c;
}
/* Improved loading process gif color (dark mode only) */
img[src="/luci-static/resources/icons/loading.gif"] {
filter: invert(1);
}
div.cbi-value var,
td.cbi-value-field var {
color: #483d8b;
@ -541,11 +637,37 @@ td.cbi-value-field var {
background-color: darkolivegreen !important;
}
/* Define the warning background-color breathe display animation (dark mode) */
@keyframes warning-background-color-breathe-dark {
0%{
color: #fff;
background-color: darkorange;
}
50%{
color: #ccc;
background-color: #333333;
}
100%{
color: #fff;
background-color: darkorange;
}
}
.warning,
.warning * {
animation: warning-background-color-breathe-dark 1.5s ease-in-out infinite !important;
}
.notice {
background-color: #483d8b !important;
background-color: var(--dark-primary) !important;
}
/* Improved the aleart-message background color during device restart (dark mode only) */
.errorbox,
.alert-message {
background-color: #333333;
}
.cbi-input-find,
.cbi-input-save,
.cbi-button-add,
@ -587,8 +709,30 @@ fieldset[id^="cbi-apply-"] {
background: #252525;
}
.cbi-section-error {
/* Define the error text border breathe display animation (dark mode) */
@keyframes error-border-breathe-dark {
0%{
border-color: darkorange;
}
50%{
border-color: transparent;
}
100%{
border-color: darkorange;
}
}
/* Add border for error text box, and border breathe display animation to make it more noticeable (dark mode) */
.cbi-section-error>ul>li {
color: darkorange;
border: 2px solid darkorange ;
animation: error-border-breathe-dark 1.5s ease-in-out infinite;
}
.cbi-input-invalid,
.cbi-value-error input {
color: darkorange;
border: 1px dashed darkorange !important;
}
.node-services-vssr .block h4 span{

View File

@ -1,11 +1,11 @@
<%#
Argonne is a clean HTML5 theme for LuCI. It is based on luci-theme-material and Argonne Template
Argon is a clean HTML5 theme for LuCI. It is based on luci-theme-material Argon Template
luci-theme-argonne
Copyright 2019 Jerrykuku <jerrykuku@qq.com>
luci-theme-argon
Copyright 2020 Jerrykuku <jerrykuku@qq.com>
Have a bug? Please create an issue here on GitHub!
https://github.com/kenzok78/luci-theme-argonne/issues
https://github.com/jerrykuku/luci-theme-argon/issues
luci-theme-bootstrap:
Copyright 2008 Steven Barth <steven@midlink.org>
@ -18,7 +18,7 @@
luci-theme-material:
https://github.com/LuttyYang/luci-theme-material/
Agron Theme
Argon Theme
https://demos.creative-tim.com/argon-dashboard/index.html
Login background
@ -43,7 +43,7 @@
<div class="ftc">
<a class="luci-link" href="https://github.com/openwrt/luci">Powered by <%= ver.luciname %>
(<%= ver.luciversion %>)</a> /
<a href="https://github.com/kenzok78/luci-theme-argonne">ArgonneTheme <%# vPKG_VERSION %></a> /
<a href="https://github.com/jerrykuku/luci-theme-argon">ArgonTheme <%# vPKG_VERSION %></a> /
<%= ver.distversion %>
<% if #categories > 1 then %>
<ul class="breadcrumb pull-right" id="modemenu">
@ -58,31 +58,28 @@
</footer>
</div>
</div>
<script>
// thanks for Jo-Philipp Wich <jow@openwrt.org>
var luciLocation = <%= luci.http.write_json(luci.dispatcher.context.path) %>;
var winHeight = $(window).height();
$(window).resize(function () {
var winWidth = $(window).width()
if(winWidth < 600){
var newHeight = $(this).height();
var keyboradHeight = newHeight - winHeight;
$(".ftc").css("bottom", keyboradHeight + 30);
}
if($(document.body).height() < 525 ){
if($(".ftc").css('display') != 'none'){
$(".ftc").hide()
<script>
// thanks for Jo-Philipp Wich <jow@openwrt.org>
var winHeight = $(window).height();
$(window).resize(function () {
if($(document.body).height() < 525 ){
if($(".ftc").css('display') != 'none'){
$(".ftc").hide()
}
}else{
if($(".ftc").css('display') == 'none'){
$(".ftc").show()
}
}
}else{
if($(".ftc").css('display') == 'none'){
$(".ftc").show()
}
}
})
</script>
})
</script>
<script src="<%=media%>/js/script.js"></script>
<script>
if (window.orientation == 90 || window.orientation == -90) {
$(".ftc").hide()
}
</script>
<script src="<%=media%>/js/styles-argon.js<%# ?v=PKG_VERSION %>"></script>
</body>
</html>

View File

@ -1,11 +1,11 @@
<%#
Argonne is a clean HTML5 theme for LuCI. It is based on luci-theme-bootstrap and MUI and Argonne Template
Argon is a clean HTML5 theme for LuCI. It is based on luci-theme-bootstrap and MUI and Argon Template
luci-theme-argonne
luci-theme-argon
Copyright 2020 Jerryk <jerrykuku@gmail.com>
Have a bug? Please create an issue here on GitHub!
https://github.com/kenzok78/luci-theme-argonne/issues
https://github.com/jerrykuku/luci-theme-argon/issues
luci-theme-bootstrap:
Copyright 2008 Steven Barth <steven@midlink.org>
@ -15,7 +15,7 @@
MUI:
https://github.com/muicss/mui
Agron Theme
Argon Theme
https://demos.creative-tim.com/argon-dashboard/index.html
Licensed to the public under the Apache License 2.0
@ -44,7 +44,7 @@
local node = disp.context.dispatched
local categories = disp.node_childs(tree)
local currentNode = luci.dispatcher.context.path
local c = tree
local i, r
@ -108,22 +108,16 @@
end
end
local function render_submenu(prefix,parent, node)
local function render_submenu(prefix, node)
local childs = disp.node_childs(node)
if #childs > 0 then
local active = (currentNode[2] == parent) and "active" or ""
local display = (currentNode[2] == parent) and 'style="display: block;"' or ""
write('<ul class="slide-menu %s" %s>' %{
active,
display
})
write('<ul class="slide-menu">')
for i, r in ipairs(childs) do
local nnode = node.nodes[r]
local title = pcdata(striptags(translate(nnode.title)))
local subactive = (currentNode[3] == r) and 'class="active"' or ""
write('<li %s><a data-title="%s" href="%s">%s</a></li>' %{
subactive,
write('<li><a data-title="%s" href="%s">%s</a></li>' %{
title,
nodeurl(prefix, r, nnode.query),
title
@ -138,21 +132,20 @@
local childs = disp.node_childs(cattree)
if #childs > 0 then
write('<ul class="nav">')
for i, r in ipairs(childs) do
local nnode = cattree.nodes[r]
local grandchildren = disp.node_childs(nnode)
if #grandchildren > 0 then
local active = (currentNode[2] == r) and "active" or ""
local title = pcdata(striptags(translate(nnode.title)))
local en_title = pcdata(striptags(string.gsub(nnode.title," ","_")))
write('<li class="slide"><a class="menu %s" data-title="%s" href="#">%s</a>' %{
active,
write('<li class="slide"><a class="menu" data-title="%s" href="#">%s</a>' %{
en_title,
title
})
render_submenu(category .. "/" .. r,r, nnode)
render_submenu(category .. "/" .. r, nnode)
write('</li>')
else
local title = pcdata(striptags(translate(nnode.title)))
@ -196,17 +189,17 @@
-- Custom settings
local mode = 'normal'
local dark_css = fs.readfile('/www/luci-static/argonne/css/dark.css')
local dark_css = fs.readfile('/www/luci-static/argon/css/dark.css')
local bar_color = '#5e72e4'
local primary, dark_primary, blur_radius, blur_radius_dark, blur_opacity
if fs.access('/etc/config/argonne') then
primary = uci:get_first('argonne', 'global', 'primary')
dark_primary = uci:get_first('argonne', 'global', 'dark_primary')
blur_radius = uci:get_first('argonne', 'global', 'blur')
blur_radius_dark = uci:get_first('argonne', 'global', 'blur_dark')
blur_opacity = uci:get_first('argonne', 'global', 'transparency')
blur_opacity_dark = uci:get_first('argonne', 'global', 'transparency_dark')
mode = uci:get_first('argonne', 'global', 'mode')
if fs.access('/etc/config/argon') then
primary = uci:get_first('argon', 'global', 'primary')
dark_primary = uci:get_first('argon', 'global', 'dark_primary')
blur_radius = uci:get_first('argon', 'global', 'blur')
blur_radius_dark = uci:get_first('argon', 'global', 'blur_dark')
blur_opacity = uci:get_first('argon', 'global', 'transparency')
blur_opacity_dark = uci:get_first('argon', 'global', 'transparency_dark')
mode = uci:get_first('argon', 'global', 'mode')
bar_color = mode == 'dark' and dark_primary or primary
end
@ -240,11 +233,11 @@
<link rel="icon" type="image/png" sizes="32x32" href="<%=media%>/icon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="<%=media%>/icon/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="<%=media%>/icon/favicon-16x16.png">
<link rel="manifest" href="<%=media%>/icon/manifest.json">
<link rel="manifest" href="<%=media%>/icon/manifest.json" crossorigin="use-credentials">
<meta name="msapplication-TileColor" content="<%=bar_color%>">
<meta name="msapplication-TileImage" content="<%=media%>/icon/ms-icon-144x144.png">
<meta name="theme-color" content="<%=bar_color%>">
<link rel="stylesheet" href="<%=media%>/css/cascade.css?v=<%=math.random(1,100000)%>">
<link rel="stylesheet" href="<%=media%>/css/cascade.css<%# ?v=PKG_VERSION %>">
<style title="text/css">
<% if mode == 'normal' then %>
@media (prefers-color-scheme: dark) {
@ -253,7 +246,7 @@
<% elseif mode == 'dark' then %>
<%=dark_css%>
<% end -%>
<% if fs.access('/etc/config/argonne') then %>
<% if fs.access('/etc/config/argon') then %>
:root {
--primary: <%=primary%>;
--dark-primary: <%=dark_primary%>;
@ -273,11 +266,11 @@
<% end -%>
<script src="<%=resource%>/cbi.js<%# ?v=PKG_VERSION %>"></script>
<script src="<%=resource%>/xhr.js<%# ?v=PKG_VERSION %>"></script>
<script src="<%=media%>/js/jquery.min.js<%# ?v=PKG_VERSION %>"></script>
<script src="<%=media%>/js/jquery.min.js?v=3.5.1"></script>
</head>
<body
class="<%- if node then %><%= striptags( node.title ) %><%- end %> <% if luci.dispatcher.context.authsession then %>logged-in<% end %> lang_<%=luci.i18n.context.lang%> ">
class="<%- if node then %><%= striptags( node.title ) %><%- end %> <% if luci.dispatcher.context.authsession then %>logged-in<% end %> lang_<%=luci.i18n.context.lang%> <%=mode %> ">
<div class="main">
<div class="main-left">
@ -326,3 +319,12 @@
</noscript>
<% if category then render_tabmenu(category, cattree) end %>
<script>
// thanks for Jo-Philipp Wich <jow@openwrt.org>
var luciLocation = <%= luci.http.write_json(luci.dispatcher.context.path) %>;
</script>
<script src="<%=media%>/js/menu-argon.js<%# ?v=PKG_VERSION %>"></script>
<script src="<%=media%>/js/sidebar-argon.js<%# ?v=PKG_VERSION %>"></script>

View File

@ -0,0 +1,136 @@
<%#
Argon is a clean HTML5 theme for LuCI. It is based on luci-theme-bootstrap and MUI and Argon Template
luci-theme-argon
Copyright 2020 Jerrykuku <jerrykuku@qq.com>
Have a bug? Please create an issue here on GitHub!
https://github.com/jerrykuku/luci-theme-argon/issues
luci-theme-bootstrap:
Copyright 2008 Steven Barth <steven@midlink.org>
Copyright 2008-2016 Jo-Philipp Wich <jow@openwrt.org>
Copyright 2012 David Menting <david@nut-bolt.nl>
MUI:
https://github.com/muicss/mui
Argon Theme
https://demos.creative-tim.com/argon-dashboard/index.html
Licensed to the public under the Apache License 2.0
-%>
<%
local sys = require "luci.sys"
local util = require "luci.util"
local http = require "luci.http"
local disp = require "luci.dispatcher"
local fs = require "nixio.fs"
local nutil = require "nixio.util"
local uci = require 'luci.model.uci'.cursor()
local boardinfo = util.ubus("system", "board")
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
math.randomseed(tonumber(tostring(os.time()):reverse():sub(1, 9)))
-- Custom settings
local mode = 'normal'
local dark_css = fs.readfile('/www/luci-static/argon/css/dark.css')
local bar_color = '#5e72e4'
local primary, dark_primary, blur_radius, blur_radius_dark, blur_opacity
if fs.access('/etc/config/argon') then
primary = uci:get_first('argon', 'global', 'primary')
dark_primary = uci:get_first('argon', 'global', 'dark_primary')
blur_radius = uci:get_first('argon', 'global', 'blur')
blur_radius_dark = uci:get_first('argon', 'global', 'blur_dark')
blur_opacity = uci:get_first('argon', 'global', 'transparency')
blur_opacity_dark = uci:get_first('argon', 'global', 'transparency_dark')
mode = uci:get_first('argon', 'global', 'mode')
bar_color = mode == 'dark' and dark_primary or primary
end
-%>
<!DOCTYPE html>
<html lang="<%=luci.i18n.context.lang%>">
<head>
<meta charset="utf-8">
<title>
<%=striptags( (boardinfo.hostname or "?") .. ( (node and node.title) and ' - ' .. translate(node.title) or '')) %> - LuCI
</title>
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
<meta name="format-detection" content="telephone=no, email=no" />
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="mobile-web-app-capable" content="yes">
<meta name="x5-fullscreen" content="true">
<meta name="full-screen" content="yes">
<meta name="x5-page-mode" content="app">
<meta name="browsermode" content="application">
<meta name="msapplication-tap-highlight" content="no">
<meta name="msapplication-TileColor" content="<%=bar_color%>">
<meta name="application-name" content="<%=striptags( (boardinfo.hostname or "?") ) %> - LuCI">
<meta name="apple-mobile-web-app-title" content="<%=striptags( (boardinfo.hostname or "?") ) %> - LuCI">
<link rel="apple-touch-icon" sizes="60x60" href="<%=media%>/icon/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="<%=media%>/icon/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="144x144" href="<%=media%>/icon/apple-icon-144x144.png">
<link rel="icon" type="image/png" sizes="192x192" href="<%=media%>/icon/android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="<%=media%>/icon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="<%=media%>/icon/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="<%=media%>/icon/favicon-16x16.png">
<link rel="manifest" href="<%=media%>/icon/manifest.json" crossorigin="use-credentials">
<meta name="msapplication-TileColor" content="<%=bar_color%>">
<meta name="msapplication-TileImage" content="<%=media%>/icon/ms-icon-144x144.png">
<meta name="theme-color" content="<%=bar_color%>">
<link rel="stylesheet" href="<%=media%>/css/cascade.css<%# ?v=PKG_VERSION %>">
<style title="text/css">
<% if mode == 'normal' then %>
@media (prefers-color-scheme: dark) {
<%=dark_css%>
}
<% elseif mode == 'dark' then %>
<%=dark_css%>
<% end -%>
<% if fs.access('/etc/config/argon') then %>
:root {
--primary: <%=primary%>;
--dark-primary: <%=dark_primary%>;
--blur-radius:<%=blur_radius%>px;
--blur-opacity:<%=blur_opacity%>;
--blur-radius-dark:<%=blur_radius_dark%>px;
--blur-opacity-dark:<%=blur_opacity_dark%>;
}
<% end -%>
</style>
<link rel="shortcut icon" href="<%=media%>/favicon.ico">
<% if node and node.css then %>
<link rel="stylesheet" href="<%=resource%>/<%=node.css%>">
<% end -%>
<% if css then %>
<style title="text/css">
<%=css %>
</style>
<% end -%>
<script src="<%=resource%>/cbi.js<%# ?v=PKG_VERSION %>"></script>
<script src="<%=resource%>/xhr.js<%# ?v=PKG_VERSION %>"></script>
<script src="<%=media%>/js/jquery.min.js?v=3.5.1"></script>
</head>
<body class="<%- if node then %><%= striptags( node.title ) %><%- end %> <% if luci.dispatcher.context.authsession then %>logged-in<% end %> lang_<%=luci.i18n.context.lang%> ">

View File

@ -1,6 +1,6 @@
<%#
Copyright 2008 Steven Barth <steven@midlink.org>
Copyright 2008 Jo-Philipp Wich <jow@openwrt.org>
Copyright 2008-2019 Jo-Philipp Wich <jo@mein.io>
Licensed to the public under the Apache License 2.0.
-%>

View File

@ -1,11 +1,11 @@
<%#
Argonne is a clean HTML5 theme for LuCI. It is based on luci-theme-bootstrap and MUI and Argonne Template
Argon is a clean HTML5 theme for LuCI. It is based on luci-theme-bootstrap and MUI and Argon Template
luci-theme-argonne
luci-theme-argon
Copyright 2021 Jerryk <jerrykuku@gmail.com>
Have a bug? Please create an issue here on GitHub!
https://github.com/kenzok78/luci-theme-argonne/issues
https://github.com/jerrykuku/luci-theme-argon/issues
luci-theme-bootstrap:
Copyright 2008 Steven Barth <steven@midlink.org>
@ -14,8 +14,8 @@
MUI:
https://github.com/muicss/mui
Agron Theme
Argon Theme
https://demos.creative-tim.com/argon-dashboard/index.html
Licensed to the public under the Apache License 2.0
@ -23,16 +23,16 @@
<%+header_login%>
<%
local util = require "luci.util"
local fs = require "nixio.fs"
local nutil = require "nixio.util"
local sys = require "luci.sys"
local json = require "luci.jsonc"
local uci = require 'luci.model.uci'.cursor()
local util = require "luci.util"
local fs = require "nixio.fs"
local nutil = require "nixio.util"
local json = require "luci.jsonc"
local sys = require "luci.sys"
local uci = require 'luci.model.uci'.cursor()
-- Fetch Local Background Media
function glob(...)
local function glob(...)
local iter, code, msg = fs.glob(...)
if iter then
return nutil.consume(iter)
@ -41,64 +41,84 @@
end
end
function fetchMedia(path,themeDir)
local backgroundTable = {}
local backgroundCount = 0
local imageTypes = " jpg png gif webp "
local videoTypes = " mp4 webm "
local allTypes = imageTypes .. videoTypes
local function fetchMedia(path, themeDir)
local backgroundTable = {}
local backgroundCount = 0
for i, f in ipairs(glob(path)) do
attr = fs.stat(f)
if attr then
local ext = fs.basename(f):match(".+%.(%w+)$")
if ext == "jpg" or ext == "png" or ext == "gif" or ext == "mp4" then
if ext ~= nil then
ext = ext:lower()
end
if ext ~= nil and string.match(allTypes, " "..ext.." ") ~= nil then
local bg = {}
bg.type = ext
bg.url = themeDir .. fs.basename(f)
table.insert(backgroundTable,bg)
table.insert(backgroundTable, bg)
backgroundCount = backgroundCount + 1
end
end
end
return backgroundTable,backgroundCount
return backgroundTable, backgroundCount
end
local function selectBackground(themeDir)
local bgUrl = media .. "/img/bg1.jpg"
local backgroundType = "Image"
local mimeType = ""
if fs.access("/etc/config/argon") then
local online_wallpaper = uci:get_first('argon', 'global', 'online_wallpaper') or (uci:get_first('argon', 'global', 'bing_background') == '1' and 'bing')
if (online_wallpaper and online_wallpaper ~= "none") then
local picurl = sys.exec("/usr/libexec/argon/online_wallpaper")
if (picurl and picurl ~= '') then
return picurl, "Image", ""
end
end
end
local backgroundTable, backgroundCount = fetchMedia("/www" .. themeDir .. "*", themeDir)
if ( backgroundCount > 0 ) then
local currentBg = backgroundTable[math.random(1, backgroundCount)]
bgUrl = currentBg.url
if (string.match(videoTypes, " "..currentBg.type.." ") ~= nil) then
backgroundType = "Video"
mimeType = "video/" .. currentBg.type
end
end
return bgUrl, backgroundType, mimeType
end
local boardinfo = util.ubus("system", "board")
local bingUrl = "http://www.bing.com/"
local bingApiUrl = bingUrl .. "HPImageArchive.aspx?format=js&idx=0&n=1&mkt=en-US"
local themeDir = media .. "/background/"
local bgUrl = media .. "/img/bg1.jpg"
local useBing = fs.access('/etc/config/argonne') and uci:get_first('argonne', 'global', 'bing_background') or "0"
local backgroundTable, backgroundCount = fetchMedia("/www" .. themeDir .. "*",themeDir)
local backgroundType = "Image"
function getBing()
local bing = sys.exec("wget --timeout=0.5 -qO- '%s'" %bingApiUrl)
if (bing and bing ~= '') then
bgUrl = bingUrl .. json.parse(bing).images[1].url
end
end
if ( useBing == "0" ) then
if ( backgroundCount > 0 ) then
local currentBg = backgroundTable[math.random(1,backgroundCount)]
bgUrl = currentBg.url
if (currentBg.type == "mp4" ) then
backgroundType = "Video"
end
end
else
pcall(getBing)
end
local bgUrl, backgroundType, mimeType = selectBackground(themeDir)
%>
<!-- Login Page Start -->
<div class="login-page">
<% if ( backgroundType == "Video" ) then %>
<!-- Video Player Start -->
<div class="video ar-flex ar-justify-content-center ar-align-items-center">
<div class="video">
<video autoplay loop muted id="video">
<source src="<%=bgUrl%>" type="video/mp4">
<source src="<%=bgUrl%>" type="<%=mimeType%>">
</video>
</div>
<div class="volume-control mute"></div>
<script>
$(".volume-control").click(function(){
if($(this).hasClass("mute")){
$(this).removeClass("mute")
$("#video").prop('muted', false);
}else{
$(this).addClass("mute")
$("#video").prop('muted', true);
}
})
</script>
<!-- Video Player End -->
<% else %>
<!-- Image Background Start -->
@ -108,8 +128,12 @@
<!-- Login Container Start -->
<div class="login-container">
<div class="login-form">
<a class="brand" href="/"><img src="<%=media%>/img/argonne.svg" class="icon"><span
class="brand-text"><%=striptags( (boardinfo.hostname or "?") .. ( (node and node.title) and ' - ' .. translate(node.title) or '')) %></span></a>
<!-- Logo Start -->
<a class="brand" href="/"><img src="<%=media%>/img/argon.svg" class="icon">
<span class="brand-text"><%=striptags( (boardinfo.hostname or "?") ) %></span>
</a>
<!-- Logo End -->
<!-- Login Form Start -->
<form class="form-login" method="post" action="<%=pcdata(luci.http.getenv("REQUEST_URI"))%>">
<%- if fuser then %>
@ -130,7 +154,7 @@
<input type="submit" value="<%:Login%>" class="cbi-button cbi-button-apply" />
</div>
</form>
<!-- Login Form End -->
<script type="text/javascript">//<![CDATA[
var input = document.getElementsByName('luci_password')[0];
if (input)

View File

@ -1,12 +1,12 @@
#!/bin/sh
sed -i ":a;$!N;s/tmpl.render.*sysauth_template.*return/local scope = { duser = default_user, fuser = user }\nlocal ok, res = luci.util.copcall\(luci.template.render_string, [[<% include\(\"themes\/\" .. theme .. \"\/sysauth\"\) %>]], scope\)\nif ok then\nreturn res\nend\nreturn luci.template.render\(\"sysauth\", scope\)/;ba" /usr/lib/lua/luci/dispatcher.lua
sed -i ":a;$!N;s/t.render.*sysauth_template.*return/local scope = { duser = h, fuser = a }\nlocal ok, res = luci.util.copcall\(luci.template.render_string, [[<% include\(\"themes\/\" .. theme .. \"\/sysauth\"\) %>]], scope\)\nif ok then\nreturn res\nend\nreturn luci.template.render\(\"sysauth\", scope\)/;ba" /usr/lib/lua/luci/dispatcher.lua
[ -f /usr/lib/lua/luci/view/themes/argonne/out_header_login.htm ] && mv -f /usr/lib/lua/luci/view/themes/argonne/out_header_login.htm /usr/lib/lua/luci/view/header_login.htm
[ -f /usr/lib/lua/luci/view/themes/argon/out_header_login.htm ] && mv -f /usr/lib/lua/luci/view/themes/argon/out_header_login.htm /usr/lib/lua/luci/view/header_login.htm
rm -Rf /var/luci-modulecache
rm -Rf /var/luci-indexcache
uci batch <<-EOF
set luci.themes.Argonne=/luci-static/argonne
set luci.main.mediaurlbase=/luci-static/argonne
set luci.themes.Argone=/luci-static/argone
set luci.main.mediaurlbase=/luci-static/argone
commit luci
EOF
exit 0

View File

@ -0,0 +1,70 @@
#!/bin/sh
# author jjm2473
# the script will be excuted when `argon.@global[0].bing_background == '1'`
# defaults to 'bing' to be compatible with old config
WEB_PIC_SRC=$(uci -q get argon.@global[0].online_wallpaper || echo 'bing')
CACHE=/var/run/argon_${WEB_PIC_SRC}.url
WRLOCK=/var/lock/argon_${WEB_PIC_SRC}.lock
fetch_pic_url() {
case $WEB_PIC_SRC in
bing)
local picpath=$(curl -fks --max-time 3 \
"https://www.bing.com/HPImageArchive.aspx?format=js&n=1" |
jsonfilter -q -e '@.images[0].url')
[ -n "${picpath}" ] && echo "//www.bing.com${picpath}"
;;
unsplash)
curl -fks --max-time 3 \
"https://source.unsplash.com/1920x1080/daily?wallpapers" |
sed -E 's#^.*href="([^?]+)\?.*$#\1?fm=jpg\&fit=crop\&w=1920\&h=1080#'
;;
unsplash_*)
local collection_id=${WEB_PIC_SRC#unsplash_}
curl -fks --max-time 3 \
"https://source.unsplash.com/collection/${collection_id}/1920x1080" |
sed -E 's#^.*href="([^?]+)\?.*$#\1?fm=jpg\&fit=crop\&w=1920\&h=1080#'
;;
esac
}
try_update() {
local lock="$WRLOCK"
exec 200>$lock
if flock -n 200 >/dev/null 2>&1; then
local picurl=$(fetch_pic_url)
if [ -n "$picurl" ]; then
echo "${picurl}" | tee "$CACHE"
else
if [ -s "$CACHE" ]; then
cat "$CACHE"
else
touch "$CACHE"
fi
fi
flock -u 200 >/dev/null 2>&1
elif [ -s "$CACHE" ]; then
cat "$CACHE"
fi
}
get_url() {
if [ -f "$CACHE" ]; then
local idle_t=$(($(date '+%s') - $(date -r "$CACHE" '+%s' 2>/dev/null || echo '0')))
if [ -s "$CACHE" ]; then
if [ $idle_t -le 43200 ]; then
cat "$CACHE"
return
fi
else
if [ $idle_t -le 120 ]; then
return
fi
fi
fi
try_update
}
get_url

View File

@ -1,10 +0,0 @@
#### argon 原作者是jerrykuku
#### 改argonne是为了编译方便
+ main默认支持luci-18.06
```bash
git clone https://github.com/kenzok78/luci-theme-argonne
```
+ 21.02分支支持最新luci
```bash
git clone -b 21.02 https://github.com/kenzok78/luci-theme-argonne
```

File diff suppressed because one or more lines are too long

Binary file not shown.

Before

Width:  |  Height:  |  Size: 75 KiB

View File

@ -1,135 +0,0 @@
<%#
Argonne is a clean HTML5 theme for LuCI. It is based on luci-theme-bootstrap and MUI and Argonne Template
luci-theme-argonne
Copyright 2020 Jerryk <jerrykuku@gmail.com>
Have a bug? Please create an issue here on GitHub!
https://github.com/kenzok78/luci-theme-argonne/issues
luci-theme-bootstrap:
Copyright 2008 Steven Barth <steven@midlink.org>
Copyright 2008-2016 Jo-Philipp Wich <jow@openwrt.org>
Copyright 2012 David Menting <david@nut-bolt.nl>
MUI:
https://github.com/muicss/mui
Agron Theme
https://demos.creative-tim.com/argon-dashboard/index.html
Licensed to the public under the Apache License 2.0
-%>
<%
local sys = require "luci.sys"
local util = require "luci.util"
local http = require "luci.http"
local disp = require "luci.dispatcher"
local fs = require "nixio.fs"
local nutil = require "nixio.util"
local uci = require 'luci.model.uci'.cursor()
local boardinfo = util.ubus("system", "board")
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
math.randomseed(tonumber(tostring(os.time()):reverse():sub(1, 9)))
-- Custom settings
local mode = 'normal'
local dark_css = fs.readfile('/www/luci-static/argonne/css/dark.css')
local bar_color = '#5e72e4'
local primary, dark_primary, blur_radius, blur_radius_dark, blur_opacity
if fs.access('/etc/config/argonne') then
primary = uci:get_first('argonne', 'global', 'primary')
dark_primary = uci:get_first('argonne', 'global', 'dark_primary')
blur_radius = uci:get_first('argonne', 'global', 'blur')
blur_radius_dark = uci:get_first('argonne', 'global', 'blur_dark')
blur_opacity = uci:get_first('argonne', 'global', 'transparency')
blur_opacity_dark = uci:get_first('argonne', 'global', 'transparency_dark')
mode = uci:get_first('argonne', 'global', 'mode')
bar_color = mode == 'dark' and dark_primary or primary
end
-%>
<!DOCTYPE html>
<html lang="<%=luci.i18n.context.lang%>">
<head>
<meta charset="utf-8">
<title>
<%=striptags( (boardinfo.hostname or "?") .. ( (node and node.title) and ' - ' .. translate(node.title) or '')) %> - LuCI
</title>
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
<meta name="format-detection" content="telephone=no, email=no" />
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="mobile-web-app-capable" content="yes">
<meta name="x5-fullscreen" content="true">
<meta name="full-screen" content="yes">
<meta name="x5-page-mode" content="app">
<meta name="browsermode" content="application">
<meta name="msapplication-tap-highlight" content="no">
<meta name="msapplication-TileColor" content="<%=bar_color%>">
<meta name="application-name" content="<%=striptags( (boardinfo.hostname or "?") ) %> - LuCI">
<meta name="apple-mobile-web-app-title" content="<%=striptags( (boardinfo.hostname or "?") ) %> - LuCI">
<link rel="apple-touch-icon" sizes="60x60" href="<%=media%>/icon/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="<%=media%>/icon/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="144x144" href="<%=media%>/icon/apple-icon-144x144.png">
<link rel="icon" type="image/png" sizes="192x192" href="<%=media%>/icon/android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="<%=media%>/icon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="<%=media%>/icon/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="<%=media%>/icon/favicon-16x16.png">
<link rel="manifest" href="<%=media%>/icon/manifest.json">
<meta name="msapplication-TileColor" content="<%=bar_color%>">
<meta name="msapplication-TileImage" content="<%=media%>/icon/ms-icon-144x144.png">
<meta name="theme-color" content="<%=bar_color%>">
<link rel="stylesheet" href="<%=media%>/css/cascade.css?v=<%=math.random(1,100000)%>">
<style title="text/css">
<% if mode == 'normal' then %>
@media (prefers-color-scheme: dark) {
<%=dark_css%>
}
<% elseif mode == 'dark' then %>
<%=dark_css%>
<% end -%>
<% if fs.access('/etc/config/argonne') then %>
:root {
--primary: <%=primary%>;
--dark-primary: <%=dark_primary%>;
--blur-radius:<%=blur_radius%>px;
--blur-opacity:<%=blur_opacity%>;
--blur-radius-dark:<%=blur_radius_dark%>px;
--blur-opacity-dark:<%=blur_opacity_dark%>;
}
<% end -%>
</style>
<link rel="shortcut icon" href="<%=media%>/favicon.ico">
<% if node and node.css then %>
<link rel="stylesheet" href="<%=resource%>/<%=node.css%>">
<% end -%>
<% if css then %>
<style title="text/css"><%=css %></style>
<% end -%>
<script src="<%=resource%>/cbi.js<%# ?v=PKG_VERSION %>"></script>
<script src="<%=resource%>/xhr.js<%# ?v=PKG_VERSION %>"></script>
<script src="<%=media%>/js/jquery.min.js<%# ?v=PKG_VERSION %>"></script>
</head>
<body class="<%- if node then %><%= striptags( node.title ) %><%- end %> <% if luci.dispatcher.context.authsession then %>logged-in<% end %> lang_<%=luci.i18n.context.lang%> ">

View File

@ -48,6 +48,7 @@
- 适配深色模式,适配系统自动切换,支持自定义模式
- 适配openwrt 21/22、lede
- 支持插件式配置主题
- 流畅度比肩bootstrap
### 体验WebApp方法