Name: sfos-patch-browser-readability

Display name: Browser reader mode

Author: roundedrectangle

Updated at: Feb. 21, 2025, 3:28 p.m.

Description: Adds a reader mode to the browser. Based on Mozilla Readability.js, DOMPurify and sakura css styles. To use, click on hamburger menu and select readability. To undo, simply reload the page

CSS styling notices:
Use basic HTML tags like h1->h6, p, a, ul, li, blockquote, img, video, etc. Good reference is sakura source code: https://github.com/oxalorg/sakura/blob/master/css/sakura.css

Classes and other stuff specefic to this implementation include (these are css selectors basically):
.readability-site-name /*Site name at the top*/
.readability-title /*Article title*/
.readability-dir /*tag <details> containing contents*/
.readability-dir summary /*"Contents" text*/
.readability-dir p /*Actual contents*/
.readability-metadata /*Metadata container, currently a blockquote*/
.readability-content-start /*The divider of content and info, is a line with an option in settings enabled*/
/*The following ones are in `.readability-metadata` and follow the names of Readability.parse() result, so they're not explained to save time. Here, they start with emojis, except for excerpt. See: https://github.com/mozilla/readability#parse*/
.readability-excerpt
.readability-meta-byline
.readability-meta-publishedTime
.readability-meta-length /*This one also includes words count besides characters*/

Rating: 0

Total activations: 9

Files: