Style remove button to match port label bubble
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -312,7 +312,7 @@ export function createNodeElement(node, switchConnection, nodeLocation, uplinkIn
|
|||||||
if (!removeBtn) {
|
if (!removeBtn) {
|
||||||
removeBtn = document.createElement('button');
|
removeBtn = document.createElement('button');
|
||||||
removeBtn.className = 'remove-node-btn';
|
removeBtn.className = 'remove-node-btn';
|
||||||
removeBtn.textContent = '×';
|
removeBtn.textContent = 'X';
|
||||||
removeBtn.title = 'Remove node';
|
removeBtn.title = 'Remove node';
|
||||||
removeBtn.addEventListener('click', (e) => {
|
removeBtn.addEventListener('click', (e) => {
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
|
|||||||
@@ -300,7 +300,7 @@ export function renderNetworkTable() {
|
|||||||
html += '<td class="' + statusClass + '">' + r.status + '</td>';
|
html += '<td class="' + statusClass + '">' + r.status + '</td>';
|
||||||
html += '<td>';
|
html += '<td>';
|
||||||
if (r.removable) {
|
if (r.removable) {
|
||||||
html += '<button class="remove-node-btn" data-node-id="' + escapeHtml(r.nodeId) + '" title="Remove node">×</button>';
|
html += '<button class="remove-node-btn" data-node-id="' + escapeHtml(r.nodeId) + '" title="Remove node">X</button>';
|
||||||
}
|
}
|
||||||
html += '</td>';
|
html += '</td>';
|
||||||
html += '</tr>';
|
html += '</tr>';
|
||||||
|
|||||||
@@ -1056,7 +1056,8 @@ body.sacn-mode .node:not(.sacn-out):not(.sacn-in):hover .node-info-wrapper {
|
|||||||
.node:has(.uplink-hover:hover) .node-info-wrapper,
|
.node:has(.uplink-hover:hover) .node-info-wrapper,
|
||||||
.node:has(.dante-hover:hover) .node-info-wrapper,
|
.node:has(.dante-hover:hover) .node-info-wrapper,
|
||||||
.node:has(.artnet-hover:hover) .node-info-wrapper,
|
.node:has(.artnet-hover:hover) .node-info-wrapper,
|
||||||
.node:has(.sacn-hover:hover) .node-info-wrapper {
|
.node:has(.sacn-hover:hover) .node-info-wrapper,
|
||||||
|
.node:has(.remove-node-btn:hover) .node-info-wrapper {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -1276,8 +1277,24 @@ body.sacn-mode .node:not(.sacn-out):not(.sacn-in):hover .node-info-wrapper {
|
|||||||
|
|
||||||
.node .remove-node-btn {
|
.node .remove-node-btn {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: 2px;
|
top: -8px;
|
||||||
right: 2px;
|
right: -4px;
|
||||||
|
width: auto;
|
||||||
|
height: auto;
|
||||||
|
padding: 1px 6px;
|
||||||
|
font-size: 10px;
|
||||||
|
line-height: 1;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
background: #833;
|
||||||
|
border: none;
|
||||||
|
border-radius: 8px;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.node .remove-node-btn:hover {
|
||||||
|
background: #a44;
|
||||||
}
|
}
|
||||||
|
|
||||||
.data-table .remove-node-btn {
|
.data-table .remove-node-btn {
|
||||||
|
|||||||
Reference in New Issue
Block a user