From af4ffb8559a0aa71d8261fde4f431e3fa88d3067 Mon Sep 17 00:00:00 2001
From: Kobe <kobeamerijckx@outlook.com>
Date: Tue, 10 Jun 2025 12:15:18 +0200
Subject: [PATCH] Update instance_detail.html

---
 templates/main/instance_detail.html | 24 +++++++++++++++---------
 1 file changed, 15 insertions(+), 9 deletions(-)

diff --git a/templates/main/instance_detail.html b/templates/main/instance_detail.html
index 5af70e1..06252c9 100644
--- a/templates/main/instance_detail.html
+++ b/templates/main/instance_detail.html
@@ -176,7 +176,7 @@ async function checkInstanceStatus() {
         console.log('Status data:', data);
         
         // Update activity status
-        const activityIcon = document.querySelector('.status-icon-wrapper .fa-circle-notch');
+        const activityIcon = document.querySelector('.card:first-child .fa-circle-notch');
         const activityBadge = document.querySelector('.card:first-child .badge');
         const activityDetails = document.querySelector('.card:first-child .text-muted');
         
@@ -187,8 +187,14 @@ async function checkInstanceStatus() {
             activityBadge.className = `badge bg-${data.status === 'active' ? 'success' : 'danger'}`;
             activityBadge.textContent = data.status.charAt(0).toUpperCase() + data.status.slice(1);
         }
-        if (activityDetails && data.status_details) {
-            activityDetails.textContent = data.status_details;
+        if (activityDetails) {
+            // Only update if we have status details
+            if (data.status_details) {
+                activityDetails.textContent = data.status_details;
+                activityDetails.style.display = 'block';
+            } else {
+                activityDetails.style.display = 'none';
+            }
         }
     } catch (error) {
         console.error('Error checking instance status:', error);
@@ -206,9 +212,9 @@ async function checkAuthStatus() {
         console.log('Auth data:', data);
         
         // Update authentication status
-        const authIcon = document.querySelector('.card:last-child .fa-shield-alt');
-        const authBadge = document.querySelector('.card:last-child .badge');
-        const authDetails = document.querySelector('.card:last-child .text-muted');
+        const authIcon = document.querySelector('.card:nth-child(2) .fa-shield-alt');
+        const authBadge = document.querySelector('.card:nth-child(2) .badge');
+        const authDetails = document.querySelector('.card:nth-child(2) .text-muted');
         
         if (authIcon) {
             authIcon.className = `fas fa-shield-alt ${data.authenticated ? 'text-success' : 'text-warning'} fa-2x`;
@@ -283,7 +289,7 @@ async function fetchCompanyInfo() {
         
         // Update email with mailto link
         if (data.company_email && data.company_email !== 'Not set') {
-            emailElement.innerHTML = `<a href="mailto:${data.company_email}" class="text-decoration-none">
+            emailElement.innerHTML = `<a href="mailto:${data.company_email}" class="text-decoration-none" style="color: var(--primary-color);">
                 <i class="fas fa-envelope me-2"></i>${data.company_email}
             </a>`;
         } else {
@@ -292,7 +298,7 @@ async function fetchCompanyInfo() {
         
         // Update phone with tel link
         if (data.company_phone && data.company_phone !== 'Not set') {
-            phoneElement.innerHTML = `<a href="tel:${data.company_phone}" class="text-decoration-none">
+            phoneElement.innerHTML = `<a href="tel:${data.company_phone}" class="text-decoration-none" style="color: var(--primary-color);">
                 <i class="fas fa-phone me-2"></i>${data.company_phone}
             </a>`;
         } else {
@@ -306,7 +312,7 @@ async function fetchCompanyInfo() {
             if (!websiteUrl.startsWith('http://') && !websiteUrl.startsWith('https://')) {
                 websiteUrl = 'https://' + websiteUrl;
             }
-            websiteElement.innerHTML = `<a href="${websiteUrl}" target="_blank" rel="noopener noreferrer" class="text-decoration-none">
+            websiteElement.innerHTML = `<a href="${websiteUrl}" target="_blank" rel="noopener noreferrer" class="text-decoration-none" style="color: var(--primary-color);">
                 <i class="fas fa-globe me-2"></i>${data.company_website}
             </a>`;
         } else {