diff options
| -rw-r--r-- | site/Makefile | 22 | ||||
| -rw-r--r-- | site/about.org | 42 | ||||
| -rw-r--r-- | site/assets/.gitignore | 3 | ||||
| -rw-r--r-- | site/assets/images/PDF-icon.png | bin | 0 -> 28254 bytes | |||
| -rw-r--r-- | site/assets/images/PowerPoint-icon.png | bin | 0 -> 17470 bytes | |||
| -rw-r--r-- | site/assets/images/html-icon.png | bin | 0 -> 36218 bytes | |||
| -rw-r--r-- | site/assets/images/space.jpg | bin | 0 -> 94407 bytes | |||
| -rw-r--r-- | site/assets/stylesheets/sd.css | 22 | ||||
| -rw-r--r-- | site/index-old.org | 133 | ||||
| -rw-r--r-- | site/index.html | 243 | ||||
| -rw-r--r-- | site/index.org | 141 | ||||
| -rw-r--r-- | site/index.pdf | bin | 0 -> 23102 bytes | |||
| -rw-r--r-- | site/jobs.org | 121 | ||||
| -rw-r--r-- | site/original-paper.org | 64 | ||||
| -rw-r--r-- | site/ox-html-uswds-components.el | 148 | ||||
| -rw-r--r-- | site/ox-html-uswds.el | 672 | ||||
| -rw-r--r-- | site/page-header.html | 103 | ||||
| -rw-r--r-- | site/posts/test.org | 23 | ||||
| -rw-r--r-- | site/publish.el | 74 | ||||
| -rw-r--r-- | site/sitemap.html | 0 | ||||
| -rw-r--r-- | site/sitemap.org | 6 |
21 files changed, 1817 insertions, 0 deletions
diff --git a/site/Makefile b/site/Makefile new file mode 100644 index 0000000..c7ff8a8 --- /dev/null +++ b/site/Makefile @@ -0,0 +1,22 @@ +# Makefile for Smart Documents. + +.PHONY: all content styles + +all: content styles + +content: publish.el + @echo "Publishing site's content (html and site media)." + emacs --batch --load publish.el --eval="(org-publish \"content\")" + +styles: publish.el + @echo "Publishing site's assets (css, js, img, fonts etc.)." + emacs --batch --load publish.el --eval="(org-publish \"assets\")" + +css: publish.el + @echo "Publishing site's css stylesheets." + emacs --batch --load publish.el --eval="(org-publish \"css\")" + +clean: + @echo "Cleaning up.." + @rm -rvf *.elc + @rm -rvf ~/.org-timestamps/* diff --git a/site/about.org b/site/about.org new file mode 100644 index 0000000..57b1d9c --- /dev/null +++ b/site/about.org @@ -0,0 +1,42 @@ +# -*- mode: org; -*- + +#+TITLE: About +#+AUTHOR: Marius Peter +#+DATE: <2021-02-13 Sat> + +#+INCLUDE: page-header.html export html + +#+begin_export html +<div class="usa-section"> + <div class="grid-container"> + <div class="grid-row grid-gap"> + <main class="usa-layout-docs__main desktop:grid-col-9 usa-prose usa-layout-docs" id="main-content"> +#+end_export + +* Contact + +Contact me at [[https://t.me/Blendoit][t.me/Blendoit]] or at [[mailto:smart-documents@tuta.io][smart-documents@tuta.io]]. + +* Sources + +** Home + +- PDF icon: [[https://commons.wikimedia.org/wiki/File:PDF_file_icon.svg][commons.wikimedia.org]] +- PowerPoint icon: [[https://www.pngwing.com/en/free-png-zfutu/download][www.pngwing.com]] +- HTML icon: Icon made from [[http://www.onlinewebfonts.com/icon][Icon Fonts]] is licensed by CC BY 3.0 + +** The Original Paper + +External materials used are referred throughout the paper as +footnotes. + +** I am... + +** About + +#+begin_export html + </main> + </div> + </div> +</div> +#+end_export diff --git a/site/assets/.gitignore b/site/assets/.gitignore new file mode 100644 index 0000000..9e593a0 --- /dev/null +++ b/site/assets/.gitignore @@ -0,0 +1,3 @@ +# .gitignore for Smart Documents assets + +uswds*
\ No newline at end of file diff --git a/site/assets/images/PDF-icon.png b/site/assets/images/PDF-icon.png Binary files differnew file mode 100644 index 0000000..71433b2 --- /dev/null +++ b/site/assets/images/PDF-icon.png diff --git a/site/assets/images/PowerPoint-icon.png b/site/assets/images/PowerPoint-icon.png Binary files differnew file mode 100644 index 0000000..01d5b3e --- /dev/null +++ b/site/assets/images/PowerPoint-icon.png diff --git a/site/assets/images/html-icon.png b/site/assets/images/html-icon.png Binary files differnew file mode 100644 index 0000000..663667a --- /dev/null +++ b/site/assets/images/html-icon.png diff --git a/site/assets/images/space.jpg b/site/assets/images/space.jpg Binary files differnew file mode 100644 index 0000000..250baf5 --- /dev/null +++ b/site/assets/images/space.jpg diff --git a/site/assets/stylesheets/sd.css b/site/assets/stylesheets/sd.css new file mode 100644 index 0000000..4289a10 --- /dev/null +++ b/site/assets/stylesheets/sd.css @@ -0,0 +1,22 @@ +#sd-intro-card{ + font-family:Source Sans Pro Web, Helvetica Neue, Helvetica, Roboto, Arial, sans-serif; + font-size:1.06rem; + line-height:1.5; + padding-bottom:2rem; + padding-top:2rem; + background-image:url("/assets/images/space.jpg"); + background-position:center; + background-size:cover; + color:white; +} + +/* .sd-header{ */ +/* position:sticky; */ +/* top:0; */ +/* z-index:10; */ +/* background-color: white; */ +/* } */ + +/* .sd-sidenav{ */ +/* position:fixed; */ +/* } */ diff --git a/site/index-old.org b/site/index-old.org new file mode 100644 index 0000000..18e0c0f --- /dev/null +++ b/site/index-old.org @@ -0,0 +1,133 @@ +# -*- mode: org; -*- + +#+TITLE: Smart Documents +#+AUTHOR: Marius Peter +#+DATE: <2021-02-09 Tue> +#+EMAIL: smart-documents@tuta.io +#+OPTIONS: toc:nil html-style:nil num:nil title:nil + +#+INCLUDE: page-header.html export html + +#+begin_export html +<section id="sd-intro-card" aria-label="Introduction"> + <div class="grid-container"> + <div class="usa-hero__callout"> + <h1 class="usa-hero__heading"> + <span class="usa-hero__heading--alt">Emacs</span> but + accessible & beautiful. + </h1> + <p> + Smart Documents is a document production system created to + raise mainstream awareness of + the <a href="https://www.gnu.org/software/emacs/">Emacs</a> + software on which it is based. + </p> + <a class="usa-button" href="https://github.com/Blendoit/.emacs.d">Try it now!</a> + </div> + </div> +</section> +#+end_export + +#+begin_export html +<div class="usa-section"> + <div class="grid-container"> + <div class="grid-row grid-gap"> + <main class="usa-layout-docs__main desktop:grid-col-9 usa-prose usa-layout-docs" id="main-content"> +#+end_export + +# #+begin_alert-success +# Finally online thank God :pray: +# #+end_alert-success + +* Perfect documents every time. +:PROPERTIES: +:CUSTOM_ID: perfect-document +:END: + +Focus on your content and let the powerful export engine work out the +appearance, for flawless results every time. + +* Maximum productivity. +:PROPERTIES: +:CUSTOM_ID: easy-document +:END: + +Collect feedback and create new document versions through an efficient +wizard. + +* Everything linked together. +:PROPERTIES: +:CUSTOM_ID: linked-document +:END: + +Create links between files to keep track of dates, people, tags, and +compile them into neatly filtered agendas---perfect for sharing a +project status or roadmap! + +* COMMENT A single authoritative document. +:PROPERTIES: +:CUSTOM_ID: single-document +:END: + +#+NAME: pdf-icon +#+ATTR_HTML: :height 100px +#+ATTR_LATEX: :height 100px +[[file:assets/images/PDF-icon.png]] + +#+NAME: powerpoint-icon +#+ATTR_HTML: :height 100px +#+ATTR_LATEX: :height 100px +[[file:assets/images/PowerPoint-icon.png]] + +#+NAME: html-icon +#+ATTR_HTML: :height 100px +#+ATTR_LATEX: :height 100px +[[file:assets/images/html-icon.png]] + +Each document can be declined into a report, a presentation +summarizing the document's outline, or a website page that can be +added to your wiki. + +* COMMENT Program your documents. +:PROPERTIES: +:CUSTOM_ID: single-document +:END: + +Program your documents in your favorite language. Python, C++, Go, +Clojure, you name it---you can develop interactive features from +within the document itself. + +* Download + +You can download the current development snapshot on GitHub. + +#+begin_export html +<a class="usa-button" href="https://github.com/Blendoit/.emacs.d">Github</a> +#+end_export + +# #+begin_button +# [[https://github.com/Blendoit/.emacs.d][Download]] +# #+end_button + +* Support this project + +#+begin_export html +<a class="usa-button" href="https://venmo.com/blendoit">Venmo</a> +#+end_export + +# #+begin_button +# [[https://venmo.com/blendoit][Venmo]] +# #+end_button + +* Contact + +For all inquiries, please send an e-mail to [[mailto:smart-documents@tuta.io][smart-documents@tuta.io]]. + +# Dirty! :P +#+begin_export html +</div> +</main> +</div> +</div> +</div> +#+end_export diff --git a/site/index.html b/site/index.html new file mode 100644 index 0000000..c66bdca --- /dev/null +++ b/site/index.html @@ -0,0 +1,243 @@ +<?xml version="1.0" encoding="utf-8"?> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" +"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> +<head> +<!-- 2021-09-29 Wed 19:37 --> +<meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> +<meta name="viewport" content="width=device-width, initial-scale=1" /> +<title>Smart Documents</title> +<meta name="generator" content="Org mode" /> +<meta name="author" content="Marius Peter" /> +<script type="text/javascript"> +// @license magnet:?xt=urn:btih:e95b018ef3580986a04669f1b5879592219e2a7a&dn=public-domain.txt Public Domain +<!--/*--><![CDATA[/*><!--*/ + function CodeHighlightOn(elem, id) + { + var target = document.getElementById(id); + if(null != target) { + elem.classList.add("code-highlighted"); + target.classList.add("code-highlighted"); + } + } + function CodeHighlightOff(elem, id) + { + var target = document.getElementById(id); + if(null != target) { + elem.classList.remove("code-highlighted"); + target.classList.remove("code-highlighted"); + } + } + /*]]>*///--> +// @license-end +</script> +</head> +<body> +<div id="content"> +<section class="usa-banner" aria-label="Accessible website"> + <div class="usa-accordion"> + + <header class="usa-banner__header"> + <div class="usa-banner__inner"> + <div class="grid-col-auto"> + <img class="usa-banner__header-flag" src="assets/uswds-2.10.1/img/us_flag_small.png" alt="U.S. flag"> + </div> + <div class="grid-col-fill tablet:grid-col-auto"> + <p class="usa-banner__header-text">Proudly designed with the U.S. Web Design System.</p> + <p class="usa-banner__header-action" aria-hidden="true">Here's how you know</p> + </div> + <button class="usa-accordion__button usa-banner__button" aria-expanded="false" aria-controls="gov-banner"> + <span class="usa-banner__button-text">Here's how you know</span> + </button> + </div> + </header> + + <div class="usa-banner__content usa-accordion__content" id="gov-banner"> + <div class="grid-row grid-gap-lg"> + <div class="usa-banner__guidance tablet:grid-col-6"> + <img class="usa-banner__icon usa-media-block__img" src="assets/uswds-2.10.1/img/icon-dot-gov.svg" role="img" alt="" aria-hidden="true"> + <div class="usa-media-block__body"> + <p> + <strong>Design for democracy</strong> + <br/> + The <a href="https://designsystem.digital.gov/">U.S. Web Design System</a> emphasizes universal accessibility. + </p> + </div> + </div> + <div class="usa-banner__guidance tablet:grid-col-6"> + <img class="usa-banner__icon usa-media-block__img" src="assets/uswds-2.10.1/img/icon-https.svg" role="img" alt="" aria-hidden="true"> + <div class="usa-media-block__body"> + <p> + <strong>Secure .gov websites use HTTPS</strong> + <br/> + This website will soon feature identical protection features! + </p> + </div> + </div> + </div> + </div> + + </div> +</section> + +<header class="usa-header usa-header--extended sd-header"> + <div class="usa-navbar"> + <div class="usa-logo" id="extended-logo"> + <em class="usa-logo__text"><a href="index.html" title="Home" aria-label="Home">Smart Documents</a></em> + </div> + <button class="usa-menu-btn">Menu</button> + </div> + + <nav aria-label="Primary navigation" class="usa-nav"> + <div class="usa-nav__inner"> + + <button class="usa-nav__close"> + <img src="assets/img/usa-icons/close.svg" role="img" alt="close"> + </button> + + <ul class="usa-nav__primary usa-accordion"> + + <li class="usa-nav__primary-item"> + <button class="usa-accordion__button usa-nav__link" aria-expanded="false" aria-controls="extended-nav-section-two"> + <span>Features</span> + </button> + <ul id="extended-nav-section-two" class="usa-nav__submenu"> + <li class="usa-nav__submenu-item"><a href="#" class=""> wan</a></li> + <li class="usa-nav__submenu-item"><a href="#" class=""> tu</a></li> + <li class="usa-nav__submenu-item"><a href="#" class=""> mute</a></li> + </ul> + </li> + + <li class="usa-nav__primary-item"> + <a class="usa-nav__link" href="original-paper.html"><span>The original paper</span></a> + </li> + + <li class="usa-nav__primary-item"> + <a class="usa-nav__link" href="jobs.html"><span>I am...</span></a> + </li> + + <li class="usa-nav__primary-item"> + <a class="usa-nav__link" href="about.html"><span>About</span></a> + </li> + + </ul> + + <div class="usa-nav__secondary"> + <ul class="usa-nav__secondary-links"> + <li class="usa-nav__secondary-item"><a href="">Contact</a></li> + <li class="usa-nav__secondary-item"><a href="">Contribute</a></li> + </ul> + + <form class="usa-search usa-search--small " role="search"> + <label class="usa-sr-only" for="extended-search-field-small">Search small</label> + <input class="usa-input" id="extended-search-field-small" type="search" name="search"> + <button class="usa-button" type="submit"><span class="usa-sr-only">Search</span></button> + </form> + </div> + </div> + </nav> +</header> + +<section id="sd-intro-card" aria-label="Introduction"> + <div class="grid-container"> + <div class="usa-hero__callout"> + <h1 class="usa-hero__heading"> + <span class="usa-hero__heading--alt">Emacs</span> but + accessible & beautiful. + </h1> + <p> + Smart Documents is a document production system created to + raise mainstream awareness of + the <a href="https://www.gnu.org/software/emacs/">Emacs</a> + software on which it is based. + </p> + <a class="usa-button" href="https://github.com/Blendoit/.emacs.d">Try it now!</a> + </div> + </div> +</section> + +<div class="usa-section"> + <div class="grid-container"> + <div class="grid-row grid-gap"> + <main class="usa-layout-docs__main desktop:grid-col-9 usa-prose usa-layout-docs" id="main-content"> + +<p> +The self-publishing publishing tool +</p> + +<ul class="org-ul"> +<li>This website is a <code>Smart Document</code> comprised of different <code>Smart Documents</code>.</li> +</ul> + +<div id="outline-container-perfect-document" class="outline-2"> +<h2 id="perfect-document">Perfect documents every time.</h2> +<div class="outline-text-2" id="text-perfect-document"> +<p> +Focus on your content and let the powerful export engine work out the +appearance, for flawless results every time. +</p> +</div> +</div> + +<div id="outline-container-easy-document" class="outline-2"> +<h2 id="easy-document">Maximum productivity.</h2> +<div class="outline-text-2" id="text-easy-document"> +<p> +Collect feedback and create new document versions through an efficient +wizard. +</p> +</div> +</div> + +<div id="outline-container-linked-document" class="outline-2"> +<h2 id="linked-document">Everything linked together.</h2> +<div class="outline-text-2" id="text-linked-document"> +<p> +Create links between files to keep track of dates, people, tags, and +compile them into neatly filtered agendas—perfect for sharing a +project status or roadmap! +</p> +</div> +</div> + +<div id="outline-container-orgbd48720" class="outline-2"> +<h2 id="orgbd48720">Download</h2> +<div class="outline-text-2" id="text-orgbd48720"> +<p> +You can download the current development snapshot on GitHub. +</p> + +<a class="usa-button" href="https://github.com/Blendoit/.emacs.d">Github</a> +</div> +</div> + +<div id="outline-container-org563d56b" class="outline-2"> +<h2 id="org563d56b">Support this project</h2> +<div class="outline-text-2" id="text-org563d56b"> +<a class="usa-button" href="https://venmo.com/blendoit">Venmo</a> +</div> +</div> + +<div id="outline-container-org5edb15d" class="outline-2"> +<h2 id="org5edb15d">Contact</h2> +<div class="outline-text-2" id="text-org5edb15d"> +<p> +For all inquiries, please send an e-mail to <a href="mailto:smart-documents@tuta.io">smart-documents@tuta.io</a>. +</p> + +</div> +</main> +</div> +</div> +</div> +</div> +</div> +</div> +<div id="postamble" class="status"> +<p class="date">Date: 2021-02-09 Tue 00:00</p> +<p class="author">Author: Marius Peter</p> +<p class="date">Created: 2021-09-29 Wed 19:37</p> +<p class="validation"><a href="https://validator.w3.org/check?uri=referer">Validate</a></p> +</div> +</body> +</html> diff --git a/site/index.org b/site/index.org new file mode 100644 index 0000000..34c53b0 --- /dev/null +++ b/site/index.org @@ -0,0 +1,141 @@ +# -*- mode: org; -*- + +#+TITLE: Smart Documents +#+AUTHOR: Marius Peter +#+DATE: <2021-02-09 Tue> +#+EMAIL: smart-documents@tuta.io +#+OPTIONS: toc:nil html-style:nil num:nil title:nil +#+MACRO: SD =Smart Document= +#+MACRO: SDs =Smart Documents= + +#+SETUPFILE: /home/blendux/.emacs.d/resources/templates/documents/gnu-default.setup +#+INCLUDE: page-header.html export html + +#+begin_export html +<section id="sd-intro-card" aria-label="Introduction"> + <div class="grid-container"> + <div class="usa-hero__callout"> + <h1 class="usa-hero__heading"> + <span class="usa-hero__heading--alt">Emacs</span> but + accessible & beautiful. + </h1> + <p> + Smart Documents is a document production system created to + raise mainstream awareness of + the <a href="https://www.gnu.org/software/emacs/">Emacs</a> + software on which it is based. + </p> + <a class="usa-button" href="https://github.com/Blendoit/.emacs.d">Try it now!</a> + </div> + </div> +</section> +#+end_export + +#+begin_export html +<div class="usa-section"> + <div class="grid-container"> + <div class="grid-row grid-gap"> + <main class="usa-layout-docs__main desktop:grid-col-9 usa-prose usa-layout-docs" id="main-content"> +#+end_export + +The self-publishing publishing tool + +As in, this website is a {{{SD}}} that exists just as comfortably as +HTML (what you are most likely viewing now) as PDF. + +- This website is a {{{SD}}} comprised of different {{{SDs}}}. + +- This is + +* Perfect documents every time. +:PROPERTIES: +:CUSTOM_ID: perfect-document +:END: + +Focus on your content and let the powerful export engine work out the +appearance, for flawless results every time. + +* Maximum productivity. +:PROPERTIES: +:CUSTOM_ID: easy-document +:END: + +Collect feedback and create new document versions through an efficient +wizard. + +* Everything linked together. +:PROPERTIES: +:CUSTOM_ID: linked-document +:END: + +Create links between files to keep track of dates, people, tags, and +compile them into neatly filtered agendas---perfect for sharing a +project status or roadmap! + +* COMMENT A single authoritative document. +:PROPERTIES: +:CUSTOM_ID: single-document +:END: + +#+NAME: pdf-icon +#+ATTR_HTML: :height 100px +#+ATTR_LATEX: :height 100px +[[file:assets/images/PDF-icon.png]] + +#+NAME: powerpoint-icon +#+ATTR_HTML: :height 100px +#+ATTR_LATEX: :height 100px +[[file:assets/images/PowerPoint-icon.png]] + +#+NAME: html-icon +#+ATTR_HTML: :height 100px +#+ATTR_LATEX: :height 100px +[[file:assets/images/html-icon.png]] + +Each document can be declined into a report, a presentation +summarizing the document's outline, or a website page that can be +added to your wiki. + +* COMMENT Program your documents. +:PROPERTIES: +:CUSTOM_ID: single-document +:END: + +Program your documents in your favorite language. Python, C++, Go, +Clojure, you name it---you can develop interactive features from +within the document itself. + +* Download + +You can download the current development snapshot on GitHub. + +#+begin_export html +<a class="usa-button" href="https://github.com/Blendoit/.emacs.d">Github</a> +#+end_export + +# #+begin_button +# [[https://github.com/Blendoit/.emacs.d][Download]] +# #+end_button + +* Support this project + +#+begin_export html +<a class="usa-button" href="https://venmo.com/blendoit">Venmo</a> +#+end_export + +# #+begin_button +# [[https://venmo.com/blendoit][Venmo]] +# #+end_button + +* Contact + +For all inquiries, please send an e-mail to [[mailto:smart-documents@tuta.io][smart-documents@tuta.io]]. + +# Dirty! :P +#+begin_export html +</div> +</main> +</div> +</div> +</div> +#+end_export diff --git a/site/index.pdf b/site/index.pdf Binary files differnew file mode 100644 index 0000000..9d57a82 --- /dev/null +++ b/site/index.pdf diff --git a/site/jobs.org b/site/jobs.org new file mode 100644 index 0000000..5e97365 --- /dev/null +++ b/site/jobs.org @@ -0,0 +1,121 @@ +# -*- mode: org; -*- + +#+TITLE: My job is... +#+AUTHOR: Marius Peter +#+DATE: <2021-02-09 Tue> + +#+INCLUDE: page-header.html export html + +#+begin_export html +<div class="usa-section"> + <div class="grid-container"> + <div class="grid-row grid-gap"> + <div class="usa-layout-docs__sidenav desktop:grid-col-3"> + <nav aria-label="Secondary navigation"> + <ul class="usa-sidenav sd-sidenav"> + <li class="usa-sidenav__item"> + <a href="">Parent link</a> + </li><li class="usa-sidenav__item"> + <a href="" class="usa-current">Current page + </a><ul class="usa-sidenav__sublist"> + <li class="usa-sidenav__item"> + <a href="">Child link</a> + </li><li class="usa-sidenav__item"> + <a href="" class="usa-current">Child link</a><ul class="usa-sidenav__sublist"> + <li class="usa-sidenav__item"> + <a href="">Grandchild link</a> + </li><li class="usa-sidenav__item"> + <a href="">Grandchild link</a> + </li><li class="usa-sidenav__item"> + <a href="" class="usa-current">Grandchild link</a> + </li><li class="usa-sidenav__item"> + <a href="">Grandchild link</a> + </li> + </ul> + </li><li class="usa-sidenav__item"> + <a href="">Child link</a> + </li><li class="usa-sidenav__item"> + <a href="">Child link</a> + </li><li class="usa-sidenav__item"> + <a href="">Child link</a> + </li> + </ul> + </li><li class="usa-sidenav__item"> + <a href="">Parent link</a> + </li> + </ul> + </nav> + + </div> + + <main class="usa-layout-docs__main desktop:grid-col-9 usa-prose usa-layout-docs" id="main-content"> +#+end_export + +* Educators & Academics + +** Teacher + +*** Kindergarten + +*** Middle School + +*** High School + +** Student + +*** Middle and High School + +*** College + +**** MLA +**** APA + +** Professor + +*** Syllabus + +*** Homework assignment + +** Researchers + +*** Thesis + +* Businesspersons + +** Reports + +* Legal + +** Lawyer + +** Judge + +** Stenographer + +* Technicians + +** Engineer + +** Product Line Manager + +* Managers & Executives + +** CEO + +** Board Member + +** Manager + +* Artists + +** Painter + +** Screenwriter + +#+begin_export html + </main> + </div> + </div> +</div> +#+end_export + diff --git a/site/original-paper.org b/site/original-paper.org new file mode 100644 index 0000000..2e46f69 --- /dev/null +++ b/site/original-paper.org @@ -0,0 +1,64 @@ +# -*- mode: org; -*- + +#+TITLE: The Original Paper +#+AUTHOR: Marius Peter +#+DATE: <2021-03-01 Mon> +#+EMAIL: smart-documents@tuta.io + +#+INCLUDE: page-header.html export html + +#+begin_export html +<div class="usa-section"> + <div class="grid-container"> + <div class="grid-row grid-gap"> + <div class="usa-layout-docs__sidenav desktop:grid-col-3"> + <nav aria-label="Secondary navigation"> + <ul class="usa-sidenav sd-sidenav"> + <li class="usa-sidenav__item"> + <a href="">Parent link</a> + </li><li class="usa-sidenav__item"> + <a href="" class="usa-current">Current page + </a><ul class="usa-sidenav__sublist"> + <li class="usa-sidenav__item"> + <a href="">Child link</a> + </li><li class="usa-sidenav__item"> + <a href="" class="usa-current">Child link</a><ul class="usa-sidenav__sublist"> + <li class="usa-sidenav__item"> + <a href="">Grandchild link</a> + </li><li class="usa-sidenav__item"> + <a href="">Grandchild link</a> + </li><li class="usa-sidenav__item"> + <a href="" class="usa-current">Grandchild link</a> + </li><li class="usa-sidenav__item"> + <a href="">Grandchild link</a> + </li> + </ul> + </li><li class="usa-sidenav__item"> + <a href="">Child link</a> + </li><li class="usa-sidenav__item"> + <a href="">Child link</a> + </li><li class="usa-sidenav__item"> + <a href="">Child link</a> + </li> + </ul> + </li><li class="usa-sidenav__item"> + <a href="">Parent link</a> + </li> + </ul> + </nav> + + </div> + + <main class="usa-layout-docs__main desktop:grid-col-9 usa-prose usa-layout-docs" id="main-content"> +#+end_export + +* My Configuration for Emacs + +#+INCLUDE: ~/.emacs.d/smart-documents.org + +#+begin_export html + </main> + </div> + </div> +</div> +#+end_export diff --git a/site/ox-html-uswds-components.el b/site/ox-html-uswds-components.el new file mode 100644 index 0000000..08e9684 --- /dev/null +++ b/site/ox-html-uswds-components.el @@ -0,0 +1,148 @@ +;;; ox-html-uswds-components.el --- Transcription functions for all USWDS components, -*- lexical-binding: t; -*- +;; Copyright (C) 2021 Marius Peter + +;; Author: Marius Peter (rot13 "?znevhf.crgre@ghgnabgn.pbz") +;; Created: March 2021 +;; Package-Version: 0.1 +;; Keywords: org export publish html +;; Homepage: http://www.smart-documents.org + +;; This file is not part of GNU Emacs. + +;;; License: +;; This program is free software; you can redistribute it and/or modify +;; it under the terms of the GNU General Public License as published by +;; the Free Software Foundation, either version 3 of the License, or +;; (at your option) any later version. +;; +;; This program is distributed in the hope that it will be useful, +;; but WITHOUT ANY WARRANTY; without even the implied warranty of +;; MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the +;; GNU General Public License for more details. +;; +;; You should have received a copy of the GNU General Public License +;; along with this file. If not, see <http://www.gnu.org/licenses/>. +;;; Commentary: + +;; These are all the components made available by the USDWS. + +;;; Code: + +(defun uswds-component-accordion (contents) + (format "<script>%s</script>" contents)) + +(defun uswds-component-alert-info (contents) + (format "<div class=\"usa-alert usa-alert--info\" > + <div class=\"usa-alert__body\"> + <h3 class=\"usa-alert__heading\">Informative status</h3> + <p class=\"usa-alert__text\">%s</p> + </div> +</div>" contents)) + +(defun uswds-component-alert-warning (contents) + (format "<div class=\"usa-alert usa-alert--warning\" > + <div class=\"usa-alert__body\"> + <h3 class=\"usa-alert__heading\">Warning status</h3> + <p class=\"usa-alert__text\">%s</p> + </div> +</div>" contents)) + +(defun uswds-component-alert-error (contents) + (format "<div class=\"usa-alert usa-alert--error\" > + <div class=\"usa-alert__body\"> + <h3 class=\"usa-alert__heading\">Error status</h3> + <p class=\"usa-alert__text\">%s</p> + </div> +</div>" contents)) + +(defun uswds-component-alert-success (contents) + (format "<div class=\"usa-alert usa-alert--success\" > + <div class=\"usa-alert__body\"> + <h3 class=\"usa-alert__heading\">Success status</h3> + <p class=\"usa-alert__text\">%s</p> + </div> +</div>" contents)) + +(defun uswds-component-alert-slim (contents) + (format "<div class=\"usa-alert usa-alert--slim\" > + <div class=\"usa-alert__body\"> + <p class=\"usa-alert__text\">%s</p> + </div> +</div>" contents)) + +(defun uswds-component-alert-no-icon (contents) + (format "<div class=\"usa-alert usa-alert--no-icon\" > + <div class=\"usa-alert__body\"> + <p class=\"usa-alert__text\">%s</p> + </div> +</div>" contents)) + +(defun uswds-component-banner (contents) + (format "<style type=\"text/css\">%s</style>" contents)) + +(defun uswds-component-breadcrumb (contents) + (format "<style type=\"text/css\">%s</style>" contents)) + +(defun uswds-component-button (contents) + ;; <a class=\"usa-button\" href=\"https://github.com/Blendoit/.emacs.d\">%s</a> + (format "<a class=\"usa-button\">%s</a>" contents)) + +(defun uswds-component-button-group (contents) + (format "<style type=\"text/css\">%s</style>" contents)) + +(defun uswds-component-card (contents) + (format "<style type=\"text/css\">%s</style>" contents)) + +(defun uswds-component-collection (contents) + (format "<style type=\"text/css\">%s</style>" contents)) + +(defun uswds-component-footer (contents) + (format "<style type=\"text/css\">%s</style>" contents)) + +;; TODO form controls and templates +(defun uswds-component-grid (contents) + (format "<style type=\"text/css\">%s</style>" contents)) + +(defun uswds-component-header (contents) + (format "<style type=\"text/css\">%s</style>" contents)) + +;; TODO icons + +(defun uswds-component-identifier (contents) + (format "<style type=\"text/css\">%s</style>" contents)) + +(defun uswds-component-process (contents) + (format "<style type=\"text/css\">%s</style>" contents)) + +(defun uswds-component-search (contents) + (format "<style type=\"text/css\">%s</style>" contents)) + +(defun uswds-component-side (contents) + (format "<style type=\"text/css\">%s</style>" contents)) + +(defun uswds-component-site (contents) + (format "<style type=\"text/css\">%s</style>" contents)) + +(defun uswds-component-step (contents) + (format "<style type=\"text/css\">%s</style>" contents)) + +(defun uswds-component-summary (contents) + (format "<style type=\"text/css\">%s</style>" contents)) + +;; TODO table? + +(defun uswds-component-tag (contents) + (format "<span class=\"usa-tag\">%s</span>" contents)) + +(defun uswds-component-tooltip (contents) + (format "<style type=\"text/css\">%s</style>" contents)) + +(defun uswds-component-tooltip (contents) + (format "<style type=\"text/css\">%s</style>" contents)) + +(defun uswds-component-tooltip (contents) + (format "<style type=\"text/css\">%s</style>" contents)) + +(provide 'ox-html-uswds-components) +;;; ox-html-uswds-components.el ends here + diff --git a/site/ox-html-uswds.el b/site/ox-html-uswds.el new file mode 100644 index 0000000..6efe322 --- /dev/null +++ b/site/ox-html-uswds.el @@ -0,0 +1,672 @@ +;;; ox-slimhtml.el --- an HTML org export backend for the USWDS -*- lexical-binding: t; -*- +;; Copyright (C) 2021 Marius Peter + +;; Author: Marius Peter (rot13 "?znevhf.crgre@ghgnabgn.pbz") +;; Created: March 2021 +;; Package-Version: 0.1 +;; Keywords: org export publish html +;; Homepage: http://www.smart-documents.org + +;; This file is not part of GNU Emacs. + +;;; License: +;; This program is free software; you can redistribute it and/or modify +;; it under the terms of the GNU General Public License as published by +;; the Free Software Foundation, either version 3 of the License, or +;; (at your option) any later version. +;; +;; This program is distributed in the hope that it will be useful, +;; but WITHOUT ANY WARRANTY; without even the implied warranty of +;; MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the +;; GNU General Public License for more details. +;; +;; You should have received a copy of the GNU General Public License +;; along with this file. If not, see <http://www.gnu.org/licenses/>. + +;;; Commentary: +;; html-uswds is an Org mode export backend derived from the +;; `ox-slimhtml' backend. It is intended to produce HTML compatible +;; with the USWDS (https://designsystem.digital.gov/). A key feature +;; of resulting web pages is their accessibility---the USWDS initially +;; caters to American federal agencies wishing to adopt a common +;; design language intelligible for all cultures and levels of +;; computer literacy. + +;;; Code: +(require 'ox-html) +(require 'cl-lib) + +;; formatting +;; #+BEGIN_EXAMPLE +;; ,*bold* # <strong>bold</strong> +;; /italic/ # <em>italic</em> +;; =verbatim= # <kbd>verbatim</kbd> +;; #+END_EXAMPLE + +(defun ox-html-uswds-bold (bold contents info) + "Transcode BOLD from Org to HTML. + +CONTENTS is the text with bold markup. +INFO is a plist holding contextual information." + (when contents (format "<strong>%s</strong>" contents))) + +(defun ox-html-uswds-italic (italic contents info) + "Transcode ITALIC from Org to HTML. + +CONTENTS is the text with italic markup. +INFO is a plist holding contextual information." + (when contents (format "<em>%s</em>" contents))) + +(defun ox-html-uswds-verbatim (verbatim contents info) + "Transcode VERBATIM string from Org to HTML. + +CONTENTS is nil. +INFO is a plist holding contextual information." + (let ((contents (org-html-encode-plain-text + (org-element-property :value verbatim)))) + (when contents (format "<kbd>%s</kbd>" contents)))) + +;; headlines +;; #+BEGIN_EXAMPLE +;; ,* headline text # <section class="container"> +;; :PROPERTIES: # <h1 class="headline">headline text</h1> +;; :attr_html: :class headline # </section> +;; :html_container: section +;; :html_container_class: container +;; :END: + +;; ,#+OPTIONS: H:[headline level] +;; ,#+HTML_CONTAINER: [default container] +;; #+END_EXAMPLE + +(defun ox-html-uswds-headline (headline contents info) + "Transcode HEADLINE from Org to HTML. + +CONTENTS is the section as defined under the HEADLINE. +INFO is a plist holding contextual information." + (let* ((text (org-export-data (org-element-property :title headline) info)) + (level (org-export-get-relative-level headline info)) + (attributes (org-element-property :ATTR_HTML headline)) + (container (org-element-property :HTML_CONTAINER headline)) + (container-class (and container (org-element-property :HTML_CONTAINER_CLASS headline)))) + (when attributes + (setq attributes + (format " %s" (org-html--make-attribute-string + (org-export-read-attribute 'attr_html `(nil + (attr_html ,(split-string attributes)))))))) + (concat + (when (and container (not (string= "" container))) + (format "<%s%s>" container (if container-class (format " class=\"%s\"" container-class) ""))) + (if (not (org-export-low-level-p headline info)) + (format "<h%d%s>%s</h%d>%s" level (or attributes "") text level (or contents "")) + (concat + (when (org-export-first-sibling-p headline info) "<ul>") + (format "<li>%s%s</li>" text (or contents "")) + (when (org-export-last-sibling-p headline info) "</ul>"))) + (when (and container (not (string= "" container))) + (format "</%s>" (cl-subseq container 0 (cl-search " " container))))))) + +;; sections + +(defun ox-html-uswds-section (section contents info) + "Transcode a SECTION element from Org to HTML. + +CONTENTS is the contents of the section. +INFO is a plist holding contextual information. + +Sections are child elements of org headlines; +'container' settings are found in slim-headlines." + contents) + +;; links +;; #+BEGIN_EXAMPLE +;; ,#+attr_html: :class link # <a href="link" class="link">content</a> +;; [[link][content]] + +;; ,#+OPTIONS: html-link-org-files-as-html:[t/nil] || org-html-link-org-files-as-html +;; ,#+HTML_EXTENSION: [html] || org-html-extension + +;; ,#+OPTIONS: html-link-use-abs-url:[t/nil] || org-html-link-use-abs-url +;; #+END_EXAMPLE + +(defun ox-html-uswds-link (link contents info) + "Transcode LINK from Org to HTML. + +CONTENTS is the text of the link. +INFO is a plist holding contextual information." + (if (ox-html-uswds--immediate-child-of-p link 'link) (org-element-property :raw-link link) + (if (not contents) (format "<em>%s</em>" (org-element-property :path link)) + (let ((link-type (org-element-property :type link)) + (href (org-element-property :raw-link link)) + (attributes (if (ox-html-uswds--immediate-child-of-p link 'paragraph) + (ox-html-uswds--attr (org-export-get-parent link)) + "")) + (element "<a href=\"%s\"%s>%s</a>")) + (cond ((string= "file" link-type) + (let ((html-extension (or (plist-get info :html-extension) "")) + (use-abs-url (plist-get info :html-link-use-abs-url)) + (link-org-files-as-html (plist-get info :html-link-org-as-html)) + (path (or (org-element-property :path link) ""))) + (format element + (concat (if (and use-abs-url (file-name-absolute-p path)) "file:" "") + (if (and link-org-files-as-html (string= "org" (downcase (or (file-name-extension path) "")))) + (if (and html-extension (not (string= "" html-extension))) + (concat (file-name-sans-extension path) "." html-extension) + (file-name-sans-extension path)) + path)) + attributes contents))) + (t + (format element href attributes contents))))))) + +;; plain lists +;; #+BEGIN_EXAMPLE +;; ,#+attr_html: :class this # <ul class="this"> +;; - item 1 # <li>item 1</li> +;; - item 2 # <li>item 2</li> +;; # </ul> + +;; + item 1 # <ol><li>item 1</li></ol> +;; - definition :: list # <dl><dt>definition</dt><dd>list</dd></dl> +;; #+END_EXAMPLE + +(defun ox-html-uswds-plain-list (plain-list contents info) + "Transcode a PLAIN-LIST string from Org to HTML. + +CONTENTS is the contents of the list element. +INFO is a plist holding contextual information." + (when contents + (let ((type (cl-case (org-element-property :type plain-list) + (ordered "ol") + (unordered "ul") + (descriptive "dl")))) + (format "<%s%s>%s</%s>" type (ox-html-uswds--attr plain-list) contents type)))) + +;; paragraphs +;; #+BEGIN_EXAMPLE +;; ,#+attr_html: :class this # <p class="this">content</p> +;; content +;; #+END_EXAMPLE + +(defun ox-html-uswds-paragraph (paragraph contents info) + "Transcode a PARAGRAPH element from Org to HTML. + +CONTENTS is the contents of the paragraph. +INFO is a plist holding contextual information." + (when contents + (if (or (ox-html-uswds--immediate-child-of-p paragraph 'item) + (ox-html-uswds--immediate-child-of-p paragraph 'special-block)) + contents + (if (ox-html-uswds--has-immediate-child-of-p paragraph 'link) + (format "<p>%s</p>" contents) + (format "<p%s>%s</p>" (ox-html-uswds--attr paragraph) contents))))) + +;; examples +;; #+BEGIN_EXAMPLE +;; ,#+BEGIN_EXAMPLE # content +;; content +;; ,#+END_EXAMPLE +;; #+END_EXAMPLE + +(defun ox-html-uswds-example-block (example-block contents info) + "Transcode an EXAMPLE-BLOCK element from Org to HTML. + +CONTENTS is nil. INFO is a plist holding contextual information." + (let ((code (org-html-format-code example-block info))) + (when code + (format "<pre><code class=\"%s\">%s</code></pre>" + (or (org-element-property :language example-block) "example") + code)))) + +;; raw html +;; #+BEGIN_EXAMPLE +;; ,#+BEGIN_EXPORT html # <span>export block</span> +;; <span>export block</span> +;; ,#+END_EXPORT + +;; ,#+BEGIN_EXPORT javascript # <script>console.log()</script> +;; console.log() +;; ,#+END_EXPORT + +;; ,#+BEGIN_EXPORT css # <style type="text/css">span{}</style> +;; span {} +;; ,#+END_EXPORT +;; #+END_EXAMPLE + +(defun ox-html-uswds-export-block (export-block contents info) + "Transcode an EXPORT-BLOCK element from Org to HTML. +CONTENTS is nil. INFO is a plist holding contextual information." + (let ((contents (org-element-property :value export-block)) + (language (org-element-property :type export-block))) + (when contents + (cond ((string= "JAVASCRIPT" language) + (format "<script>%s</script>" contents)) + ((string= "CSS" language) + (format "<style type=\"text/css\">%s</style>" contents)) + (t + (org-remove-indentation contents)))))) + +;; snippet +;; #+BEGIN_EXAMPLE +;; @@html:<span>snippet</span>@@ # <span>snippet</span> +;; #+END_EXAMPLE + +(defun ox-html-uswds-export-snippet (export-snippet contents info) + "Transcode a EXPORT-SNIPPET object from Org to HTML. + +CONTENTS is nil. INFO is a plist holding contextual information." + (let ((contents (org-element-property :value export-snippet))) + (when contents contents))) + +;; special block +;; #+BEGIN_EXAMPLE +;; ,#+attr_html: :type text/css # <style type="text/css"> +;; ,#+BEGIN_STYLE # p { font-weight:500; } +;; p { font-weight:500; } # </style> +;; ,#+END_STYLE +;; #+END_EXAMPLE + +(load-file "./ox-html-uswds-components.el") + +(defun ox-html-uswds-special-block (special-block contents info) + "Transcode SPECIAL-BLOCK from Org to HTML. + +CONTENTS is the text within the #+BEGIN_ and #+END_ markers. +INFO is a plist holding contextual information." + (when contents + (let ((block-type (downcase (org-element-property :type special-block)))) + (cond ((string= "accordion" block-type)(uswds-component-accordion contents)) + ((string= "alert-info" block-type) (uswds-component-alert-info contents)) + ((string= "alert-warning" block-type) (uswds-component-alert-warning contents)) + ((string= "alert-error" block-type) (uswds-component-alert-error contents)) + ((string= "alert-success" block-type) (uswds-component-alert-success contents)) + ((string= "alert-slim" block-type) (uswds-component-alert-slim contents)) + ((string= "alert-no-icon" block-type) (uswds-component-alert-no-icon contents)) + ((string= "banner" block-type) (uswds-component-banner contents)) + ((string= "breadcrumb" block-type) (uswds-component-breadcrumb contents)) + ((string= "button" block-type) (uswds-component-button contents)) + ((string= "button-group" block-type) (uswds-component-button-group contents)) + ((string= "card" block-type) (uswds-component-card contents)) + ((string= "collection" block-type) (uswds-component-collection contents)) + ((string= "footer" block-type) (uswds-component-footer contents)) + ;; TODO form controls and templates + ((string= "grid" block-type) (uswds-component-grid contents)) + ((string= "header" block-type) (uswds-component-header contents)) + ;; TODO icons + ((string= "identifier" block-type) (uswds-component-identifier contents)) + ((string= "process-list" block-type) (uswds-component-process contents)) + ((string= "search" block-type) (uswds-component-search contents)) + ((string= "side-navigation" block-type) (uswds-component-side contents)) + ((string= "site-alert" block-type) (uswds-component-site-alert contents)) + ((string= "step-indicator" block-type) (uswds-component-step-indicator contents)) + ((string= "summary-box" block-type) (uswds-component-summary-box contents)) + ;; TODO table? + ((string= "tag" block-type) (uswds-component-tag contents)) + ((string= "tooltip" block-type) (uswds-component-tooltip contents)) + (t (format "<div>\n%s No suitable special block found. \n</div>" contents)))))) + +;; source code +;; #+BEGIN_EXAMPLE +;; ,#+BEGIN_SRC javascript # <pre> +;; code # <code class="javascript">code</code> +;; ,#+END_SRC # </pre> +;; #+END_EXAMPLE + +(defun ox-html-uswds-src-block (src-block contents info) + "Transcode SRC-BLOCK from Org to HTML. + +CONTENTS is the text of a #+BEGIN_SRC...#+END_SRC block. +INFO is a plist holding contextual information." + (let ((code (org-html-format-code src-block info)) + (language (org-element-property :language src-block))) + (when code + (format "<pre><code class=\"%s\"%s>%s</code></pre>" + language (ox-html-uswds--attr src-block) code)))) + +;; body +;; #+BEGIN_EXAMPLE +;; ,#+HTML_PREAMBLE: preamble {{{macro}}} # preamble +;; content # content +;; ,#+HTML_POSTAMBLE: postamble {{{macro}}} # postamble +;; #+END_EXAMPLE + +(defun ox-html-uswds-inner-template (contents info) + "Return body of document string after HTML conversion. + +CONTENTS is the transcoded contents string. +INFO is a plist holding export options." + (when (and contents (not (string= "" contents))) + (let ((container (plist-get info :html-container))) + (concat + (when (and container (not (string= "" container))) (format "<%s>" container)) + (or (ox-html-uswds--expand-macros (plist-get info :html-preamble) info) "") + contents + (or (ox-html-uswds--expand-macros (plist-get info :html-postamble) info) "") + (when (and container (not (string= "" container))) + (format "</%s>" (cl-subseq container 0 (cl-search " " container)))))))) + +;; html page +;; #+BEGIN_EXAMPLE +;; ,#+HTML_DOCTYPE: || org-html-doctype # <!DOCTYPE html> ; html5 +;; ,#+HTML_HEAD: || org-html-head # <html lang="en"> ; when language is set +;; ,#+HTML_TITLE: %t # <head> +;; ,#+HTML_HEAD_EXTRA: || org-html-head-extra # head +;; ,#+HTML_BODY_ATTR: id="test" # <title>document title</title> +;; ,#+HTML_HEADER: {{{macro}}} # head-extra +;; ,#+HTML_FOOTER: {{{macro}}} # </head> +;; # <body id="test"> +;; # header +;; # content +;; # footer +;; # </body> +;; # </html> + +;; {{{macro}}} tokens can also be set in INFO; +;; :html-head, :html-head-extra and :html-header. + +;; :html-title is a string with optional tokens; +;; %t is the document's #+TITLE: property. +;; #+END_EXAMPLE + +(defun ox-html-uswds-template (contents info) + "Return full document string after HTML conversion. + +CONTENTS is the transcoded contents string. +INFO is a plist holding export options." + (let ((doctype (assoc (plist-get info :html-doctype) org-html-doctype-alist)) + (language (plist-get info :language)) + (head (ox-html-uswds--expand-macros (plist-get info :html-head) info)) + (head-extra (ox-html-uswds--expand-macros (plist-get info :html-head-extra) info)) + (title (plist-get info :title)) + (title-format (plist-get info :html-title)) + (body-attr (plist-get info :html-body-attr)) + (header (plist-get info :html-header)) + (newline "\n")) + (when (listp title) + (setq title (car title))) + (concat + (when doctype (concat (cdr doctype) newline)) + "<html" (when language (concat " lang=\"" language "\"")) ">" newline + ;; Start if the document head. + "<head>" newline + (when (not (string= "" head)) (concat head newline)) + (when (and title (not (string= "" title))) + (if title-format + (format-spec (concat "<title>" title-format "</title>\n") + (format-spec-make ?t title)) + (concat "<title>" title "</title>" newline))) + (when (not (string= "" head-extra)) (concat head-extra newline)) + "<link rel=\"stylesheet\" href=\"../assets/uswds-2.10.1/css/uswds.min.css\" />" + "<link rel=\"stylesheet\" href=\"../assets/stylesheets/sd.css\" />" + ;; USWDS init + "<script src=\"../assets/uswds-2.10.1/js/uswds-init.min.js\" type=\"text/javascript\"></script>" + "</head>" newline + ;; Start of the document body. + "<body" (and body-attr (not (string= "" body-attr)) (format " %s" body-attr)) ">" + "<a class=\"usa-skipnav\" href=\"#main-content\">Skip to main content</a>" + "" + (when (and header (not (string= "" header))) + (or (ox-html-uswds--expand-macros header info) "")) + ;; When not the index page, add side navigation links. + ;; (when (not (string= (substring (buffer-name) 0 5) "index")) + ;; "<a class=\"usa-skipnav\" href=\"#main-content\">Skip to main content</a>" + ;; "<div class=\"usa-section\"> + ;; <div class=\"grid-container\"> + ;; <div class=\"grid-row grid-gap\"> + ;; <div class=\"usa-layout-docs__sidenav desktop:grid-col-3\"> + ;; <nav aria-label=\"Secondary navigation\"> + ;; <ul class=\"usa-sidenav sd-sidenav\"> + ;; <li class=\"usa-sidenav__item\"> + ;; <a href=\"\">Parent link</a> + ;; </li><li class=\"usa-sidenav__item\"> + ;; <a href=\"\" class=\"usa-current\">Current page</a><ul class=\"usa-sidenav__sublist\"> + ;; <li class=\"usa-sidenav__item\"> + ;; <a href=\"\">Child link</a> + ;; </li><li class=\"usa-sidenav__item\"> + ;; <a href=\"\" class=\"usa-current\">Child link</a><ul class=\"usa-sidenav__sublist\"> + ;; <li class=\"usa-sidenav__item\"> + ;; <a href=\"\">Grandchild link</a> + ;; </li><li class=\"usa-sidenav__item\"> + ;; <a href=\"\">Grandchild link</a> + ;; </li><li class=\"usa-sidenav__item\"> + ;; <a href=\"\" class=\"usa-current\">Grandchild link</a> + ;; </li><li class=\"usa-sidenav__item\"> + ;; <a href=\"\">Grandchild link</a> + ;; </li> + ;; </ul> + ;; </li><li class=\"usa-sidenav__item\"> + ;; <a href=\"\">Child link</a> + ;; </li><li class=\"usa-sidenav__item\"> + ;; <a href=\"\">Child link</a> + ;; </li><li class=\"usa-sidenav__item\"> + ;; <a href=\"\">Child link</a> + ;; </li> + ;; </ul> + ;; </li><li class=\"usa-sidenav__item\"> + ;; <a href=\"\">Parent link</a> + ;; </li> + ;; </ul> + ;; </nav> + + ;; </div>) + contents + (or (ox-html-uswds--expand-macros (plist-get info :html-footer) info) "") + "<script src=\"../assets/uswds-2.10.1/js/uswds.min.js\"></script>" newline + "</body>" newline + "</html>"))) + +;; plain text + +(defun ox-html-uswds-plain-text (plain-text info) + "Transcode a PLAIN-TEXT string from Org to HTML. + +PLAIN-TEXT is the string to transcode. +INFO is a plist holding contextual information." + (org-html-encode-plain-text plain-text)) + +;; attributes + +(defun ox-html-uswds--attr (element &optional property) + "Return ELEMENT's html attribute properties as a string. + +When optional argument PROPERTY is non-nil, return the value of +that property within attributes." + (let ((attributes (org-export-read-attribute :attr_html element property))) + (if attributes (concat " " (org-html--make-attribute-string attributes)) ""))) + +;; is an immediate child of [element]? + +(defun ox-html-uswds--immediate-child-of-p (element container-type) + "Is ELEMENT an immediate child of an org CONTAINER-TYPE element?" + (let ((container (org-export-get-parent element))) + (and (eq (org-element-type container) container-type) + (= (org-element-property :begin element) + (org-element-property :contents-begin container))))) + +;; has an immediate child of [element-type]? + +(defun ox-html-uswds--has-immediate-child-of-p (element element-type) + "Does ELEMENT have an immediate ELEMENT-TYPE child?" + (org-element-map element element-type + (lambda (link) (= (org-element-property :begin link) + (org-element-property :contents-begin element))) + nil t)) + +;; expand macros +;; Macro expansion takes place in a separate buffer - as such buffer local variables +;; are not directly available, which might be important when using self-evaluating +;; macros such as =,#+MACRO: x (eval (fn $1))=. To help with this, the original +;; =buffer-file-name= is shadowed. + +(defun ox-html-uswds--expand-macros (contents info) + "Return CONTENTS string, with macros expanded. + +CONTENTS is a string, optionally with {{{macro}}} +tokens. INFO is a plist holding export options." + (if (cl-search "{{{" contents) + (let* ((author (org-element-interpret-data (plist-get info :author))) + (date (org-element-interpret-data (plist-get info :date))) + (email (or (plist-get info :email) "")) + (title (org-element-interpret-data (plist-get info :title))) + (export-specific-templates + (list (cons "author" author) + (cons "date" + (format "(eval (format-time-string \"$1\" '%s))" + (org-read-date nil t date nil))) + (cons "email" email) + (cons "title" title))) + (templates (org-combine-plists export-specific-templates + org-macro-templates)) + (buffer-name buffer-file-name)) + (with-temp-buffer (insert contents) + (let ((buffer-file-name buffer-name)) + (org-macro-replace-all templates)) + (buffer-string))) + contents)) + +;; org-mode publishing function +;; #+BEGIN_EXAMPLE +;; (setq org-publish-project-alist +;; '(("project-name" +;; :base-directory "~/src" +;; :publishing-directory "~/public" +;; :publishing-function ox-html-uswds-publish-to-html))) +;; #+END_EXAMPLE + +;;;###autoload +(defun ox-html-uswds-publish-to-html (plist filename pub-dir) + "Publish an org file to HTML adapted for the USWDS. + +PLIST is the property list for the given project. FILENAME +is the filename of the Org file to be published. PUB-DIR is +the publishing directory. + +Return output file name." + (let ((html-extension (or (plist-get plist :html-extension) org-html-extension))) + (org-publish-org-to 'html-uswds + filename + (when (and html-extension (not (string= "" html-extension))) + (concat "." html-extension)) + plist + pub-dir))) + +;; org-export backend definition +(org-export-define-backend + 'html-uswds + '((bold . ox-html-uswds-bold) + (example-block . ox-html-uswds-example-block) + (export-block . ox-html-uswds-export-block) + (export-snippet . ox-html-uswds-export-snippet) + (headline . ox-html-uswds-headline) + (inner-template . ox-html-uswds-inner-template) + (italic . ox-html-uswds-italic) + (item . org-html-item) + (link . ox-html-uswds-link) + (paragraph . ox-html-uswds-paragraph) + (plain-list . ox-html-uswds-plain-list) + (plain-text . ox-html-uswds-plain-text) + (section . ox-html-uswds-section) + (special-block . ox-html-uswds-special-block) + (src-block . ox-html-uswds-src-block) + (template . ox-html-uswds-template) + (verbatim . ox-html-uswds-verbatim)) + :menu-entry + '(?u "Export to html-uswds" + ((?U "As html-uswds buffer" ox-html-uswds-export-as-html) + (?u "As html-uswds file" ox-html-uswds-export-to-html))) + :options-alist + '((:html-extension "HTML_EXTENSION" nil org-html-extension) + (:html-link-org-as-html nil "html-link-org-files-as-html" org-html-link-org-files-as-html) + (:html-doctype "HTML_DOCTYPE" nil org-html-doctype) + (:html-container "HTML_CONTAINER" nil org-html-container-element t) + (:html-link-use-abs-url nil "html-link-use-abs-url" org-html-link-use-abs-url) + (:html-link-home "HTML_LINK_HOME" nil org-html-link-home) + (:html-preamble "HTML_PREAMBLE" nil "" newline) + (:html-postamble "HTML_POSTAMBLE" nil "" newline) + (:html-head "HTML_HEAD" nil org-html-head newline) + (:html-head-extra "HTML_HEAD_EXTRA" nil org-html-head-extra newline) + (:html-header "HTML_HEADER" nil "" newline) + (:html-footer "HTML_FOOTER" nil "" newline) + (:html-title "HTML_TITLE" nil "%t" t) + (:html-body-attr "HTML_BODY_ATTR" nil "" t))) + +;;;###autoload +(defun ox-html-uswds-export-as-html + (&optional async subtreep visible-only body-only ext-plist) + "Export current buffer to a HTML-USWDS buffer. + +Export as `org-html-export-as-html' does, with html-uswds +org-export-backend. + +If narrowing is active in the current buffer, only export its +narrowed part. + +If a region is active, export that region. + +A non-nil optional argument ASYNC means the process should happen +asynchronously. The resulting buffer should be accessible +through the `org-export-stack' interface. + +When optional argument SUBTREEP is non-nil, export the sub-tree +at point, extracting information from the headline properties +first. + +When optional argument VISIBLE-ONLY is non-nil, don't export +contents of hidden elements. + +When optional argument BODY-ONLY is non-nil, only write code +between \"<body>\" and \"</body>\" tags. + +EXT-PLIST, when provided, is a property list with external +parameters overriding Org default settings, but still inferior to +file-local settings. + +Export is done in a buffer named \"*Org HTML-USWDS export*\", which +will be displayed when `org-export-show-temporary-export-buffer' +is non-nil." + (interactive) + (org-export-to-buffer 'html-uswds "*Org HTML-USWDS Export*" + async subtreep visible-only body-only ext-plist + (lambda () (set-auto-mode t)))) + +;;;###autoload +(defun ox-html-uswds-export-to-html (&optional async subtreep visible-only body-only ext-plist) + "Export current buffer to an HTML file. + +Export as `org-html-export-as-html' does, with html-uswds +org-export-backend. + +If narrowing is active in the current buffer, only export its +narrowed part. + +If a region is active, export that region. + +A non-nil optional argument ASYNC means the process should happen +asynchronously. The resulting file should be accessible through +the `org-export-stack' interface. + +When optional argument SUBTREEP is non-nil, export the sub-tree +at point, extracting information from the headline properties +first. + +When optional argument VISIBLE-ONLY is non-nil, don't export +contents of hidden elements. + +When optional argument BODY-ONLY is non-nil, only write code +between \"<body>\" and \"</body>\" tags. + +EXT-PLIST, when provided, is a property list with external +parameters overriding Org default settings, but still inferior to +file-local settings. + +Return output file's name." + (interactive) + (let* ((extension (concat "." (or (plist-get ext-plist :html-extension) + org-html-extension + "html"))) + (file (org-export-output-file-name extension subtreep)) + (org-export-coding-system org-html-coding-system)) + (org-export-to-file 'html-uswds file + async subtreep visible-only body-only ext-plist))) + +(provide 'ox-html.uswds) +;;; ox-html-uswds.el ends here diff --git a/site/page-header.html b/site/page-header.html new file mode 100644 index 0000000..ff5670b --- /dev/null +++ b/site/page-header.html @@ -0,0 +1,103 @@ +<section class="usa-banner" aria-label="Accessible website"> + <div class="usa-accordion"> + + <header class="usa-banner__header"> + <div class="usa-banner__inner"> + <div class="grid-col-auto"> + <img class="usa-banner__header-flag" src="assets/uswds-2.10.1/img/us_flag_small.png" alt="U.S. flag"> + </div> + <div class="grid-col-fill tablet:grid-col-auto"> + <p class="usa-banner__header-text">Proudly designed with the U.S. Web Design System.</p> + <p class="usa-banner__header-action" aria-hidden="true">Here's how you know</p> + </div> + <button class="usa-accordion__button usa-banner__button" aria-expanded="false" aria-controls="gov-banner"> + <span class="usa-banner__button-text">Here's how you know</span> + </button> + </div> + </header> + + <div class="usa-banner__content usa-accordion__content" id="gov-banner"> + <div class="grid-row grid-gap-lg"> + <div class="usa-banner__guidance tablet:grid-col-6"> + <img class="usa-banner__icon usa-media-block__img" src="assets/uswds-2.10.1/img/icon-dot-gov.svg" role="img" alt="" aria-hidden="true"> + <div class="usa-media-block__body"> + <p> + <strong>Design for democracy</strong> + <br/> + The <a href="https://designsystem.digital.gov/">U.S. Web Design System</a> emphasizes universal accessibility. + </p> + </div> + </div> + <div class="usa-banner__guidance tablet:grid-col-6"> + <img class="usa-banner__icon usa-media-block__img" src="assets/uswds-2.10.1/img/icon-https.svg" role="img" alt="" aria-hidden="true"> + <div class="usa-media-block__body"> + <p> + <strong>Secure .gov websites use HTTPS</strong> + <br/> + This website will soon feature identical protection features! + </p> + </div> + </div> + </div> + </div> + + </div> +</section> + +<header class="usa-header usa-header--extended sd-header"> + <div class="usa-navbar"> + <div class="usa-logo" id="extended-logo"> + <em class="usa-logo__text"><a href="index.html" title="Home" aria-label="Home">Smart Documents</a></em> + </div> + <button class="usa-menu-btn">Menu</button> + </div> + + <nav aria-label="Primary navigation" class="usa-nav"> + <div class="usa-nav__inner"> + + <button class="usa-nav__close"> + <img src="assets/img/usa-icons/close.svg" role="img" alt="close"> + </button> + + <ul class="usa-nav__primary usa-accordion"> + + <li class="usa-nav__primary-item"> + <button class="usa-accordion__button usa-nav__link" aria-expanded="false" aria-controls="extended-nav-section-two"> + <span>Features</span> + </button> + <ul id="extended-nav-section-two" class="usa-nav__submenu"> + <li class="usa-nav__submenu-item"><a href="#" class=""> wan</a></li> + <li class="usa-nav__submenu-item"><a href="#" class=""> tu</a></li> + <li class="usa-nav__submenu-item"><a href="#" class=""> mute</a></li> + </ul> + </li> + + <li class="usa-nav__primary-item"> + <a class="usa-nav__link" href="original-paper.html"><span>The original paper</span></a> + </li> + + <li class="usa-nav__primary-item"> + <a class="usa-nav__link" href="jobs.html"><span>I am...</span></a> + </li> + + <li class="usa-nav__primary-item"> + <a class="usa-nav__link" href="about.html"><span>About</span></a> + </li> + + </ul> + + <div class="usa-nav__secondary"> + <ul class="usa-nav__secondary-links"> + <li class="usa-nav__secondary-item"><a href="">Contact</a></li> + <li class="usa-nav__secondary-item"><a href="">Contribute</a></li> + </ul> + + <form class="usa-search usa-search--small " role="search"> + <label class="usa-sr-only" for="extended-search-field-small">Search small</label> + <input class="usa-input" id="extended-search-field-small" type="search" name="search"> + <button class="usa-button" type="submit"><span class="usa-sr-only">Search</span></button> + </form> + </div> + </div> + </nav> +</header> diff --git a/site/posts/test.org b/site/posts/test.org new file mode 100644 index 0000000..59c0930 --- /dev/null +++ b/site/posts/test.org @@ -0,0 +1,23 @@ +# -*- mode: org; -*- + +#+TITLE: First Post +#+AUTHOR: Marius Peter +#+DATE: <2021-03-28 Sun> + +#+INCLUDE: page-header.html export html + +#+begin_export html +<div class="usa-section"> + <div class="grid-container"> + <div class="grid-row grid-gap"> + <main class="usa-layout-docs__main desktop:grid-col-9 usa-prose usa-layout-docs" id="main-content"> +#+end_export + +In this post, I wanted to talk about a couple of things. + +#+begin_export html + </main> + </div> + </div> +</div> +#+end_export diff --git a/site/publish.el b/site/publish.el new file mode 100644 index 0000000..e8248f0 --- /dev/null +++ b/site/publish.el @@ -0,0 +1,74 @@ +;;; publish.el --- Publish the Smart Documents website. + +;; Copyright (C) 2021 Marius Peter + +;; Author: Marius Peter + +;;; Commentary: + +;; This file is intended to be run as a script for the Makefile used +;; to generate the Smart Documents website. + +;;; Code: + +(require 'ox-publish) +(load-file "./ox-html-uswds.el") + +;; (let ((publishing-location "~/Documents/www/")) +(let ((publishing-location "/ssh:root@192.162.71.223:/var/www/smart-documents.org/")) + (setq org-publish-project-alist + `(("page" + :base-directory "." + :base-extension "org" + :publishing-directory ,publishing-location + :recursive nil ; Top-level pages are all in top-level org directory. + :publishing-function ox-html-uswds-publish-to-html + :auto-sitemap t) + ("page-media" + :base-directory "assets/images/" + :base-extension "jpg\\|gif\\|png\\|svg\\|mp3" + :publishing-directory ,(concat publishing-location "assets/images/") + :recursive t + :publishing-function org-publish-attachment) + ("posts" + :base-directory "posts/" + :base-extension "org" + :publishing-directory ,(concat publishing-location "posts/") + :recursive t + :publishing-function ox-html-uswds-publish-to-html) + ("css" + :base-directory "assets/" + :base-extension "css\\|map" + :publishing-directory ,(concat publishing-location "assets/") + :publishing-function org-publish-attachment + :recursive t) + ("js" + :base-directory "assets/" + :base-extension "js" + :publishing-directory ,(concat publishing-location "assets/") + :publishing-function org-publish-attachment + :recursive t) + ("fonts" + :base-directory "assets/" + :base-extension "ttf\\|woff2" + :publishing-directory ,(concat publishing-location "assets/") + :publishing-function org-publish-attachment + :recursive t) + ("img" + :base-directory "assets/uswds-2.10.1/" + :base-extension "png\\|svg" + :publishing-directory ,(concat publishing-location "assets/uswds-2.10.1/") + :publishing-function org-publish-attachment + :recursive t) + ("content" + :components ("page" + "page-media")) + ("assets" + :components ("css" + "js" + "fonts" + "img")) + ("all" :components ("content" "assets"))))) + +(provide 'publish) +;;; publish.el ends here diff --git a/site/sitemap.html b/site/sitemap.html new file mode 100644 index 0000000..e69de29 --- /dev/null +++ b/site/sitemap.html diff --git a/site/sitemap.org b/site/sitemap.org new file mode 100644 index 0000000..143e087 --- /dev/null +++ b/site/sitemap.org @@ -0,0 +1,6 @@ +#+TITLE: Sitemap for project page + +- [[file:about.org][About]] +- [[file:jobs.org][My job is...]] +- [[file:index.org][Smart Documents]] +- [[file:original-paper.org][The Original Paper]]
\ No newline at end of file |
