diff --git a/CHANGELOG.md b/CHANGELOG.md index ec6da8c6..c1469854 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -3,12 +3,16 @@ Change log For detailed information check [Blogophon's releases on Github](https://github.com/fboes/blogophon/releases). +1.1.1 +----- + * [x] Improving code highlighting by handling strings and comments separately from standard code * [x] Adding `h-entry` microformats and English template language * [x] Added `8<` symbol (for snippets) * [X] Codepen.io integration * [x] More sharing links (Pocket, Tumblr, Wordpress) * [x] JSON for Slack added +* [x] Improved default theme 1.1.0 ----- diff --git a/docs/README.md b/docs/README.md new file mode 100644 index 00000000..911546de --- /dev/null +++ b/docs/README.md @@ -0,0 +1,8 @@ +![Blogophon -](blogophon.png) Documentation +============== + +1. [Markdown](markdown.md): All Blogophon articles are written in Markdown. This document explains how to work with Markdown. +1. [Special features](special-features.md): All features listed here can be activated during installation. +1. [Manual operations](manual.md): You do not have to use `blogophon` to generate your blog. All operations can be done by a bunch of other tools. +1. [Development](development.md): The Blogophon supports the building of custom themes and frontend functionality. You ware free to change the styling of the pages build by the Blogophon. +1. [Advanced stuff](advanced-stuff.md): In this document you will find some stuff for hardcore CLI wizards and server gurus. diff --git a/docs/advanced-stuff.md b/docs/advanced-stuff.md index b087c43f..dbd78124 100644 --- a/docs/advanced-stuff.md +++ b/docs/advanced-stuff.md @@ -81,3 +81,7 @@ In certain environments you may not be able to install the Blogophon globally. T * All commands relating to `blogophon` may now be called by executing `node node_modules/blogophon/index.js` * All commands relating to `blogophon-generate` may now be called by executing `node node_modules/blogophon/generate.js` + +--- + +Return to [table of contents](README.md). diff --git a/docs/development.md b/docs/development.md index 23fedf93..6822cdca 100644 --- a/docs/development.md +++ b/docs/development.md @@ -32,3 +32,7 @@ To develop a new theme follow these steps: 1. Call `blogophon` and choose your new theme `YOUR_THEME_NAME`. 1. Run `gulp` to start the SASS- & JS-compiler. This will also reload your browser on theme changes if you have the [LiveReload plugin](http://livereload.com/extensions/) installed. 1. Start making modifications to your copied theme files. + +--- + +Return to [table of contents](README.md). diff --git a/docs/manual.md b/docs/manual.md index e3f23dd5..f27a5390 100644 --- a/docs/manual.md +++ b/docs/manual.md @@ -33,3 +33,7 @@ If you want to write an article without publishing it, you can append a `~` to y If you want to completely delete an article, you will have to delete all HTML files and Markdown files as well as any images associated with the selected article. After that you will have to generate all pages anew, as the index pages will still link to the deleted article. + +--- + +Return to [table of contents](README.md). diff --git a/docs/markdown.md b/docs/markdown.md index 1a40d97b..0cff0ba1 100644 --- a/docs/markdown.md +++ b/docs/markdown.md @@ -227,3 +227,7 @@ Checkboxes * [X] _Produces a checked checkbox_ ``` + +--- + +Return to [table of contents](README.md). diff --git a/docs/special-features.md b/docs/special-features.md index 2d017e85..d1e2d7c7 100644 --- a/docs/special-features.md +++ b/docs/special-features.md @@ -97,3 +97,7 @@ AJAX Exports all articles as `index.json`. These files may be used for AJAX loading of articles. Exports all indexes as `index.json`, containing references to the AJAX articles. + +--- + +Return to [table of contents](README.md). diff --git a/htdocs/themes/default/css/amp.css b/htdocs/themes/default/css/amp.css index 8a83a381..fd8ef6d6 100644 --- a/htdocs/themes/default/css/amp.css +++ b/htdocs/themes/default/css/amp.css @@ -5,15 +5,17 @@ body { font-family: Arial, sans-serif; line-height: 1.5; } li { margin-left: 1.5em; } body[dir="rtl"] li { margin-right: 1.5em; margin-left: 0; } a { color: #116bfc; } -#container > * { padding-left: 0.5em; padding-right: 0.5em; } -@media screen and (min-width: 640px) { #container > * { padding-left: calc(50vw - (320px) + 0.5em); padding-right: calc(50vw - (320px) + 0.5em); } } +#container > header, #container > div > main, #container > div > aside, #container > footer { padding-left: 0.5em; padding-right: 0.5em; } +@media screen and (min-width: 640px) { #container > header, #container > div > main, #container > div > aside, #container > footer { padding-left: calc(50vw - (320px) + 0.5em); padding-right: calc(50vw - (320px) + 0.5em); } } #container > header { background-color: #116bfc; } #container > header h1 { font-size: 1em; } #container > header a { color: white; text-decoration: none; } #container > aside { border-top: 1px dashed #666666; } #prevnext { text-align: center; padding: 2em 0; } #prevnext a { display: inline-block; padding: 0 1em; } -#footer { color: #666666; border-top: 1px dashed; padding: 1em; font-size: 0.8em; margin-top: 1em; text-align: center; } +#header, #sidebar, #footer { padding-top: 1em; padding-bottom: 1em; } +#sidebar { background-color: #dddddd; border-top: 1px dashed #666666; } +#footer { background-color: #dddddd; color: #666666; font-size: 0.7em; text-align: center; } article header .date { float: right; font-size: 0.8em; } body[dir="rtl"] article header .date { float: left; } article img, article amp-img { float: left; margin: 0 1em 1em 0; max-width: 100%; height: auto; } @@ -35,12 +37,3 @@ article footer a { text-decoration: none; } article address img { width: 2em; } article iframe { width: 100%; overflow: hidden; border: none; } .teasers .modified { display: none; } -pre.code, pre > code { font: 1em/1.3 "Courier New", monospace; color: white; margin-bottom: 1em; padding: 0.5em; background: rgba(0, 0, 0, 0.1); display: block; overflow: scroll; background: #272822; } -pre.code b, pre.code i, pre.code var, pre.code tt, pre.code em, pre.code kbd, pre.code samp, pre.code u, pre > code b, pre > code i, pre > code var, pre > code tt, pre > code em, pre > code kbd, pre > code samp, pre > code u { text-decoration: none; font-style: normal; font-family: inherit; } -pre.code .c1, pre.code b, pre > code .c1, pre > code b { color: #66D9EF; } -pre.code .c2, pre.code i, pre > code .c2, pre > code i { color: #F92672; } -pre.code .c3, pre.code var, pre > code .c3, pre > code var { color: #A6E22E; } -pre.code .c4, pre.code tt, pre.code em, pre > code .c4, pre > code tt, pre > code em { color: #FD971F; } -pre.code .c5, pre.code kbd, pre > code .c5, pre > code kbd { color: #E6DB74; } -pre.code .c6, pre.code samp, pre > code .c6, pre > code samp { color: #AE81FF; } -pre.code .comment, pre.code .comment *, pre.code u, pre.code u *, pre > code .comment, pre > code .comment *, pre > code u, pre > code u * { color: #75715E !important; } diff --git a/htdocs/themes/default/css/styles.css b/htdocs/themes/default/css/styles.css index e5bce1c0..49582c46 100644 --- a/htdocs/themes/default/css/styles.css +++ b/htdocs/themes/default/css/styles.css @@ -11,15 +11,17 @@ a { color: #116bfc; } h1, h2, h3, h4, p, li, tr, img { page-break-inside: avoid; } thead { display: table-header-group; } img { max-width: 100% !important; } } -#container > * { padding-left: 0.5em; padding-right: 0.5em; } -@media screen and (min-width: 640px) { #container > * { padding-left: calc(50vw - (320px) + 0.5em); padding-right: calc(50vw - (320px) + 0.5em); } } +#container > header, #container > div > main, #container > div > aside, #container > footer { padding-left: 0.5em; padding-right: 0.5em; } +@media screen and (min-width: 640px) { #container > header, #container > div > main, #container > div > aside, #container > footer { padding-left: calc(50vw - (320px) + 0.5em); padding-right: calc(50vw - (320px) + 0.5em); } } #container > header { background-color: #116bfc; } #container > header h1 { font-size: 1em; } #container > header a { color: white; text-decoration: none; } #container > aside { border-top: 1px dashed #666666; } #prevnext { text-align: center; padding: 2em 0; } #prevnext a { display: inline-block; padding: 0 1em; } -#footer { color: #666666; border-top: 1px dashed; padding: 1em; font-size: 0.8em; margin-top: 1em; text-align: center; } +#header, #sidebar, #footer { padding-top: 1em; padding-bottom: 1em; } +#sidebar { background-color: #dddddd; border-top: 1px dashed #666666; } +#footer { background-color: #dddddd; color: #666666; font-size: 0.7em; text-align: center; } article header .date { float: right; font-size: 0.8em; } body[dir="rtl"] article header .date { float: left; } article img, article amp-img { float: left; margin: 0 1em 1em 0; max-width: 100%; height: auto; } @@ -62,4 +64,3 @@ pre.code .c4, pre.code tt, pre.code em, pre > code .c4, pre > code tt, pre > cod pre.code .c5, pre.code kbd, pre > code .c5, pre > code kbd { color: #E6DB74; } pre.code .c6, pre.code samp, pre > code .c6, pre > code samp { color: #AE81FF; } pre.code .comment, pre.code .comment *, pre.code u, pre.code u *, pre > code .comment, pre > code .comment *, pre > code u, pre > code u * { color: #75715E !important; } -svg.icon { height: 1em; width: 1em; fill: currentColor; } diff --git a/htdocs/themes/default/sass/_blogophon-styles.scss b/htdocs/themes/default/sass/_article.scss similarity index 87% rename from htdocs/themes/default/sass/_blogophon-styles.scss rename to htdocs/themes/default/sass/_article.scss index 2a01101c..54ddda88 100644 --- a/htdocs/themes/default/sass/_blogophon-styles.scss +++ b/htdocs/themes/default/sass/_article.scss @@ -183,38 +183,31 @@ article { } } } -} -pre.code, -pre > code { - font: 1em/1.3 $fontfamily-monospace; - color: white; - margin-bottom: 1em; - padding: 0.5em; - background: rgba(0,0,0,0.1); - display: block; - overflow: scroll; - background:#272822; - b, i, var, tt, em, kbd, samp, u { - text-decoration: none; - font-style: normal; - font-family: inherit; - } - .c1, b { color: #66D9EF; } // blue - .c2, i { color: #F92672; } // red - .c3, var { color: #A6E22E; } // green - .c4, tt, em { color: #FD971F; } // orange - .c5, kbd { color: #E6DB74; } // yellow - .c6, samp { color: #AE81FF; } // purple - .comment, u { - &, * { color:#75715E !important; } - } -} -@include no-amp { - svg.icon { - height: 1em; - width: 1em; - fill: currentColor; + pre.code, + pre > code { + font: 1em/1.3 $fontfamily-monospace; + color: white; + margin-bottom: 1em; + padding: 0.5em; + background: rgba(0,0,0,0.1); + display: block; + overflow: scroll; + background:#272822; + b, i, var, tt, em, kbd, samp, u { + text-decoration: none; + font-style: normal; + font-family: inherit; + } + .c1, b { color: #66D9EF; } // blue + .c2, i { color: #F92672; } // red + .c3, var { color: #A6E22E; } // green + .c4, tt, em { color: #FD971F; } // orange + .c5, kbd { color: #E6DB74; } // yellow + .c6, samp { color: #AE81FF; } // purple + .comment, u { + &, * { color:#75715E !important; } + } } } diff --git a/htdocs/themes/default/sass/_main.scss b/htdocs/themes/default/sass/_main.scss index 3c29d611..9e181820 100644 --- a/htdocs/themes/default/sass/_main.scss +++ b/htdocs/themes/default/sass/_main.scss @@ -45,7 +45,10 @@ a { } #container { - > * { + > header, + > div > main, + > div > aside, + > footer { padding-left: 0.5em; padding-right: 0.5em; @@ -80,11 +83,21 @@ a { } } +#header, +#sidebar, #footer { + padding-top: 1em; + padding-bottom: 1em; +} + +#sidebar { + background-color: $color-grey; + border-top:1px dashed $color-grey-dark; +} + +#footer { + background-color: $color-grey; color: $color-grey-dark; - border-top: 1px dashed; - padding: 1em; - font-size: 0.8em; - margin-top: 1em; + font-size: 0.7em; text-align: center; } diff --git a/htdocs/themes/default/sass/styles.scss b/htdocs/themes/default/sass/styles.scss index 9dc109a1..ba452cd5 100644 --- a/htdocs/themes/default/sass/styles.scss +++ b/htdocs/themes/default/sass/styles.scss @@ -1,4 +1,4 @@ @import "base"; @import "mixins"; @import "main"; -@import "blogophon-styles"; +@import "article";