update 2024-12-22 14:14:14

luci-app-fchomo/htdocs/luci-static/resources/view/fchomo/log.js

@@ -87,20 +87,38 @@ function getRuntimeLog(name, filename) {
 
 return view.extend({
 	render: function(data) {
-		let m, s, o;
+		let m, s, o, ss, so;
 
 		m = new form.Map('fchomo');
 
 		s = m.section(form.NamedSection, 'config', 'fchomo');
 
-		o = s.option(form.DummyValue, '_fchomo_logview');
-		o.render = L.bind(getRuntimeLog, o, _('FullCombo Mihomo'), 'fchomo');
+		/* FullCombo Mihomo START */
+		s.tab('fchomo', _('FullCombo Mihomo'));
+		o = s.taboption('fchomo', form.SectionValue, '_fchomo', form.NamedSection, 'config', null);
+		ss = o.subsection;
 
-		o = s.option(form.DummyValue, '_mihomo-c_logview');
-		o.render = L.bind(getRuntimeLog, o, _('Mihomo client'), 'mihomo-c');
+		so = ss.option(form.DummyValue, '_fchomo_logview');
+		so.render = L.bind(getRuntimeLog, so, _('FullCombo Mihomo'), 'fchomo');
+		/* FullCombo Mihomo END */
 
-		o = s.option(form.DummyValue, '_mihomo-s_logview');
-		o.render = L.bind(getRuntimeLog, o, _('Mihomo server'), 'mihomo-s');
+		/* Mihomo client START */
+		s.tab('mihomo_c', _('Mihomo client'));
+		o = s.taboption('mihomo_c', form.SectionValue, '_mihomo_c', form.NamedSection, 'config', null);
+		ss = o.subsection;
+
+		so = ss.option(form.DummyValue, '_mihomo-c_logview');
+		so.render = L.bind(getRuntimeLog, so, _('Mihomo client'), 'mihomo-c');
+		/* Mihomo client END */
+
+		/* Mihomo server START */
+		s.tab('mihomo_s', _('Mihomo server'));
+		o = s.taboption('mihomo_s', form.SectionValue, '_mihomo_s', form.NamedSection, 'config', null);
+		ss = o.subsection;
+
+		so = ss.option(form.DummyValue, '_mihomo-s_logview');
+		so.render = L.bind(getRuntimeLog, so, _('Mihomo server'), 'mihomo-s');
+		/* Mihomo server END */
 
 		return m.render();
 	},

luci-theme-argon/less/cascade.less

@@ -313,6 +313,7 @@ select,
 .cbi-dropdown {
   width: inherit;
   cursor: default;
+  padding-right: 1rem;
 }
 
 select:not([multiple="multiple"]):focus,
@@ -1655,8 +1656,6 @@ tr > th,
   gap: 0px;
 
   input {
-    border-bottom-right-radius: 0;
-    border-top-right-radius: 0;
     border-right-width: 0;
     margin-right: 0;
   }
@@ -2448,6 +2447,10 @@ body:not(.Interfaces) .cbi-rowstyle-2:first-child {
   min-height: 2.1875rem;
 }
 
+.cbi-dropdown.btn > ul:not(.dropdown), .cbi-dropdown.cbi-button > ul:not(.dropdown){
+  margin: 0 0 0 0.75rem!important;
+}
+
 .cbi-dropdown[placeholder*="select"] {
   max-width: 25rem;
   height: auto;
@@ -2471,6 +2474,11 @@ body:not(.Interfaces) .cbi-rowstyle-2:first-child {
 
 }
 
+.cbi-dropdown.cbi-button-apply,
+.cbi-dropdown.cbi-button-action{
+  padding: 0;
+}
+
 .cbi-button-apply > ul.preview {
   display: none;
 
@@ -2501,10 +2509,12 @@ body:not(.Interfaces) .cbi-rowstyle-2:first-child {
   flex-grow: 0;
   flex-shrink: 0;
   justify-content: center;
-  padding: 0 .25em;
-  cursor: default;
+  padding: 0 .375rem;
+  cursor: pointer;
   text-align: center;
   outline: 0;
+  border-left: thin solid #ccc;
+  margin-left: 0.5rem;
 }
 
 .cbi-dropdown > .more,
@@ -2835,8 +2845,7 @@ body.modal-overlay-active #modal_overlay {
 }
 
 #view {
-  border-radius: 0.25rem;
-  overflow: hidden;
+  border-radius: 0.25rem; 
 
   & > .spinning {
     position: fixed;

luci-theme-argon/luasrc/view/themes/argon/header.htm

@@ -88,36 +88,24 @@
 	<meta name="theme-color" content="<%=bar_color%>">
 	<link rel="stylesheet" href="<%=media%>/css/cascade.css<%# ?v=PKG_VERSION %>">
 	<style title="text/css">
-		<% if mode ~= 'dark' then %>
-			@media (prefers-color-scheme: dark) {
-				<%=dark_css%>
-			}
-		<% if fs.access('/etc/config/argon') then %>
-		:root {
-			--primary: <%=primary%>;
-			--dark-primary: <%=dark_primary%>;
-				--bar-bg: <%=primary%>;
-			--blur-radius:<%=blur_radius%>px;
-			--blur-opacity:<%=blur_opacity%>;
-			--blur-radius-dark:<%=blur_radius_dark%>px;
-			--blur-opacity-dark:<%=blur_opacity_dark%>;
-		}
-		<% end -%>
-		<% elseif mode == 'dark' then %>
-			<%=dark_css%>
-		<% if fs.access('/etc/config/argon') then %>
-		:root {
-			--primary: <%=primary%>;
-			--dark-primary: <%=dark_primary%>;
-				--bar-bg: <%=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 -%>
-		<% end -%>
-	</style>
+        <% 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%>">