As per the discussion on t.me/emacs_en, orgmode.org currently has a broken layout on mobile. The patches below fixes that as well as a few other issues I found along the way:
1. The <asside> element used in org-demo.html was probably a misspelling. See <https://developer.mozilla.org/en-US/search?q=aside> 2. "z-index: -1" causes an aside (asside?) element to become invisible on mobile. 3. The issue mentioned in Telegram chat: some contents don't wrap correctly, causing overflow on mobile. 4. Remove inline-looking background for <code> in <pre>...</pre>. (See https://orgmode.org/#:~:text=bzg%2Fworg for an example.) 5. Now that the <nav> bar is wider than 850px (around 1050px now), the "#translate" element in the <nav> bar overlaps with the Orgmode icon when the browser window is around 1000px wide. This commit adjusts the media query for that from 850px to 1050px, and also adds a bit styling to ensure when there are not enough room, the bar scrolls and doesn't overlap things. 6. The referenced resource /resources/img/greenteselatedband.png seems missing? https://orgmode.org/resources/img/greenteselatedband.png returns 404, and web.archive.org also returns 404 for the archived versions I randomly checked. I tested the changes with: $ for dest in resources/style/*.min.css; do echo $dest; \ sassc "${dest%.min.css}.scss" "${dest%.min.css}.css"; \ cleancss --source-map -o "$dest" "${dest%.min.css}.css"; done But I didn't include the minimized files in the patches as I'm not exactly sure what tools (or args to pass to them) should be used for that. (A typical way might be to include build commands in ./publish.el and then remove minified products from git repo?) Kana (6): org-demo.html: use canonical aside instead of asside org-demo.html: fix an invisible aside on mobile css: fix horizontal scroll on mobile css: fix code inside pre background css: fix #translate overlapping on less wide windows css: remove ref to the missing greenteselatedband.png index.org | 8 ++++---- org-demo.html | 26 +++++++++++++------------- resources/style/_code.scss | 5 ++++- resources/style/_layout.scss | 1 + resources/style/_nav.scss | 17 ++++++++++------- resources/style/org-demo.scss | 23 +++++++++++++---------- zh-CN/org-demo.html | 26 +++++++++++++------------- 7 files changed, 58 insertions(+), 48 deletions(-) base-commit: cb8fbc936b8e30c5583b0961586aaf59719eb8ab -- 2.54.0
