vsharapov / indexmd Goto Github PK

Would be nice to have a toggle [dark|light|auto] floating on the top right

Currently links are inverted, dimmed to 50% and inverted again. Why not just brighten to 200% you ask? #0000FF times 2 is still #0000FF, but if you start with #0000FF -> invert -> #FFFF00 -> ×½ -> #808000 -> invert again -> #8080FF.

Anyway, I noticed this on MDN: https://developer.mozilla.org/en-US/docs/Web/CSS/filter-function/hue-rotate()
Might get better results 🤷 currently overlapping lonks and code blocks get their background brightened:

[li`code`nk][1][link][1] `code`

Currently going to a fragment, e.g. https://vsharapov.github.io/INDEXmd/#links will result in the fragment being cleared, and no scroll down to the "Links" section.

I'm guessing this has something to do with the settings being loaded and the window.location being changed.

Probably wrap the whole thing in a centered <div> and If there's some way to increase all font sizes, that would be a neat trick.

Should easy - just adding another menuOption:
parser: {"markdown": true, "raw": false}

If you have a <pre> and you set the innerText (instead of innerHTML) ... will it automagically turn carets into <> ? 🤷
Worth a try.

...you know, so that you don't get a sad blank page when you're on an intranet or something.

Currently if the showdown library isn't available, nothing is rendered. The preferred behavior would be to force the parse setting to raw.

Currently the target file is chosen by this line:

readme = 'README.md'

But I'd rather this be a default, overridden by a GET argument like ?target.md=other.md for example

Maybe this could be bundled into settings - with a note not to make it persistent, so you could navigate to a different document by typing into a text field inside the settings widget.

Should replace .innerHTML with .innerText when setting title, other wise you get <a href... ugliness.

When printing from dark mode the result is grey-on-white text (and I think that's the browser offering mercy, it's probably white-on-white otherwise).

Needs to be fixed with @media print.

Headers should be a name="" links, maybe there's a Markdown parsing option? Maybe manually?

element {
    background-color: #7777;
    padding: 2px;
}

This ↑ looks good for small spans, but has clunky overlap when they're near. Adding the same to <pre> doesn't help. Gotta think of something elegant.

Currently no options are used, and that's fine, but it would be nice to += a bunch of common options, one per line, and comment it out. Enabling those common options becomes as easy as uncommenting those lines.

Would be nice to have a font-family toggle [serif|sans-serif|monospace] for readability preferences

Try something like:

- [named link 1][1]    
- [x] [named link 2][2]

First line is rendered fine, one with the "checkbox" has a weird looking citation format, which is a graceful failure, but still.

I think settings should cascade like so:

1. Set in current session
2. Retrieved from GET parameter
3. Retrieved from localStorage
4. Defaults

A URL such as https://vsharapov.github.io/INDEXmd/?newParameter=newValue#horizontalrules will lose the GET parameters. Since this project is meant to serve as a boilerplate for others, it's expected that GET parameters will be used, and should not be omitted.

Note that GET parameters which appear in menuOptions will not be subject to this issue, since they are re-inserted as newGetParameters,

The fix should be applied to the branch fix-setting-location.

...and possibly other HTML elements?
Wrapping everything in a <pre> doesn't stop this, adding the following line creates an image that still renders:

<img src="https://dummyimage.com/13x7/f/0.png&text=png" alt="External via inline HTML" />

I think there's a more foolproof way - google "CDATA raw html".

Need an iOS device to reproduce...

Adding display: inline-block; to the code, pre css should fix this, but might have some weird effects on inline code.

SVG of the first character of the title (based on first element innerText) would be real cute.
https://css-tricks.com/svg-favicons-and-all-the-fun-things-we-can-do-with-them/

Would be nice to have a view-width toggle to handle long lines.

Loop around all the way back to a markdown parser.

Switch to dark or light mode, switch back, The "auto" theme should follow system preferences but it does nothing.