From 0ab194e1c6b5a5a3a12a1ab4c6146bf8da774350 Mon Sep 17 00:00:00 2001
From: Yohan Boniface <yohanboniface@free.fr>
Date: Mon, 2 Dec 2024 17:16:32 +0100
Subject: [PATCH] feat: highlight importer URL field when it is fulfilled

cf #2302
---
 umap/static/umap/css/form.css           | 3 +++
 umap/static/umap/js/modules/importer.js | 2 +-
 2 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/umap/static/umap/css/form.css b/umap/static/umap/css/form.css
index 2d35cb264..32473f123 100644
--- a/umap/static/umap/css/form.css
+++ b/umap/static/umap/css/form.css
@@ -599,3 +599,6 @@ input[type=hidden].blur + [type="button"] {
     border: 1px solid #202425;
     border-radius: initial;
 }
+input.highlightable:not(:placeholder-shown) {
+    border: 1px solid var(--color-brightCyan);
+}
diff --git a/umap/static/umap/js/modules/importer.js b/umap/static/umap/js/modules/importer.js
index 6d9595244..7e7343c82 100644
--- a/umap/static/umap/js/modules/importer.js
+++ b/umap/static/umap/js/modules/importer.js
@@ -10,7 +10,7 @@ const TEMPLATE = `
     <fieldset class="formbox">
       <legend class="counter">${translate('Choose data')}</legend>
       <input type="file" multiple autofocus onchange />
-      <input type="url" placeholder="${translate('Provide an URL here')}" onchange />
+      <input class="highlightable" type="url" placeholder="${translate('Provide an URL here')}" onchange />
       <textarea onchange placeholder="${translate('Paste your data here')}"></textarea>
       <div class="importers" hidden>
         <h4>${translate('Import helpers:')}</h4>