readthedocs / readthedocs/ext-theme

Help topics: improve placement

Open
#170 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Needed: design decision
Dominant language
HTML
Stars
12
Forks
6
Avg merge
13h 25m
Merged PRs (30d)
1

Description

Recently, I moved help topics to a sub-optimal (but absolutely fine for now) placement in the pages in order to allow prioritize responsive display of the pages. Previously, the help topics had a great placement for wide/desktop viewports, but when sized down for narrow desktop/tablet, the help topic column ruined the rest of the content placement due to limited horizontal space.

For now, the help topics appear at the bottom of the admin page navigation sidebar, but this is often low down on the page or at the bottom most part of the page. It would be a good idea to find an option here that straddled the two options. This is very low priority though.

Some possibilities:

  • Use a rail ^1 on desktop displays for the third column. This puts placement outside the main content bounds, but does take some extra fiddling to avoid collapsing the column in between desktop and tablet viewport sizes. I haven't used this element yet because of this.
  • Bring back the third column and only show it on desktop viewports. This requires duplicating the help topics block in two places, one visible only on desktop, one only visible on not desktop.
  • I'm less a fan of this option for links to our docs, but do like this option for hiding paragraph content (as users do not read UI copy anyways). Do something like Cloudflare and put more help under a dropdown:

image

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reviewing the current help-topic placement in the admin page navigation sidebar across desktop, tablet, and narrow viewports. Compare the proposed rail, desktop-only third column, and dropdown approaches; done means an agreed responsive placement that preserves the surrounding page layout.

Written by the indexing model from the issue text.

Assessment

Tech stack
html
Domain
design, frontend
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.