hacklab/OASIS_MOBILE
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Clean up Oasis-Mobile-UX theme: cascade order, drop dead JS

Browse source 
- Link the theme after mobile.css on mobile builds (OASIS_MOBILE=1) so
  it wins by cascade; removed ~420 !important, keeping only the few that
  override epsylon's inline styles.
- Reveal the quick bar without !important: the inline display:none is
  emitted only on desktop.
- Remove unused oasis-mobile-nav.js (it was never linked and would be
  blocked by CSP script-src 'none' on clearnet).
- epsylon's mobile.css and OasisMobile.css left untouched.
This commit is contained in:
s1to 2026-08-01 14:41:49 +02:00
parent 8d21216362
commit 230d11ba7a
3 changed files with 436 additions and 468 deletions
Download patch file Download diff file Expand all files Collapse all files

854
src/client/assets/themes/OasisMobileUX.css
View file

File diff suppressed because it is too large Load diff

36
src/client/public/js/oasis-mobile-nav.js
View file

@ -1,36 +0,0 @@
(function () {
function mark() {
var p = (location.pathname || "/").replace(/\/+$/, "") || "/";
var links = document.querySelectorAll(".oasis-bottombar a.bb-item");
var best = null, bestLen = -1;
links.forEach(function (a) {
var h = (a.getAttribute("href") || "").replace(/\/+$/, "") || "/";
if (h === "/") return;
if (p === h || p.indexOf(h + "/") === 0) {
if (h.length > bestLen) { best = a; bestLen = h.length; }
}
});
if (best) best.classList.add("current");
}
function onToggle(e) {
var t = e.target;
if (!t || !t.classList || !t.classList.contains("oasis-nav-toggle")) return;
if (!t.checked) return;
var group = t.closest(".oasis-nav-group");
var scope = group && group.parentElement;
if (!scope) return;
var others = scope.querySelectorAll(
":scope > .oasis-nav-group > .oasis-nav-toggle"
);
others.forEach(function (o) { if (o !== t) o.checked = false; });
}
function init() {
mark();
document.addEventListener("change", onToggle);
}
if (document.readyState !== "loading") init();
else document.addEventListener("DOMContentLoaded", init);
})();

14
src/views/main_views.js
View file

@ -1185,7 +1185,7 @@ const renderBottomBar = () => {
const pair = [ bbLink("/peers", "⧖", i18n.peers || "Peers") ];
if (modOn('invitesMod')) pair.push(bbLink("/invites", "ꔮ", i18n.invites || "Invites"));
return nav(
{ class: "oasis-bottombar", style: "display:none", "aria-label": i18n.bbQuickActions || "Quick actions" },
{ class: "oasis-bottombar", ...(process.env.OASIS_MOBILE === '1' ? {} : { style: "display:none" }), "aria-label": i18n.bbQuickActions || "Quick actions" },
...slots,
editSlot,
div({ class: "bb-pair" }, ...pair)
@ -1267,8 +1267,10 @@ const template = (titlePrefix, ...elements) => {
head(
title(titlePrefix, " | Oasis"),
link({ rel: "stylesheet", href: "/assets/styles/style.css" }),
themeLink,
link({ rel: "stylesheet", href: "/assets/styles/mobile.css", ...(process.env.OASIS_MOBILE === '1' ? {} : { media: "(max-width: 768px)" }) }),
// móvil: el tema va DESPUÉS de mobile.css para ganar por cascada sin !important; escritorio: orden original de epsylon
...(process.env.OASIS_MOBILE === '1'
? [ link({ rel: "stylesheet", href: "/assets/styles/mobile.css" }), themeLink ]
: [ themeLink, link({ rel: "stylesheet", href: "/assets/styles/mobile.css", media: "(max-width: 768px)" }) ]),
link({ rel: "icon", href: "/assets/images/favicon.svg" }),
meta({ charset: "utf-8" }),
meta({ name: "description", content: i18n.oasisDescription }),
@ -1597,8 +1599,10 @@ exports.ainavHomeView = ({ recentTags = [] } = {}) => {
head(
title(placeholder, " | Oasis"),
link({ rel: "stylesheet", href: "/assets/styles/style.css" }),
link({ rel: "stylesheet", href: `/assets/themes/${theme}.css` }),
link({ rel: "stylesheet", href: "/assets/styles/mobile.css", ...(process.env.OASIS_MOBILE === '1' ? {} : { media: "(max-width: 768px)" }) }),
// móvil: el tema va DESPUÉS de mobile.css para ganar por cascada sin !important; escritorio: orden original de epsylon
...(process.env.OASIS_MOBILE === '1'
? [ link({ rel: "stylesheet", href: "/assets/styles/mobile.css" }), link({ rel: "stylesheet", href: `/assets/themes/${theme}.css` }) ]
: [ link({ rel: "stylesheet", href: `/assets/themes/${theme}.css` }), link({ rel: "stylesheet", href: "/assets/styles/mobile.css", media: "(max-width: 768px)" }) ]),
link({ rel: "icon", href: "/assets/images/favicon.svg" }),
meta({ charset: "utf-8" }),
meta({ name: "description", content: i18n.oasisDescription }),