From ee7036f13ddce56ed8d12b3bdd224cc407ba7519 Mon Sep 17 00:00:00 2001
From: Aircoookie <21045690+Aircoookie@users.noreply.github.com>
Date: Mon, 29 May 2023 21:06:10 +0200
Subject: [PATCH] CSS tweaks
Fix repeat segment button remaining hidden
Fix third segment row (offset) alignment in 1D mode
Keep disabled sound simulation modes as comment for reference
New local var for 2D seg UI, improves code legibility
---
wled00/data/index.css | 12 +-
wled00/data/index.js | 34 +-
wled00/html_ui.h | 3348 ++++++++++++++++++++---------------------
wled00/util.cpp | 13 +
4 files changed, 1710 insertions(+), 1697 deletions(-)
diff --git a/wled00/data/index.css b/wled00/data/index.css
index c85288177..640839d55 100644
--- a/wled00/data/index.css
+++ b/wled00/data/index.css
@@ -191,12 +191,8 @@ button {
.g-icon {
font-style: normal;
position: absolute;
- top: 6px;
- right: 8px;
-}
-
-#segutil .g-icon {
top: 8px;
+ right: 8px;
}
/* pop-up container */
@@ -207,7 +203,7 @@ button {
right: 0;
}
-/* pop-up content */
+/* pop-up content (segment sets) */
.pop-c {
position: absolute;
background-color: var(--c-2);
@@ -216,8 +212,9 @@ button {
z-index: 1;
top: 3px;
right: 35px;
- padding: 4px 8px 1px;
+ padding: 3px 8px 1px;
font-size: 24px;
+ line-height: 24px;
}
.pop-c span {
padding: 2px 6px;
@@ -823,6 +820,7 @@ input[type=range]::-moz-range-thumb {
.btn-xs, .btn-pl-del, .btn-pl-add {
width: 42px !important;
height: 42px !important;
+ text-overflow: clip;
}
.btn-xs {
margin: 2px 0 0 0;
diff --git a/wled00/data/index.js b/wled00/data/index.js
index 31f472228..e6c89342c 100644
--- a/wled00/data/index.js
+++ b/wled00/data/index.js
@@ -702,11 +702,12 @@ function populateSegments(s)
let sg = gId(`seg${i}`);
let exp = sg ? (sg.classList.contains('expanded') || (i===0 && cfg.comp.segexp)) : false;
- let cG = "var(--c-f)";
+ // segment set icon color
+ let cG = "var(--c-b)";
switch (inst.set) {
case 1: cG = "var(--c-r)"; break;
- case 2: cG = "var(--c-g)"; break;
- case 3: cG = "var(--c-b)"; break;
+ case 2: cG = "var(--c-g)"; break;
+ case 3: cG = "var(--c-l)"; break;
}
let segp = `
`+
@@ -720,10 +721,11 @@ function populateSegments(s)
let stoX = inst.stop;
let staY = inst.startY;
let stoY = inst.stopY;
+ let isMSeg = isM && staX
Reverse ${isM?'':'direction'}`;
let miXck = ``;
let rvYck = "", miYck ="";
- if (isM && staXReverse`;
miYck = ``;
}
@@ -761,16 +763,16 @@ function populateSegments(s)
``+
``+
``+
- (!(isM&&staX1&&stoX-staX>1 ? map2D : '') +
+ (!isMSeg ? rvXck : '') +
+ (isMSeg&&stoY-staY>1&&stoX-staX>1 ? map2D : '') +
(s.AudioReactive && s.AudioReactive.on ? "" : sndSim) +
`