update 2023-05-04 13:38:33
@ -1,17 +1,17 @@
|
|||||||
include $(TOPDIR)/rules.mk
|
include $(TOPDIR)/rules.mk
|
||||||
|
|
||||||
PKG_NAME:=luci-app-argonne-config
|
PKG_NAME:=luci-app-argone-config
|
||||||
PKG_VERSION:=1.2
|
PKG_VERSION:=1.2
|
||||||
PKG_RELEASE:=2
|
PKG_RELEASE:=2
|
||||||
|
|
||||||
PKG_MAINTAINER:=jerrykuku <jerrykuku@qq.com>
|
PKG_MAINTAINER:=jerrykuku <jerrykuku@qq.com>
|
||||||
|
|
||||||
LUCI_TITLE:=LuCI page for Argonne Config
|
LUCI_TITLE:=LuCI page for Argone Config
|
||||||
LUCI_PKGARCH:=all
|
LUCI_PKGARCH:=all
|
||||||
LUCI_DEPENDS:=+luci-compat +luci-theme-argonne
|
LUCI_DEPENDS:=+luci-compat
|
||||||
|
|
||||||
define Package/$(PKG_NAME)/conffiles
|
define Package/$(PKG_NAME)/conffiles
|
||||||
/etc/config/argonne
|
/etc/config/argone
|
||||||
endef
|
endef
|
||||||
|
|
||||||
include $(TOPDIR)/feeds/luci/luci.mk
|
include $(TOPDIR)/feeds/luci/luci.mk
|
@ -1,8 +1,8 @@
|
|||||||
# luci-app-argonne-config
|
# luci-app-argone-config
|
||||||
argonne Theme Config Plugin
|
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.
|
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主题。
|
+ 编译时无需再去删除源码自带的argon主题。
|
10
luci-app-argone-config/luasrc/controller/argone-config.lua
Normal 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
|
@ -4,7 +4,7 @@ local opkg = require 'luci.model.ipkg'
|
|||||||
local sys = require 'luci.sys'
|
local sys = require 'luci.sys'
|
||||||
local http = require 'luci.http'
|
local http = require 'luci.http'
|
||||||
local nutil = require 'nixio.util'
|
local nutil = require 'nixio.util'
|
||||||
local name = 'argonne'
|
local name = 'argone'
|
||||||
local uci = require 'luci.model.uci'.cursor()
|
local uci = require 'luci.model.uci'.cursor()
|
||||||
|
|
||||||
local fstat = nxfs.statvfs(opkg.overlay_root())
|
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 free_byte = space_free * fstat.frsize
|
||||||
|
|
||||||
local primary, dark_primary, blur_radius, blur_radius_dark, blur_opacity, mode
|
local primary, dark_primary, blur_radius, blur_radius_dark, blur_opacity, mode
|
||||||
if nxfs.access('/etc/config/argonne') then
|
if nxfs.access('/etc/config/argone') then
|
||||||
primary = uci:get_first('argonne', 'global', 'primary')
|
primary = uci:get_first('argone', 'global', 'primary')
|
||||||
dark_primary = uci:get_first('argonne', 'global', 'dark_primary')
|
dark_primary = uci:get_first('argone', 'global', 'dark_primary')
|
||||||
blur_radius = uci:get_first('argonne', 'global', 'blur')
|
blur_radius = uci:get_first('argone', 'global', 'blur')
|
||||||
blur_radius_dark = uci:get_first('argonne', 'global', 'blur_dark')
|
blur_radius_dark = uci:get_first('argone', 'global', 'blur_dark')
|
||||||
blur_opacity = uci:get_first('argonne', 'global', 'transparency')
|
blur_opacity = uci:get_first('argone', 'global', 'transparency')
|
||||||
blur_opacity_dark = uci:get_first('argonne', 'global', 'transparency_dark')
|
blur_opacity_dark = uci:get_first('argone', 'global', 'transparency_dark')
|
||||||
mode = uci:get_first('argonne', 'global', 'mode')
|
mode = uci:get_first('argone', 'global', 'mode')
|
||||||
bing_background = uci:get_first('argonne', 'global', 'bing_background')
|
bing_background = uci:get_first('argone', 'global', 'bing_background')
|
||||||
end
|
end
|
||||||
|
|
||||||
function glob(...)
|
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.reset = false
|
||||||
br.submit = false
|
br.submit = false
|
||||||
s = br:section(SimpleSection)
|
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
|
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)
|
nxfs.writefile('/tmp/aaa', data)
|
||||||
for key, value in pairs(data) do
|
for key, value in pairs(data) do
|
||||||
uci:set('argonne','@global[0]',key,value)
|
uci:set('argone','@global[0]',key,value)
|
||||||
end
|
end
|
||||||
uci:commit('argonne')
|
uci:commit('argone')
|
||||||
end
|
end
|
||||||
return true
|
return true
|
||||||
end
|
end
|
||||||
@ -125,14 +125,14 @@ ful = SimpleForm('upload', translate('Upload (Free: ') .. wa.byte_format(free_b
|
|||||||
ful.reset = false
|
ful.reset = false
|
||||||
ful.submit = 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 = sul:option(FileUpload, '')
|
||||||
fu.template = 'argonne-config/other_upload'
|
fu.template = 'argone-config/other_upload'
|
||||||
um = sul:option(DummyValue, '', nil)
|
um = sul:option(DummyValue, '', nil)
|
||||||
um.template = 'argonne-config/other_dvalue'
|
um.template = 'argone-config/other_dvalue'
|
||||||
|
|
||||||
local dir, fd
|
local dir, fd
|
||||||
dir = '/www/luci-static/argonne/background/'
|
dir = '/www/luci-static/argone/background/'
|
||||||
nxfs.mkdir(dir)
|
nxfs.mkdir(dir)
|
||||||
http.setfilehandler(
|
http.setfilehandler(
|
||||||
function(meta, chunk, eof)
|
function(meta, chunk, eof)
|
||||||
@ -156,7 +156,7 @@ http.setfilehandler(
|
|||||||
if eof and fd then
|
if eof and fd then
|
||||||
fd:close()
|
fd:close()
|
||||||
fd = nil
|
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
|
||||||
end
|
end
|
||||||
)
|
)
|
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"luci-app-argonne-config": {
|
"luci-app-argone-config": {
|
||||||
"description": "Grant UCI access for luci-app-argonne-config",
|
"description": "Grant UCI access for luci-app-argone-config",
|
||||||
"read": {
|
"read": {
|
||||||
"uci": [ "argonne" ]
|
"uci": [ "argonne" ]
|
||||||
},
|
},
|
@ -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
|
|
@ -6,19 +6,19 @@
|
|||||||
|
|
||||||
include $(TOPDIR)/rules.mk
|
include $(TOPDIR)/rules.mk
|
||||||
|
|
||||||
LUCI_TITLE:=Argonne kenzo
|
LUCI_TITLE:=Argone kenzo
|
||||||
LUCI_DEPENDS:=
|
LUCI_DEPENDS:=+curl +jsonfilter
|
||||||
PKG_VERSION:=1.7.3
|
PKG_VERSION:=1.7.7
|
||||||
PKG_RELEASE:=2
|
PKG_RELEASE:=3
|
||||||
|
|
||||||
include $(TOPDIR)/feeds/luci/luci.mk
|
include $(TOPDIR)/feeds/luci/luci.mk
|
||||||
|
|
||||||
|
|
||||||
define Package/luci-theme-argonne/postinst
|
define Package/luci-theme-Argone/postinst
|
||||||
#!/bin/sh
|
#!/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/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
|
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-modulecache
|
||||||
rm -Rf /var/luci-indexcache
|
rm -Rf /var/luci-indexcache
|
||||||
exit 0
|
exit 0
|
10
luci-theme-argone/README.md
Normal 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
|
||||||
|
```
|
@ -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>
|
* Copyright 2020 Jerryk <jerrykuku@gmail.com>
|
||||||
*
|
*
|
||||||
* Have a bug? Please create an issue here on GitHub!
|
* 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:
|
* luci-theme-bootstrap:
|
||||||
* Copyright 2008 Steven Barth <steven@midlink.org>
|
* Copyright 2008 Steven Barth <steven@midlink.org>
|
||||||
@ -18,7 +18,7 @@
|
|||||||
* luci-theme-material:
|
* luci-theme-material:
|
||||||
* https://github.com/LuttyYang/luci-theme-material/
|
* https://github.com/LuttyYang/luci-theme-material/
|
||||||
*
|
*
|
||||||
* Agron Theme
|
* Argon Theme
|
||||||
* https://demos.creative-tim.com/argon-dashboard/index.html
|
* https://demos.creative-tim.com/argon-dashboard/index.html
|
||||||
*
|
*
|
||||||
* Login background
|
* 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);
|
box-shadow: 0 0px 2px rgba(0, 0, 0, 0.12), 0 2px 2px rgba(0, 0, 0, 0.2);
|
||||||
}
|
}
|
||||||
.cbi-button:active {
|
.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 {
|
.cbi-button:disabled {
|
||||||
cursor: not-allowed;
|
cursor: not-allowed;
|
||||||
@ -947,6 +947,34 @@ form.inline + form.inline,
|
|||||||
.cbi-value-field .cbi-button-neutral {
|
.cbi-value-field .cbi-button-neutral {
|
||||||
min-width: 2.5rem !important;
|
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 */
|
/* input */
|
||||||
.cbi-value input[type="password"],
|
.cbi-value input[type="password"],
|
||||||
.cbi-value input[type="text"] {
|
.cbi-value input[type="text"] {
|
||||||
@ -1055,12 +1083,13 @@ input[type="checkbox"] {
|
|||||||
appearance: none !important;
|
appearance: none !important;
|
||||||
-webkit-appearance: none !important;
|
-webkit-appearance: none !important;
|
||||||
border: 1px solid #dee2e6;
|
border: 1px solid #dee2e6;
|
||||||
width: 16px !important;
|
width: 17px !important;
|
||||||
height: 16px !important;
|
height: 17px !important;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
transition: all 0.2s;
|
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 {
|
input[type="checkbox"]:checked {
|
||||||
border: 1px solid #5e72e4;
|
border: 1px solid #5e72e4;
|
||||||
@ -1073,7 +1102,8 @@ input[type="checkbox"]:checked {
|
|||||||
background-position: center;
|
background-position: center;
|
||||||
}
|
}
|
||||||
ul li .cbi-input-checkbox {
|
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 {
|
.cbi-input-radio {
|
||||||
appearance: none !important;
|
appearance: none !important;
|
||||||
@ -1186,7 +1216,7 @@ ul li .cbi-input-checkbox {
|
|||||||
}
|
}
|
||||||
.cbi-section-create {
|
.cbi-section-create {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding-left: 1rem;
|
padding-left: 0.5rem;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
.cbi-section-create > * {
|
.cbi-section-create > * {
|
||||||
@ -1245,10 +1275,41 @@ small {
|
|||||||
.cbi-section > legend {
|
.cbi-section > legend {
|
||||||
display: none !important;
|
display: none !important;
|
||||||
}
|
}
|
||||||
.cbi-section-error {
|
/* Define the error text border breathe display animation */
|
||||||
padding: 1.5rem;
|
@keyframes error-border-breathe {
|
||||||
color: #fb6340;
|
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;
|
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 {
|
fieldset > fieldset {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
@ -1309,6 +1370,7 @@ input[name="nslookup"] {
|
|||||||
height: 1.6rem !important;
|
height: 1.6rem !important;
|
||||||
line-height: 1.6rem;
|
line-height: 1.6rem;
|
||||||
border-radius: 0.25rem;
|
border-radius: 0.25rem;
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
#swaptotal > div > div,
|
#swaptotal > div > div,
|
||||||
#swapfree > div > div,
|
#swapfree > div > div,
|
||||||
@ -1400,6 +1462,30 @@ td > table > tbody > tr > td,
|
|||||||
.a-to-btn {
|
.a-to-btn {
|
||||||
text-decoration: none;
|
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 */
|
/* table */
|
||||||
.cbi-section-table .cbi-section-table-titles .cbi-section-table-cell {
|
.cbi-section-table .cbi-section-table-titles .cbi-section-table-cell {
|
||||||
width: auto !important;
|
width: auto !important;
|
||||||
@ -1514,6 +1600,40 @@ td > table > tbody > tr > td,
|
|||||||
#cbi-network-switch_vlan .td {
|
#cbi-network-switch_vlan .td {
|
||||||
flex-basis: 12%;
|
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 */
|
/* language fix */
|
||||||
body.lang_pl.node-main-login .cbi-value-title {
|
body.lang_pl.node-main-login .cbi-value-title {
|
||||||
width: 12rem;
|
width: 12rem;
|
||||||
@ -1777,12 +1897,20 @@ table > thead > tr > th,
|
|||||||
.cbi-section-table-row:last-child {
|
.cbi-section-table-row:last-child {
|
||||||
margin-bottom: 0;
|
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-select,
|
||||||
.cbi-section-table-row > .cbi-value-field .cbi-input-text,
|
.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-input-password {
|
||||||
.cbi-section-table-row > .cbi-value-field .cbi-dropdown {
|
|
||||||
width: 100%;
|
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 [data-dynlist] > input,
|
||||||
.cbi-section-table-row > .cbi-value-field input.cbi-input-password {
|
.cbi-section-table-row > .cbi-value-field input.cbi-input-password {
|
||||||
width: calc(100% - 1.5rem);
|
width: calc(100% - 1.5rem);
|
||||||
@ -1800,10 +1928,27 @@ div > .table > .tbody > .tr:nth-of-type(2n) {
|
|||||||
background-color: var(--danger) !important;
|
background-color: var(--danger) !important;
|
||||||
color: #fff !important;
|
color: #fff !important;
|
||||||
}
|
}
|
||||||
.warning {
|
/* Define the warning background-color breathe display animation */
|
||||||
background-color: #fb6340 !important;
|
@keyframes warning-background-color-breathe {
|
||||||
background-color: var(--warning) !important;
|
0%{
|
||||||
color: #fff !important;
|
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 {
|
.notice {
|
||||||
background-color: #5e72e4 !important;
|
background-color: #5e72e4 !important;
|
||||||
@ -1948,7 +2093,6 @@ table > thead > tr > th {
|
|||||||
padding-top: 0.75rem;
|
padding-top: 0.75rem;
|
||||||
padding-bottom: 0.75rem;
|
padding-bottom: 0.75rem;
|
||||||
letter-spacing: 1px;
|
letter-spacing: 1px;
|
||||||
text-transform: uppercase;
|
|
||||||
border-bottom: 1px solid #e9ecef;
|
border-bottom: 1px solid #e9ecef;
|
||||||
}
|
}
|
||||||
table > tbody > tr:first-child > td,
|
table > tbody > tr:first-child > td,
|
||||||
@ -2031,7 +2175,7 @@ td > table > tbody > tr > td {
|
|||||||
}
|
}
|
||||||
.cbi-tabmenu {
|
.cbi-tabmenu {
|
||||||
color: white;
|
color: white;
|
||||||
padding: 0.5rem 1rem 0 1rem;
|
padding: 0.5rem 0.5rem 0 0.5rem;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
border-bottom: 1px solid #ddd !important;
|
border-bottom: 1px solid #ddd !important;
|
||||||
@ -2297,7 +2441,7 @@ select[multiple="multiple"] {
|
|||||||
overflow-y: visible;
|
overflow-y: visible;
|
||||||
}
|
}
|
||||||
.cbi-section-node .cbi-value {
|
.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) {
|
.cbi-tabcontainer > .cbi-value:nth-of-type(2n) {
|
||||||
background-color: #f9f9f9;
|
background-color: #f9f9f9;
|
||||||
@ -2308,6 +2452,18 @@ select[multiple="multiple"] {
|
|||||||
line-height: 1.6;
|
line-height: 1.6;
|
||||||
font-size: 0.875rem;
|
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 {
|
.cbi-value-helpicon > img {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
@ -2327,7 +2483,6 @@ select[multiple="multiple"] {
|
|||||||
padding: 0.7rem;
|
padding: 0.7rem;
|
||||||
padding-left: 0;
|
padding-left: 0;
|
||||||
width: 23rem;
|
width: 23rem;
|
||||||
float: left;
|
|
||||||
text-align: right;
|
text-align: right;
|
||||||
display: table-cell;
|
display: table-cell;
|
||||||
}
|
}
|
||||||
@ -2515,18 +2670,22 @@ td > .ifacebadge,
|
|||||||
min-width: 10rem;
|
min-width: 10rem;
|
||||||
margin-top: 0.3rem;
|
margin-top: 0.3rem;
|
||||||
}
|
}
|
||||||
.cbi-value-field .cbi-input-checkbox,
|
.cbi-value-field .cbi-input-checkbox {
|
||||||
.cbi-value-field .cbi-input-radio {
|
margin: 0.5rem 0.25rem 0.7rem 0.25rem;
|
||||||
margin: 0.9rem 0.25rem 0 0.25rem;
|
vertical-align: middle;
|
||||||
height: 1rem;
|
height: 1rem;
|
||||||
line-height: 1.6;
|
line-height: 1.6;
|
||||||
}
|
}
|
||||||
.cbi-input-checkbox {
|
.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 {
|
.cbi-value-field .cbi-input-radio {
|
||||||
margin: 0rem 0.25rem;
|
margin: 0rem 0.25rem;
|
||||||
}
|
}
|
||||||
|
.cbi-input-radio {
|
||||||
|
margin: 0rem 0.25rem;
|
||||||
|
}
|
||||||
.cbi-value-field > input + .cbi-value-description {
|
.cbi-value-field > input + .cbi-value-description {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
@ -2547,7 +2706,7 @@ td > .ifacebadge,
|
|||||||
min-width: 7rem;
|
min-width: 7rem;
|
||||||
}
|
}
|
||||||
.cbi-section-create > .cbi-button-add {
|
.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 {
|
.cbi-section-remove {
|
||||||
padding: 0.5rem;
|
padding: 0.5rem;
|
||||||
@ -2651,6 +2810,10 @@ input[name="nslookup"] {
|
|||||||
border-right: 0 !important;
|
border-right: 0 !important;
|
||||||
background-color: #5e72e4 !important;
|
background-color: #5e72e4 !important;
|
||||||
background-color: var(--primary) !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 {
|
.node-system-leds .cbi-section em {
|
||||||
display: block;
|
display: block;
|
||||||
@ -2852,10 +3015,6 @@ input[name="nslookup"] {
|
|||||||
header > .fill > .container > .brand {
|
header > .fill > .container > .brand {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
.cbi-value-title {
|
|
||||||
width: 9rem;
|
|
||||||
padding-right: 1rem;
|
|
||||||
}
|
|
||||||
.node-network-diagnostics > .main .cbi-map fieldset > div * {
|
.node-network-diagnostics > .main .cbi-map fieldset > div * {
|
||||||
width: 100% !important;
|
width: 100% !important;
|
||||||
}
|
}
|
||||||
@ -2963,12 +3122,6 @@ input[name="nslookup"] {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
position: relative;
|
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 {
|
.cbi-page-actions > div > input {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
@ -3066,4 +3219,4 @@ input[name="nslookup"] {
|
|||||||
width: 2.3rem !important;
|
width: 2.3rem !important;
|
||||||
height: auto;
|
height: auto;
|
||||||
}
|
}
|
||||||
}
|
}
|
682
luci-theme-argone/htdocs/luci-static/argone/css/dark.css
Normal 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);
|
||||||
|
}
|
||||||
|
}
|
@ -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>
|
* Copyright 2020 Jerryk <jerrykuku@gmail.com>
|
||||||
*
|
*
|
||||||
* Have a bug? Please create an issue here on GitHub!
|
* 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:
|
* luci-theme-bootstrap:
|
||||||
* Copyright 2008 Steven Barth <steven@midlink.org>
|
* Copyright 2008 Steven Barth <steven@midlink.org>
|
||||||
@ -18,7 +18,7 @@
|
|||||||
* luci-theme-material:
|
* luci-theme-material:
|
||||||
* https://github.com/LuttyYang/luci-theme-material/
|
* https://github.com/LuttyYang/luci-theme-material/
|
||||||
*
|
*
|
||||||
* Agron Theme
|
* Argon Theme
|
||||||
* https://demos.creative-tim.com/argon-dashboard/index.html
|
* https://demos.creative-tim.com/argon-dashboard/index.html
|
||||||
*
|
*
|
||||||
* Login background
|
* Login background
|
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 15 KiB |
Before Width: | Height: | Size: 69 KiB After Width: | Height: | Size: 69 KiB |
Before Width: | Height: | Size: 28 KiB After Width: | Height: | Size: 28 KiB |
Before Width: | Height: | Size: 6.3 KiB After Width: | Height: | Size: 6.3 KiB |
Before Width: | Height: | Size: 5.1 KiB After Width: | Height: | Size: 5.1 KiB |
Before Width: | Height: | Size: 2.5 KiB After Width: | Height: | Size: 2.5 KiB |
Before Width: | Height: | Size: 2.8 KiB After Width: | Height: | Size: 2.8 KiB |
Before Width: | Height: | Size: 1019 B After Width: | Height: | Size: 1019 B |
Before Width: | Height: | Size: 1.7 KiB After Width: | Height: | Size: 1.7 KiB |
Before Width: | Height: | Size: 3.6 KiB After Width: | Height: | Size: 3.6 KiB |
Before Width: | Height: | Size: 5.1 KiB After Width: | Height: | Size: 5.1 KiB |
BIN
luci-theme-argone/htdocs/luci-static/argone/img/add.webp
Normal file
After Width: | Height: | Size: 690 B |
Before Width: | Height: | Size: 4.9 KiB After Width: | Height: | Size: 4.9 KiB |
BIN
luci-theme-argone/htdocs/luci-static/argone/img/bg1.jpg
Normal file
After Width: | Height: | Size: 156 KiB |
Before Width: | Height: | Size: 938 B After Width: | Height: | Size: 938 B |
BIN
luci-theme-argone/htdocs/luci-static/argone/img/edit.webp
Normal file
After Width: | Height: | Size: 632 B |
BIN
luci-theme-argone/htdocs/luci-static/argone/img/fieldadd.webp
Normal file
After Width: | Height: | Size: 664 B |
BIN
luci-theme-argone/htdocs/luci-static/argone/img/file.webp
Normal file
After Width: | Height: | Size: 566 B |
BIN
luci-theme-argone/htdocs/luci-static/argone/img/find.webp
Normal file
After Width: | Height: | Size: 674 B |
BIN
luci-theme-argone/htdocs/luci-static/argone/img/folder.webp
Normal file
After Width: | Height: | Size: 252 B |
BIN
luci-theme-argone/htdocs/luci-static/argone/img/link.webp
Normal file
After Width: | Height: | Size: 480 B |
BIN
luci-theme-argone/htdocs/luci-static/argone/img/reload.webp
Normal file
After Width: | Height: | Size: 848 B |
BIN
luci-theme-argone/htdocs/luci-static/argone/img/remove.webp
Normal file
After Width: | Height: | Size: 682 B |
Before Width: | Height: | Size: 6.4 KiB After Width: | Height: | Size: 6.4 KiB |
Before Width: | Height: | Size: 1.7 KiB After Width: | Height: | Size: 1.7 KiB |
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 1.3 KiB |
@ -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 2019 Jerrykuku <jerrykuku@qq.com>
|
* Copyright 2023 Jerrykuku <jerrykuku@qq.com>
|
||||||
*
|
*
|
||||||
* Have a bug? Please create an issue here on GitHub!
|
* 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:
|
* luci-theme-bootstrap:
|
||||||
* Copyright 2008 Steven Barth <steven@midlink.org>
|
* Copyright 2008 Steven Barth <steven@midlink.org>
|
||||||
@ -18,7 +18,7 @@
|
|||||||
* luci-theme-material:
|
* luci-theme-material:
|
||||||
* https://github.com/LuttyYang/luci-theme-material/
|
* https://github.com/LuttyYang/luci-theme-material/
|
||||||
*
|
*
|
||||||
* Agron Theme
|
* Argon Theme
|
||||||
* https://demos.creative-tim.com/argon-dashboard/index.html
|
* https://demos.creative-tim.com/argon-dashboard/index.html
|
||||||
*
|
*
|
||||||
* Login background
|
* Login background
|
||||||
@ -27,22 +27,6 @@
|
|||||||
* Licensed to the public under the Apache License 2.0
|
* 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 lastNode = undefined;
|
||||||
var mainNodeName = undefined;
|
var mainNodeName = undefined;
|
||||||
|
|
||||||
@ -68,6 +52,7 @@
|
|||||||
*/
|
*/
|
||||||
function getCurrentNodeByUrl() {
|
function getCurrentNodeByUrl() {
|
||||||
var ret = false;
|
var ret = false;
|
||||||
|
const urlReg = new RegExp(nodeUrl + "$")
|
||||||
if (!$('body').hasClass('logged-in')) {
|
if (!$('body').hasClass('logged-in')) {
|
||||||
luciLocation = ["Main", "Login"];
|
luciLocation = ["Main", "Login"];
|
||||||
return true;
|
return true;
|
||||||
@ -81,7 +66,7 @@
|
|||||||
var that = $(this);
|
var that = $(this);
|
||||||
var href = that.attr("href");
|
var href = that.attr("href");
|
||||||
|
|
||||||
if (href.indexOf(nodeUrl) != -1) {
|
if (urlReg.test(href)) {
|
||||||
ulNode.click();
|
ulNode.click();
|
||||||
ulNode.next(".slide-menu").stop(true, true);
|
ulNode.next(".slide-menu").stop(true, true);
|
||||||
lastNode = that.parent();
|
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
|
* hook menu click and add the hash
|
||||||
*/
|
*/
|
||||||
@ -153,7 +126,7 @@
|
|||||||
window.location = $($(this).find("a")[0]).attr("href");
|
window.location = $($(this).find("a")[0]).attr("href");
|
||||||
return false;
|
return false;
|
||||||
});
|
});
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* fix submenu click
|
* fix submenu click
|
||||||
*/
|
*/
|
||||||
@ -166,91 +139,11 @@
|
|||||||
/**
|
/**
|
||||||
* get current node and open it
|
* get current node and open it
|
||||||
*/
|
*/
|
||||||
|
if (getCurrentNodeByUrl()) {
|
||||||
$(".cbi-button-up").val("");
|
mainNodeName = "node-" + luciLocation[0] + "-" + luciLocation[1];
|
||||||
$(".cbi-button-down").val("");
|
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").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 (mainNodeName != undefined) {
|
if (mainNodeName != undefined) {
|
||||||
console.log(mainNodeName);
|
console.log(mainNodeName);
|
||||||
@ -273,5 +166,3 @@
|
|||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
})(jQuery);
|
|
@ -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;
|
||||||
|
}
|
||||||
|
});
|
103
luci-theme-argone/htdocs/luci-static/argone/js/styles-argon.js
Normal 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);
|
@ -1,12 +1,12 @@
|
|||||||
// compress: false
|
// 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>
|
* Copyright 2020 Jerryk <jerrykuku@gmail.com>
|
||||||
*
|
*
|
||||||
* Have a bug? Please create an issue here on GitHub!
|
* 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:
|
* luci-theme-bootstrap:
|
||||||
* Copyright 2008 Steven Barth <steven@midlink.org>
|
* Copyright 2008 Steven Barth <steven@midlink.org>
|
||||||
@ -19,7 +19,7 @@
|
|||||||
* luci-theme-material:
|
* luci-theme-material:
|
||||||
* https://github.com/LuttyYang/luci-theme-material/
|
* https://github.com/LuttyYang/luci-theme-material/
|
||||||
*
|
*
|
||||||
* Agron Theme
|
* Argon Theme
|
||||||
* https://demos.creative-tim.com/argon-dashboard/index.html
|
* https://demos.creative-tim.com/argon-dashboard/index.html
|
||||||
*
|
*
|
||||||
* Login background
|
* Login background
|
||||||
@ -1060,7 +1060,7 @@ footer {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.cbi-button:active {
|
.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 {
|
.cbi-button:disabled {
|
||||||
@ -1134,6 +1134,34 @@ form.inline+form.inline,
|
|||||||
min-width: 2.5rem !important;
|
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 */
|
/* input */
|
||||||
.cbi-value input[type="password"],
|
.cbi-value input[type="password"],
|
||||||
@ -1268,13 +1296,14 @@ input[type="checkbox"] {
|
|||||||
-webkit-appearance: none !important;
|
-webkit-appearance: none !important;
|
||||||
border: 1px solid #dee2e6;
|
border: 1px solid #dee2e6;
|
||||||
|
|
||||||
width: 16px !important;
|
width: 17px !important;
|
||||||
height: 16px !important;
|
height: 17px !important;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
transition: all 0.2s;
|
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 {
|
input[type="checkbox"]:checked {
|
||||||
@ -1289,7 +1318,8 @@ input[type="checkbox"]:checked {
|
|||||||
}
|
}
|
||||||
|
|
||||||
ul li .cbi-input-checkbox {
|
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 {
|
.cbi-input-radio {
|
||||||
@ -1422,7 +1452,7 @@ ul li .cbi-input-checkbox {
|
|||||||
|
|
||||||
.cbi-section-create {
|
.cbi-section-create {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding-left: 1rem;
|
padding-left: 0.5rem;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
||||||
}
|
}
|
||||||
@ -1495,12 +1525,47 @@ small {
|
|||||||
display: none !important;
|
display: none !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.cbi-section-error {
|
/* Define the error text border breathe display animation */
|
||||||
padding: 1.5rem;
|
@keyframes error-border-breathe {
|
||||||
color: #fb6340;
|
0%{
|
||||||
font-weight: 600;
|
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 {
|
fieldset>fieldset {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
@ -1571,6 +1636,7 @@ input[name="nslookup"] {
|
|||||||
height: 1.6rem !important;
|
height: 1.6rem !important;
|
||||||
line-height: 1.6rem;
|
line-height: 1.6rem;
|
||||||
border-radius: .25rem;
|
border-radius: .25rem;
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
#swaptotal>div>div,
|
#swaptotal>div>div,
|
||||||
@ -1683,6 +1749,31 @@ td>table>tbody>tr>td,
|
|||||||
text-decoration: none;
|
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 */
|
/* table */
|
||||||
|
|
||||||
|
|
||||||
@ -1835,6 +1926,46 @@ td>table>tbody>tr>td,
|
|||||||
flex-basis: 12%;
|
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 */
|
/* language fix */
|
||||||
body.lang_pl.node-main-login .cbi-value-title {
|
body.lang_pl.node-main-login .cbi-value-title {
|
||||||
width: 12rem;
|
width: 12rem;
|
||||||
@ -2165,11 +2296,21 @@ table>thead>tr>th,
|
|||||||
margin-bottom: 0;
|
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-select,
|
||||||
.cbi-section-table-row>.cbi-value-field .cbi-input-text,
|
.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-input-password{
|
||||||
.cbi-section-table-row>.cbi-value-field .cbi-dropdown {
|
width:100%
|
||||||
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 [data-dynlist]>input,
|
||||||
@ -2193,10 +2334,27 @@ div>.table>.tbody>.tr:nth-of-type(2n) {
|
|||||||
color: #fff !important;
|
color: #fff !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.warning {
|
/* Define the warning background-color breathe display animation */
|
||||||
background-color: #fb6340 !important;
|
@keyframes warning-background-color-breathe {
|
||||||
background-color: var(--warning) !important;
|
0%{
|
||||||
color: #fff !important;
|
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 {
|
.notice {
|
||||||
@ -2373,7 +2531,6 @@ table>thead>tr>th {
|
|||||||
padding-top: .75rem;
|
padding-top: .75rem;
|
||||||
padding-bottom: .75rem;
|
padding-bottom: .75rem;
|
||||||
letter-spacing: 1px;
|
letter-spacing: 1px;
|
||||||
text-transform: uppercase;
|
|
||||||
border-bottom: 1px solid #e9ecef;
|
border-bottom: 1px solid #e9ecef;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -2484,7 +2641,7 @@ td>table>tbody>tr>td {
|
|||||||
|
|
||||||
.cbi-tabmenu {
|
.cbi-tabmenu {
|
||||||
color: white;
|
color: white;
|
||||||
padding: 0.5rem 1rem 0 1rem;
|
padding: 0.5rem 0.5rem 0 0.5rem;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
border-bottom: 1px solid #ddd !important;
|
border-bottom: 1px solid #ddd !important;
|
||||||
@ -2811,7 +2968,7 @@ select[multiple="multiple"] {
|
|||||||
|
|
||||||
|
|
||||||
.cbi-section-node .cbi-value {
|
.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 {
|
.cbi-value-helpicon>img {
|
||||||
@ -2851,7 +3020,6 @@ select[multiple="multiple"] {
|
|||||||
padding: .7rem;
|
padding: .7rem;
|
||||||
padding-left: 0;
|
padding-left: 0;
|
||||||
width: 23rem;
|
width: 23rem;
|
||||||
float: left;
|
|
||||||
text-align: right;
|
text-align: right;
|
||||||
display: table-cell;
|
display: table-cell;
|
||||||
}
|
}
|
||||||
@ -3097,21 +3265,25 @@ td>.ifacebadge,
|
|||||||
margin-top: 0.3rem;
|
margin-top: 0.3rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.cbi-value-field .cbi-input-checkbox,
|
.cbi-value-field .cbi-input-checkbox {
|
||||||
.cbi-value-field .cbi-input-radio {
|
margin: 0.5rem 0.25rem 0.7rem 0.25rem;
|
||||||
margin: 0.9rem 0.25rem 0 0.25rem;
|
vertical-align: middle;
|
||||||
height: 1rem;
|
height: 1rem;
|
||||||
line-height: 1.6;
|
line-height: 1.6;
|
||||||
}
|
}
|
||||||
|
|
||||||
.cbi-input-checkbox {
|
.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 {
|
.cbi-value-field .cbi-input-radio {
|
||||||
margin: 0rem 0.25rem;
|
margin: 0rem 0.25rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.cbi-input-radio {
|
||||||
|
margin: 0rem 0.25rem;
|
||||||
|
}
|
||||||
|
|
||||||
.cbi-value-field>input+.cbi-value-description {
|
.cbi-value-field>input+.cbi-value-description {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
@ -3139,7 +3311,7 @@ td>.ifacebadge,
|
|||||||
}
|
}
|
||||||
|
|
||||||
.cbi-section-create>.cbi-button-add {
|
.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 {
|
.cbi-section-remove {
|
||||||
@ -3276,6 +3448,10 @@ input[name="nslookup"] {
|
|||||||
border-right: 0 !important;
|
border-right: 0 !important;
|
||||||
background-color: #5e72e4 !important;
|
background-color: #5e72e4 !important;
|
||||||
background-color: var(--primary) !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;
|
font-size: 1.7rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
header>.fill>.container>.brand {
|
header>.fill>.container>.brand {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
|
|
||||||
.cbi-value-title {
|
|
||||||
width: 9rem;
|
|
||||||
padding-right: 1rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.node-network-diagnostics>.main .cbi-map fieldset>div * {
|
.node-network-diagnostics>.main .cbi-map fieldset>div * {
|
||||||
width: 100% !important;
|
width: 100% !important;
|
||||||
}
|
}
|
||||||
@ -3716,13 +3885,6 @@ input[name="nslookup"] {
|
|||||||
position: relative;
|
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 {
|
.cbi-page-actions>div>input {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
@ -1,12 +1,12 @@
|
|||||||
// compress: true
|
// 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>
|
* Copyright 2020 Jerryk <jerrykuku@gmail.com>
|
||||||
*
|
*
|
||||||
* Have a bug? Please create an issue here on GitHub!
|
* 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:
|
* luci-theme-bootstrap:
|
||||||
* Copyright 2008 Steven Barth <steven@midlink.org>
|
* Copyright 2008 Steven Barth <steven@midlink.org>
|
||||||
@ -19,7 +19,7 @@
|
|||||||
* luci-theme-material:
|
* luci-theme-material:
|
||||||
* https://github.com/LuttyYang/luci-theme-material/
|
* https://github.com/LuttyYang/luci-theme-material/
|
||||||
*
|
*
|
||||||
* Agron Theme
|
* Argon Theme
|
||||||
* https://demos.creative-tim.com/argon-dashboard/index.html
|
* https://demos.creative-tim.com/argon-dashboard/index.html
|
||||||
*
|
*
|
||||||
* Login background
|
* Login background
|
||||||
@ -272,6 +272,7 @@ table>thead>tr>td {
|
|||||||
|
|
||||||
div {
|
div {
|
||||||
background-color: #32325d !important;
|
background-color: #32325d !important;
|
||||||
|
background-color: var(--dark-primary) !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -287,7 +288,7 @@ table>thead>tr>th {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.cbi-rowstyle-2 {
|
.cbi-rowstyle-2 {
|
||||||
background-color: #1e1e1e;
|
background-color: #2c2c2c !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.cbi-rowstyle-1 {
|
.cbi-rowstyle-1 {
|
||||||
@ -306,7 +307,12 @@ table>thead>tr>th {
|
|||||||
|
|
||||||
.cbi-button {
|
.cbi-button {
|
||||||
color: #ccc;
|
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 {
|
.cbi-section-node {
|
||||||
@ -326,6 +332,72 @@ div>.table>.tbody>.tr:nth-of-type(2n) {
|
|||||||
background-color: #252526;
|
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 {
|
#content_syslog {
|
||||||
box-shadow: 0 0 0.5rem 0 rgba(0, 0, 0, .35)
|
box-shadow: 0 0 0.5rem 0 rgba(0, 0, 0, .35)
|
||||||
}
|
}
|
||||||
@ -464,7 +536,7 @@ select {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.ifacebox {
|
.ifacebox {
|
||||||
background-color: none;
|
background-color: #1e1e1e;
|
||||||
border: 1px solid #1e1e1e;
|
border: 1px solid #1e1e1e;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -484,6 +556,30 @@ select {
|
|||||||
background-color: #3c3c3c;
|
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,
|
div.cbi-value var,
|
||||||
td.cbi-value-field var {
|
td.cbi-value-field var {
|
||||||
color: #483d8b;
|
color: #483d8b;
|
||||||
@ -541,11 +637,37 @@ td.cbi-value-field var {
|
|||||||
background-color: darkolivegreen !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 {
|
.notice {
|
||||||
background-color: #483d8b !important;
|
background-color: #483d8b !important;
|
||||||
background-color: var(--dark-primary) !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-find,
|
||||||
.cbi-input-save,
|
.cbi-input-save,
|
||||||
.cbi-button-add,
|
.cbi-button-add,
|
||||||
@ -587,8 +709,30 @@ fieldset[id^="cbi-apply-"] {
|
|||||||
background: #252525;
|
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;
|
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{
|
.node-services-vssr .block h4 span{
|
@ -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
|
luci-theme-argon
|
||||||
Copyright 2019 Jerrykuku <jerrykuku@qq.com>
|
Copyright 2020 Jerrykuku <jerrykuku@qq.com>
|
||||||
|
|
||||||
Have a bug? Please create an issue here on GitHub!
|
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:
|
luci-theme-bootstrap:
|
||||||
Copyright 2008 Steven Barth <steven@midlink.org>
|
Copyright 2008 Steven Barth <steven@midlink.org>
|
||||||
@ -18,7 +18,7 @@
|
|||||||
luci-theme-material:
|
luci-theme-material:
|
||||||
https://github.com/LuttyYang/luci-theme-material/
|
https://github.com/LuttyYang/luci-theme-material/
|
||||||
|
|
||||||
Agron Theme
|
Argon Theme
|
||||||
https://demos.creative-tim.com/argon-dashboard/index.html
|
https://demos.creative-tim.com/argon-dashboard/index.html
|
||||||
|
|
||||||
Login background
|
Login background
|
||||||
@ -43,7 +43,7 @@
|
|||||||
<div class="ftc">
|
<div class="ftc">
|
||||||
<a class="luci-link" href="https://github.com/openwrt/luci">Powered by <%= ver.luciname %>
|
<a class="luci-link" href="https://github.com/openwrt/luci">Powered by <%= ver.luciname %>
|
||||||
(<%= ver.luciversion %>)</a> /
|
(<%= 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 %>
|
<%= ver.distversion %>
|
||||||
<% if #categories > 1 then %>
|
<% if #categories > 1 then %>
|
||||||
<ul class="breadcrumb pull-right" id="modemenu">
|
<ul class="breadcrumb pull-right" id="modemenu">
|
||||||
@ -58,31 +58,28 @@
|
|||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<script>
|
||||||
<script>
|
// thanks for Jo-Philipp Wich <jow@openwrt.org>
|
||||||
// thanks for Jo-Philipp Wich <jow@openwrt.org>
|
var winHeight = $(window).height();
|
||||||
var luciLocation = <%= luci.http.write_json(luci.dispatcher.context.path) %>;
|
$(window).resize(function () {
|
||||||
var winHeight = $(window).height();
|
if($(document.body).height() < 525 ){
|
||||||
$(window).resize(function () {
|
if($(".ftc").css('display') != 'none'){
|
||||||
var winWidth = $(window).width()
|
$(".ftc").hide()
|
||||||
if(winWidth < 600){
|
}
|
||||||
var newHeight = $(this).height();
|
}else{
|
||||||
var keyboradHeight = newHeight - winHeight;
|
if($(".ftc").css('display') == 'none'){
|
||||||
$(".ftc").css("bottom", keyboradHeight + 30);
|
$(".ftc").show()
|
||||||
}
|
}
|
||||||
if($(document.body).height() < 525 ){
|
|
||||||
if($(".ftc").css('display') != 'none'){
|
|
||||||
$(".ftc").hide()
|
|
||||||
}
|
}
|
||||||
}else{
|
})
|
||||||
if($(".ftc").css('display') == 'none'){
|
</script>
|
||||||
$(".ftc").show()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
</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>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
@ -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>
|
Copyright 2020 Jerryk <jerrykuku@gmail.com>
|
||||||
|
|
||||||
Have a bug? Please create an issue here on GitHub!
|
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:
|
luci-theme-bootstrap:
|
||||||
Copyright 2008 Steven Barth <steven@midlink.org>
|
Copyright 2008 Steven Barth <steven@midlink.org>
|
||||||
@ -15,7 +15,7 @@
|
|||||||
MUI:
|
MUI:
|
||||||
https://github.com/muicss/mui
|
https://github.com/muicss/mui
|
||||||
|
|
||||||
Agron Theme
|
Argon Theme
|
||||||
https://demos.creative-tim.com/argon-dashboard/index.html
|
https://demos.creative-tim.com/argon-dashboard/index.html
|
||||||
|
|
||||||
Licensed to the public under the Apache License 2.0
|
Licensed to the public under the Apache License 2.0
|
||||||
@ -44,7 +44,7 @@
|
|||||||
local node = disp.context.dispatched
|
local node = disp.context.dispatched
|
||||||
|
|
||||||
local categories = disp.node_childs(tree)
|
local categories = disp.node_childs(tree)
|
||||||
local currentNode = luci.dispatcher.context.path
|
|
||||||
local c = tree
|
local c = tree
|
||||||
local i, r
|
local i, r
|
||||||
|
|
||||||
@ -108,22 +108,16 @@
|
|||||||
end
|
end
|
||||||
end
|
end
|
||||||
|
|
||||||
local function render_submenu(prefix,parent, node)
|
local function render_submenu(prefix, node)
|
||||||
local childs = disp.node_childs(node)
|
local childs = disp.node_childs(node)
|
||||||
if #childs > 0 then
|
if #childs > 0 then
|
||||||
local active = (currentNode[2] == parent) and "active" or ""
|
write('<ul class="slide-menu">')
|
||||||
local display = (currentNode[2] == parent) and 'style="display: block;"' or ""
|
|
||||||
|
|
||||||
write('<ul class="slide-menu %s" %s>' %{
|
|
||||||
active,
|
|
||||||
display
|
|
||||||
})
|
|
||||||
for i, r in ipairs(childs) do
|
for i, r in ipairs(childs) do
|
||||||
local nnode = node.nodes[r]
|
local nnode = node.nodes[r]
|
||||||
local title = pcdata(striptags(translate(nnode.title)))
|
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>' %{
|
write('<li><a data-title="%s" href="%s">%s</a></li>' %{
|
||||||
subactive,
|
|
||||||
title,
|
title,
|
||||||
nodeurl(prefix, r, nnode.query),
|
nodeurl(prefix, r, nnode.query),
|
||||||
title
|
title
|
||||||
@ -138,21 +132,20 @@
|
|||||||
local childs = disp.node_childs(cattree)
|
local childs = disp.node_childs(cattree)
|
||||||
if #childs > 0 then
|
if #childs > 0 then
|
||||||
write('<ul class="nav">')
|
write('<ul class="nav">')
|
||||||
|
|
||||||
for i, r in ipairs(childs) do
|
for i, r in ipairs(childs) do
|
||||||
local nnode = cattree.nodes[r]
|
local nnode = cattree.nodes[r]
|
||||||
local grandchildren = disp.node_childs(nnode)
|
local grandchildren = disp.node_childs(nnode)
|
||||||
|
|
||||||
if #grandchildren > 0 then
|
if #grandchildren > 0 then
|
||||||
local active = (currentNode[2] == r) and "active" or ""
|
|
||||||
local title = pcdata(striptags(translate(nnode.title)))
|
local title = pcdata(striptags(translate(nnode.title)))
|
||||||
local en_title = pcdata(striptags(string.gsub(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>' %{
|
write('<li class="slide"><a class="menu" data-title="%s" href="#">%s</a>' %{
|
||||||
active,
|
|
||||||
en_title,
|
en_title,
|
||||||
title
|
title
|
||||||
})
|
})
|
||||||
|
|
||||||
render_submenu(category .. "/" .. r,r, nnode)
|
render_submenu(category .. "/" .. r, nnode)
|
||||||
write('</li>')
|
write('</li>')
|
||||||
else
|
else
|
||||||
local title = pcdata(striptags(translate(nnode.title)))
|
local title = pcdata(striptags(translate(nnode.title)))
|
||||||
@ -196,17 +189,17 @@
|
|||||||
|
|
||||||
-- Custom settings
|
-- Custom settings
|
||||||
local mode = 'normal'
|
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 bar_color = '#5e72e4'
|
||||||
local primary, dark_primary, blur_radius, blur_radius_dark, blur_opacity
|
local primary, dark_primary, blur_radius, blur_radius_dark, blur_opacity
|
||||||
if fs.access('/etc/config/argonne') then
|
if fs.access('/etc/config/argon') then
|
||||||
primary = uci:get_first('argonne', 'global', 'primary')
|
primary = uci:get_first('argon', 'global', 'primary')
|
||||||
dark_primary = uci:get_first('argonne', 'global', 'dark_primary')
|
dark_primary = uci:get_first('argon', 'global', 'dark_primary')
|
||||||
blur_radius = uci:get_first('argonne', 'global', 'blur')
|
blur_radius = uci:get_first('argon', 'global', 'blur')
|
||||||
blur_radius_dark = uci:get_first('argonne', 'global', 'blur_dark')
|
blur_radius_dark = uci:get_first('argon', 'global', 'blur_dark')
|
||||||
blur_opacity = uci:get_first('argonne', 'global', 'transparency')
|
blur_opacity = uci:get_first('argon', 'global', 'transparency')
|
||||||
blur_opacity_dark = uci:get_first('argonne', 'global', 'transparency_dark')
|
blur_opacity_dark = uci:get_first('argon', 'global', 'transparency_dark')
|
||||||
mode = uci:get_first('argonne', 'global', 'mode')
|
mode = uci:get_first('argon', 'global', 'mode')
|
||||||
bar_color = mode == 'dark' and dark_primary or primary
|
bar_color = mode == 'dark' and dark_primary or primary
|
||||||
end
|
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="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="96x96" href="<%=media%>/icon/favicon-96x96.png">
|
||||||
<link rel="icon" type="image/png" sizes="16x16" href="<%=media%>/icon/favicon-16x16.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-TileColor" content="<%=bar_color%>">
|
||||||
<meta name="msapplication-TileImage" content="<%=media%>/icon/ms-icon-144x144.png">
|
<meta name="msapplication-TileImage" content="<%=media%>/icon/ms-icon-144x144.png">
|
||||||
<meta name="theme-color" content="<%=bar_color%>">
|
<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">
|
<style title="text/css">
|
||||||
<% if mode == 'normal' then %>
|
<% if mode == 'normal' then %>
|
||||||
@media (prefers-color-scheme: dark) {
|
@media (prefers-color-scheme: dark) {
|
||||||
@ -253,7 +246,7 @@
|
|||||||
<% elseif mode == 'dark' then %>
|
<% elseif mode == 'dark' then %>
|
||||||
<%=dark_css%>
|
<%=dark_css%>
|
||||||
<% end -%>
|
<% end -%>
|
||||||
<% if fs.access('/etc/config/argonne') then %>
|
<% if fs.access('/etc/config/argon') then %>
|
||||||
:root {
|
:root {
|
||||||
--primary: <%=primary%>;
|
--primary: <%=primary%>;
|
||||||
--dark-primary: <%=dark_primary%>;
|
--dark-primary: <%=dark_primary%>;
|
||||||
@ -273,11 +266,11 @@
|
|||||||
<% end -%>
|
<% end -%>
|
||||||
<script src="<%=resource%>/cbi.js<%# ?v=PKG_VERSION %>"></script>
|
<script src="<%=resource%>/cbi.js<%# ?v=PKG_VERSION %>"></script>
|
||||||
<script src="<%=resource%>/xhr.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>
|
</head>
|
||||||
|
|
||||||
<body
|
<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">
|
||||||
<div class="main-left">
|
<div class="main-left">
|
||||||
@ -326,3 +319,12 @@
|
|||||||
</noscript>
|
</noscript>
|
||||||
|
|
||||||
<% if category then render_tabmenu(category, cattree) end %>
|
<% 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>
|
136
luci-theme-argone/luasrc/view/themes/argone/header_login.htm
Normal 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%> ">
|
||||||
|
|
@ -1,6 +1,6 @@
|
|||||||
<%#
|
<%#
|
||||||
Copyright 2008 Steven Barth <steven@midlink.org>
|
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.
|
Licensed to the public under the Apache License 2.0.
|
||||||
-%>
|
-%>
|
||||||
|
|
@ -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>
|
Copyright 2021 Jerryk <jerrykuku@gmail.com>
|
||||||
|
|
||||||
Have a bug? Please create an issue here on GitHub!
|
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:
|
luci-theme-bootstrap:
|
||||||
Copyright 2008 Steven Barth <steven@midlink.org>
|
Copyright 2008 Steven Barth <steven@midlink.org>
|
||||||
@ -14,8 +14,8 @@
|
|||||||
|
|
||||||
MUI:
|
MUI:
|
||||||
https://github.com/muicss/mui
|
https://github.com/muicss/mui
|
||||||
|
|
||||||
Agron Theme
|
Argon Theme
|
||||||
https://demos.creative-tim.com/argon-dashboard/index.html
|
https://demos.creative-tim.com/argon-dashboard/index.html
|
||||||
|
|
||||||
Licensed to the public under the Apache License 2.0
|
Licensed to the public under the Apache License 2.0
|
||||||
@ -23,16 +23,16 @@
|
|||||||
|
|
||||||
<%+header_login%>
|
<%+header_login%>
|
||||||
<%
|
<%
|
||||||
local util = require "luci.util"
|
local util = require "luci.util"
|
||||||
local fs = require "nixio.fs"
|
local fs = require "nixio.fs"
|
||||||
local nutil = require "nixio.util"
|
local nutil = require "nixio.util"
|
||||||
local sys = require "luci.sys"
|
local json = require "luci.jsonc"
|
||||||
local json = require "luci.jsonc"
|
local sys = require "luci.sys"
|
||||||
local uci = require 'luci.model.uci'.cursor()
|
local uci = require 'luci.model.uci'.cursor()
|
||||||
|
|
||||||
-- Fetch Local Background Media
|
-- Fetch Local Background Media
|
||||||
|
|
||||||
function glob(...)
|
local function glob(...)
|
||||||
local iter, code, msg = fs.glob(...)
|
local iter, code, msg = fs.glob(...)
|
||||||
if iter then
|
if iter then
|
||||||
return nutil.consume(iter)
|
return nutil.consume(iter)
|
||||||
@ -41,64 +41,84 @@
|
|||||||
end
|
end
|
||||||
end
|
end
|
||||||
|
|
||||||
function fetchMedia(path,themeDir)
|
|
||||||
local backgroundTable = {}
|
local imageTypes = " jpg png gif webp "
|
||||||
local backgroundCount = 0
|
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
|
for i, f in ipairs(glob(path)) do
|
||||||
attr = fs.stat(f)
|
attr = fs.stat(f)
|
||||||
if attr then
|
if attr then
|
||||||
local ext = fs.basename(f):match(".+%.(%w+)$")
|
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 = {}
|
local bg = {}
|
||||||
bg.type = ext
|
bg.type = ext
|
||||||
bg.url = themeDir .. fs.basename(f)
|
bg.url = themeDir .. fs.basename(f)
|
||||||
table.insert(backgroundTable,bg)
|
table.insert(backgroundTable, bg)
|
||||||
backgroundCount = backgroundCount + 1
|
backgroundCount = backgroundCount + 1
|
||||||
end
|
end
|
||||||
end
|
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
|
end
|
||||||
|
|
||||||
local boardinfo = util.ubus("system", "board")
|
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 themeDir = media .. "/background/"
|
||||||
local bgUrl = media .. "/img/bg1.jpg"
|
local bgUrl, backgroundType, mimeType = selectBackground(themeDir)
|
||||||
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
|
|
||||||
%>
|
%>
|
||||||
<!-- Login Page Start -->
|
<!-- Login Page Start -->
|
||||||
<div class="login-page">
|
<div class="login-page">
|
||||||
|
|
||||||
<% if ( backgroundType == "Video" ) then %>
|
<% if ( backgroundType == "Video" ) then %>
|
||||||
<!-- Video Player Start -->
|
<!-- 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">
|
<video autoplay loop muted id="video">
|
||||||
<source src="<%=bgUrl%>" type="video/mp4">
|
<source src="<%=bgUrl%>" type="<%=mimeType%>">
|
||||||
</video>
|
</video>
|
||||||
</div>
|
</div>
|
||||||
<div class="volume-control mute"></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 -->
|
<!-- Video Player End -->
|
||||||
<% else %>
|
<% else %>
|
||||||
<!-- Image Background Start -->
|
<!-- Image Background Start -->
|
||||||
@ -108,8 +128,12 @@
|
|||||||
<!-- Login Container Start -->
|
<!-- Login Container Start -->
|
||||||
<div class="login-container">
|
<div class="login-container">
|
||||||
<div class="login-form">
|
<div class="login-form">
|
||||||
<a class="brand" href="/"><img src="<%=media%>/img/argonne.svg" class="icon"><span
|
<!-- Logo Start -->
|
||||||
class="brand-text"><%=striptags( (boardinfo.hostname or "?") .. ( (node and node.title) and ' - ' .. translate(node.title) or '')) %></span></a>
|
<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"))%>">
|
<form class="form-login" method="post" action="<%=pcdata(luci.http.getenv("REQUEST_URI"))%>">
|
||||||
|
|
||||||
<%- if fuser then %>
|
<%- if fuser then %>
|
||||||
@ -130,7 +154,7 @@
|
|||||||
<input type="submit" value="<%:Login%>" class="cbi-button cbi-button-apply" />
|
<input type="submit" value="<%:Login%>" class="cbi-button cbi-button-apply" />
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
|
<!-- Login Form End -->
|
||||||
<script type="text/javascript">//<![CDATA[
|
<script type="text/javascript">//<![CDATA[
|
||||||
var input = document.getElementsByName('luci_password')[0];
|
var input = document.getElementsByName('luci_password')[0];
|
||||||
if (input)
|
if (input)
|
@ -1,12 +1,12 @@
|
|||||||
#!/bin/sh
|
#!/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/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
|
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-modulecache
|
||||||
rm -Rf /var/luci-indexcache
|
rm -Rf /var/luci-indexcache
|
||||||
uci batch <<-EOF
|
uci batch <<-EOF
|
||||||
set luci.themes.Argonne=/luci-static/argonne
|
set luci.themes.Argone=/luci-static/argone
|
||||||
set luci.main.mediaurlbase=/luci-static/argonne
|
set luci.main.mediaurlbase=/luci-static/argone
|
||||||
commit luci
|
commit luci
|
||||||
EOF
|
EOF
|
||||||
exit 0
|
exit 0
|
70
luci-theme-argone/root/usr/libexec/argone/online_wallpaper
Executable 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
|
@ -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
|
|
||||||
```
|
|
Before Width: | Height: | Size: 75 KiB |
@ -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%> ">
|
|
||||||
|
|
@ -48,6 +48,7 @@
|
|||||||
- 适配深色模式,适配系统自动切换,支持自定义模式
|
- 适配深色模式,适配系统自动切换,支持自定义模式
|
||||||
- 适配openwrt 21/22、lede
|
- 适配openwrt 21/22、lede
|
||||||
- 支持插件式配置主题
|
- 支持插件式配置主题
|
||||||
|
- 流畅度比肩bootstrap
|
||||||
|
|
||||||
### 体验WebApp方法
|
### 体验WebApp方法
|
||||||
|
|
||||||
|