diff --git a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/audio-wave/audio-wave.component.css b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/audio-wave/audio-wave.component.css
index cf377d64..3c9a16f0 100644
--- a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/audio-wave/audio-wave.component.css
+++ b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/audio-wave/audio-wave.component.css
@@ -29,7 +29,7 @@
max-height: 15px;
height: 15px;
width: 15px;
- border-radius: 50%;
+ border-radius: var(--ov-buttons-radius);
display: flex;
justify-content: space-between;
}
diff --git a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/panel/chat-panel/chat-panel.component.css b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/panel/chat-panel/chat-panel.component.css
index b2b64bd1..06ffa974 100644
--- a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/panel/chat-panel/chat-panel.component.css
+++ b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/panel/chat-panel/chat-panel.component.css
@@ -1,7 +1,7 @@
#chat-container {
margin: 20px;
background-color: var(--ov-light-color);
- border-radius: 5px;
+ border-radius: var(--ov-panel-radius);
height: -webkit-fill-available;
height: -moz-available;
}
@@ -19,6 +19,7 @@
.header-container button {
margin-left: auto;
+ border-radius: var(--ov-buttons-radius);
}
.text-container{
@@ -43,7 +44,7 @@
background-color: var(--ov-light-dark-color);
padding: 10px;
margin: 10px;
- border-radius: 5px;
+ border-radius: var(--ov-panel-radius);
}
.input-container textarea {
@@ -89,14 +90,17 @@
.msg-content {
position: relative;
- border-radius: 5px;
+ border-radius: var(--ov-panel-radius);
padding: 8px;
color: #000000;
width: auto;
max-width: 95%;
font-size: 13px;
word-break: break-all;
+ }
+ #send-btn {
+ border-radius: var(--ov-buttons-radius);
}
diff --git a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/panel/chat-panel/chat-panel.component.ts b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/panel/chat-panel/chat-panel.component.ts
index 77e8fd17..0495fbbf 100644
--- a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/panel/chat-panel/chat-panel.component.ts
+++ b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/panel/chat-panel/chat-panel.component.ts
@@ -53,8 +53,10 @@ export class ChatPanelComponent implements OnInit, AfterViewInit {
}
sendMessage(): void {
- this.chatService.sendMessage(this.message);
- this.message = '';
+ if(!!this.message) {
+ this.chatService.sendMessage(this.message);
+ this.message = '';
+ }
}
scrollToBottom(): void {
diff --git a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/panel/participants-panel/participants-panel/participants-panel.component.css b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/panel/participants-panel/participants-panel/participants-panel.component.css
index a4109f88..e0ec0517 100644
--- a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/panel/participants-panel/participants-panel/participants-panel.component.css
+++ b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/panel/participants-panel/participants-panel/participants-panel.component.css
@@ -1,7 +1,7 @@
.participants-container {
margin: 20px;
background-color: var(--ov-light-color);
- border-radius: 5px;
+ border-radius: var(--ov-panel-radius);
height: -webkit-fill-available;
height: -moz-available;
}
@@ -19,6 +19,7 @@
.header-container button {
margin-left: auto;
+ border-radius: var(--ov-buttons-radius);
}
.local-participant-container, .remote-participants-container {
diff --git a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/stream/stream.component.css b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/stream/stream.component.css
index dd1b3647..c46200ef 100644
--- a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/stream/stream.component.css
+++ b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/stream/stream.component.css
@@ -9,7 +9,7 @@
padding: 0px;
position: absolute;
z-index: 999;
- border-radius: 5px;
+ border-radius: var(--ov-panel-radius);
color: #ffffff;
font-family: 'Roboto','RobotoDraft',Helvetica,Arial,sans-serif;
}
@@ -18,12 +18,12 @@
padding: 5px;
color: #ffffff;
font-weight: bold;
- border-radius: 2px;
+ border-radius: var(--ov-panel-radius);
}
#dialogNickname {
background-color: #0000005e;
- border-radius: 3px;
+ border-radius: var(--ov-panel-radius);
}
#closeButton {
@@ -81,6 +81,7 @@
width: 26px;
height: 26px;
margin: 5px;
+ border-radius: var(--ov-buttons-radius);
}
.status-icons button {
@@ -110,7 +111,7 @@
position: absolute;
overflow: hidden;
background-color: #000000;
- border-radius: 5px;
+ border-radius: var(--ov-video-radius);
}
mat-error,
diff --git a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/stream/stream.component.html b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/stream/stream.component.html
index c0773def..7e1bab4f 100644
--- a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/stream/stream.component.html
+++ b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/stream/stream.component.html
@@ -27,8 +27,6 @@
-
-
diff --git a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/stream/stream.component.ts b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/stream/stream.component.ts
index 62106e3c..c9c7f1c3 100644
--- a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/stream/stream.component.ts
+++ b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/stream/stream.component.ts
@@ -10,7 +10,6 @@ import { OpenViduService } from '../../services/openvidu/openvidu.service';
import { LayoutService } from '../../services/layout/layout.service';
import { StorageService } from '../../services/storage/storage.service';
import { Signal } from '../../models/signal.model';
-import { LayoutClass } from '../../models/layout.model';
import { PublisherProperties } from 'openvidu-browser';
import { StreamModel } from '../../models/participant.model';
import { ParticipantService } from '../../services/participant/participant.service';
diff --git a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/toolbar/toolbar.component.css b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/toolbar/toolbar.component.css
index d60f1930..f63c818a 100644
--- a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/toolbar/toolbar.component.css
+++ b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/toolbar/toolbar.component.css
@@ -34,13 +34,17 @@
font-size: 24px;
}
- #company-logo {
+#media-buttons-container button, #menu-buttons-container button {
+ border-radius: var(--ov-buttons-radius);
+}
+
+#branding-logo {
background-color: var(--ov-dark-color);
- border-radius: 5px;
+ border-radius: var(--ov-panel-radius);
max-width: 35px;
max-height: 35px;
padding: 10px;
- }
+}
#session-title {
font-family: 'Ubuntu', sans-serif;
@@ -56,7 +60,7 @@
position: absolute;
top: 12px;
right: 33px;
- border-radius: 50%;
+ border-radius: var(--ov-buttons-radius);
background-color: #ffa600;
border: 1px solid #000;
z-index: 99999;
@@ -64,7 +68,7 @@
#leave-btn {
background-color: var(--ov-warn-color) !important;
- border-radius: 10px !important;
+ border-radius: var(--ov-leave-button-radius) !important;
width: 60px !important;
}
@@ -92,7 +96,7 @@
}
@media (max-width: 850px) {
- #company-logo {
+ #branding-logo {
display: none;
}
}
\ No newline at end of file
diff --git a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/toolbar/toolbar.component.html b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/toolbar/toolbar.component.html
index 43ac495a..f2d09adc 100644
--- a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/toolbar/toolbar.component.html
+++ b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/toolbar/toolbar.component.html
@@ -1,7 +1,7 @@
-
![OpenVidu Logo]()
+
{{ session.sessionId }}
diff --git a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/toolbar/toolbar.component.ts b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/toolbar/toolbar.component.ts
index 817ccbe2..af352700 100644
--- a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/toolbar/toolbar.component.ts
+++ b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/toolbar/toolbar.component.ts
@@ -54,7 +54,6 @@ export class ToolbarComponent implements OnInit, OnDestroy {
isFullscreenActive: boolean = false;
isChatOpened: boolean = false;
isParticipantsOpened: boolean = false;
- logoUrl = 'assets/images/openvidu_globe.png';
protected log: ILogger;
protected menuTogglingSubscription: Subscription;
diff --git a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/user-settings/user-settings.component.css b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/user-settings/user-settings.component.css
index 6c2c167b..8400a4a5 100644
--- a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/user-settings/user-settings.component.css
+++ b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/user-settings/user-settings.component.css
@@ -1,6 +1,6 @@
.card-header {
background-color: var(--ov-primary-color);
- border-radius: 10px 10px 0px 0px;
+ border-radius: var(--ov-panel-radius) var(--ov-panel-radius) 0px 0px;
text-align: center;
height: 50px;
}
@@ -67,6 +67,7 @@
}
.deviceButton {
box-shadow: none;
+ border-radius: var(--ov-buttons-radius);
background-color: var(--ov-secondary-color) !important;
color: var(--ov-light-color) !important;
}
@@ -965,7 +966,7 @@
background-clip: padding-box;
border: 1px solid #999999;
border: 1px solid rgba(0, 0, 0, 0.2);
- border-radius: 10px;
+ border-radius: var(--ov-panel-radius);
-webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
outline: 0;
diff --git a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/video/video.component.css b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/video/video.component.css
index 180a5cc6..b4900a5f 100644
--- a/openvidu-components-angular/projects/openvidu-angular/src/lib/components/video/video.component.css
+++ b/openvidu-components-angular/projects/openvidu-angular/src/lib/components/video/video.component.css
@@ -8,11 +8,11 @@ video {
padding: 0;
border: 0;
font-size: 100%;
- border-radius: 5px;
+ border-radius: var(--ov-video-radius);
background-color: #000000;
}
-.poster_img {
+.poster {
position: absolute;
z-index: 888;
max-width: 60%;
diff --git a/openvidu-components-angular/src/styles.scss b/openvidu-components-angular/src/styles.scss
index cc42a25d..e6b267b6 100644
--- a/openvidu-components-angular/src/styles.scss
+++ b/openvidu-components-angular/src/styles.scss
@@ -50,6 +50,11 @@ $openvidu-components-theme: mat.define-light-theme((
--ov-light-color: #ffffff;
--ov-light-dark-color: #f1f1f1;
+
+ --ov-buttons-radius: 50%; // border-radius property
+ --ov-leave-button-radius: 10px;
+ --ov-video-radius: 5px;
+ --ov-panel-radius: 5px;
}