Mercurial > libervia-templates

comparison sat_templates/templates/bulma/call/call.html @ 374:5646df8bd391

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
bulma (call): calling mode improvments: - instead of a "switch" button, there are now 2 button with only an icon, one for video call and the other for audio call, they appear on the same row as the search bar - search item can now be extended using "call" blocks, and options are used - call search items don't show group, and now display an "extra" menu (3 dots menu) with a dropdown to select audio or video call.
author Goffi <goffi@goffi.org>
date Tue, 15 Aug 2023 17:12:18 +0200
parents a603cf0fa5d1
children 44337471d390
comparison
equal deleted inserted replaced
373:c5609be6c34e 374:5646df8bd391
11 <section class="section is-full-below-menu" style="position: relative" > 11 <section class="section is-full-below-menu" style="position: relative" >
12 <div id="containers_wrapper"> 12 <div id="containers_wrapper">
13 13
14 {# Search #} 14 {# Search #}
15 <div id="search_container" class="is-overlay"> 15 <div id="search_container" class="is-overlay">
16 <div id="search_header" class="columns is-1">
17 <div class="column">
18 <input class="input" type="search" id="search" placeholder="Enter contact's name or address">
19 </div>
20 16
21 <div class="column is-narrow buttons has-addons"> 17 <div class="container">
22 <button class="button is-primary" id="call_btn"> 18 <div class="columns is-vcentered is-mobile">
23 <i class="icon-videocam" aria-hidden="true"></i> 19
24 {% trans %}Video Call{% endtrans %} 20 <!-- Search bar -->
25 </button> 21 <div class="column is-flex-grow-1">
26 <button class="button is-primary" id="toggle_call_mode_btn"> 22 <input class="input" type="search" id="search" placeholder="Enter contact's name or address" aria-label="Search for contacts">
27 <span class="icon is-small"> 23 </div>
28 <i class="icon-exchange" aria-hidden="true"></i> 24
25 <!-- Video Call Button -->
26 <div class="column is-narrow">
27 <button class="button is-primary" id="video_call_btn" aria-label="Initiate Video Call">
28 <span class="icon">
29 <i class="icon-videocam"></i>
29 </span> 30 </span>
30 </button> 31 </button>
31 </div> 32 </div>
33
34 <!-- Audio Call Button -->
35 <div class="column is-narrow">
36 <button class="button is-light" id="audio_call_btn" aria-label="Initiate Audio Call">
37 <span class="icon">
38 <i class="icon-phone"></i>
39 </span>
40 </button>
41 </div>
42 </div>
32 </div> 43 </div>
33 44
34 <div id="contacts" class="columns is-multiline is-mobile"> 45 <div id="contacts" class="columns is-multiline is-mobile is-half-touch">
35 </div> 46 </div>
36 47
37 </div> 48 </div>
38 49
39 {# Calls #} 50 {# Calls #}