[Members] Proposal: Re-Design of the XEP HTML Pages

Jonas Schäfer jonas at wielicki.name
Wed Apr 3 16:45:02 UTC 2019


Hey folks,

(Editor Hat on)

For some reason, I was in the mood for writing CSS, and also I was a tad 
unhappy with the mobile rendering of our XEP pages. In addition, I am of  the 
opinion that they could use a bit of modernizing.

So I went ahead and created a draft of a new design for XEPs. You can take a 
look at an example here:

https://sotecware.net/files/noindex/xeptest/xep-0030.html

(All current XEPs are available there, just modify the URL. Note that these 
are not official XEP renderings and they may differ from the versions on 
xmpp.org in content for $reasons. Links from those renderings to other XEPs go 
to the official documents.)

Summary of changes:

- Completely new CSS based on yaml.de
- Removed the indent everywhere (-> renders better on small screens)
- Replaced some parts of XSL magic with HTML/CSS magic (e.g. the TOC 
enumeration)
- Removed legacy stuff and replaced it with modern stuff
- Added anchor links to each section, example and table so that you don’t have 
to scroll up to link to a specific thing
- Exchanged the link colour for another colour from the XSF "corporate 
design".
- Re-organized the header a little

I would love to feedback and stuff you’d like to see in the new design. Of 
course, encouragement to continue this is also highly appreciated ;).

Things I have planned:

- Move the ToC to the left side of the screen so that it stays always visible 
if the screen is wide enough for that (should be doable without JavaScript)
- Add a "Burger Menu" style ToC menu to the top of the screen on small screens 
(may require JavaScript)
- Cleanup of the revision history section (it looks pretty bad at the moment)
- Maybe do something with the footnotes -- ideas welcome
- Adapt the margins / paddings on small screens (especially code blocks and 
examples)

kind regards,
Jonas
-------------- next part --------------
A non-text attachment was scrubbed...
Name: signature.asc
Type: application/pgp-signature
Size: 833 bytes
Desc: This is a digitally signed message part.
URL: <http://mail.jabber.org/pipermail/members/attachments/20190403/9563baaf/attachment.sig>


More information about the Members mailing list