bonamin/bellsystems-cp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

colour changes made by Copilot

Browse Source
This commit is contained in:
Vasileios Kousaridas
2026-02-17 19:20:15 +02:00
parent b061b7ab9d
commit f1b0bcd201
4 changed files with 21 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
frontend/src/melodies/MelodyForm.jsx
View File

@@ -219,7 +219,7 @@ export default function MelodyForm() {
form="melody-form"
disabled={saving || uploading}
className="px-4 py-2 text-sm rounded-md disabled:opacity-50 disabled:cursor-not-allowed transition-colors"
style={{ backgroundColor: "var(--btn-primary)", color: "var(--text-heading)" }}
style={{ backgroundColor: "var(--btn-primary)", color: "var(--text-white)" }}
>
{uploading ? "Uploading files..." : saving ? "Saving..." : isEdit ? "Update Melody" : "Create Melody"}
</button>
@@ -333,11 +333,10 @@ export default function MelodyForm() {
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M7 21a4 4 0 01-4-4V5a2 2 0 012-2h4a2 2 0 012 2v12a4 4 0 01-4 4zm0 0h12a2 2 0 002-2v-4a2 2 0 00-2-2h-2.343M11 7.343l1.657-1.657a2 2 0 012.828 0l2.829 2.829a2 2 0 010 2.828l-8.486 8.485M7 17h.01" />
</svg>
Custom
<input type="color" value={information.color ? normalizeColor(information.color) : "#000000"} onChange={(e) => updateInfo("color", e.target.value)} className="absolute inset-0 opacity-0 w-full h-full cursor-pointer" />
<input type="color" value={normalizeColor(information.color)} onChange={(e) => updateInfo("color", e.target.value)} className="absolute inset-0 opacity-0 w-full h-full cursor-pointer" />
</label>
</div>
</div>
style={{ backgroundColor: "var(--btn-primary)", color: "var(--text-white)" }}
</div>
<div className="flex items-center gap-2 pt-2">
<input type="checkbox" id="isTrueRing" checked={information.isTrueRing} onChange={(e) => updateInfo("isTrueRing", e.target.checked)} className="h-4 w-4 rounded" />
<label htmlFor="isTrueRing" className="text-sm font-medium" style={labelStyle}>True Ring</label>

9
frontend/src/melodies/MelodySettings.jsx
View File

@@ -23,8 +23,11 @@ export default function MelodySettings() {
const [success, setSuccess] = useState("");
const [langToAdd, setLangToAdd] = useState("");
const [colorToAdd, setColorToAdd] = useState("#FF0000");
const [colorHexInput, setColorHexInput] = useState("#FF0000");
const cssColorDefault = (typeof window !== "undefined" && window.getComputedStyle)
? getComputedStyle(document.documentElement).getPropertyValue("--color-default").trim()
: "var(--color-default)";
const [colorToAdd, setColorToAdd] = useState(cssColorDefault);
const [colorHexInput, setColorHexInput] = useState(cssColorDefault);
const [durationToAdd, setDurationToAdd] = useState("");
useEffect(() => {
@@ -231,7 +234,7 @@ export default function MelodySettings() {
type="text"
value={colorHexInput}
onChange={(e) => { setColorHexInput(e.target.value); if (/^#[0-9A-Fa-f]{6}$/.test(e.target.value)) setColorToAdd(e.target.value); }}
placeholder="#FF0000"
placeholder="#RRGGBB"
className="w-28 px-3 py-2 rounded-md text-sm font-mono border"
/>
<button type="button" onClick={addColor} disabled={saving} className={btnPrimary} style={{ backgroundColor: "var(--btn-primary)", color: "var(--text-white)" }}>Add</button>

12
frontend/src/melodies/melodyUtils.js
View File

@@ -48,7 +48,17 @@ export function getLocalizedValue(value, lang, fallback = "") {
* Converts "0xFFRRGGBB" or "0xRRGGBB" format to "#RRGGBB".
*/
export function normalizeColor(val) {
if (!val) return "#000000";
if (!val) {
try {
if (typeof window !== "undefined" && window.getComputedStyle) {
const v = getComputedStyle(document.documentElement).getPropertyValue("--color-default").trim();
if (v) return v;
}
} catch (e) {
// fallthrough
}
return "var(--color-default)";
}
if (val.startsWith("0x") || val.startsWith("0X")) {
const hex = val.slice(2);
// If 8 chars (AARRGGBB), skip alpha