Add (disabled) multi-party call UI

3 files changed, 53 insertions, 13 deletions

diff --git a/main/data/call_widget.ui b/main/data/call_widget.ui
index 47fb0046..8e2ee36c 100644
--- a/main/data/call_widget.ui
+++ b/main/data/call_widget.ui
@@ -66,19 +66,15 @@
                                 <property name="reveal-child">True</property>
                                 <property name="visible">True</property>
                                 <child>
-                                    <object class="GtkBox">
+                                    <object class="GtkBox" id="outer_additional_box">
                                         <property name="visible">True</property>
-                                        <style>
-                                            <class name="incoming-call-box"/>
-                                        </style>
                                         <child>
-                                            <object class="GtkBox">
+                                            <object class="GtkBox" id="incoming_call_box">
                                                 <property name="halign">end</property>
                                                 <property name="orientation">horizontal</property>
                                                 <property name="spacing">5</property>
                                                 <property name="margin">10</property>
                                                 <property name="hexpand">True</property>
-                                                <property name="visible">True</property>
                                                 <child>
                                                     <object class="GtkButton" id="reject_call_button">
                                                         <property name="label" translatable="yes">Reject</property>
@@ -99,6 +95,13 @@
                                                 </child>
                                             </object>
                                         </child>
+                                        <child>
+                                            <object class="GtkBox" id="multiparty_peer_box">
+                                                <property name="margin">10</property>
+                                                <property name="spacing">5</property>
+                                                <property name="hexpand">True</property>
+                                            </object>
+                                        </child>
                                     </object>
                                 </child>
                             </object>
diff --git a/main/data/icons/dino-account-plus-symbolic.svg b/main/data/icons/dino-account-plus-symbolic.svg
new file mode 100644
index 00000000..cf743afa
--- /dev/null
+++ b/main/data/icons/dino-account-plus-symbolic.svg
@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="24" height="24" viewBox="0 0 24 24"><path d="M15,14C12.33,14 7,15.33 7,18V20H23V18C23,15.33 17.67,14 15,14M6,10V7H4V10H1V12H4V15H6V12H9V10M15,12A4,4 0 0,0 19,8A4,4 0 0,0 15,4A4,4 0 0,0 11,8A4,4 0 0,0 15,12Z" /></svg>
\ No newline at end of file
diff --git a/main/data/theme.css b/main/data/theme.css
index cf57ae96..36b3cb5b 100644
--- a/main/data/theme.css
+++ b/main/data/theme.css
@@ -114,6 +114,11 @@ window.dino-main .incoming-call-box {
     background: alpha(@theme_selected_bg_color, 0.1);
 }
 
+window.dino-main .multiparty-participants {
+    border-top: 1px solid alpha(@theme_fg_color, 0.05);
+    background: alpha(@theme_fg_color, 0.04)
+}
+
 window.dino-main .dino-sidebar > frame.collapsed {
     border-bottom: 1px solid @borders;
 }
@@ -280,20 +285,27 @@ box.dino-input-error label.input-status-highlight-once {
     margin: 0;
 }
 
-.dino-call-window .encryption-box {
+.dino-call-window .black-element {
     color: rgba(255,255,255,0.7);
     border-radius: 5px;
     background: rgba(0,0,0,0.5);
-    padding: 0px;
     border: none;
     box-shadow: none;
 }
 
-.dino-call-window .encryption-box.unencrypted {
+.dino-call-window label.black-element {
+    padding: 5px;
+}
+
+.dino-call-window button.black-element {
+    padding: 0;
+}
+
+.dino-call-window button.black-element.unencrypted {
     color: @error_color;
 }
 
-.dino-call-window .encryption-box:hover {
+.dino-call-window .black-element:hover {
     background: rgba(20,20,20,0.5);
 }
 
@@ -303,22 +315,46 @@ box.dino-input-error label.input-status-highlight-once {
     border-radius: 0;
 }
 
-.dino-call-window .call-header-bar,
-.dino-call-window .call-header-bar image {
+.dino-call-window .call-header-bar {
     color: #ededec;
 }
 
+.dino-call-window .call-header-bar button image {
+    color: alpha(white, 0.7);
+}
+
+.dino-call-window .call-header-bar button:hover image {
+    color: white;
+}
+
+.dino-call-window .participant-title-button {
+    background: none;
+    border: 0;
+    border-radius: 0;
+    box-shadow: none;
+}
+
 .dino-call-window .call-bottom-bar {
     background: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.3));
     border: 0;
 }
 
-.dino-call-window .video-placeholder-box {
+.dino-call-window {
     background-color: #212121;
 }
 
+.dino-call-window .participant-name {
+    color: white;
+    text-shadow: black;
+}
+
 .dino-call-window .text-no-controls {
+    color: black;
     background: white;
     border-radius: 5px;
     padding: 5px 10px;
+}
+
+.dino-call-window .own-video {
+    box-shadow: 0 0 2px 0 rgba(0,0,0,0.5);
 }
\ No newline at end of file