diff options
author | Claire <claire.github-309c@sitedethib.com> | 2022-10-30 18:15:28 +0100 |
---|---|---|
committer | Claire <claire.github-309c@sitedethib.com> | 2022-10-30 18:15:28 +0100 |
commit | eee36267d627ae08898d2b3301f56ce729055e82 (patch) | |
tree | dae581a9867b8dcdd2c3ab0154794a1ff10ad98e /app/javascript/flavours/glitch/packs | |
parent | 26ff48ee48a5c03a2a4b0bd03fd322529e6bd960 (diff) | |
parent | ac9fb0d654440ce1179bab4071941450aa994d2c (diff) |
Merge branch 'main' into glitch-soc/merge-upstream
Conflicts: - `app/javascript/mastodon/locales/ja.json`: Upstream change too close to a glitch-soc-specific string. The glitch-soc-specific string should not have been in this file, so it has been moved to `app/javascript/flavours/glitch/locales/ja.js`. - `app/javascript/packs/public.js`: Upstream refactored a part, that as usual is split and duplicated in various pack files. Updated those pack files accordingly. - `app/views/layouts/application.html.haml`: Upstream fixed custom.css path in a different way than we did, went with upstream's change.
Diffstat (limited to 'app/javascript/flavours/glitch/packs')
-rw-r--r-- | app/javascript/flavours/glitch/packs/public.js | 25 | ||||
-rw-r--r-- | app/javascript/flavours/glitch/packs/settings.js | 25 |
2 files changed, 48 insertions, 2 deletions
diff --git a/app/javascript/flavours/glitch/packs/public.js b/app/javascript/flavours/glitch/packs/public.js index 629ea32b7..843fd5163 100644 --- a/app/javascript/flavours/glitch/packs/public.js +++ b/app/javascript/flavours/glitch/packs/public.js @@ -139,8 +139,31 @@ function main() { }); }); + const toggleSidebar = () => { + const sidebar = document.querySelector('.sidebar ul'); + const toggleButton = document.querySelector('.sidebar__toggle__icon'); + + if (sidebar.classList.contains('visible')) { + document.body.style.overflow = null; + toggleButton.setAttribute('aria-expanded', false); + } else { + document.body.style.overflow = 'hidden'; + toggleButton.setAttribute('aria-expanded', true); + } + + toggleButton.classList.toggle('active'); + sidebar.classList.toggle('visible'); + }; + delegate(document, '.sidebar__toggle__icon', 'click', () => { - document.querySelector('.sidebar ul').classList.toggle('visible'); + toggleSidebar(); + }); + + delegate(document, '.sidebar__toggle__icon', 'keydown', e => { + if (e.key === ' ' || e.key === 'Enter') { + e.preventDefault(); + toggleSidebar(); + } }); // Empty the honeypot fields in JS in case something like an extension diff --git a/app/javascript/flavours/glitch/packs/settings.js b/app/javascript/flavours/glitch/packs/settings.js index 4c85f6556..31c88b2b5 100644 --- a/app/javascript/flavours/glitch/packs/settings.js +++ b/app/javascript/flavours/glitch/packs/settings.js @@ -7,8 +7,31 @@ import 'cocoon-js-vanilla'; function main() { const { delegate } = require('@rails/ujs'); + const toggleSidebar = () => { + const sidebar = document.querySelector('.sidebar ul'); + const toggleButton = document.querySelector('.sidebar__toggle__icon'); + + if (sidebar.classList.contains('visible')) { + document.body.style.overflow = null; + toggleButton.setAttribute('aria-expanded', false); + } else { + document.body.style.overflow = 'hidden'; + toggleButton.setAttribute('aria-expanded', true); + } + + toggleButton.classList.toggle('active'); + sidebar.classList.toggle('visible'); + }; + delegate(document, '.sidebar__toggle__icon', 'click', () => { - document.querySelector('.sidebar ul').classList.toggle('visible'); + toggleSidebar(); + }); + + delegate(document, '.sidebar__toggle__icon', 'keydown', e => { + if (e.key === ' ' || e.key === 'Enter') { + e.preventDefault(); + toggleSidebar(); + } }); } |