meoware.exe/TidaLuna-Plugins
1
0
Fork 0
mirror of https://github.com/meowarex/TidaLuna-Plugins.git synced 2026-06-18 03:43:10 +10:00
Code Issues Packages Projects Releases Wiki Activity

Added Option to Use OLED Friendly Buttons instead of White (Bad for OLED)

Browse Source
This commit is contained in:
meowarex
2025-06-01 21:39:13 +10:00
parent 3ddb30a58b
commit 8a88c38083
2 changed files with 75 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
plugins/oled-theme-luna/src/Settings.tsx
+15
View File
@@ -4,10 +4,12 @@ import React from "react";
export const settings = await ReactiveStore.getPluginStorage("OLEDTheme", {
qualityColorMatchedSeekBar: true,
oledFriendlyButtons: true,
});
export const Settings = () => {
const [qualityColorMatchedSeekBar, setQualityColorMatchedSeekBar] = React.useState(settings.qualityColorMatchedSeekBar);
const [oledFriendlyButtons, setOledFriendlyButtons] = React.useState(settings.oledFriendlyButtons);
return (
<LunaSettings>
@@ -24,6 +26,19 @@ export const Settings = () => {
}
}}
/>
<LunaSwitchSetting
title="OLED Friendly Buttons"
desc="Remove button styling from OLED theme to keep buttons with original Tidal appearance"
checked={oledFriendlyButtons}
onChange={(_, checked) => {
console.log("OLED Friendly Buttons:", checked ? "enabled" : "disabled");
setOledFriendlyButtons((settings.oledFriendlyButtons = checked));
// Update styles immediately when setting changes
if ((window as any).updateOLEDThemeStyles) {
(window as any).updateOLEDThemeStyles();
}
}}
/>
</LunaSettings>
);
};
plugins/oled-theme-luna/src/index.ts
+60 -1
View File
@@ -26,12 +26,71 @@ const applyThemeStyles = function(): void {
// Remove SeekBar coloring if Quality Color Matched Seek Bar is enabled
if (settings.qualityColorMatchedSeekBar) {
modifiedStyle = originalStyle.replace(/\[class\^="_progressBarWrapper"\]\s*\{[^}]*\}/g, '');
modifiedStyle = modifiedStyle.replace(/\[class\^="_progressBarWrapper"\]\s*\{[^}]*\}/g, '');
trace.msg.log("OLED theme applied with SeekBar coloring removed");
} else {
trace.msg.log("OLED theme applied with original SeekBar coloring");
}
// Remove button styling if OLED Friendly Buttons is enabled
if (settings.oledFriendlyButtons) {
// First, let's debug what we're working with
const originalRuleCount = (modifiedStyle.match(/\{[^}]*\}/g) || []).length;
trace.msg.log(`Original CSS has ${originalRuleCount} rules`);
// Split CSS into individual rules and filter out button-related ones
const cssRules = modifiedStyle.split('}').filter(rule => rule.trim());
const filteredRules = cssRules.filter(rule => {
const lowerRule = rule.toLowerCase();
// Check if this rule might affect buttons
const isButtonRule =
// Direct button selectors
lowerRule.includes('button') ||
lowerRule.includes('[role="button"]') ||
lowerRule.includes('[type="button"]') ||
lowerRule.includes('[type="submit"]') ||
lowerRule.includes('[type="reset"]') ||
// Class-based button selectors
lowerRule.includes('btn') ||
lowerRule.includes('_button') ||
lowerRule.includes('-button') ||
lowerRule.includes('button-') ||
lowerRule.includes('button_') ||
// Common button-related classes
lowerRule.includes('clickable') ||
lowerRule.includes('action') ||
lowerRule.includes('control') ||
lowerRule.includes('icon') ||
// Data attributes that might be buttons
lowerRule.includes('data-test') && lowerRule.includes('button') ||
lowerRule.includes('aria-label') && lowerRule.includes('button') ||
// Button states
lowerRule.includes(':hover') && (lowerRule.includes('button') || lowerRule.includes('btn')) ||
lowerRule.includes(':focus') && (lowerRule.includes('button') || lowerRule.includes('btn')) ||
lowerRule.includes(':active') && (lowerRule.includes('button') || lowerRule.includes('btn')) ||
// Cursor pointer (often used on buttons)
lowerRule.includes('cursor') && lowerRule.includes('pointer') ||
// Any class containing button-like patterns
/\[class[^=]*=["'][^"']*button/i.test(rule) ||
/\[class[^=]*=["'][^"']*btn/i.test(rule) ||
/\[class[^=]*=["'][^"']*click/i.test(rule) ||
/\[class[^=]*=["'][^"']*action/i.test(rule) ||
/\[class[^=]*=["'][^"']*control/i.test(rule);
// Return true to keep the rule (i.e., if it's NOT a button rule)
return !isButtonRule;
});
modifiedStyle = filteredRules.join('} ') + (filteredRules.length > 0 ? '}' : '');
const filteredRuleCount = (modifiedStyle.match(/\{[^}]*\}/g) || []).length;
const removedRuleCount = originalRuleCount - filteredRuleCount;
trace.msg.log(`OLED Friendly Buttons enabled: Removed ${removedRuleCount} button-related CSS rules, ${filteredRuleCount} rules remaining`);
} else {
trace.msg.log("OLED Friendly Buttons disabled: Button styling preserved from original theme");
}
appliedStyleElement = document.createElement("style");
appliedStyleElement.type = "text/css";
appliedStyleElement.textContent = modifiedStyle;