portal agent: consider clicks to phone numbers, not whole line (#63484)

static/portal-agent/css/agent-portal.scss

@@ -310,3 +310,17 @@ div.profile {
 		page-break-after: always;
 	}
 }
+
+#calls {
+	ul, li { margin: 0; padding: 0; list-style: none; }
+	ul { margin-bottom: 1em; }
+	li {
+		margin-bottom: 1ex;
+	}
+	.caller {
+		cursor: pointer;
+		&:hover {
+			text-decoration: underline;
+		}
+	}
+}

templates/portal-agent/combo/json/phone-calls.html

@@ -13,7 +13,7 @@ function set_caller(caller) {
 
 <div id="calls" data-calls="{{ json|as_json }}">
 {% if json %}  {# callee has been set #}
-<strong>Appel en cours</strong>
+<h3>Appel en cours</h3>
 {% for call in json.data.current %}
 {% if forloop.first %}
 <script>
@@ -22,18 +22,19 @@ $(function() {
 });
 </script>
 {% endif %}
-<div class="caller" data-caller="{{ call.caller }}">
+<ul><li><span class="caller" title="Chercher ce numéro" data-caller="{{ call.caller }}">
   {{call.start|parse_datetime|date:"H\hi"}} : {{ call.caller }}
-</div>
+</span></li></ul>
 {% empty %}
 <div>Pas d’appel en cours</div>
 {% endfor %}
 
 {% for call in json.data.past|slice:":10" %}
-{% if forloop.first %}<strong>Appels précédents</strong>{% endif %}
-<div class="caller" data-caller="{{ call.caller }}">
+{% if forloop.first %}<h3>Appels précédents</h3><ul>{% endif %}
+<li><span class="caller" title="Chercher ce numéro" data-caller="{{ call.caller }}">
   {{call.start|parse_datetime|date:"H\hi"}} : {{ call.caller }}
-</div>
+</span></li>
+{% if forloop.last %}</ul>{% endif %}
 {% endfor %}
 {% endif %}
 </div>
@@ -53,7 +54,7 @@ $(function() {
 
 <script>
 $(function() {
-  $('div.caller').on('click', function(event) {
+  $('.caller').on('click', function(event) {
     set_caller($(event.target).data('caller'));
   });
   var $cell = $('.configjsoncell.phone-calls');