ghaymah_dev/codepill-sfu
2
0
نسخ 0
الشفرة المشكلات طلبات السحب Actions Packages المشاريع الإصدارات الويكي النشاط

[mirotalksfu] - add new theme

تصفح المصدر
هذا الالتزام موجود في:
Miroslav Pejic
2024-07-13 16:41:00 +02:00
الأصل 5323eac0c9
التزام f0c4add267
6 ملفات معدلة مع 73 إضافات و14 حذوفات
تنزيل ملف التصحيح تنزيل ملف الاختلاف توسيع جميع الملفات طي جميع الملفات

2
app/src/Server.js
عرض الملف

@@ -44,7 +44,7 @@ dependencies: {
* @license For commercial or closed source, contact us at license.mirotalk@gmail.com or purchase directly via CodeCanyon
* @license CodeCanyon: https://codecanyon.net/item/mirotalk-sfu-webrtc-realtime-video-conferences/40769970
* @author Miroslav Pejic - miroslav.pejic.85@gmail.com
* @version 1.4.95
* @version 1.4.96
*
*/

2
package.json
عرض الملف

@@ -1,6 +1,6 @@
{
"name": "mirotalksfu",
"version": "1.4.95",
"version": "1.4.96",
"description": "WebRTC SFU browser-based video calls",
"main": "Server.js",
"scripts": {

43
public/css/Room.css
عرض الملف

@@ -1370,6 +1370,49 @@ hr {
object-fit: contain;
}
.color-option {
display: flex;
align-items: center;
}
.color-circle {
width: 15px;
height: 15px;
border-radius: 50%;
margin-right: 5px;
}
.dark {
background-color: black;
}
.elegant {
background-color: gray;
}
.grey {
background-color: lightgray;
}
.green {
background-color: green;
}
.blue {
background-color: blue;
}
.red {
background-color: red;
}
.purple {
background-color: purple;
}
.orange {
background-color: orange;
}
.pink {
background-color: pink;
}
.yellow {
background-color: yellow;
}
/*--------------------------------------------------------------
# Pulse class effect
--------------------------------------------------------------*/

37
public/js/Room.js
عرض الملف

@@ -11,7 +11,7 @@ if (location.href.substr(0, 5) !== 'https') location.href = 'https' + location.h
* @license For commercial or closed source, contact us at license.mirotalk@gmail.com or purchase directly via CodeCanyon
* @license CodeCanyon: https://codecanyon.net/item/mirotalk-sfu-webrtc-realtime-video-conferences/40769970
* @author Miroslav Pejic - miroslav.pejic.85@gmail.com
* @version 1.4.95
* @version 1.4.96
*
*/
@@ -4001,7 +4001,7 @@ function setTheme() {
selectTheme.selectedIndex = localStorageSettings.theme;
const theme = selectTheme.value;
switch (theme) {
case 'dark':
case 'elegant':
swalBackground = 'linear-gradient(135deg, #000000, #434343)';
document.documentElement.style.setProperty('--body-bg', 'linear-gradient(135deg, #000000, #434343)');
document.documentElement.style.setProperty('--trx-bg', 'linear-gradient(135deg, #000000, #434343)');
@@ -4016,6 +4016,21 @@ function setTheme() {
document.body.style.background = 'linear-gradient(135deg, #000000, #434343)';
selectTheme.selectedIndex = 0;
break;
case 'dark':
swalBackground = 'linear-gradient(135deg, #000000, #1a1a1a)';
document.documentElement.style.setProperty('--body-bg', 'linear-gradient(135deg, #000000, #1a1a1a)');
document.documentElement.style.setProperty('--trx-bg', 'linear-gradient(135deg, #000000, #1a1a1a)');
document.documentElement.style.setProperty('--msger-bg', 'linear-gradient(135deg, #000000, #1a1a1a)');
document.documentElement.style.setProperty('--left-msg-bg', '#0d0d0d');
document.documentElement.style.setProperty('--right-msg-bg', '#1a1a1a');
document.documentElement.style.setProperty('--select-bg', '#1a1a1a');
document.documentElement.style.setProperty('--tab-btn-active', '#1a1a1a');
document.documentElement.style.setProperty('--settings-bg', 'linear-gradient(135deg, #000000, #1a1a1a)');
document.documentElement.style.setProperty('--wb-bg', 'linear-gradient(135deg, #000000, #1a1a1a)');
document.documentElement.style.setProperty('--btns-bg-color', 'rgba(0, 0, 0, 0.85)');
document.body.style.background = 'linear-gradient(135deg, #000000, #1a1a1a)';
selectTheme.selectedIndex = 1;
break;
case 'grey':
swalBackground = 'linear-gradient(135deg, #1a1a1a, #4f4f4f)';
document.documentElement.style.setProperty('--body-bg', 'linear-gradient(135deg, #1a1a1a, #4f4f4f)');
@@ -4029,7 +4044,7 @@ function setTheme() {
document.documentElement.style.setProperty('--wb-bg', 'linear-gradient(135deg, #1a1a1a, #4f4f4f)');
document.documentElement.style.setProperty('--btns-bg-color', 'rgba(0, 0, 0, 0.7)');
document.body.style.background = 'linear-gradient(135deg, #1a1a1a, #4f4f4f)';
selectTheme.selectedIndex = 1;
selectTheme.selectedIndex = 2;
break;
case 'green':
swalBackground = 'linear-gradient(135deg, #002a22, #004d40)';
@@ -4044,7 +4059,7 @@ function setTheme() {
document.documentElement.style.setProperty('--wb-bg', 'linear-gradient(135deg, #002a22, #004d40)');
document.documentElement.style.setProperty('--btns-bg-color', 'rgba(0, 42, 34, 0.7)');
document.body.style.background = 'linear-gradient(135deg, #002a22, #004d40)';
selectTheme.selectedIndex = 2;
selectTheme.selectedIndex = 3;
break;
case 'blue':
swalBackground = 'linear-gradient(135deg, #00274d, #004d80)';
@@ -4059,7 +4074,7 @@ function setTheme() {
document.documentElement.style.setProperty('--wb-bg', 'linear-gradient(135deg, #00274d, #004d80)');
document.documentElement.style.setProperty('--btns-bg-color', 'rgba(0, 39, 77, 0.7)');
document.body.style.background = 'linear-gradient(135deg, #00274d, #004d80)';
selectTheme.selectedIndex = 3;
selectTheme.selectedIndex = 4;
break;
case 'red':
swalBackground = 'linear-gradient(135deg, #2a0d0d, #4d1a1a)';
@@ -4074,7 +4089,7 @@ function setTheme() {
document.documentElement.style.setProperty('--wb-bg', 'linear-gradient(135deg, #2a0d0d, #4d1a1a)');
document.documentElement.style.setProperty('--btns-bg-color', 'rgba(42, 13, 13, 0.7)');
document.body.style.background = 'linear-gradient(135deg, #2a0d0d, #4d1a1a)';
selectTheme.selectedIndex = 4;
selectTheme.selectedIndex = 5;
break;
case 'purple':
swalBackground = 'linear-gradient(135deg, #2a001d, #4d004a)';
@@ -4089,7 +4104,7 @@ function setTheme() {
document.documentElement.style.setProperty('--wb-bg', 'linear-gradient(135deg, #2a001d, #4d004a)');
document.documentElement.style.setProperty('--btns-bg-color', 'rgba(42, 0, 29, 0.7)');
document.body.style.background = 'linear-gradient(135deg, #2a001d, #4d004a)';
selectTheme.selectedIndex = 5;
selectTheme.selectedIndex = 6;
break;
case 'orange':
swalBackground = 'linear-gradient(135deg, #3d1a00, #ff8c00)';
@@ -4104,7 +4119,7 @@ function setTheme() {
document.documentElement.style.setProperty('--wb-bg', 'linear-gradient(135deg, #3d1a00, #ff8c00)');
document.documentElement.style.setProperty('--btns-bg-color', 'rgba(61, 26, 0, 0.7)');
document.body.style.background = 'linear-gradient(135deg, #3d1a00, #ff8c00)';
selectTheme.selectedIndex = 6;
selectTheme.selectedIndex = 7;
break;
case 'pink':
swalBackground = 'linear-gradient(135deg, #4d001d, #ff66b2)';
@@ -4119,7 +4134,7 @@ function setTheme() {
document.documentElement.style.setProperty('--wb-bg', 'linear-gradient(135deg, #4d001d, #ff66b2)');
document.documentElement.style.setProperty('--btns-bg-color', 'rgba(77, 0, 29, 0.7)');
document.body.style.background = 'linear-gradient(135deg, #4d001d, #ff66b2)';
selectTheme.selectedIndex = 7;
selectTheme.selectedIndex = 8;
break;
case 'yellow':
swalBackground = 'linear-gradient(135deg, #4d3b00, #ffc107)';
@@ -4134,7 +4149,7 @@ function setTheme() {
document.documentElement.style.setProperty('--wb-bg', 'linear-gradient(135deg, #4d3b00, #ffc107)');
document.documentElement.style.setProperty('--btns-bg-color', 'rgba(77, 59, 0, 0.7)');
document.body.style.background = 'linear-gradient(135deg, #4d3b00, #ffc107)';
selectTheme.selectedIndex = 8;
selectTheme.selectedIndex = 9;
break;
default:
break;
@@ -4225,7 +4240,7 @@ function showAbout() {
imageUrl: image.about,
customClass: { image: 'img-about' },
position: 'center',
title: 'WebRTC SFU v1.4.95',
title: 'WebRTC SFU v1.4.96',
html: `
<br />
<div id="about">

2
public/js/RoomClient.js
عرض الملف

@@ -9,7 +9,7 @@
* @license For commercial or closed source, contact us at license.mirotalk@gmail.com or purchase directly via CodeCanyon
* @license CodeCanyon: https://codecanyon.net/item/mirotalk-sfu-webrtc-realtime-video-conferences/40769970
* @author Miroslav Pejic - miroslav.pejic.85@gmail.com
* @version 1.4.95
* @version 1.4.96
*
*/

1
public/views/Room.html
عرض الملف

@@ -1087,6 +1087,7 @@ access to use this app.
</div>
<br />
<select id="selectTheme" class="form-select text-light bg-dark">
<option value="elegant">🔘 &nbsp;Elegant</option>
<option value="dark">⚫ &nbsp;Dark</option>
<option value="grey">⚪ &nbsp;Grey</option>
<option value="green">🟢 &nbsp;Green</option>