{{
@@ -97,9 +96,17 @@
}
- @if (recordingStatus === recStatusEnum.FAILED) {
+ @if (showStartStopRecordingButton && recordingStatus === recStatusEnum.FAILED && recordingError) {
- {{ recordingError }}
+
+
+ Error starting recording
+
+
+
diff --git a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/activities-panel/recording-activity/recording-activity.component.scss b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/activities-panel/recording-activity/recording-activity.component.scss
index 6459900a..312d3d7e 100644
--- a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/activities-panel/recording-activity/recording-activity.component.scss
+++ b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/activities-panel/recording-activity/recording-activity.component.scss
@@ -401,6 +401,46 @@
font-weight: 600;
}
+ .recording-error {
+ display: flex;
+ align-items: flex-start;
+ gap: 12px;
+ background: rgba(244, 67, 54, 0.08);
+ border: 1px solid var(--ov-error-color);
+ border-radius: 8px;
+ padding: 12px 16px;
+ margin: 16px 0;
+ color: var(--ov-error-color);
+ font-size: 15px;
+ box-shadow: 0 2px 8px 0 rgba(244,67,54,0.04);
+
+ .error-icon {
+ font-size: 28px;
+ color: var(--ov-error-color);
+ flex-shrink: 0;
+ margin-top: 2px;
+ width: 100%;
+ height: 100%;
+ }
+
+ .error-content {
+ display: flex;
+ flex-direction: column;
+ gap: 2px;
+ }
+
+ .error-title {
+ font-weight: 600;
+ font-size: 15px;
+ margin-bottom: 2px;
+ }
+
+ .error-message {
+ font-size: 14px;
+ opacity: 0.85;
+ }
+ }
+
.disable-recording-btn {
background-color: var(--ov-secondary-action-color) !important;
color: var(--ov-text-surface-color) !important;
+
+
diff --git a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/activities-panel/recording-activity/recording-activity.component.scss b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/activities-panel/recording-activity/recording-activity.component.scss
index 6459900a..312d3d7e 100644
--- a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/activities-panel/recording-activity/recording-activity.component.scss
+++ b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/activities-panel/recording-activity/recording-activity.component.scss
@@ -401,6 +401,46 @@
font-weight: 600;
}
+ .recording-error {
+ display: flex;
+ align-items: flex-start;
+ gap: 12px;
+ background: rgba(244, 67, 54, 0.08);
+ border: 1px solid var(--ov-error-color);
+ border-radius: 8px;
+ padding: 12px 16px;
+ margin: 16px 0;
+ color: var(--ov-error-color);
+ font-size: 15px;
+ box-shadow: 0 2px 8px 0 rgba(244,67,54,0.04);
+
+ .error-icon {
+ font-size: 28px;
+ color: var(--ov-error-color);
+ flex-shrink: 0;
+ margin-top: 2px;
+ width: 100%;
+ height: 100%;
+ }
+
+ .error-content {
+ display: flex;
+ flex-direction: column;
+ gap: 2px;
+ }
+
+ .error-title {
+ font-weight: 600;
+ font-size: 15px;
+ margin-bottom: 2px;
+ }
+
+ .error-message {
+ font-size: 14px;
+ opacity: 0.85;
+ }
+ }
+
.disable-recording-btn {
background-color: var(--ov-secondary-action-color) !important;
color: var(--ov-text-surface-color) !important;
+
+ Error starting recording
+
+
+