├── LICENSE ├── README.md ├── example.html ├── example.pdf ├── fonts ├── computer_modern │ ├── OFL-FAQ.txt │ ├── OFL.txt │ ├── README.txt │ ├── cmun-serif.css │ ├── cmun-typewriter.css │ ├── cmunbi.eot │ ├── cmunbi.svg │ ├── cmunbi.ttf │ ├── cmunbi.woff │ ├── cmunbx.eot │ ├── cmunbx.svg │ ├── cmunbx.ttf │ ├── cmunbx.woff │ ├── cmunit.eot │ ├── cmunit.svg │ ├── cmunit.ttf │ ├── cmunit.woff │ ├── cmunrm.eot │ ├── cmunrm.svg │ ├── cmunrm.ttf │ ├── cmunrm.woff │ ├── cmuntb.eot │ ├── cmuntb.svg │ ├── cmuntb.ttf │ ├── cmuntb.woff │ ├── cmunti.eot │ ├── cmunti.svg │ ├── cmunti.ttf │ ├── cmunti.woff │ ├── cmuntt.eot │ ├── cmuntt.svg │ ├── cmuntt.ttf │ ├── cmuntt.woff │ ├── cmuntx.eot │ ├── cmuntx.svg │ ├── cmuntx.ttf │ └── cmuntx.woff └── latin_modern │ ├── GUST-FONT-LICENSE.txt │ ├── MANIFEST-Latin-Modern-Math.txt │ ├── README-Latin-Modern-Math.txt │ ├── latinmodern-math.otf │ ├── lmmono10-italic.otf │ ├── lmmono10-regular.otf │ ├── lmmono12-regular.otf │ ├── lmmono8-regular.otf │ ├── lmmono9-regular.otf │ ├── lmmonocaps10-oblique.otf │ ├── lmmonocaps10-regular.otf │ ├── lmmonolt10-bold.otf │ ├── lmmonolt10-boldoblique.otf │ ├── lmmonolt10-oblique.otf │ ├── lmmonolt10-regular.otf │ ├── lmmonoltcond10-oblique.otf │ ├── lmmonoltcond10-regular.otf │ ├── lmmonoprop10-oblique.otf │ ├── lmmonoprop10-regular.otf │ ├── lmmonoproplt10-bold.otf │ ├── lmmonoproplt10-boldoblique.otf │ ├── lmmonoproplt10-oblique.otf │ ├── lmmonoproplt10-regular.otf │ ├── lmmonoslant10-regular.otf │ ├── lmodern.css │ ├── lmodern.html │ ├── lmroman10-bold.otf │ ├── lmroman10-bolditalic.otf │ ├── lmroman10-italic.otf │ ├── lmroman10-regular.otf │ ├── lmroman12-bold.otf │ ├── lmroman12-italic.otf │ ├── lmroman12-regular.otf │ ├── lmroman17-regular.otf │ ├── lmroman5-bold.otf │ ├── lmroman5-regular.otf │ ├── lmroman6-bold.otf │ ├── lmroman6-regular.otf │ ├── lmroman7-bold.otf │ ├── lmroman7-italic.otf │ ├── lmroman7-regular.otf │ ├── lmroman8-bold.otf │ ├── lmroman8-italic.otf │ ├── lmroman8-regular.otf │ ├── lmroman9-bold.otf │ ├── lmroman9-italic.otf │ ├── lmroman9-regular.otf │ ├── lmromancaps10-oblique.otf │ ├── lmromancaps10-regular.otf │ ├── lmromandemi10-oblique.otf │ ├── lmromandemi10-regular.otf │ ├── lmromandunh10-oblique.otf │ ├── lmromandunh10-regular.otf │ ├── lmromanslant10-bold.otf │ ├── lmromanslant10-regular.otf │ ├── lmromanslant12-regular.otf │ ├── lmromanslant17-regular.otf │ ├── lmromanslant8-regular.otf │ ├── lmromanslant9-regular.otf │ ├── lmromanunsl10-regular.otf │ ├── lmsans10-bold.otf │ ├── lmsans10-boldoblique.otf │ ├── lmsans10-oblique.otf │ ├── lmsans10-regular.otf │ ├── lmsans12-oblique.otf │ ├── lmsans12-regular.otf │ ├── lmsans17-oblique.otf │ ├── lmsans17-regular.otf │ ├── lmsans8-oblique.otf │ ├── lmsans8-regular.otf │ ├── lmsans9-oblique.otf │ ├── lmsans9-regular.otf │ ├── lmsansdemicond10-oblique.otf │ ├── lmsansdemicond10-regular.otf │ ├── lmsansquot8-bold.otf │ ├── lmsansquot8-boldoblique.otf │ ├── lmsansquot8-oblique.otf │ └── lmsansquot8-regular.otf ├── latex.css └── page.css /LICENSE: -------------------------------------------------------------------------------- 1 | Copyright (c) 2015 Philipp Miller 2 | 3 | Permission is hereby granted, free of charge, to any person obtaining 4 | a copy of this software and associated documentation files (the 5 | "Software"), to deal in the Software without restriction, including 6 | without limitation the rights to use, copy, modify, merge, publish, 7 | distribute, sublicense, and/or sell copies of the Software, and to 8 | permit persons to whom the Software is furnished to do so, subject to 9 | the following conditions: 10 | 11 | The above copyright notice and this permission notice shall be 12 | included in all copies or substantial portions of the Software. 13 | 14 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, 15 | EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF 16 | MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND 17 | NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE 18 | LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION 19 | OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION 20 | WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. 21 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | HTMLpaper 2 | ========= 3 | 4 | This is a simple CSS "Framework" that lets you create and manually layout printable HTML documents. 5 | Basically the printed version will look exactly like what you see on screen. 6 | You can create complex layouts using CSS without worrying about them getting botched by your browser's print settings. 7 | 8 | Additionally, there is a very basic LaTeX style formatting option 9 | that let's you create pages that will look like and 10 | seemlessly integrate into LaTeX documents. See LaTeX's `pdfpages` package. 11 | 12 | Font files for LaTeX's Latin Modern as well as the original Computer Modern are included. The css will default to a system installed version of Latin Modern and fallback to the included Latin Modern webfont. 13 | You may also want to include [MathJax](http://www.mathjax.org) for displaying mathematical formula. 14 | 15 | ### Requirements 16 | * I assume you know your way around HTML and CSS. Otherwise you should probably find another (easier) way to do whatever it is you are trying to do. 17 | * A sensible, up-to-date web browser is recomended. I have only tested this in Firefox 29+ but I assume that latest Webkit browsers will work fine as well (feedback is appreciated). 18 | 19 | 20 | ### How to use 21 | * Look at the *example.html* file. The easiest way to start will be to modify it. 22 | You can copy-paste `div.page` to add more pages. 23 | Make sure you leave the document structure intact and `page.css` is linked in your document's head. 24 | * Put your content inside `div.page-inner`. Go Nuts. 25 | * Add the appropriate CSS classes to specify what paper format you want to use.Look inside *page.css* to see what paper formats are available. 26 | The default format is DIN A4. 27 | Feel free to suggest more formats! 28 | * Add a `.latex` class in your document for things that should look like LaTeX. If it all should look like LaTeX, just add it to the `body` tag. 29 | Make sure *latex.css* is linked in your document's head and look inside to see what classes you can use. 30 | * Open the HTML file in your browser (see requirements). 31 | * Use the browser's print function. 32 | Make sure to check a preview first or use a 'print to file' feature. 33 | 34 | 35 | ### When to use 36 | Consider the following scenarios 37 | * You want to create a short (1 or 2 pages) document, like a handout or a cheatsheet. 38 | * You are trying to create something that looks like LaTeX but LaTeX keeps botching your complex box layout. You know you can achieve it using CSS. 39 | * All other alternatives have failed you (office suite, InDesign, [Scribus](http://www.scribus.net/canvas/Scribus)). 40 | * Maybe you want to automate stuff like generating a table or even create graphics with something like [D3.js](http://d3js.org/). 41 | * Something else I haven't though of yet. 42 | 43 | 44 | ### When not to use 45 | * Don't use this to write long, multi page documents. That's what LaTeX is for. 46 | * Don't expect any magical auto-formatting. That's not what this is. 47 | * Don't use this *because* you don't know LaTeX. If you *can* use this then LaTeX will be easy enough to learn for you. 48 | 49 | 50 | ### Terms 51 | * This Software is provided as is, yada yada. I don't take any responsibility for things you manage to break or waste by using this. If you print out a thousand pages and then notice something is slightly off, that's on you. 52 | * Don't distribute it claiming you created it yourself. 53 | * If you create something cool with this, you may show it to me, so I can feel warm and fuzzy inside. 54 | * License is MIT, see included LICENSE file. 55 | -------------------------------------------------------------------------------- /example.html: -------------------------------------------------------------------------------- 1 | 2 | 3 |
4 | 5 |Lorem ipsum dolor sit amet, illud referrentur nam et, quod dictas sententiae cu vix. Has in quodsi singulis eloquentiam. Ut animal phaedrum per. Id vel modo torquatos. Cum id oblique inermis inciderint, labore constituam pro id. Delenit efficiendi nam ea, eu adhuc partem eos.
17 | 18 |Laudem theophrastus ne vel, dicant malorum albucius pri ut. Est facete labores volumus ad. Est nonumy invenire conclusionemque ut, ignota urbanitas voluptatibus ea usu. Tollit definitionem vim an, libris adversarium ei eam, nibh omnium persius qui ne.
19 | 20 |Pro sumo malorum nostrud ea. Vis et oblique docendi platonem, mel ei prima eloquentiam. Ei mea liber delectus, similique disputationi vim id. Usu utinam viderer vituperatoribus et.
22 | 23 |Has esse augue ut. Option praesent pro te, est percipitur signiferumque te. Natum eirmod efficiantur est ex, pri veritus iudicabit cu. Cum oportere persecuti ne, at vide vocent elaboraret qui.
24 | 25 |Ea eius mazim contentiones est. Democritum philosophia at eam. Ad congue nusquam mea, te eos aperiri commune splendide. Aliquam incorrupte his ea, duo ea quis illum alienum. Vel eu tota praesent, his ex insolens imperdiet dissentiet. Quo ei graece interesset.
27 | 28 |
29 |
30 | https://github.com/philer
31 |
32 |