gsadmin/KoalaSync
1
0
Fork 0
mirror of https://github.com/Shik3i/KoalaSync.git synced 2026-07-26 12:08:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(extension): implement accordion mutual exclusion behavior for settings details categories

Browse Source
This commit is contained in:
KoalaDev
2026-07-12 06:31:24 +02:00
parent 9cd3fc1ee2
commit bd33ea4804
5 changed files with 20 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
examples/Caddyfile.example
+1 -1
View File
@@ -84,7 +84,7 @@ sync.koalastuff.net {
import security_headers
header {
# CSP hardened with base-uri and form-action limits
Content-Security-Policy "default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'; connect-src 'self'; img-src 'self' data: blob:; object-src 'none'; frame-ancestors 'none'; base-uri 'none'; form-action 'none';"
Content-Security-Policy "default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'; connect-src 'self'; img-src 'self' data:; object-src 'none'; frame-ancestors 'none'; base-uri 'none'; form-action 'none';"
# Modern Permissions Policy (blocks browser hardware access for enhanced privacy)
Permissions-Policy "camera=(), microphone=(), geolocation=(), payment=(), usb=()"
extension/popup.html
+4 -4
View File
@@ -813,7 +813,7 @@
<!-- Settings Tab -->
<div id="tab-settings" class="tab-content">
<details class="form-group" open>
<details class="form-group" name="settings-accordion" open>
<summary title="Change your username, theme, and language." data-i18n="LABEL_SETTINGS_GROUP_PROFILE" data-i18n-title="LABEL_SETTINGS_GROUP_PROFILE_TOOLTIP">👤 Profile & Theme</summary>
<div class="details-content">
<div style="display: flex; align-items: center; justify-content: space-between; gap: 12px;">
@@ -851,7 +851,7 @@
</div>
</details>
<details class="form-group">
<details class="form-group" name="settings-accordion">
<summary title="Choose which titles are sent to the room." data-i18n="LABEL_PRIVACY_SETTINGS" data-i18n-title="LABEL_PRIVACY_SETTINGS_TOOLTIP">🔒 Privacy Settings</summary>
<div class="details-content">
<div style="display: flex; align-items: center; justify-content: space-between; gap: 12px;">
@@ -872,7 +872,7 @@
</div>
</details>
<details class="form-group">
<details class="form-group" name="settings-accordion">
<summary title="Customize playback, notifications, and audio preferences." data-i18n="LABEL_SETTINGS_GROUP_SYNC" data-i18n-title="LABEL_SETTINGS_GROUP_SYNC_TOOLTIP">⚡ Playback & Sync</summary>
<div class="details-content">
<div style="display: flex; align-items: center; justify-content: space-between; gap: 12px;">
@@ -910,7 +910,7 @@
</div>
</details>
<details class="form-group">
<details class="form-group" name="settings-accordion">
<summary title="Tools for fixing connection issues." data-i18n="LABEL_TROUBLESHOOTING" data-i18n-title="LABEL_TROUBLESHOOTING_TOOLTIP">🔧 Troubleshooting</summary>
<div class="details-content" style="gap: 8px;">
<button id="restartTourBtn" class="secondary" style="width: 100%; font-size: 11px;" title="Restart the onboarding tutorial" data-i18n="BTN_RESTART_TOUR" data-i18n-title="BTN_RESTART_TOUR_TOOLTIP">Restart Tutorial</button>
extension/popup.js
+13
View File
@@ -1375,6 +1375,19 @@ if (elements.langSelector) {
});
}
// Accordion behavior for settings details categories (collapses others when one opens)
document.querySelectorAll('#tab-settings details.form-group').forEach(det => {
det.addEventListener('toggle', () => {
if (det.open) {
document.querySelectorAll('#tab-settings details.form-group').forEach(other => {
if (other !== det && other.open) {
other.removeAttribute('open');
}
});
}
});
});
elements.serverUrl.addEventListener('change', () => {
let url = elements.serverUrl.value.trim();
if (url && !url.includes('://')) {
website/README.md
+1 -1
View File
@@ -90,7 +90,7 @@ sync.koalastuff.net {
header @static Cache-Control "public, max-age=31536000, must-revalidate"
header {
Content-Security-Policy "default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'; connect-src 'self'; img-src 'self' data: blob:; object-src 'none'; frame-ancestors 'none'; base-uri 'none'; form-action 'none';"
Content-Security-Policy "default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'; connect-src 'self'; img-src 'self' data:; object-src 'none'; frame-ancestors 'none'; base-uri 'none'; form-action 'none';"
Permissions-Policy "camera=(), microphone=(), geolocation=(), payment=(), usb=()"
Strict-Transport-Security "max-age=31536000; includeSubDomains; preload"
X-Content-Type-Options nosniff
website/template.html
+1 -1
View File
@@ -1440,7 +1440,7 @@
<span class="t-comment"># Hardened Security & Permission Policies</span>
<span class="t-key">import</span> <span class="t-val">security_headers</span>
<span class="t-key">header</span> {
Content-Security-Policy <span class="t-str">"default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'; connect-src 'self'; img-src 'self' data: blob:; object-src 'none'; frame-ancestors 'none'; base-uri 'none'; form-action 'none';"</span>
Content-Security-Policy <span class="t-str">"default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'; connect-src 'self'; img-src 'self' data:; object-src 'none'; frame-ancestors 'none'; base-uri 'none'; form-action 'none';"</span>
Permissions-Policy <span class="t-str">"camera=(), microphone=(), geolocation=(), payment=(), usb=()"</span>
}
}