tweak cam op list l&f

This commit is contained in:
Stewart Allen 2024-06-01 23:42:35 -04:00
commit 248e7952f7
3 changed files with 8 additions and 7 deletions

View file

@ -457,7 +457,7 @@ CAM.init = function(kiri, api) {
currentIndex = isIndexed && !isPreview ? index * DEG2RAD : 0; currentIndex = isIndexed && !isPreview ? index * DEG2RAD : 0;
} }
// (re)render thea re-orderable op list // (re)render the re-orderable op list
api.event.on("cam.op.render", func.opRender = () => { api.event.on("cam.op.render", func.opRender = () => {
let oplist = current.process.ops; let oplist = current.process.ops;
if (!(isCamMode && oplist)) { if (!(isCamMode && oplist)) {
@ -471,7 +471,6 @@ CAM.init = function(kiri, api) {
let notime = false; let notime = false;
oplist.forEach((rec,i) => { oplist.forEach((rec,i) => {
let clock = rec.type === '|'; let clock = rec.type === '|';
// let label = clock ? `<i class="fa-regular fa-clock"></i>` : rec.type;
let label = clock ? `` : rec.type; let label = clock ? `` : rec.type;
let clazz = notime ? [ "draggable", "notime" ] : [ "draggable" ]; let clazz = notime ? [ "draggable", "notime" ] : [ "draggable" ];
let notable = rec.note?.split(' ').filter(v => v.charAt(0) === '#'); let notable = rec.note?.split(' ').filter(v => v.charAt(0) === '#');
@ -481,7 +480,7 @@ CAM.init = function(kiri, api) {
`<div id="${mark+i}" class="${clazz.join(' ')}">`, `<div id="${mark+i}" class="${clazz.join(' ')}">`,
`<label class="label">${label}</label>`, `<label class="label">${label}</label>`,
clock ? '' : clock ? '' :
`<label id="${mark+i}-x" class="del"><i class="fa-regular fa-circle-xmark"></i></label>`, `<label id="${mark+i}-x" class="del"><i class="fa fa-trash"></i></label>`,
`</div>` `</div>`
]); ]);
bind[mark+i] = rec; bind[mark+i] = rec;

View file

@ -114,7 +114,7 @@ FDM.init = function(kiri, api) {
let id = (now++).toString(36); let id = (now++).toString(36);
let rows = Object.entries(range.fields).map(a => `<div><label class="pad">${rangeVars[a[0]]}</label><span></span><label class="val">${a[1]}</label></div>`).join(''); let rows = Object.entries(range.fields).map(a => `<div><label class="pad">${rangeVars[a[0]]}</label><span></span><label class="val">${a[1]}</label></div>`).join('');
let hover = `<div id="hov_${id}" class="range-detail">${rows}</div>`; let hover = `<div id="hov_${id}" class="range-detail">${rows}</div>`;
let info = `<button id="sel_${id}" class="j-center grow">${range.lo} - ${range.hi}</button><button id="del_${id}"><i class="far fa-trash-alt"></i></button>`; let info = `<button id="sel_${id}" class="j-center grow">${range.lo} - ${range.hi}</button><button id="del_${id}"><i class="fa fa-trash"></i></button>`;
html.appendAll([ html.appendAll([
`<div id="rng_${id}" class="range-info">${hover}${info}</div>` `<div id="rng_${id}" class="range-info">${hover}${info}</div>`
]); ]);

View file

@ -1063,6 +1063,9 @@ th, tr, td, label {
#oplist .clock:hover { #oplist .clock:hover {
background-color: var(--blue-2); background-color: var(--blue-2);
} }
#oplist > div {
padding: 5px 20px 5px 7px !important;
}
#oplist > div, .opdiv { #oplist > div, .opdiv {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -1094,10 +1097,9 @@ th, tr, td, label {
} }
#oplist div .del { #oplist div .del {
position: absolute; position: absolute;
top: 1px; right: 6px;
right: 2px;
font-size: 14px; font-size: 14px;
color: rgba(0,0,0,0); color: rgba(0,0,0,0.25);
} }
.dark #oplist div:hover .del { .dark #oplist div:hover .del {
color: #777; color: #777;