Add Notification Center and Game Optimizer themes

Extend Luma-style dark theme to two more Enact web overlays:
- com.webos.app.notificationcenter: dark pills, transparent
  compositor, notification-specific components
- com.webos.app.gameoptimizer: same plus GameItem, GameButton,
  GameSwitch, GamePanel custom components

Rename build.js → build.cjs (ESM compat) and update to build
all three themes from a single script.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Kaloyan DanchevandClaude Opus 4.6 committed 2026-10-24 12:07:09 +03:00
1 parent 14db4f6e71
commit 98dd75ab0e
4 files changed
+560 -29

No files matched your search

+41
View File
@@ -0,0 +1,41 @@
const fs = require('fs');
const path = require('path');
const APPS = [
'com.palm.app.settings',
'com.webos.app.notificationcenter',
'com.webos.app.gameoptimizer',
];
const outDir = path.join(__dirname, 'dist');
fs.mkdirSync(outDir, { recursive: true });
for (const app of APPS) {
const srcPath = path.join(__dirname, app + '.js');
if (!fs.existsSync(srcPath)) {
console.log('SKIP:', app, '(source not found)');
continue;
}
const code = fs.readFileSync(srcPath, 'utf8');
let minified = code
.replace(/\/\/[^\n]*/g, '')
.replace(/\/\*[\s\S]*?\*\//g, '')
.replace(/\n\s*\n/g, '\n')
.replace(/^\s+/gm, '')
.replace(/\n/g, '')
.replace(/ +/g, ' ');
console.log(app + ':');
console.log(' Original:', code.length, 'bytes');
console.log(' Minified:', minified.length, 'bytes');
const minPath = path.join(outDir, app + '.min.js');
fs.writeFileSync(minPath, minified);
const b64 = Buffer.from(minified).toString('base64');
const b64Path = path.join(outDir, app + '.b64');
fs.writeFileSync(b64Path, b64);
console.log(' Base64: ', b64.length, 'bytes');
}
-29
View File
@@ -1,29 +0,0 @@
const fs = require('fs');
const path = require('path');
const src = path.join(__dirname, 'com.palm.app.settings.js');
const code = fs.readFileSync(src, 'utf8');
let minified = code
.replace(/\/\/[^\n]*/g, '')
.replace(/\/\*[\s\S]*?\*\//g, '')
.replace(/\n\s*\n/g, '\n')
.replace(/^\s+/gm, '')
.replace(/\n/g, '')
.replace(/ +/g, ' ');
console.log('Original size:', code.length, 'bytes');
console.log('Minified size:', minified.length, 'bytes');
const outDir = path.join(__dirname, 'dist');
fs.mkdirSync(outDir, { recursive: true });
const outPath = path.join(outDir, 'com.palm.app.settings.min.js');
fs.writeFileSync(outPath, minified);
console.log('Written to:', outPath);
const b64 = Buffer.from(minified).toString('base64');
const b64Path = path.join(outDir, 'com.palm.app.settings.b64');
fs.writeFileSync(b64Path, b64);
console.log('Base64 size:', b64.length, 'bytes');
console.log('Base64 written to:', b64Path);
@@ -0,0 +1,282 @@
// LG webOS Game Optimizer — Luma-style Dark Theme V1.0
// Same visual language as Settings theme: transparent compositor,
// nuclear background strip, dark pills, white focus.
// CSS class hashes from webOS 6.5.3 (kisscurl-koli).
(function () {
'use strict';
var STYLE_ID = 'luma-go-v10';
// === COMPOSITOR TRANSPARENCY ===
try {
if (window.PalmSystem && PalmSystem.setWindowProperties) {
PalmSystem.setWindowProperties(JSON.stringify({ transparent: true }));
}
} catch (e) {}
try {
if (window.webOSSystem && webOSSystem.setWindowProperty) {
webOSSystem.setWindowProperty('transparent', 'true');
}
} catch (e) {}
var CSS = [
// -------------------------------------------------------
// 1. NUCLEAR — strip all backgrounds
// -------------------------------------------------------
'*, *::before, *::after {',
' background-color: transparent !important;',
' background-image: none !important;',
' box-shadow: none !important;',
' transition: none !important;',
' animation: none !important;',
'}',
'html, body {',
' background: transparent !important;',
' background-color: transparent !important;',
' background-image: none !important;',
'}',
'body { color: rgba(255,255,255,0.85) !important; }',
// -------------------------------------------------------
// 2. DARK PILLS on items
// -------------------------------------------------------
// Standard Enact Item bg
'.Item_bg__166C- {',
' opacity: 1 !important;',
' background-color: rgba(0,0,0,0.65) !important;',
' background-image: none !important;',
' border-radius: 9999px !important;',
' filter: none !important;',
'}',
// Game-specific Item bg
'.GameItem_bg__1Px-3 {',
' opacity: 1 !important;',
' background-color: rgba(0,0,0,0.65) !important;',
' background-image: none !important;',
' border-radius: 9999px !important;',
' filter: none !important;',
'}',
// Other bg elements: pill radius
'[class*="_bg__"]:not(.Item_bg__166C-):not(.GameItem_bg__1Px-3) {',
' border-radius: 9999px !important;',
'}',
// -------------------------------------------------------
// 3. FOCUS — white pill + dark text
// -------------------------------------------------------
// Standard Item focus
'.Item_item__1Q0oR.spottable:focus,',
'.Item_item__2eTQF.spottable:focus {',
' color: #1a1a1a !important;',
'}',
'.Item_item__1Q0oR.spottable:focus .Item_bg__166C-,',
'.Item_item__2eTQF.spottable:focus .Item_bg__166C- {',
' opacity: 1 !important;',
' background-color: #fff !important;',
' background-image: none !important;',
' filter: none !important;',
' border-radius: 9999px !important;',
'}',
'.Item_item__1Q0oR.spottable:focus .Item_label__yk-Xa,',
'.Item_item__2eTQF.spottable:focus .Item_label__yk-Xa,',
'.Item_item__1Q0oR.spottable:focus .Item_itemContent__372MG,',
'.Item_item__2eTQF.spottable:focus .Item_itemContent__372MG,',
'.Item_item__1Q0oR.spottable:focus .Item_slotAfter__2fc4G,',
'.Item_item__2eTQF.spottable:focus .Item_slotAfter__2fc4G,',
'.Item_item__1Q0oR.spottable:focus .Item_slotBefore__37DXJ,',
'.Item_item__2eTQF.spottable:focus .Item_slotBefore__37DXJ,',
'.Item_item__1Q0oR.spottable:focus .Icon_icon__1UDrL,',
'.Item_item__1Q0oR.spottable:focus .Icon_icon__2ch_u,',
'.Item_item__2eTQF.spottable:focus .Icon_icon__1UDrL,',
'.Item_item__2eTQF.spottable:focus .Icon_icon__2ch_u {',
' color: #1a1a1a !important;',
'}',
// GameItem focus
'.GameItem_item__1e3fq.spottable:focus {',
' color: #1a1a1a !important;',
'}',
'.GameItem_item__1e3fq.spottable:focus .GameItem_bg__1Px-3 {',
' opacity: 1 !important;',
' background-color: #fff !important;',
' background-image: none !important;',
' filter: none !important;',
' border-radius: 9999px !important;',
'}',
'.GameItem_item__1e3fq.spottable:focus .GameItem_label__2HOiY,',
'.GameItem_item__1e3fq.spottable:focus .Icon_icon__1UDrL,',
'.GameItem_item__1e3fq.spottable:focus .Icon_icon__2ch_u {',
' color: #1a1a1a !important;',
'}',
// Disabled items
'[disabled] .Item_itemContent__372MG,',
'[aria-disabled="true"] .Item_itemContent__372MG,',
'[disabled] .Item_label__yk-Xa,',
'[aria-disabled="true"] .Item_label__yk-Xa,',
'[disabled] .Item_slotAfter__2fc4G,',
'[aria-disabled="true"] .Item_slotAfter__2fc4G,',
'[disabled] .Item_slotBefore__37DXJ,',
'[aria-disabled="true"] .Item_slotBefore__37DXJ,',
'[disabled] .Icon_icon__1UDrL,',
'[disabled] .Icon_icon__2ch_u,',
'[aria-disabled="true"] .Icon_icon__1UDrL,',
'[aria-disabled="true"] .Icon_icon__2ch_u {',
' opacity: 1 !important;',
' color: rgba(255,255,255,0.5) !important;',
'}',
// Button focus (standard Enact)
'.Button_button__2TM80.spottable:focus,',
'.Button_button__2eYtX.spottable:focus {',
' color: #1a1a1a !important;',
'}',
'.Button_button__2TM80.spottable:focus .Button_bg__2zdeb,',
'.Button_button__2TM80.spottable:focus .Button_bg__2zkI-,',
'.Button_button__2eYtX.spottable:focus .Button_bg__2zdeb,',
'.Button_button__2eYtX.spottable:focus .Button_bg__2zkI- {',
' opacity: 1 !important;',
' background-color: #fff !important;',
' background-image: none !important;',
' filter: none !important;',
' border-radius: 9999px !important;',
'}',
'.Button_button__2TM80.spottable:focus .Button_client__1-mQb,',
'.Button_button__2TM80.spottable:focus .Button_client__2pFZm,',
'.Button_button__2eYtX.spottable:focus .Button_client__1-mQb,',
'.Button_button__2eYtX.spottable:focus .Button_client__2pFZm,',
'.Button_button__2TM80.spottable:focus .Icon_icon__1UDrL,',
'.Button_button__2TM80.spottable:focus .Icon_icon__2ch_u,',
'.Button_button__2eYtX.spottable:focus .Icon_icon__1UDrL,',
'.Button_button__2eYtX.spottable:focus .Icon_icon__2ch_u {',
' color: #1a1a1a !important;',
'}',
// GameButton focus
'.GameButton_button__2_0__.spottable:focus {',
' color: #1a1a1a !important;',
'}',
'.GameButton_button__2_0__.spottable:focus .GameButton_bg__10LOj {',
' opacity: 1 !important;',
' background-color: #fff !important;',
' background-image: none !important;',
' filter: none !important;',
' border-radius: 9999px !important;',
'}',
// GameIconButton focus
'.GameIconButton_button__2mofS.spottable:focus .GameIconButton_bg__121PO {',
' opacity: 1 !important;',
' background-color: #fff !important;',
' background-image: none !important;',
' filter: none !important;',
' border-radius: 9999px !important;',
'}',
// GameSwitch focus
'.GameSwitch_switch__OWz1z.spottable:focus .GameSwitch_bg__1mRa0 {',
' opacity: 1 !important;',
' background-color: #fff !important;',
' background-image: none !important;',
' filter: none !important;',
' border-radius: 9999px !important;',
'}',
// GameRadioItem focus
'.GameRadioItem_radioItem__2GUcI.spottable:focus {',
' color: #1a1a1a !important;',
'}',
'.spottable:focus { outline: none !important; }',
// -------------------------------------------------------
// 4. TEXT & MISC
// -------------------------------------------------------
'.Item_item__1Q0oR, .Item_item__2eTQF {',
' color: rgba(255,255,255,0.85) !important;',
'}',
'.GameItem_item__1e3fq {',
' color: rgba(255,255,255,0.85) !important;',
'}',
'.Button_button__2TM80, .Button_button__2eYtX {',
' color: rgba(255,255,255,0.85) !important;',
' border-radius: 9999px !important;',
'}',
'.Header_header__2Xmak {',
' color: #fff !important;',
' border-bottom: 1px solid rgba(255,255,255,0.06) !important;',
'}',
'h1, h2, h3 { color: #fff !important; }',
'.Heading_heading__Y4gPw { color: #fff !important; }',
'.GameHeading_gameHeading__2dHP1 { color: #fff !important; }',
// GamePanel backdrop — semi-transparent dark instead of opaque
'.GamePanel_panelBackdrop__1nX3U {',
' background-color: rgba(0,0,0,0.75) !important;',
' border-radius: 24px !important;',
'}',
'.GamePanel_panel__2770_ { color: rgba(255,255,255,0.85) !important; }',
// AI Indicator
'.AIIndicatorUnit_title__1EVRE { color: rgba(255,255,255,0.7) !important; }',
'.AIIndicatorUnit_value__pC9jL { color: #fff !important; }',
// Alert popup
'.Alert_alert__gVwa9,',
'.Alert_popup__1b3Xc {',
' background-color: rgba(0,0,0,0.75) !important;',
' border-radius: 24px !important;',
'}',
'.Alert_title__1HfX1 { color: #fff !important; }',
'.Alert_body__3g69H { color: rgba(255,255,255,0.85) !important; }',
// FixedPopupPanels
'.FixedPopupPanels_fixedPopupPanels__wpe6K,',
'.FixedPopupPanels_body__2ARIw,',
'.FixedPopupPanels_panel__38yei {',
' background-color: rgba(0,0,0,0.75) !important;',
' border-radius: 24px !important;',
'}',
// Popup container
'.Popup_popup__3sv6e {',
' background-color: rgba(0,0,0,0.75) !important;',
' border-radius: 24px !important;',
'}',
'.Popup_body__2J-hw { color: rgba(255,255,255,0.85) !important; }',
// Picker styling
'.Picker_picker__fngq1 { color: rgba(255,255,255,0.85) !important; }',
'* { scrollbar-width: thin; scrollbar-color: rgba(255,255,255,0.08) transparent; }',
''
].join('\n');
function injectStyle() {
if (document.getElementById(STYLE_ID)) return;
var style = document.createElement('style');
style.id = STYLE_ID;
style.textContent = CSS;
document.head.appendChild(style);
}
if (document.body) {
injectStyle();
} else {
document.addEventListener('DOMContentLoaded', injectStyle);
}
new MutationObserver(function () {
if (!document.getElementById(STYLE_ID)) injectStyle();
}).observe(document.documentElement, { childList: true, subtree: true });
})();
@@ -0,0 +1,237 @@
// LG webOS Notification Center — Luma-style Dark Theme V1.0
// Same visual language as Settings theme: transparent compositor,
// nuclear background strip, dark pills, white focus.
// CSS class hashes from webOS 6.5.3 (kisscurl-koli).
(function () {
'use strict';
var STYLE_ID = 'luma-nc-v10';
// === COMPOSITOR TRANSPARENCY ===
try {
if (window.PalmSystem && PalmSystem.setWindowProperties) {
PalmSystem.setWindowProperties(JSON.stringify({ transparent: true }));
}
} catch (e) {}
try {
if (window.webOSSystem && webOSSystem.setWindowProperty) {
webOSSystem.setWindowProperty('transparent', 'true');
}
} catch (e) {}
var CSS = [
// -------------------------------------------------------
// 1. NUCLEAR — strip all backgrounds
// -------------------------------------------------------
'*, *::before, *::after {',
' background-color: transparent !important;',
' background-image: none !important;',
' box-shadow: none !important;',
' transition: none !important;',
' animation: none !important;',
'}',
'html, body {',
' background: transparent !important;',
' background-color: transparent !important;',
' background-image: none !important;',
'}',
'body { color: rgba(255,255,255,0.85) !important; }',
// -------------------------------------------------------
// 2. DARK PILLS on items
// -------------------------------------------------------
'.Item_bg__2MM1D {',
' opacity: 1 !important;',
' background-color: rgba(0,0,0,0.65) !important;',
' background-image: none !important;',
' border-radius: 9999px !important;',
' filter: none !important;',
'}',
// Other bg elements stay hidden until focus
'[class*="_bg__"]:not(.Item_bg__2MM1D) {',
' border-radius: 9999px !important;',
'}',
// FormCheckboxItem bg
'.FormCheckboxItem_bg__3GHsc {',
' opacity: 1 !important;',
' background-color: rgba(0,0,0,0.65) !important;',
' background-image: none !important;',
' border-radius: 9999px !important;',
' filter: none !important;',
'}',
// -------------------------------------------------------
// 3. FOCUS — white pill + dark text
// -------------------------------------------------------
// Item focus
'.Item_item__3OZOO.spottable:focus,',
'.Item_item__3gT3d.spottable:focus {',
' color: #1a1a1a !important;',
'}',
'.Item_item__3OZOO.spottable:focus .Item_bg__2MM1D,',
'.Item_item__3gT3d.spottable:focus .Item_bg__2MM1D {',
' opacity: 1 !important;',
' background-color: #fff !important;',
' background-image: none !important;',
' filter: none !important;',
' border-radius: 9999px !important;',
'}',
'.Item_item__3OZOO.spottable:focus .Item_label__2Wgl2,',
'.Item_item__3gT3d.spottable:focus .Item_label__2Wgl2,',
'.Item_item__3OZOO.spottable:focus .Item_itemContent__19m1V,',
'.Item_item__3gT3d.spottable:focus .Item_itemContent__19m1V,',
'.Item_item__3OZOO.spottable:focus .Item_slotAfter__hf946,',
'.Item_item__3gT3d.spottable:focus .Item_slotAfter__hf946,',
'.Item_item__3OZOO.spottable:focus .Item_slotBefore__39lzy,',
'.Item_item__3gT3d.spottable:focus .Item_slotBefore__39lzy,',
'.Item_item__3OZOO.spottable:focus .Icon_icon__3xbFH,',
'.Item_item__3OZOO.spottable:focus .Icon_icon__uDPTY,',
'.Item_item__3gT3d.spottable:focus .Icon_icon__3xbFH,',
'.Item_item__3gT3d.spottable:focus .Icon_icon__uDPTY {',
' color: #1a1a1a !important;',
'}',
// FormCheckboxItem focus
'.FormCheckboxItem_item__s8bcU.spottable:focus {',
' color: #1a1a1a !important;',
'}',
'.FormCheckboxItem_item__s8bcU.spottable:focus .FormCheckboxItem_bg__3GHsc {',
' opacity: 1 !important;',
' background-color: #fff !important;',
' background-image: none !important;',
' filter: none !important;',
' border-radius: 9999px !important;',
'}',
// Disabled items: force content children visible
'[disabled] .Item_itemContent__19m1V,',
'[aria-disabled="true"] .Item_itemContent__19m1V,',
'[disabled] .Item_label__2Wgl2,',
'[aria-disabled="true"] .Item_label__2Wgl2,',
'[disabled] .Item_slotAfter__hf946,',
'[aria-disabled="true"] .Item_slotAfter__hf946,',
'[disabled] .Item_slotBefore__39lzy,',
'[aria-disabled="true"] .Item_slotBefore__39lzy,',
'[disabled] .Icon_icon__3xbFH,',
'[disabled] .Icon_icon__uDPTY,',
'[aria-disabled="true"] .Icon_icon__3xbFH,',
'[aria-disabled="true"] .Icon_icon__uDPTY {',
' opacity: 1 !important;',
' color: rgba(255,255,255,0.5) !important;',
'}',
// Button focus
'.Button_button__2U0Zv.spottable:focus,',
'.Button_button__msIzD.spottable:focus {',
' color: #1a1a1a !important;',
'}',
'.Button_button__2U0Zv.spottable:focus .Button_bg__1Dcsq,',
'.Button_button__2U0Zv.spottable:focus .Button_bg__AoDJy,',
'.Button_button__msIzD.spottable:focus .Button_bg__1Dcsq,',
'.Button_button__msIzD.spottable:focus .Button_bg__AoDJy {',
' opacity: 1 !important;',
' background-color: #fff !important;',
' background-image: none !important;',
' filter: none !important;',
' border-radius: 9999px !important;',
'}',
'.Button_button__2U0Zv.spottable:focus .Button_client__2HSGm,',
'.Button_button__2U0Zv.spottable:focus .Button_client__3Hkj3,',
'.Button_button__msIzD.spottable:focus .Button_client__2HSGm,',
'.Button_button__msIzD.spottable:focus .Button_client__3Hkj3,',
'.Button_button__2U0Zv.spottable:focus .Icon_icon__3xbFH,',
'.Button_button__2U0Zv.spottable:focus .Icon_icon__uDPTY,',
'.Button_button__msIzD.spottable:focus .Icon_icon__3xbFH,',
'.Button_button__msIzD.spottable:focus .Icon_icon__uDPTY {',
' color: #1a1a1a !important;',
'}',
// Checkbox focus
'.Checkbox_checkbox__1mTpP.spottable:focus .Checkbox_bg__1-1hH {',
' opacity: 1 !important;',
' background-color: #fff !important;',
' background-image: none !important;',
' filter: none !important;',
' border-radius: 9999px !important;',
'}',
'.spottable:focus { outline: none !important; }',
// -------------------------------------------------------
// 4. TEXT & MISC
// -------------------------------------------------------
'.Item_item__3OZOO, .Item_item__3gT3d {',
' color: rgba(255,255,255,0.85) !important;',
'}',
'.Button_button__2U0Zv, .Button_button__msIzD {',
' color: rgba(255,255,255,0.85) !important;',
' border-radius: 9999px !important;',
'}',
'.Header_header__1wT5v {',
' color: #fff !important;',
' border-bottom: 1px solid rgba(255,255,255,0.06) !important;',
'}',
'h1, h2, h3 { color: #fff !important; }',
'.Heading_heading__Exc3p { color: #fff !important; }',
// Notification-specific: NotiHeader
'.NotiHeader_children__5zAyB { color: rgba(255,255,255,0.85) !important; }',
'.NotiHeader_headerButton__Y2scK { color: rgba(255,255,255,0.7) !important; }',
'.NotiIcon_icon__3m2-f { color: rgba(255,255,255,0.85) !important; }',
// Alert popup styling
'.Alert_alert__1hTPw,',
'.Alert_popup__2t0iD {',
' background-color: rgba(0,0,0,0.75) !important;',
' border-radius: 24px !important;',
'}',
'.Alert_title__1Qf_f { color: #fff !important; }',
'.Alert_body__3frtV { color: rgba(255,255,255,0.85) !important; }',
// FixedPopupPanels (detail views)
'.FixedPopupPanels_fixedPopupPanels__12XNO,',
'.FixedPopupPanels_body__jZC_5,',
'.FixedPopupPanels_panel__3qAUZ {',
' background-color: rgba(0,0,0,0.75) !important;',
' border-radius: 24px !important;',
'}',
// Popup container
'.Popup_popup__K1Ygj {',
' background-color: rgba(0,0,0,0.75) !important;',
' border-radius: 24px !important;',
'}',
'.Popup_body__1N5b9 { color: rgba(255,255,255,0.85) !important; }',
'* { scrollbar-width: thin; scrollbar-color: rgba(255,255,255,0.08) transparent; }',
''
].join('\n');
function injectStyle() {
if (document.getElementById(STYLE_ID)) return;
var style = document.createElement('style');
style.id = STYLE_ID;
style.textContent = CSS;
document.head.appendChild(style);
}
if (document.body) {
injectStyle();
} else {
document.addEventListener('DOMContentLoaded', injectStyle);
}
new MutationObserver(function () {
if (!document.getElementById(STYLE_ID)) injectStyle();
}).observe(document.documentElement, { childList: true, subtree: true });
})();