Improve and condense related controls

core/templates/base.html

@@ -190,6 +190,26 @@
       .modal-background{
         background-color:rgba(255, 255, 255, 0.3) !important;
       }
+      #modals-here .modal-background {
+        background-color: rgba(0, 0, 0, 0.34) !important;
+      }
+      #modals-here .modal-content > .box {
+        background-color: rgba(255, 255, 255, 0.97) !important;
+        color: inherit;
+      }
+      #modals-here .modal-content .input,
+      #modals-here .modal-content .textarea,
+      #modals-here .modal-content .select select {
+        background-color: rgba(255, 255, 255, 0.98) !important;
+      }
+      [data-theme="dark"] #modals-here .modal-content > .box {
+        background-color: rgba(45, 45, 45, 0.97) !important;
+      }
+      [data-theme="dark"] #modals-here .modal-content .input,
+      [data-theme="dark"] #modals-here .modal-content .textarea,
+      [data-theme="dark"] #modals-here .modal-content .select select {
+        background-color: rgba(33, 33, 33, 0.98) !important;
+      }
 
       .has-background-grey-lighter{
         background-color:rgba(219, 219, 219, 0.5) !important;
@@ -340,25 +360,9 @@
               Queue
             </a>
 
-            <div class="navbar-item has-dropdown is-hoverable">
-              <a class="navbar-link">
-                OSINT
-              </a>
-              <div class="navbar-dropdown">
-                <a class="navbar-item" href="{% url 'people' type='page' %}">
-                  People
-                </a>
-                <a class="navbar-item" href="{% url 'groups' type='page' %}">
-                  Groups
-                </a>
-                <a class="navbar-item" href="{% url 'personas' type='page' %}">
-                  Personas
-                </a>
-                <a class="navbar-item" href="{% url 'manipulations' type='page' %}">
-                  Manipulations
-                </a>
-              </div>
-            </div>
+            <a class="navbar-item" href="{% url 'osint_workspace' %}">
+              OSINT
+            </a>
           {% endif %}
           <a class="navbar-item add-button">
             Install
@@ -464,6 +468,54 @@
           });
         });
       });
+
+      window.giaPrepareWidgetTarget = function () {
+        const target = document.getElementById("widgets-here");
+        if (target) {
+          target.style.display = "block";
+        }
+      };
+
+      window.giaCanSpawnWidgets = function () {
+        return !!(
+          window.grid &&
+          typeof window.grid.addWidget === "function" &&
+          document.getElementById("grid-stack-main") &&
+          document.getElementById("widgets-here")
+        );
+      };
+
+      window.giaEnableWidgetSpawnButtons = function (root) {
+        const scope = root && root.querySelectorAll ? root : document;
+        const canSpawn = window.giaCanSpawnWidgets();
+        scope.querySelectorAll(".js-widget-spawn-trigger").forEach(function (button) {
+          const widgetUrl = String(
+            button.getAttribute("data-widget-url")
+            || button.getAttribute("hx-get")
+            || ""
+          ).trim();
+          const visible = canSpawn && !!widgetUrl;
+          button.classList.toggle("is-hidden", !visible);
+          button.setAttribute("aria-hidden", visible ? "false" : "true");
+        });
+      };
+
+      document.addEventListener("click", function (event) {
+        const trigger = event.target.closest(".js-widget-spawn-trigger");
+        if (!trigger) {
+          return;
+        }
+        window.giaPrepareWidgetTarget();
+      });
+
+      document.addEventListener("DOMContentLoaded", function () {
+        window.giaEnableWidgetSpawnButtons(document);
+      });
+
+      document.body.addEventListener("htmx:afterSwap", function (event) {
+        const target = (event && event.target) || document;
+        window.giaEnableWidgetSpawnButtons(target);
+      });
     </script>
     {% block outer_content %}
     {% endblock %}