mirror of
https://github.com/kiddin9/op-packages.git
synced 2026-10-27 08:32:52 +08:00
186 lines
11 KiB
Plaintext
186 lines
11 KiB
Plaintext
{#
|
|
Luxe is a clean HTML5 theme for LuCI. It is based on luci-theme-bootstrap and MUI
|
|
|
|
luci-theme-material
|
|
Copyright 2015-2017 Lutty Yang <lutty@wcan.in>
|
|
|
|
luci-theme-luxe
|
|
Copyright 2026 de-quenx | xidz_x
|
|
|
|
Have a bug? Please create an issue here on GitHub!
|
|
https://github.com/de-quenx/luci-theme-luxe/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
|
|
|
|
Licensed to the public under the Apache License 2.0
|
|
-#}
|
|
|
|
{%
|
|
import { getuid, getspnam } from 'luci.core';
|
|
|
|
const boardinfo = ubus.call('system', 'board');
|
|
const hostname = (boardinfo && boardinfo.hostname) ? striptags(boardinfo.hostname) : '?';
|
|
|
|
http.prepare_content('text/html; charset=UTF-8');
|
|
-%}
|
|
<!DOCTYPE html>
|
|
<html lang="{{ dispatcher.lang }}">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport"/>
|
|
<meta name="apple-mobile-web-app-capable" content="yes">
|
|
<meta name="mobile-web-app-capable" content="yes">
|
|
<meta name="theme-color" content="#24315e">
|
|
<meta name="msapplication-tap-highlight" content="no">
|
|
<meta name="msapplication-TileColor" content="#24315e">
|
|
<meta name="application-name" content="{{ hostname }} - LuCI">
|
|
<meta name="apple-mobile-web-app-title" content="{{ hostname }} - LuCI">
|
|
<link rel="stylesheet" href="{{ media }}/css/cascade.css?v=26.167.08541~ffc779e">
|
|
<link rel="icon" href="{{ media }}/luxe.png" sizes="64x64">
|
|
<link rel="icon" href="{{ media }}/luxe.svg" sizes="any">
|
|
{% if (node && node.css): %}
|
|
<link rel="stylesheet" href="{{ resource }}/{{ node.css }}">
|
|
{% endif %}
|
|
<script src="{{ dispatcher.build_url('admin/translations', dispatcher.lang) }}"></script>
|
|
<script src="{{ resource }}/cbi.js?v=26.167.08541~ffc779e"></script>
|
|
<title>{{ hostname }}{{ (node && node.title) ? ' - ' + striptags(node.title) : '' }} - LuCI</title>
|
|
{% if (css): %}
|
|
<style title="text/css">
|
|
{{ css }}
|
|
</style>
|
|
{% endif %}
|
|
</head>
|
|
<body class="lang_{{ dispatcher.lang }} {{ ctx.authsession ? 'logged-in' : '' }} {{ length(ctx.path) ? 'node-' + join('-', ctx.path) : 'node-main-login' }}" data-page="{{ entityencode(join('-', ctx.path), true) }}">
|
|
<script>
|
|
document.body.setAttribute('data-theme', localStorage.getItem('luxe-theme') || 'normal');
|
|
let mMode = localStorage.getItem('luxe-mode') || 'normal';
|
|
if(mMode !== 'normal') document.body.setAttribute('data-force-scheme', mMode);
|
|
let flt = localStorage.getItem('luxe-floating') || '0';
|
|
document.body.setAttribute('data-enable-navbar', flt);
|
|
document.body.setAttribute('data-navbar-enabled', flt);
|
|
if(localStorage.getItem('luxe-slider') === '1') document.body.setAttribute('data-slider', 'true');
|
|
document.body.setAttribute('data-icon', localStorage.getItem('luxe-icon') || '5');
|
|
document.body.setAttribute('data-autohide', localStorage.getItem('luxe-autohide') || '0');
|
|
document.body.setAttribute('data-show-hostname', localStorage.getItem('luxe-hostname') || '0');
|
|
</script>
|
|
<header>
|
|
<div class="fill">
|
|
<div class="container" style="display: flex; align-items: center; justify-content: space-between; width: 100%;">
|
|
<div style="display:flex;align-items:center;">
|
|
<span class="showSide"></span>
|
|
<a class="brand hostname" href="#">{{ hostname }}</a>
|
|
</div>
|
|
<div id="luxe-settings-wrapper" class="cfg-wrap">
|
|
<span id="settings-toggle" class="cfg-tgl">
|
|
<svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="3"></circle><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"></path></svg>
|
|
</span>
|
|
<div id="luxe-settings-menu" class="cfg-menu">
|
|
<div class="cfg-row" id="row-hostname">
|
|
<span class="cfg-lbl">Tampilkan Hostname</span>
|
|
<label class="luxe-switch"><input type="checkbox" id="set-hostname"><span class="luxe-slider"></span></label>
|
|
</div>
|
|
<div class="cfg-row">
|
|
<span class="cfg-lbl">Floating Navbar</span>
|
|
<label class="luxe-switch"><input type="checkbox" id="set-floating"><span class="luxe-slider"></span></label>
|
|
</div>
|
|
<div class="cfg-row" id="row-autohide-navbar">
|
|
<span class="cfg-lbl">Sembunyi Otomatis Navbar</span>
|
|
<label class="luxe-switch"><input type="checkbox" id="set-autohide-navbar"><span class="luxe-slider"></span></label>
|
|
</div>
|
|
<div class="cfg-row" id="row-slider-navbar">
|
|
<span class="cfg-lbl">Slider Navbar</span>
|
|
<label class="luxe-switch"><input type="checkbox" id="set-slider-navbar"><span class="luxe-slider"></span></label>
|
|
</div>
|
|
<div class="cfg-blk" id="row-icon-count">
|
|
<span class="cfg-lbl-blk">Jumlah Icon</span>
|
|
<div class="style-scroll" style="justify-content: center;">
|
|
<div class="icon-card" data-icon="4">4</div><div class="icon-card active" data-icon="5">5</div><div class="icon-card" data-icon="6">6</div><div class="icon-card" data-icon="7">7</div><div class="icon-card" data-icon="8">8</div>
|
|
</div>
|
|
</div>
|
|
<div class="cfg-blk">
|
|
<span class="cfg-lbl-blk">Gaya / Style</span>
|
|
<div class="style-scroll">
|
|
<div class="style-card active" data-style="normal">LuxeOs</div><div class="style-card" data-style="glass-liquid">Glass Liquid</div><div class="style-card" data-style="glass-luxe">Glass Luxe</div><div class="style-card" data-style="glass-crystal">Glass Crystal</div><div class="style-card" data-style="glass-dark">Glass Dark</div><div class="style-card" data-style="neo">Neobrutalism</div><div class="style-card" data-style="neox">Neomorphism</div><div class="style-card" data-style="neon">Neon</div><div class="style-card" data-style="rgb">Rgb</div><div class="style-card" data-style="glaze">Glaze</div><div class="style-card" data-style="onyx">Onyx</div><div class="style-card" data-style="liquid-metal">Liquid Neo</div>
|
|
</div>
|
|
</div>
|
|
<div id="mode-selection-container" style="display:none; margin-bottom:4px;">
|
|
<span class="cfg-lbl-blk">Mode Tema</span>
|
|
<div style="display:flex; gap:8px;">
|
|
<div class="mode-card active" data-mode="normal">Auto</div><div class="mode-card" data-mode="light">Light</div><div class="mode-card" data-mode="dark">Dark</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div style="display:flex;align-items:center; justify-content:flex-end;">
|
|
<span class="status" id="indicators"></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<div id="floating-navbar" class="navbar">
|
|
<div class="nav-arrow" id="prevArrow">❮</div>
|
|
<div class="floating-icons-wrapper" id="iconWrapper">
|
|
<a href='/cgi-bin/luci/admin/status/overview'><img src="{{ media }}/navbar/home.png"></a>
|
|
<a href='/cgi-bin/luci/admin/network/network'><img src="{{ media }}/navbar/interface.png"></a>
|
|
<a href='/cgi-bin/luci/admin/system/tinyfm'><img src="{{ media }}/navbar/tinyfm.png"></a>
|
|
<a href='/cgi-bin/luci/admin/services/ttyd'><img src="{{ media }}/navbar/terminal.png"></a>
|
|
<a href='/cgi-bin/luci/admin/services/openclash'><img src="{{ media }}/navbar/openclash.png"></a>
|
|
<a href='/cgi-bin/luci/admin/status/netmonitor'><img src="{{ media }}/navbar/netmon.png"></a>
|
|
<a href='/cgi-bin/luci/admin/services/nikki'><img src="{{ media }}/navbar/nikki.png"></a>
|
|
<a href='/cgi-bin/luci/admin/modem/andromodem'><img src="{{ media }}/navbar/droidnet.png"></a>
|
|
<a href='/cgi-bin/luci/admin/services/fusiontunx'><img src="{{ media }}/navbar/insomclash.png"></a>
|
|
<a href='/cgi-bin/luci/admin/modem/3ginfo-lite'><img src="{{ media }}/navbar/modem.png"></a>
|
|
<a href='/cgi-bin/luci/admin/services/passwall'><img src="{{ media }}/navbar/passwall.png"></a>
|
|
<a href='/cgi-bin/luci/admin/modem/modemdata'><img src="{{ media }}/navbar/mikhom.png"></a>
|
|
<a href='/cgi-bin/luci/admin/services/AdGuardHome'><img src="{{ media }}/navbar/adguard.png"></a>
|
|
<a href='/cgi-bin/luci/admin/vpn/tailscale'><img src="{{ media }}/navbar/tailscale.png"></a>
|
|
<a href='/cgi-bin/luci/admin/services/neko'><img src="{{ media }}/navbar/neko.png"></a>
|
|
<a href='/cgi-bin/luci/admin/modem/rakitanmanager'><img src="{{ media }}/navbar/rakitanmanager.png"></a>
|
|
<a href='/cgi-bin/luci/admin/modem/luci-app-sms-tool-js/sendat'><img src="{{ media }}/navbar/at.png"></a>
|
|
</div>
|
|
<div class="nav-arrow" id="nextArrow">❯</div>
|
|
</div>
|
|
|
|
<div class="main">
|
|
<div style="" class="loading"><span><div class="loader"></div>{{ _('Collecting data...') }}</span></div>
|
|
<div class="main-left" id="mainmenu" style="display:none"></div>
|
|
<div class="main-right">
|
|
<div class="modemenu-buttons" style="display:none"><ul id="modemenu"></ul></div>
|
|
<div class="darkMask"></div>
|
|
<div id="maincontent">
|
|
<div class="container">
|
|
{% if (getuid() == 0 && getspnam('root') && getspnam('root').pwdp === '' && ctx.authsession): %}
|
|
<div class="alert-message warning">
|
|
<h4>{{ _('No password set!') }}</h4>
|
|
<p>{{ _('There is no password set on this router. Please configure a root password to protect the web interface.') }}</p>
|
|
{% if (dispatcher.lookup("admin/system/admin")): %}
|
|
<div class="right"><a class="btn" href="{{ dispatcher.build_url("admin/system/admin") }}">{{ _('Go to password configuration...') }}</a></div>
|
|
{% endif %}
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% if (boardinfo && boardinfo.rootfs_type == "initramfs"): %}
|
|
<div class="alert-message warning">
|
|
<h4>{{ _('System running in recovery (initramfs) mode.') }}</h4>
|
|
<p>{{ _('No changes to settings will be stored and are lost after rebooting. This mode should only be used to install a firmware upgrade') }}</p>
|
|
{% if (dispatcher.lookup("admin/system/flash")): %}
|
|
<div class="right"><a class="btn" href="{{ dispatcher.build_url("admin/system/flash") }}">{{ _('Go to firmware upgrade...') }}</a></div>
|
|
{% endif %}
|
|
</div>
|
|
{% endif %}
|
|
|
|
<noscript>
|
|
<div class="alert-message warning">
|
|
<h4>{{ _('JavaScript required!') }}</h4>
|
|
<p>{{ _('You must enable JavaScript in your browser or LuCI will not work properly.') }}</p>
|
|
</div>
|
|
</noscript>
|
|
|
|
<div id="tabmenu" style="display:none"></div> |