badlydrawnrob / anki

Learn to code with Anki — flashcards and themes for all learning levels. Master your programming language of choice!
MIT License
742 stars 63 forks source link

Add lines to the highlighted code blocks? #121

Closed badlydrawnrob closed 9 months ago

badlydrawnrob commented 9 months ago

Pandoc gives the option to add lines to fenced code blocks Anki doesn't recognise some of the features[^1]

  • Very useful for websites
  • Only moderately useful for Anki

Example of syntax for numbered lines

This example has way too much code Ideally, you should have as little code as possible to get the point across ☝️One idea per card!


``` {.elm .numberLines}
..

-- View -- view model = .. .. , div [ id "thumbnails" ] (List.map (viewThumbnail model.selectedUrl) -- Apply the function model.photos ) ..

-- Helper functions -- urlPrefix = "http://elm-in-action.com/"

viewThumbnail selectedUrl thumb = img [ src (urlPrefix ++ thumb.url) , classList [ ("selected", selectedUrl == thumb.url) ] .. ] []

-- Model -- { photos = [ { url = "1.jpeg" } -- Our list of urls , { url = "2.jpeg" } , { url = "3.jpeg" } ] , selectedUrl = "1.jpeg" -- Has the url been selected? }



[^1]: [Surprise, surprise](https://github.com/badlydrawnrob/anki/blob/master/source/docs/error/index.md), we can't navigate to `id`s in Anki's desktop browser. So the only usefulness of adding lines to the code is to indicate which line we're talking about.
badlydrawnrob commented 9 months ago

For now, I think this is an optional extra and can be added to a Child Theme if required. It could be somewhat useful to reference a number to a piece of code, but I think a better way is to strip the code back to it's absolute minimal that references the question we're asking. You could always link to a Github commit, or repo file and link to the line number like this.