clojure-cheatsheets icon indicating copy to clipboard operation
clojure-cheatsheets copied to clipboard

[RFC] Use Masonry to improve layout

Open arrdem opened this issue 11 years ago • 3 comments

At present, the cheatsheets don't do especially well in terms of flowing to screen width. In my efforts to make Grimoire's frontpage as clean as possible, I stumbled upon masonry.js, an MIT licensed, jquery optional plugin which allows for exactly the kind of automatic tiling I'd like to see the cheat sheet (or at least a Grimoire build) display.

Happy to do this work, just thought I'd pre-clear it.

arrdem avatar Aug 02 '14 10:08 arrdem

As long as the existing cheatsheet looks reasonable afterwards, it sounds good to me. It might be nice if it ended up the same number of columns as it is by default, but I wouldn't put that as a hard requirement.

jafingerhut avatar Aug 02 '14 16:08 jafingerhut

Today I deployed an update to Grimoire which swaps out this cheatsheet for a new masonry based rendition of the same content (source).

The structural issue with this cheatsheet as it presently renders to HTML and LaTeX is that it makes no use of "modern" Clojure HTML generation techniques (hiccup etc) and instead uses fairly grotesque custom printing of fragments.

Masonry is designed to work with a single <div> containing multiple children nodes to be floated. This is entirely at odds with the structure of the HTML which this cheatsheet presently generates, which achieves layout manually (<page>, <column> etc.).

I think that moving the cheatsheet forward requires factoring the cheatsheet's content out into some structure... an EDN file or yaml or something, which can be shared by independent HTML and LaTeX targets.

arrdem avatar Feb 28 '16 21:02 arrdem

There is data inside the generator from which it creates HTML -- a big nested vector of vectors and maps, with a structure that some find gross, but is documented in comments. The HTML is not the original source.

jafingerhut avatar Feb 28 '16 22:02 jafingerhut