Make docs site (jrnl.sh) fully meet Web Content Accessibility Guidelines (WCAG) 2.1 (#1105)

* add some attribtutes to docs template for accessbility

* fix colors to meet accessibility guidelines (4.5 contrast ratio for text)

* Fix last remaining pa11y error (no button on search form)

This fix required moving the mkdocs theme out of the docs directory.
It's no in the docs_theme directory, and the mkdocs config is updated
accordingly.

* Re-enable accessibility testing for docs sit

Also, move the pa11y script into the gh actions workflow

* clean up linting issues in css

* fix and standardize link colors across site

* fix twitter button opacity making text fail contrast requirements

* move buttons on docs site index nav, tweak font weights

* fix footer opacity, tweak spacing of the now more visible sections of the page

* change font sizes on index page to meet WCAG

* udpate font sizes site-wide for accessibility

* fix sidebar for accessibility (font sizes and color contrasts)

* restyle code blocks to have dark background, and meet accessibility requirements

* standardize (accessible) colors across docs site
This commit is contained in:
Jonathan Wren 2020-12-12 12:05:12 -08:00 committed by GitHub
parent 42c222a6c8
commit 558d331d66
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
29 changed files with 835 additions and 644 deletions

2
docs_theme/CNAME Normal file
View file

@ -0,0 +1,2 @@
jrnl.sh

View file

@ -0,0 +1,28 @@
:root {
/* For dark bg */
--white: #fcfcfc;
--off-white: #f4f0ff;
--purple: #7e57c2;
--light-purple: #cf93e6;
--blue: #61aeee;
--green: #a6e22e;
--orange: #fd971f;
--red: #eb5567;
--pink: #d57699;
--yellow: #e2b93d;
/* For light bg */
--teal: #2a8068;
--dark-blue: #356eb7;
--mid-purple: #92679b;
--bright-purple: #af27ad;
--dark-purple: #604385;
--darkest-purple: #251A32;
--grey: #3b3b4a;
--black-shadow: #0000001A;
--blacker-shadow: #00000059;
/* Special cases */
--terminal: #1b1c2e;
}

View file

@ -0,0 +1,130 @@
/*
Atom One Dark With support for ReasonML by Gidi Morris, based off work by
Daniel Gamage
Original One Dark Syntax theme from https://github.com/atom/one-dark-syntax
*/
.hljs {
display: block;
overflow-x: auto;
padding: 0.5em;
line-height: 1.3em;
color: var(--off-white);
background: #383e49;
border-radius: 5px;
font-size: 0.9rem;
line-height: 1.3rem;
}
.hljs-keyword,
.hljs-operator {
color: var(--pink);
}
.hljs-pattern-match {
color: var(--pink);
}
.hljs-pattern-match .hljs-constructor {
color: var(--blue);
}
.hljs-function {
color: var(--blue);
}
.hljs-function .hljs-params {
color: var(--green);
}
.hljs-function .hljs-params .hljs-typing {
color: var(--orange);
}
.hljs-module-access .hljs-module {
color: var(--purple);
}
.hljs-constructor {
color: var(--yellow);
}
.hljs-constructor .hljs-string {
color: var(--green);
}
.hljs-comment,
.hljs-quote {
color: var(--light-purple);
font-style: italic;
}
.hljs-doctag,
.hljs-formula {
color: var(--purple);
}
.hljs-section,
.hljs-name,
.hljs-selector-tag,
.hljs-deletion,
.hljs-subst {
color: var(--yellow);
}
.hljs-literal {
color: var(--blue);
}
.hljs-string,
.hljs-regexp,
.hljs-addition,
.hljs-attribute,
.hljs-meta-string {
color: var(--green);
}
.hljs-built_in,
.hljs-class .hljs-title {
color: var(--orange);
}
.hljs-attr,
.hljs-variable,
.hljs-template-variable,
.hljs-type,
.hljs-selector-class,
.hljs-selector-attr,
.hljs-selector-pseudo,
.hljs-number {
color: var(--orange);
}
.rst-content a tt,
.rst-content a tt,
.rst-content a code {
color: var(--blue);
}
.hljs-number,
.hljs-literal,
.hljs-variable,
.hljs-template-variable,
.hljs-tag .hljs-attr {
color: var(--blue);
}
.hljs-tag {
color: var(--pink)
}
.hljs-symbol,
.hljs-bullet,
.hljs-link,
.hljs-meta,
.hljs-selector-id,
.hljs-title {
color: var(--blue);
}
.hljs-emphasis {
font-style: italic;
}
.hljs-strong {
font-weight: bold;
}
.hljs-link {
text-decoration: underline;
}
.rst-content .note .admonition-title {
background: var(--dark-blue);
}
.rst-content .tip .admonition-title {
background: var(--teal);
}

317
docs_theme/assets/index.css Normal file
View file

@ -0,0 +1,317 @@
/* reset */article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,video{display:inline-block}audio:not([controls]){display:none;height:0}[hidden]{display:none}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}a:focus{outline:thin dotted}a:active,a:hover{outline:0}h1{font-size:2em;margin:.67em 0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}mark{background:#ff0;color:#000}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em}pre{white-space:pre-wrap}q{quotes:"\201C" "\201D" "\2018" "\2019"}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:0}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0}button,input{line-height:normal}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0}
body {
background-color: var(--white);
font-family: "Open Sans", "Helvetica Neue", sans-serif;
font-weight: 300;
}
.icon {
background-image: url("img/sprites.svg");
width: 32px;
height: 32px;
display: inline-block;
font-size: 40px;
background-size: 200px 80px;
}
h3 {
font-weight: 400;
}
.icon.secure {
background-position: 0em 0em;
}
.icon.future {
background-position: -1em 0em;
}
.icon.search {
background-position: -2em 0em;
}
.icon.nli {
background-position: -3em 0em;
}
.icon.share {
background-position: 0em -1em;
}
.icon.sync {
background-position: 0 -1em;
}
.icon.dayone {
background-position: -1em -1em;
}
.icon.github {
background-position: -2em -1em;
}
.icon.search {
background-position: -2em 0;
}
.icon.folders {
background-position: -3em -1em;
}
.icon.twitter {
background-position: -4em -1em;
}
header {
background-image: linear-gradient(211deg, var(--mid-purple) 0%, var(--dark-purple) 100%);
color: var(--white);
border: 0px solid transparent;
display: relative;
padding-top: 150px;
overflow: visible;
}
#terminal {
background: var(--terminal);
max-width: 520px;
box-shadow: 0 -2px 16px 0 var(--black-shadow);
border-radius: 6px;
min-height: 120px;
margin: 0px auto;
position: relative;
transform: translateY(75px);
color: var(--off-white);
font-family: "Monaco", "Courier New";
font-size: 18px;
padding: 45px 20px 0px 20px;
line-height: 165%;
}
#terminal b {
font-weight: normal;
color: var(--off-white);
}
#terminal i {
font-style: normal;
color: var(--light-purple);
}
#terminal:before {
content: "";
position: absolute;
top: 15px;
left: 15px;
display: inline-block;
width: 15px;
height: 15px;
border-radius: 50%;
background: var(--grey);
box-shadow: 25px 0 0 var(--grey), 50px 0 0 var(--grey);
}
#typed:before {
content: "$ ";
color: var(--mid-purple);
}
#twitter {
display: block;
position: absolute;
text-decoration: none;
top: 20px;
right: 20px;
border: 1px solid var(--white);
padding: 5px 10px;
color: var(--white);
border-radius: 3px;
}
#twitter .icon {
transform: scale(0.5);
vertical-align: -18%;
margin: 0;
padding: 0;
}
#twitter:hover,
#twitter:active {
text-decoration: none;
box-shadow: 0 2px 25px 0 var(--black-shadow);
transition: all .5s ease;
}
#title {
max-width: 630px;
margin: 0 auto;
padding: 0px 20px;
}
#prompt {
max-width: 700px;
margin: 25px auto 100px auto;
padding: 0px 20px;
}
header img {
float: left;
margin-right: 30px;
}
h1 {
color: var(--white);
font-weight: 300;
}
a,
a:visited {
color: var(--dark-purple);
}
a:hover {
color: var(--bright-purple);
}
nav {
text-align: center;
}
nav a#twitter-nav {
display: none;
}
nav a, nav a:visited {
color: var(--dark-purple);
font-size: 20px;
line-height: 2.5em;
margin: 0 40px;
font-weight: 400;
text-decoration: none;
}
nav a:hover,
nav a:visited:hover {
color: var(--bright-purple);
text-decoration: underline;
}
nav a.cta {
display: inline-block;
color: var(--white);
background-image: linear-gradient(259deg, var(--mid-purple) 0%, var(--dark-purple) 100%);
box-shadow: 0 2px 8px 0 var(--blacker-shadow);
border-radius: 50px;
padding: 0 2em;
white-space: nowrap;
transition: all 0.1s ease;
text-decoration: none;
}
nav a.cta:hover {
text-decoration: none;
background-image: linear-gradient(259deg, var(--bright-purple) 0%, var(--dark-purple) 100%);
box-shadow: 0 4px 16px 0 var(--black-shadow);
color: var(--off-white);
}
main {
padding: 60px 0 0 0;
}
.flex {
display: flex;
margin: 0 auto;
max-width: 920px;
flex-wrap: wrap;
padding: 20px 20px;
padding-top: 30px;
justify-content: space-between;
}
.flex section {
/*margin: 20px;*/
margin-top: 40px;
width: 32%;
}
.flex section:first-child {
margin-left: 0px;
}
.flex section:last-child {
margin-right: 0px;
}
.flex section i {
float: left;
left: 0;
display: block;
margin: 0px auto 10px auto;
}
.flex section h3 {
margin-top: 0;
font-size: 18px;
color: var(--dark-purple);
margin-bottom: 0.5em;
font-weight: 300;
margin-left: 40px;
}
.flex section p {
padding-left: 40px;
color: var(--grey);
font-size: 16px;
margin: 0;
}
footer {
color: var(--grey);
max-width: 700px;
margin: 70px auto 20px;
padding: 0 20px 20px 20px;
font-size: 16px;
text-align: center;
}
@media screen and (max-width: 680px) {
.flex {
display: block;
padding: 0;
}
.flex section {
width: 100%;
}
main {
padding: 20px;
margin: 0;
width: calc(100% - 40px);
}
nav a,
nav a#twitter-nav {
display: inline-block;
margin: 0px 10px;
}
nav a.cta {
display: block;
margin: 20px;
}
header #twitter {
display: none;
}
header #logo {
display: block;
float: none;
margin: 0px auto;
}
header #title br {
display: none;
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 43 KiB

311
docs_theme/assets/theme.css Normal file
View file

@ -0,0 +1,311 @@
/* ------------------------------------------------------------ */
/* Overrides for jrnl theme */
/* ------------------------------------------------------------ */
body.wy-body-for-nav,
section.wy-nav-content-wrap {
background-color: var(--white);
}
.rst-content pre {
background-color: transparent;
border: none;
margin: 1em -1em;
}
.rst-content code {
color: var(--darkest-purple);
background-color: var(--off-white);
font-size: 15px;
}
.rst-content pre code {
color: var(--off-white);
background: var(--darkest-purple);
padding: 1em 1.5em;
border-radius: 15px;
border: none;
font-size: 16px;
line-height: 1.5em;
font-weight: 200 !important;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: "Open Sans", "Helvetica Neue", Helvetica, sans-serif;
font-weight: 600;
margin-top: 2rem;
margin-bottom: 0.2rem;
}
h2 {
font-size: 1.2em;
margin-top: 40px;
}
p,
td,
tr,
div,
li {
font-family: "Open Sans", "Helvetica Neue", Helvetica, sans-serif;
font-weight: 00;
font-size: 18px;
line-height: 1.5em;
}
p {
margin: 1em 0em;
}
/* No-one likes lines that are 400 characters long. */
div.rst-content {
max-width: 54em;
}
.wy-side-nav-search,
.wy-menu-vertical li.current {
background-color: transparent;
}
.wy-nav-top {
background-image: linear-gradient(-211deg, var(--light-purple) 0%, var(--dark-purple) 100%);
}
.wy-nav-top .fa-bars {
line-height: 50px;
}
.wy-side-nav-search a.icon-home {
width: 100%;
max-width: 250px;
background-size: 100%;
}
a.icon-home:before {
display: block;
width: 84px;
height: 70px;
content: "";
background: url(../img/logo_white.svg) center center no-repeat;
margin: 10px auto;
}
.wy-menu-vertical a,
.wy-menu-vertical li ul li a {
font-size: 16px;
color: var(--off-white);
line-height: 2em;
}
.wy-menu-vertical a:hover {
background-color: var(--black-shadow);
color: var(--white);
}
.wy-menu-vertical li.on a {
transition: all .25s ease;
background: var(--dark-purple);
color: var(--white);
position: relative;
}
.wy-menu-vertical li.current>a {
background: var(--darkest-purple);
border: none !important;
}
.wy-menu-vertical li.current>a:hover {
background: var(--darkest-purple);
border: none;
}
.wy-menu-vertical li.on a,
.wy-menu-vertical li.current a {
border-right: none;
}
.wy-menu-vertical li.on a,
.wy-menu-vertical li.current>a:after {
position: absolute;
right: 0em;
z-index: 999;
content: "";
width: 0;
height: 0;
border-top: 1em solid transparent;
border-bottom: 1em solid transparent;
border-right: 1em solid var(--white);
}
.wy-menu-vertical li li.toctree-l2 {
font-weight: 800 !important;
font-size: 50px;
color: red !important;
}
.toctree-expand:before {
display: none !important;
}
.rst-versions,
.rst-versions .rst-current-version {
display: none;
}
.wy-menu-vertical span {
color: var(--white);
font-size: 1.2em;
font-weight: 300;
}
.wy-menu-vertical li a {
color: var(--off-white) !important;
font-weight: 300;
}
.wy-nav-side {
background-image: linear-gradient(211deg, var(--mid-purple) 0%, var(--dark-purple) 100%);
font-weight: 300;
height: 100%;
}
footer {
display: none;
}
.wy-side-nav-search input[type=text],
form .search-query {
background-color: var(--black-shadow) !important;
border: none;
box-shadow: none;
margin-bottom: 1em;
color: var(--white);
font-weight: 500;
}
.wy-side-nav-search input[type=text]::placeholder,
form .search-query::placeholder {
color: var(--off-white);
}
.wy-side-nav-search > a:hover {
background: transparent;
}
.toctree-l2 a:first-child {
display: none;
}
/* ------------------------------------------------------------ */
/* Logo: ; */
/* ------------------------------------------------------------ */
.logo {
width: 128px;
height: 128px;
vertical-align: middle;
margin-right: 1em;
}
/* ------------------------------------------------------------ */
/* Code blocks in callouts */
/* ------------------------------------------------------------ */
div.admonition {
border-radius: 5px;
margin: 1em -1em;
}
div.admonition p.admonition-title {
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
div.admonition>p {
padding: 0em .5em;
}
div.admonition div.highlight {
background: none !important;
}
/* ------------------------------------------------------------ */
/* Fancy ordered lists. */
/* ------------------------------------------------------------ */
ol {
counter-reset: li;
margin-left: 0px;
padding: 0;
}
ol li {
list-style: none !important;
margin-bottom: 1.5em;
margin-left: 3em !important;
}
ol>li:before {
content: counter(li);
counter-increment: li;
background-color: var(--sidebar);
border-radius: 50%;
display: block;
float: left;
margin-left: -3em;
margin-top: -.3em;
width: 2em;
height: 2em;
color: var(--dark-purple);
text-align: center;
line-height: 2em;
font-weight: 600;
}
/* ------------------------------------------------------------ */
/* Accessibility-related changes */
/* ------------------------------------------------------------ */
.rst-content div[role="main"] a,
.rst-content div[role="main"] a:visited {
color: var(--mid-purple);
text-decoration: underline;
}
.rst-content div[role="main"] a:hover {
color: var(--bright-purple);
}
.rst-content div[role="navigation"] a,
.rst-content div[role="navigation"] a:visited {
color: var(--mid-purple);
}
.mkdocs-search {
display: flex;
margin-top: 20px;
}
.wy-side-nav-search input[type="text"] {
border-radius: 50px 0 0 50px;
height: 32px;
border-right: none;
}
.mkdocs-search button {
background-color: var(--black-shadow);
border: none;
box-shadow: none;
color: var(--white);
border-radius: 0 50px 50px 0;
height: 32px;
width: 2.5em;
overflow: hidden;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 224 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 175 KiB

BIN
docs_theme/img/favicon.ico Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

View file

@ -0,0 +1,15 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="64px" height="64px" viewBox="0 0 64 64" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 55 (78076) - https://sketchapp.com -->
<title>favicon</title>
<desc>Created with Sketch.</desc>
<defs>
<linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
<stop stop-color="#986B9D" offset="0%"></stop>
<stop stop-color="#664C8B" offset="100%"></stop>
</linearGradient>
</defs>
<g id="favicon" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<path d="M47,9.75231557 L47,37 L42,32 L37,37 L37,7 L25,7 C17.8202983,7 12,12.8202983 12,20 L12,44 C12,51.1797017 17.8202983,57 25,57 L32,57 L32,7 L34,7 L34,57 L39,57 C46.1797017,57 52,51.1797017 52,44 L52,20 C52,15.8373552 50.0435392,12.1316662 47,9.75231557 Z M47.097641,7.37132944 C51.2495133,10.039075 54,14.6983322 54,20 L54,44 C54,49.3016678 51.2495133,53.960925 47.097641,56.6286706 C52.7817736,55.2392133 57,50.1122164 57,44 L57,20 C57,13.8877836 52.7817736,8.76078667 47.097641,7.37132944 Z M16.902359,56.6286706 C12.7504867,53.960925 10,49.3016678 10,44 L10,20 C10,14.6983322 12.7504867,10.039075 16.902359,7.37132944 C11.2182264,8.76078667 7,13.8877836 7,20 L7,44 C7,50.1122164 11.2182264,55.2392133 16.902359,56.6286706 Z M52.097641,7.37132944 C56.2495133,10.039075 59,14.6983322 59,20 L59,44 C59,49.3016678 56.2495133,53.960925 52.097641,56.6286706 C57.7817736,55.2392133 62,50.1122164 62,44 L62,20 C62,13.8877836 57.7817736,8.76078667 52.097641,7.37132944 Z M11.902359,56.6286706 C7.7504867,53.960925 5,49.3016678 5,44 L5,20 C5,14.6983322 7.7504867,10.039075 11.902359,7.37132944 C6.21822638,8.76078667 2,13.8877836 2,20 L2,44 C2,50.1122164 6.21822638,55.2392133 11.902359,56.6286706 Z M15,5 L49,5 C57.2842712,5 64,11.7157288 64,20 L64,44 C64,52.2842712 57.2842712,59 49,59 L15,59 C6.71572875,59 0,52.2842712 0,44 L0,20 C2.0539126e-15,11.7157288 6.71572875,5 15,5 Z" id="Combined-Shape" fill="url(#linearGradient-1)" fill-rule="nonzero"></path>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.1 KiB

View file

@ -0,0 +1,10 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="90px" height="98px" viewBox="0 0 90 98" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 55 (78076) - https://sketchapp.com -->
<title>jrnl_white</title>
<desc>Created with Sketch.</desc>
<g id="jrnl_white" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<path d="M63,5.34786368 L63,43 L58,38 L53,43 L53,5 L30,5 C22.8202983,5 17,10.8202983 17,18 L17,58 C17,65.1797017 22.8202983,71 30,71 L45,71 L45,5 L47,5 L47,71 L60,71 C67.1797017,71 73,65.1797017 73,58 L73,18 C73,11.8528367 68.7334,6.70219128 63,5.34786368 Z M67.6693542,5.10618565 C72.0593056,7.72299627 75,12.5180801 75,18 L75,58 C75,63.4819199 72.0593056,68.2770037 67.6693542,70.8938143 C74.060623,70.0745197 79,64.6140865 79,58 L79,18 C79,11.3859135 74.060623,5.92548026 67.6693542,5.10618565 Z M22.3306458,70.8938143 C17.9406944,68.2770037 15,63.4819199 15,58 L15,18 C15,12.5180801 17.9406944,7.72299627 22.3306458,5.10618565 C15.939377,5.92548026 11,11.3859135 11,18 L11,58 C11,64.6140865 15.939377,70.0745197 22.3306458,70.8938143 Z M73.6693542,5.10618565 C78.0593056,7.72299627 81,12.5180801 81,18 L81,58 C81,63.4819199 78.0593056,68.2770037 73.6693542,70.8938143 C80.060623,70.0745197 85,64.6140865 85,58 L85,18 C85,11.3859135 80.060623,5.92548026 73.6693542,5.10618565 Z M16.3306458,70.8938143 C11.9406944,68.2770037 9,63.4819199 9,58 L9,18 C9,12.5180801 11.9406944,7.72299627 16.3306458,5.10618565 C9.93937703,5.92548026 5,11.3859135 5,18 L5,58 C5,64.6140865 9.93937703,70.0745197 16.3306458,70.8938143 Z M18,3 L72,3 C80.2842712,3 87,9.71572875 87,18 L87,58 C87,66.2842712 80.2842712,73 72,73 L18,73 C9.71572875,73 3,66.2842712 3,58 L3,18 C3,9.71572875 9.71572875,3 18,3 Z" id="Combined-Shape" fill="#FFFFFF" fill-rule="nonzero"></path>
<path d="M24.22,95.092 C24.0293324,95.092 23.7616684,95.0736668 23.417,95.037 C23.0723316,95.0003332 22.7680013,94.9306672 22.504,94.828 L22.856,92.65 C23.1786683,92.7526672 23.5673311,92.804 24.022,92.804 C24.6380031,92.804 25.0706654,92.6243351 25.32,92.265 C25.5693346,91.9056649 25.694,91.3666703 25.694,90.648 L25.694,82.642 L28.356,82.285 L28.356,90.692 C28.356,92.1880075 28.0003369,93.2953297 27.289,94.014 C26.5776631,94.7326703 25.5546733,95.092 24.22,95.092 Z M41.4,84.892 C41.1799989,84.8186663 40.8756686,84.7416671 40.487,84.661 C40.0983314,84.5803329 39.6473359,84.54 39.134,84.54 C38.8406652,84.54 38.5290017,84.569333 38.199,84.628 C37.8689984,84.686667 37.6380007,84.7379998 37.506,84.782 L37.506,94 L34.844,94 L34.844,83.044 C35.3573359,82.8533324 35.9989962,82.6736675 36.769,82.505 C37.5390039,82.3363325 38.3933286,82.252 39.332,82.252 C39.5080009,82.252 39.7133322,82.2629999 39.948,82.285 C40.1826678,82.3070001 40.4173322,82.3363332 40.652,82.373 C40.8866678,82.4096669 41.1139989,82.4536664 41.334,82.505 C41.5540011,82.5563336 41.7299993,82.6039998 41.862,82.648 L41.4,84.892 Z M46.81,82.868 C47.3233359,82.7213326 47.9906626,82.5820007 48.812,82.45 C49.6333374,82.3179993 50.5426617,82.252 51.54,82.252 C52.4786714,82.252 53.2633302,82.3803321 53.894,82.637 C54.5246698,82.893668 55.0269981,83.2529977 55.401,83.715 C55.7750019,84.1770023 56.0389992,84.7343301 56.193,85.387 C56.3470008,86.0396699 56.424,86.7546628 56.424,87.532 L56.424,94 L53.762,94 L53.762,87.95 C53.762,87.3339969 53.7216671,86.8096688 53.641,86.377 C53.5603329,85.9443312 53.4283342,85.5923347 53.245,85.321 C53.0616658,85.0496653 52.8123349,84.8516673 52.497,84.727 C52.1816651,84.6023327 51.7966689,84.54 51.342,84.54 C51.004665,84.54 50.6526685,84.5619998 50.286,84.606 C49.9193315,84.6500002 49.6480009,84.6866665 49.472,84.716 L49.472,94 L46.81,94 L46.81,82.868 Z M66.784,94.22 C65.991996,94.2053333 65.3356693,94.1173341 64.815,93.956 C64.2943307,93.7946659 63.8800015,93.5636682 63.572,93.263 C63.2639985,92.9623318 63.0476673,92.5883356 62.923,92.141 C62.7983327,91.6936644 62.736,91.1840029 62.736,90.612 L62.736,82.692 L65.398,82.252 L65.398,90.106 C65.398,90.4286683 65.4236664,90.6999989 65.475,90.92 C65.5263336,91.1400011 65.6179993,91.3269992 65.75,91.481 C65.8820007,91.6350008 66.0616655,91.7523329 66.289,91.833 C66.5163345,91.9136671 66.8059982,91.9759998 67.158,92.02 L66.784,94.22 Z" id="jrnl" fill="#FFFFFF" fill-rule="nonzero"></path>
</g>
</svg>

After

Width:  |  Height:  |  Size: 4.2 KiB

16
docs_theme/img/logo.svg Normal file
View file

@ -0,0 +1,16 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="90px" height="98px" viewBox="0 0 90 98" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 55 (78076) - https://sketchapp.com -->
<title>logo</title>
<desc>Created with Sketch.</desc>
<defs>
<linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
<stop stop-color="#986B9D" offset="0%"></stop>
<stop stop-color="#664C8B" offset="100%"></stop>
</linearGradient>
</defs>
<g id="logo" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<path d="M63,5.34786368 L63,43 L58,38 L53,43 L53,5 L30,5 C22.8202983,5 17,10.8202983 17,18 L17,58 C17,65.1797017 22.8202983,71 30,71 L45,71 L45,5 L47,5 L47,71 L60,71 C67.1797017,71 73,65.1797017 73,58 L73,18 C73,11.8528367 68.7334,6.70219128 63,5.34786368 Z M67.6693542,5.10618565 C72.0593056,7.72299627 75,12.5180801 75,18 L75,58 C75,63.4819199 72.0593056,68.2770037 67.6693542,70.8938143 C74.060623,70.0745197 79,64.6140865 79,58 L79,18 C79,11.3859135 74.060623,5.92548026 67.6693542,5.10618565 Z M22.3306458,70.8938143 C17.9406944,68.2770037 15,63.4819199 15,58 L15,18 C15,12.5180801 17.9406944,7.72299627 22.3306458,5.10618565 C15.939377,5.92548026 11,11.3859135 11,18 L11,58 C11,64.6140865 15.939377,70.0745197 22.3306458,70.8938143 Z M73.6693542,5.10618565 C78.0593056,7.72299627 81,12.5180801 81,18 L81,58 C81,63.4819199 78.0593056,68.2770037 73.6693542,70.8938143 C80.060623,70.0745197 85,64.6140865 85,58 L85,18 C85,11.3859135 80.060623,5.92548026 73.6693542,5.10618565 Z M16.3306458,70.8938143 C11.9406944,68.2770037 9,63.4819199 9,58 L9,18 C9,12.5180801 11.9406944,7.72299627 16.3306458,5.10618565 C9.93937703,5.92548026 5,11.3859135 5,18 L5,58 C5,64.6140865 9.93937703,70.0745197 16.3306458,70.8938143 Z M18,3 L72,3 C80.2842712,3 87,9.71572875 87,18 L87,58 C87,66.2842712 80.2842712,73 72,73 L18,73 C9.71572875,73 3,66.2842712 3,58 L3,18 C3,9.71572875 9.71572875,3 18,3 Z" id="Combined-Shape" fill="url(#linearGradient-1)" fill-rule="nonzero"></path>
<path d="M24.22,95.092 C24.0293324,95.092 23.7616684,95.0736668 23.417,95.037 C23.0723316,95.0003332 22.7680013,94.9306672 22.504,94.828 L22.856,92.65 C23.1786683,92.7526672 23.5673311,92.804 24.022,92.804 C24.6380031,92.804 25.0706654,92.6243351 25.32,92.265 C25.5693346,91.9056649 25.694,91.3666703 25.694,90.648 L25.694,82.642 L28.356,82.285 L28.356,90.692 C28.356,92.1880075 28.0003369,93.2953297 27.289,94.014 C26.5776631,94.7326703 25.5546733,95.092 24.22,95.092 Z M41.4,84.892 C41.1799989,84.8186663 40.8756686,84.7416671 40.487,84.661 C40.0983314,84.5803329 39.6473359,84.54 39.134,84.54 C38.8406652,84.54 38.5290017,84.569333 38.199,84.628 C37.8689984,84.686667 37.6380007,84.7379998 37.506,84.782 L37.506,94 L34.844,94 L34.844,83.044 C35.3573359,82.8533324 35.9989962,82.6736675 36.769,82.505 C37.5390039,82.3363325 38.3933286,82.252 39.332,82.252 C39.5080009,82.252 39.7133322,82.2629999 39.948,82.285 C40.1826678,82.3070001 40.4173322,82.3363332 40.652,82.373 C40.8866678,82.4096669 41.1139989,82.4536664 41.334,82.505 C41.5540011,82.5563336 41.7299993,82.6039998 41.862,82.648 L41.4,84.892 Z M46.81,82.868 C47.3233359,82.7213326 47.9906626,82.5820007 48.812,82.45 C49.6333374,82.3179993 50.5426617,82.252 51.54,82.252 C52.4786714,82.252 53.2633302,82.3803321 53.894,82.637 C54.5246698,82.893668 55.0269981,83.2529977 55.401,83.715 C55.7750019,84.1770023 56.0389992,84.7343301 56.193,85.387 C56.3470008,86.0396699 56.424,86.7546628 56.424,87.532 L56.424,94 L53.762,94 L53.762,87.95 C53.762,87.3339969 53.7216671,86.8096688 53.641,86.377 C53.5603329,85.9443312 53.4283342,85.5923347 53.245,85.321 C53.0616658,85.0496653 52.8123349,84.8516673 52.497,84.727 C52.1816651,84.6023327 51.7966689,84.54 51.342,84.54 C51.004665,84.54 50.6526685,84.5619998 50.286,84.606 C49.9193315,84.6500002 49.6480009,84.6866665 49.472,84.716 L49.472,94 L46.81,94 L46.81,82.868 Z M66.784,94.22 C65.991996,94.2053333 65.3356693,94.1173341 64.815,93.956 C64.2943307,93.7946659 63.8800015,93.5636682 63.572,93.263 C63.2639985,92.9623318 63.0476673,92.5883356 62.923,92.141 C62.7983327,91.6936644 62.736,91.1840029 62.736,90.612 L62.736,82.692 L65.398,82.252 L65.398,90.106 C65.398,90.4286683 65.4236664,90.6999989 65.475,90.92 C65.5263336,91.1400011 65.6179993,91.3269992 65.75,91.481 C65.8820007,91.6350008 66.0616655,91.7523329 66.289,91.833 C66.5163345,91.9136671 66.8059982,91.9759998 67.158,92.02 L66.784,94.22 Z" id="jrnl" fill="#674C8B" fill-rule="nonzero"></path>
</g>
</svg>

After

Width:  |  Height:  |  Size: 4.5 KiB

View file

@ -0,0 +1,9 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="84px" height="70px" viewBox="0 0 84 70" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 55 (78076) - https://sketchapp.com -->
<title>logo_white</title>
<desc>Created with Sketch.</desc>
<g id="logo_white" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<path d="M60,2.34786368 L60,40 L55,35 L50,40 L50,2 L27,2 C19.8202983,2 14,7.82029825 14,15 L14,55 C14,62.1797017 19.8202983,68 27,68 L42,68 L42,2 L44,2 L44,68 L57,68 C64.1797017,68 70,62.1797017 70,55 L70,15 C70,8.85283673 65.7334,3.70219128 60,2.34786368 Z M64.6693542,2.10618565 C69.0593056,4.72299627 72,9.51808015 72,15 L72,55 C72,60.4819199 69.0593056,65.2770037 64.6693542,67.8938143 C71.060623,67.0745197 76,61.6140865 76,55 L76,15 C76,8.38591347 71.060623,2.92548026 64.6693542,2.10618565 Z M19.3306458,67.8938143 C14.9406944,65.2770037 12,60.4819199 12,55 L12,15 C12,9.51808015 14.9406944,4.72299627 19.3306458,2.10618565 C12.939377,2.92548026 8,8.38591347 8,15 L8,55 C8,61.6140865 12.939377,67.0745197 19.3306458,67.8938143 Z M70.6693542,2.10618565 C75.0593056,4.72299627 78,9.51808015 78,15 L78,55 C78,60.4819199 75.0593056,65.2770037 70.6693542,67.8938143 C77.060623,67.0745197 82,61.6140865 82,55 L82,15 C82,8.38591347 77.060623,2.92548026 70.6693542,2.10618565 Z M13.3306458,67.8938143 C8.94069436,65.2770037 6,60.4819199 6,55 L6,15 C6,9.51808015 8.94069436,4.72299627 13.3306458,2.10618565 C6.93937703,2.92548026 2,8.38591347 2,15 L2,55 C2,61.6140865 6.93937703,67.0745197 13.3306458,67.8938143 Z M15,0 L69,0 C77.2842712,-1.33226763e-15 84,6.71572875 84,15 L84,55 C84,63.2842712 77.2842712,70 69,70 L15,70 C6.71572875,70 2.66453526e-15,63.2842712 0,55 L0,15 C-8.8817842e-16,6.71572875 6.71572875,1.33226763e-15 15,0 Z" id="Combined-Shape" fill="#FFFFFF" fill-rule="nonzero"></path>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.9 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 10 KiB

122
docs_theme/index.html Executable file
View file

@ -0,0 +1,122 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jrnl - The Command Line Journal</title>
<meta name="description" content="Collect your thoughts and notes without leaving the command line.">
<meta name="image" content="https://jrnl.sh/img/banner.png">
<meta itemprop="name" content="jrnl - The Command Line Journal">
<meta itemprop="description" content="Collect your thoughts and notes without leaving the command line.">
<meta itemprop="image" content="https://jrnl.sh/img/banner_og.png">
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="jrnl - The Command Line Journal">
<meta name="twitter:description" content="Collect your thoughts and notes without leaving the command line.">
<meta name="twitter:creator" content="jrnl">
<meta name="twitter:image:src" content="https://jrnl.sh/img/banner_twitter.png">
<meta name="og:title" content="jrnl - The Command Line Journal">
<meta name="og:description" content="Collect your thoughts and notes without leaving the command line.">
<meta name="og:image" content="https://jrnl.sh/img/banner_og.png">
<meta name="og:url" content="https://jrnl.sh">
<meta name="og:site_name" content="jrnl - The Command Line Journal">
<meta name="og:type" content="website">
<meta name="viewport" content="width=device-width">
<link href='http://fonts.googleapis.com/css?family=Open+Sans:300,400' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="assets/colors.css">
<link rel="stylesheet" href="assets/index.css">
<link rel="shortcut icon" href="img/favicon.ico">
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "SoftwareApplication",
"applicationCategory": "https://schema.org/LifestyleApplication",
"name": "jrnl",
"description": "Collect your thoughts and notes without leaving the command line.",
"operatingSystem": ["macOS", "Windows", "Linux"],
"thumbnailUrl": "https://jrnl.sh/img/banner_og.png",
"installUrl": "https://jrnl.sh/installation",
"softwareVersion": "2.5"
}
</script>
</head>
<body>
<header>
<aside>
<a id="twitter" href="https://twitter.com/intent/tweet?text=Collect+your+thoughts+and+notes+without+leaving+the+command+line.+https%3A%2F%2Fjrnl.sh+via+@JrnlSh"><i class="icon twitter"></i>Tell your friends</a>
</aside>
<div id="title">
<img id="logo" src="img/jrnl_white.svg" width="90px" height="98px" title="jrnl" alt="jrnl logo" />
<h1>Collect your thoughts and notes <br />without leaving the command line.</h1>
</div>
<div id="prompt">
<div id="terminal">
<div id="typed"></div>
</div>
</div>
</header>
<main>
<nav>
<a href="overview">Documentation</a>
<a href="installation" class="cta">Get Started</a>
<a href="http://github.com/jrnl-org/jrnl" title="View on Github">Fork on GitHub</a>
<a id="twitter-nav" href="https://twitter.com/intent/tweet?text=Collect+your+thoughts+and+notes+without+leaving+the+command+line.+https%3A%2F%2Fjrnl.sh+via+@JrnlSh"><i class="icon twitter"></i>Tell your friends on Twitter</a>
</nav>
<div class="flex">
<section>
<i class="icon nli"></i>
<h3>Human friendly.</h3>
<p>jrnl has a natural-language interface so you don't have to remember cryptic shortcuts when you're writing down your thoughts.</p>
</section>
<section>
<i class="icon future"></i>
<h3>Future-proof.</h3>
<p>Your journals are stored in plain-text files that will still be readable in 50 years when all your fancy iPad apps will have gone the way of the Dodo.</p>
</section>
<section>
<i class="icon secure"></i>
<h3>Secure.</h3>
<p>Encrypt your journals with industry-strength AES encryption. The NSA won't be able to read your dirty secrets.</p>
</section>
<section>
<i class="icon sync"></i>
<h3>Accessible anywhere.</h3>
<p>Sync your journals with Dropbox and capture your thoughts where ever you are.</p>
</section>
<section>
<i class="icon github"></i>
<h3>Free &amp; Open Source.</h3>
<p>jrnl is made by a bunch of really friendly and remarkably attractive people. Maybe even <a href="https://www.github.com/jrnl-org/jrnl" title="Fork jrnl on GitHub">you</a>?</p>
</section>
<section>
<i class="icon folders"></i>
<h3>For work and play.</h3>
<p>Effortlessly access several journals for all parts of your life.</p>
</section>
</div>
</main>
<footer>
jrnl is made with love by <a href="https://github.com/jrnl-org/jrnl/graphs/contributors" title="Contributors">many fabulous people</a>. If you need help, <a href="https://github.com/jrnl-org/jrnl/issues/new/choose" title="Open a new issue on Github">submit an issue</a> on Github.
</footer>
<script src="//cdnjs.cloudflare.com/ajax/libs/typed.js/2.0.10/typed.min.js"></script>
<script>
new Typed("#typed", {
strings: [
"jrnl today: Started writing my memoirs. On the command line. Like a boss.",
"jrnl yesterday 2pm: used jrnl to keep track of accomplished tasks. The done.txt for my todo.txt",
"jrnl <b>-from</b> 2009 <b>-until</b> may<br /><i>`(Displays all entries from January 2009 to last may)`</i>",
"jrnl A day on the beach with @beth and @frank. Taggidy-tag-tag.",
"jrnl <b>--tags</b><br /><i>`@idea 7<br />@beth 5</i>`",
"jrnl <b>--format</b> json<br /><i>`(Outputs your entire journal as json)</i>`",
"jrnl <b>--encrypt</b><br /><i>`(AES encryption. Crack this, NSA)</i>`"
],
typeSpeed: 35,
backSpeed: 15,
backDelay: 2000,
loop: true,
showCursor: false
});
</script>
</body>
</html>

1
docs_theme/index.js Normal file
View file

@ -0,0 +1 @@
var typed2 =

8
docs_theme/main.html Normal file
View file

@ -0,0 +1,8 @@
{% extends "base.html" %}
{% block search_button %}
<form class="mkdocs-search" action="search.html">
<input type="text" name="q" placeholder="Search docs" title="Type search term here">
<button class="icon icon-search" aria-label="submit"></button>
</form>
{% endblock %}

View file

@ -0,0 +1 @@
mkdocs==1.1