aheh/mirotalk
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[mirotalk] - feat(landing): make Past Sponsors section click/tap-toggle only and hidden by default

Browse Source
This commit is contained in:
Miroslav Pejic
2026-04-25 18:19:12 +02:00
parent d8bf661f9d
commit 58fc83afa5
10 changed files with 125 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.env.template
+1 -1
View File
@@ -1,5 +1,5 @@
# ====================================================
# MiroTalk P2P v.1.8.12 - Environment Configuration
# MiroTalk P2P v.1.8.13 - Environment Configuration
# ====================================================
# App environment
app/src/config.template.js
+1 -1
View File
@@ -2,7 +2,7 @@
/**
* ==============================================
* MiroTalk P2P v.1.8.12 - Configuration File
* MiroTalk P2P v.1.8.13 - Configuration File
* ==============================================
*
* This file is the central configuration source.
app/src/server.js
+1 -1
View File
@@ -45,7 +45,7 @@ dependencies: {
* @license For commercial use or closed source, contact us at license.mirotalk@gmail.com or purchase directly from CodeCanyon
* @license CodeCanyon: https://codecanyon.net/item/mirotalk-p2p-webrtc-realtime-video-conferences/38376661
* @author Miroslav Pejic - miroslav.pejic.85@gmail.com
* @version 1.8.12
* @version 1.8.13
*
*/
package-lock.json
Generated
+2 -2
View File
@@ -1,12 +1,12 @@
{
"name": "mirotalk",
"version": "1.8.12",
"version": "1.8.13",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "mirotalk",
"version": "1.8.12",
"version": "1.8.13",
"license": "AGPL-3.0",
"dependencies": {
"@mattermost/client": "11.6.0",
package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{
"name": "mirotalk",
"version": "1.8.12",
"version": "1.8.13",
"description": "A free WebRTC browser-based video call",
"main": "server.js",
"scripts": {
public/css/landing.css
+75
View File
@@ -2969,6 +2969,81 @@ ul.pricing-item-features-list li {
transform: scale(1.01);
}
/*--------------------------------------------------------------
# Past Sponsors Toggle
--------------------------------------------------------------*/
#pastSponsors .past-sponsors-toggle {
border: 0;
background: transparent;
color: #d6ddf5;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 10px;
cursor: pointer;
padding: 0;
}
#pastSponsors .past-sponsors-toggle-label {
font-size: 2rem;
line-height: 1.2;
letter-spacing: -0.4px;
font-weight: 600;
}
#pastSponsors .past-sponsors-toggle-hint {
font-size: 0.75rem;
color: #959cb1;
line-height: 1;
text-transform: uppercase;
letter-spacing: 0.08em;
}
#pastSponsors .past-sponsors-toggle-icon {
font-size: 0.85rem;
color: #4a74f5;
transform: rotate(-90deg);
transition: transform 0.25s ease;
}
#pastSponsors .clients-inner {
max-height: 0;
opacity: 0;
overflow: hidden;
pointer-events: none;
transform: translateY(-8px);
transition:
max-height 0.35s ease,
opacity 0.28s ease,
transform 0.35s ease;
}
#pastSponsors.is-open .clients-inner {
max-height: 1200px;
opacity: 1;
pointer-events: auto;
transform: translateY(0);
}
#pastSponsors.is-open .past-sponsors-toggle-icon {
transform: rotate(0deg);
}
@media (max-width: 640px) {
#pastSponsors .past-sponsors-toggle {
flex-wrap: wrap;
}
#pastSponsors .past-sponsors-toggle-label {
font-size: 1.5rem;
}
#pastSponsors .past-sponsors-toggle-hint {
width: 100%;
}
}
/*--------------------------------------------------------------
# Sponsors & Powered By Sections (Grid)
--------------------------------------------------------------*/
public/js/brand.js
+1 -1
View File
@@ -109,7 +109,7 @@ let brand = {
},
about: {
imageUrl: '../images/mirotalk-logo.gif',
title: 'WebRTC P2P v1.8.12',
title: 'WebRTC P2P v1.8.13',
html: `
<button
id="support-button"
public/js/client.js
+2 -2
View File
@@ -15,7 +15,7 @@
* @license For commercial use or closed source, contact us at license.mirotalk@gmail.com or purchase directly from CodeCanyon
* @license CodeCanyon: https://codecanyon.net/item/mirotalk-p2p-webrtc-realtime-video-conferences/38376661
* @author Miroslav Pejic - miroslav.pejic.85@gmail.com
* @version 1.8.12
* @version 1.8.13
*
*/
@@ -15270,7 +15270,7 @@ function showAbout() {
Swal.fire({
background: swBg,
position: 'center',
title: brand.about?.title && brand.about.title.trim() !== '' ? brand.about.title : 'WebRTC P2P v1.8.12',
title: brand.about?.title && brand.about.title.trim() !== '' ? brand.about.title : 'WebRTC P2P v1.8.13',
imageUrl: brand.about?.imageUrl && brand.about.imageUrl.trim() !== '' ? brand.about.imageUrl : images.about,
customClass: { image: 'img-about' },
html: `
public/js/landing.js
+24
View File
@@ -306,3 +306,27 @@
});
}
})());
(function () {
'use strict';
const section = document.getElementById('pastSponsors');
const toggle = document.getElementById('pastSponsorsToggle');
if (!section || !toggle) return;
const setExpanded = (expanded) => {
section.classList.toggle('is-open', expanded);
toggle.setAttribute('aria-expanded', expanded ? 'true' : 'false');
};
toggle.addEventListener('click', (event) => {
event.preventDefault();
setExpanded(!section.classList.contains('is-open'));
});
document.addEventListener('click', (event) => {
if (!section.contains(event.target)) {
setExpanded(false);
}
});
})();
public/views/landing.html
+17 -2
View File
@@ -633,8 +633,23 @@
<section id="pastSponsors" class="clients section">
<div class="container">
<h2 class="mt-24 tac">Past sponsors</h2>
<div class="clients-inner section-inner has-animations has-top-divider has-bottom-divider">
<div class="past-sponsors-header tac mt-24">
<button
id="pastSponsorsToggle"
class="past-sponsors-toggle"
type="button"
aria-controls="pastSponsorsContent"
aria-expanded="false"
>
<span class="past-sponsors-toggle-label">Past sponsors</span>
<span class="past-sponsors-toggle-hint">Hover or tap to view</span>
<i class="fa-solid fa-chevron-down past-sponsors-toggle-icon" aria-hidden="true"></i>
</button>
</div>
<div
id="pastSponsorsContent"
class="clients-inner section-inner has-animations has-top-divider has-bottom-divider"
>
<ul class="list-reset">
<li class="reveal-from-top" data-reveal-delay="150">
<div class="clients-logo">