From b59c56c3e85508ff846a271ca4e84b2aefa6e11c Mon Sep 17 00:00:00 2001
From: Carlos Santos <4a.santos@gmail.com>
Date: Wed, 6 Nov 2024 10:05:56 +0100
Subject: [PATCH] ov-components: Updated css variable names

---
 .../e2e/webcomponent-app/index.html                       | 2 +-
 .../projects/openvidu-components-angular/README.md        | 8 ++++----
 .../src/lib/components/panel/panel.component.scss         | 2 +-
 .../participant-panel-item.component.scss                 | 2 +-
 .../src/lib/components/toolbar/toolbar.component.scss     | 2 +-
 openvidu-components-angular/src/styles.scss               | 2 +-
 6 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/openvidu-components-angular/e2e/webcomponent-app/index.html b/openvidu-components-angular/e2e/webcomponent-app/index.html
index 4d3dd4cf03..6fae701e09 100644
--- a/openvidu-components-angular/e2e/webcomponent-app/index.html
+++ b/openvidu-components-angular/e2e/webcomponent-app/index.html
@@ -24,7 +24,7 @@
 				--ov-text-primary-color: #1d1d1d;
 				--ov-surface-color: #ffffff;
 
-				--ov-buttons-radius: 50%;
+				--ov-toolbar-buttons-radius: 50%;
 				--ov-leave-button-radius: 10px;
 				--ov-video-radius: 5px;
 				--ov-surface-radius: 5px;
diff --git a/openvidu-components-angular/projects/openvidu-components-angular/README.md b/openvidu-components-angular/projects/openvidu-components-angular/README.md
index 691bb0abf5..235167ef8a 100644
--- a/openvidu-components-angular/projects/openvidu-components-angular/README.md
+++ b/openvidu-components-angular/projects/openvidu-components-angular/README.md
@@ -72,10 +72,10 @@ You can also customize the styles in your `styles.scss` file:
 	--ov-warn-color: #ffba53; // Warning color
 
 	/* Radius */
-	--ov-buttons-radius: 50%;
-	--ov-leave-button-radius: 10px;
-	--ov-video-radius: 5px;
-	--ov-surface-radius: 5px;
+	--ov-toolbar-buttons-radius: 50%; // Radius for toolbar buttons
+	--ov-leave-button-radius: 10px; // Radius for leave button
+	--ov-video-radius: 5px; // Radius for video elements
+	--ov-surface-radius: 5px; // Radius for surface elements
 }
 ```
 
diff --git a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/panel.component.scss b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/panel.component.scss
index e69f2c3664..0f8a41c3dc 100644
--- a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/panel.component.scss
+++ b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/panel.component.scss
@@ -29,7 +29,7 @@
 
 .panel-close-button {
 	margin-left: auto;
-	border-radius: var(--ov-buttons-radius);
+	border-radius: 50%;
 }
 
 ::-webkit-scrollbar {
diff --git a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/participants-panel/participant-panel-item/participant-panel-item.component.scss b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/participants-panel/participant-panel-item/participant-panel-item.component.scss
index e97f5b425d..6fa1279f01 100644
--- a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/participants-panel/participant-panel-item/participant-panel-item.component.scss
+++ b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/panel/participants-panel/participant-panel-item/participant-panel-item.component.scss
@@ -57,7 +57,7 @@
 	}
 
 	#mute-btn {
-		border-radius: var(--ov-buttons-radius);
+		border-radius: 50%;
 		color: var(--ov-text-surface-color);
 	}
 
diff --git a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/toolbar/toolbar.component.scss b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/toolbar/toolbar.component.scss
index b51ee8c66f..be68254887 100644
--- a/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/toolbar/toolbar.component.scss
+++ b/openvidu-components-angular/projects/openvidu-components-angular/src/lib/components/toolbar/toolbar.component.scss
@@ -56,7 +56,7 @@ $ov-recording-blinking-color: #eb5144;
 
 	#media-buttons-container button,
 	#menu-buttons-container button {
-		border-radius: var(--ov-buttons-radius);
+		border-radius: var(--ov-toolbar-buttons-radius);
 		color: var(--ov-secondary-action-color);
 	}
 
diff --git a/openvidu-components-angular/src/styles.scss b/openvidu-components-angular/src/styles.scss
index 9af9852d70..9afd27309d 100644
--- a/openvidu-components-angular/src/styles.scss
+++ b/openvidu-components-angular/src/styles.scss
@@ -40,7 +40,7 @@ body {
 	--ov-text-primary-color: #ffffff;
 	--ov-text-surface-color: #1d1d1d;
 
-	--ov-buttons-radius: 50%;
+	--ov-toolbar-buttons-radius: 50%;
 	--ov-leave-button-radius: 10px;
 	--ov-video-radius: 5px;
 	--ov-surface-radius: 5px;