diff --git a/app/static/css/index.css b/app/static/css/index.css index b0ae75f..415f19f 100644 --- a/app/static/css/index.css +++ b/app/static/css/index.css @@ -149,6 +149,58 @@ a{color:var(--link)} background: var(--chip); } +/* Новые стили для расширенного tooltip */ +.mini-container-tooltip-remote-icon { + font-size: 12px; + color: var(--accent); + margin-left: 4px; +} + +.mini-container-tooltip-host { + font-size: 11px; + color: var(--muted); + margin-bottom: 4px; + display: flex; + align-items: center; + gap: 4px; +} + +.mini-container-tooltip-update { + font-size: 10px; + color: var(--muted); + margin-bottom: 6px; + font-style: italic; +} + +.mini-container-tooltip-ssh { + font-size: 10px; + color: var(--accent); + text-decoration: none; + display: flex; + align-items: center; + gap: 4px; + padding: 2px 4px; + border-radius: 4px; + transition: all 0.2s ease; + cursor: pointer; + margin-top: 4px; +} + +.mini-container-tooltip-ssh:hover { + text-decoration: underline; + color: var(--link); + background: var(--chip); +} + +.mini-container-tooltip-action { + font-size: 10px; + color: var(--muted); + margin-top: 6px; + padding-top: 6px; + border-top: 1px solid var(--border); + font-style: italic; +} + /* Дополнительные стили для светлой темы */ diff --git a/app/static/js/index.js b/app/static/js/index.js index 94cb319..7031359 100644 --- a/app/static/js/index.js +++ b/app/static/js/index.js @@ -1592,22 +1592,51 @@ function showMiniContainerTooltip(event, service) { const statusClass = service.status === 'running' ? 'running' : service.status === 'stopped' ? 'stopped' : 'paused'; - tooltip.innerHTML = ` + // Определяем тип контейнера и создаем соответствующий tooltip + const isRemote = service.is_remote || service.hostname !== 'localhost'; + const hostname = service.hostname || 'localhost'; + + let tooltipContent = `