Improve TSCM modal close button visibility

- Add circular background to close button
- Use visible border and solid background color
- Increase z-index to ensure it's above content
- Add hover effect with red background
- Better positioning and sizing

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Smittix
2026-01-14 15:53:23 +00:00
parent ec585aba42
commit 42f6dc3087
+19 -8
View File
@@ -2273,16 +2273,27 @@
} }
.tscm-modal-close { .tscm-modal-close {
position: absolute; position: absolute;
top: 10px; top: 12px;
right: 10px; right: 12px;
background: none; background: var(--bg-tertiary);
border: none; border: 1px solid var(--border-light);
color: var(--text-muted); border-radius: 50%;
font-size: 24px; width: 32px;
height: 32px;
display: flex;
align-items: center;
justify-content: center;
color: var(--text-secondary);
font-size: 20px;
cursor: pointer; cursor: pointer;
z-index: 1; z-index: 10;
transition: all 0.2s;
}
.tscm-modal-close:hover {
background: var(--accent-red);
border-color: var(--accent-red);
color: #fff;
} }
.tscm-modal-close:hover { color: #fff; }
.device-detail-header { .device-detail-header {
padding: 16px; padding: 16px;
border-bottom: 1px solid var(--border-color); border-bottom: 1px solid var(--border-color);