w0bm/f0bm
4
0
Fork 1
Code Pull Requests Activity

feat: Refactor fullscreen toggle and theme initialization in JavaScript, and refine fullscreen CSS styling for improved appearance.

Browse Source
This commit is contained in:
x
2026-01-24 20:52:53 +01:00
parent 9d4f47698c
commit 7baf50f9fa
2 changed files with 53 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
public/s/css/f0ck.css
View File

@@ -1144,12 +1144,20 @@ html[theme="f0ck95d"] .admin-search button {
} }
/* fullscreen */ /* fullscreen */
html[res="fullscreen"] ._204863 {
border-top: none;
}
html[res="fullscreen"] .metadata {
border-bottom: none;
}
html[res="fullscreen"] .embed-responsive-16by9::before { html[res="fullscreen"] .embed-responsive-16by9::before {
padding-top: 32.99%; padding-top: 32.99%;
} }
html[res="fullscreen"] .container { html[res="fullscreen"] .container {
max-width: 100% !important; max-width: 90% !important;
padding: 0 !important; padding: 0 !important;
} }

86
public/s/js/theme.js
View File

@@ -18,51 +18,53 @@ const Cookie = {
const acttheme = Cookie.get('theme') ?? "w0bm"; const acttheme = Cookie.get('theme') ?? "w0bm";
const themecontainer = document.querySelector("li#themes > ul.dropdown-menu"); const themecontainer = document.querySelector("li#themes > ul.dropdown-menu");
if (!themecontainer) return; // Theme menu not present on this page if (themecontainer) {
const themes = [...themecontainer.querySelectorAll("li > a")].map(t => t.innerText.toLowerCase());
if (acttheme !== document.documentElement.getAttribute("theme") && themes.includes(acttheme))
document.documentElement.setAttribute("theme", acttheme);
// [...themecontainer.querySelectorAll("li > a")].forEach(t => t.addEventListener("click", e => {
// e.preventDefault();
// const _theme = e.target.innerText.toLowerCase();
// document.documentElement.setAttribute("theme", _theme);
// document.querySelector("#themes > a").setAttribute("content", _theme);
// Cookie.set("theme", _theme, { path: "/", days: 360 });
// return false;
// }));
document.addEventListener("keydown", e => {
if (e.target.tagName === "INPUT" || e.target.tagName === "TEXTAREA")
return;
const acttheme = Cookie.get('theme') ?? "w0bm";
const themes = [...themecontainer.querySelectorAll("li > a")].map(t => t.innerText.toLowerCase()); const themes = [...themecontainer.querySelectorAll("li > a")].map(t => t.innerText.toLowerCase());
const k = e.key; if (acttheme !== document.documentElement.getAttribute("theme") && themes.includes(acttheme))
// if (k === "t") { document.documentElement.setAttribute("theme", acttheme);
// [...themecontainer.querySelectorAll("li > a")].forEach(t => t.addEventListener("click", e => {
// e.preventDefault(); // e.preventDefault();
// let i = themes.indexOf(acttheme); // const _theme = e.target.innerText.toLowerCase();
// if (++i >= themes.length) // document.documentElement.setAttribute("theme", _theme);
// i = 0; // document.querySelector("#themes > a").setAttribute("content", _theme);
// document.documentElement.setAttribute("theme", themes[i]); // Cookie.set("theme", _theme, { path: "/", days: 360 });
// document.querySelector("#themes > a").setAttribute("content", themes[i]); // return false;
// Cookie.set("theme", themes[i], { path: "/", days: 360 }); // }));
// }
});
if (tbuttonfull = document.querySelector('svg#a_tfull')) { document.addEventListener("keydown", e => {
tbuttonfull.addEventListener('click', e => { if (e.target.tagName === "INPUT" || e.target.tagName === "TEXTAREA")
let f = Cookie.get('fullscreen'); return;
if (f == 1) { const acttheme = Cookie.get('theme') ?? "w0bm";
Cookie.set('fullscreen', 0); const themes = [...themecontainer.querySelectorAll("li > a")].map(t => t.innerText.toLowerCase());
document.querySelector('html').setAttribute('res', ''); const k = e.key;
tbuttonfull.innerHTML = `<use href="/s/img/iconset.svg#window-maximize"></use>`; // if (k === "t") {
} // e.preventDefault();
else { // let i = themes.indexOf(acttheme);
Cookie.set('fullscreen', 1); // if (++i >= themes.length)
document.querySelector('html').setAttribute('res', 'fullscreen'); // i = 0;
tbuttonfull.innerHTML = `<use href="/s/img/iconset.svg#window-minimize"></use>`; // document.documentElement.setAttribute("theme", themes[i]);
} // document.querySelector("#themes > a").setAttribute("content", themes[i]);
return true; // Cookie.set("theme", themes[i], { path: "/", days: 360 });
// }
}); });
} }
// Fullscreen toggle - runs regardless of theme menu presence
document.addEventListener('click', e => {
const tbuttonfull = e.target.closest('svg#a_tfull');
if (!tbuttonfull) return;
let f = Cookie.get('fullscreen');
if (f == 1) {
Cookie.set('fullscreen', 0);
document.documentElement.setAttribute('res', '');
tbuttonfull.innerHTML = `<use href="/s/img/iconset.svg#window-maximize"></use>`;
}
else {
Cookie.set('fullscreen', 1);
document.documentElement.setAttribute('res', 'fullscreen');
tbuttonfull.innerHTML = `<use href="/s/img/iconset.svg#window-minimize"></use>`;
}
return true;
});
})(); })();