From 612ca2d53693f2ba41b6a654a1dc554238787a5a Mon Sep 17 00:00:00 2001 From: Natalia Ventre Date: Wed, 8 Feb 2012 21:58:21 -0200 Subject: added Just Read theme --- Just-Read/.gitignore | 35 +++ Just-Read/less/base.less | 68 +++++ Just-Read/less/main.less | 445 +++++++++++++++++++++++++++++++++ Just-Read/less/mixins.less | 46 ++++ Just-Read/less/print.less | 76 ++++++ Just-Read/less/var.less | 17 ++ Just-Read/pelican.conf.py-sample.py | 10 + Just-Read/psd/bullet.psd | Bin 0 -> 2458 bytes Just-Read/psd/bullet.pxm | Bin 0 -> 20770 bytes Just-Read/psd/line2px.psd | Bin 0 -> 2872 bytes Just-Read/psd/line2px.pxm | Bin 0 -> 29156 bytes Just-Read/psd/pages.psd | Bin 0 -> 22702 bytes Just-Read/psd/pages.pxm | Bin 0 -> 41780 bytes Just-Read/readme.md | 11 + Just-Read/screenshot.png | Bin 0 -> 77147 bytes Just-Read/static/css/main.css | 483 ++++++++++++++++++++++++++++++++++++ Just-Read/static/images/2px.png | Bin 0 -> 186 bytes Just-Read/static/images/bullet.png | Bin 0 -> 194 bytes Just-Read/static/images/pages.png | Bin 0 -> 781 bytes Just-Read/templates/archives.html | 21 ++ Just-Read/templates/article.html | 29 +++ Just-Read/templates/base.html | 65 +++++ Just-Read/templates/categories.html | 1 + Just-Read/templates/category.html | 17 ++ Just-Read/templates/index.html | 26 ++ Just-Read/templates/metadata.html | 12 + Just-Read/templates/page.html | 10 + Just-Read/templates/tag.html | 16 ++ Just-Read/templates/tags.html | 1 + 29 files changed, 1389 insertions(+) create mode 100644 Just-Read/.gitignore create mode 100644 Just-Read/less/base.less create mode 100644 Just-Read/less/main.less create mode 100644 Just-Read/less/mixins.less create mode 100644 Just-Read/less/print.less create mode 100644 Just-Read/less/var.less create mode 100644 Just-Read/pelican.conf.py-sample.py create mode 100644 Just-Read/psd/bullet.psd create mode 100644 Just-Read/psd/bullet.pxm create mode 100644 Just-Read/psd/line2px.psd create mode 100644 Just-Read/psd/line2px.pxm create mode 100644 Just-Read/psd/pages.psd create mode 100644 Just-Read/psd/pages.pxm create mode 100644 Just-Read/readme.md create mode 100644 Just-Read/screenshot.png create mode 100644 Just-Read/static/css/main.css create mode 100644 Just-Read/static/images/2px.png create mode 100644 Just-Read/static/images/bullet.png create mode 100644 Just-Read/static/images/pages.png create mode 100644 Just-Read/templates/archives.html create mode 100644 Just-Read/templates/article.html create mode 100644 Just-Read/templates/base.html create mode 100644 Just-Read/templates/categories.html create mode 100644 Just-Read/templates/category.html create mode 100644 Just-Read/templates/index.html create mode 100644 Just-Read/templates/metadata.html create mode 100644 Just-Read/templates/page.html create mode 100644 Just-Read/templates/tag.html create mode 100644 Just-Read/templates/tags.html (limited to 'Just-Read') diff --git a/Just-Read/.gitignore b/Just-Read/.gitignore new file mode 100644 index 0000000..12a938a --- /dev/null +++ b/Just-Read/.gitignore @@ -0,0 +1,35 @@ +# Compiled source # +################### +*.com +*.class +*.dll +*.exe +*.o +*.so + +# Packages # +############ +# it's better to unpack these files and commit the raw source +# git has its own built in compression methods +*.7z +*.dmg +*.gz +*.iso +*.jar +*.rar +*.tar +*.zip + +# Logs and databases # +###################### +*.log +*.sql +*.sqlite + +# OS generated files # +###################### +.DS_Store* +ehthumbs.db +Icon? +Thumbs.db +.DS_Store diff --git a/Just-Read/less/base.less b/Just-Read/less/base.less new file mode 100644 index 0000000..7d31c62 --- /dev/null +++ b/Just-Read/less/base.less @@ -0,0 +1,68 @@ +// Credits: [HTML Boilerplate[(https://github.com/h5bp/html5-boilerplate) + + +// HTML5 display definitions + +article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, time { + display: block; +} + +// Base + +html { + font-size: 100%; + overflow-y: scroll; + -webkit-text-size-adjust: 100%; + -ms-text-size-adjust: 100%; +} + +body{ + margin: 0; +} + +// Remove text-shadow in selection highlight: h5bp.com/i + +::-moz-selection { + background: #fd7; // This color should play well with any design + color: #000; + text-shadow: none; +} +::selection { + background: #fd7; + color: #000; + text-shadow: none; +} + +// Improve readability when focused and hovered in all browsers: h5bp.com/h + +a:hover, a:active { + outline: 0; +} + +// Lists + +ul, ol{ + margin: 0; + padding: 0; +} + +// Embedded content + +img { + border: 0; + -ms-interpolation-mode: bicubic; + vertical-align: middle; +} + +// Contain floats: h5bp.com/q + +.clearfix:before, .clearfix:after { + content: ""; + display: table; +} +.clearfix:after { + clear: both; +} +.clearfix { + *zoom: 1; +} \ No newline at end of file diff --git a/Just-Read/less/main.less b/Just-Read/less/main.less new file mode 100644 index 0000000..55efa5a --- /dev/null +++ b/Just-Read/less/main.less @@ -0,0 +1,445 @@ +@import "base.less"; +@import "mixins.less"; +@import "var.less"; + +// Credits: [Golden Grid System](http://goldengridsystem.com/) by [Joni Korpi](http://jonikorpi.com/) licensed under [MIT](http://www.opensource.org/licenses/mit-license.php) + +// Important numbers + +@line: 24; +@column: 100% / 18; +@font-size: 16; +@em: @font-size*1em; + + +// Simple fluid media + +figure { + position: relative; +} + +figure img, figure object, figure embed, figure video { + max-width: 100%; + display: block; +} + +// Elastic Object & Iframe Embedded Videos http://webdesignerwall.com/tutorials/css-elastic-videos + +.video-container { + position: relative; + padding-bottom: 56.25%; + padding-top: 30px; + height: 0; + overflow: hidden; + margin-bottom: @line * 1px; +} + +.video-container iframe, +.video-container object, +.video-container embed { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; +} + +// Typography settings - Make the text bigger if you dare + +.small {font-size: 12px;} +.normal {font-size: 14px;} +.large {font-size: 18px;} +.huge {font-size: 24px;} +.massive {font-size: 36px;} +.gigantic {font-size: 48px;} + +body { + .normal; + line-height: @line * 1px; + background: @white; + color: lighten(@black, 25%); + .sans; +} + +.title{ + line-height: 1; + .fancy-font; + font-weight: 700; +} + +h1{ + .title; + .huge; + margin: 0 0 (@line * 1.5px) 0; +} + +h2{ + .title; + .large; + margin: (@line * 2px) 0 (@line * 1px); + +} + +h3{ + .title; + .normal; + margin: (@line * 1.5px) 0 (@line * 1px); + text-transform: uppercase; + color: lighten(@black, 60%); + +} + +h4, h5, h6{ + .title; + .normal; + margin: (@line * 1px) 0; + font-weight: 400; + +} + +b, strong{ + font-weight: 700; +} + + +// Four-column grid active +// ---------------------------------------- +// Margin | # 1 2 3 4 | Margin +// 5.55555% | % 25 50 75 100 | 5.55555% + +.wrapper { + padding: 0 (@line/2)/@em; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + -o-box-sizing: border-box; + box-sizing: border-box; +} + + +a{ + color: @link; + text-decoration: none; + .transition(); + + &:hover{ + color: darken(@link, 40%); + text-decoration:underline; + } +} + +header{ + .border-image(0 0 2px, 0 0 2, '../images/2px.png', repeat); // It's a very small detail, delete this line if you want different colors and don't want to edit the image file + .gradient(@color, darken(@color, 6%)); + padding: (@line * 2px) @column; + margin-bottom: (@line * 2px); + + h1{ + margin: 0; + } + + a{ + text-decoration: none; + color: fade(@white, 80%); + + // The 3d effect is kind of silly, so go ahead and delete the following lines xD + text-shadow: + 0 1px 0 lighten(@black, 70%), + 0 2px 0 lighten(@black, 60%), + 0 3px 0 lighten(@black, 50%), + 0 4px 0 lighten(@black, 40%), + 0 5px 0 lighten(@black, 30%), + 0 6px 0 lighten(@black, 20%), + 0px 7px 0 lighten(@black, 10%), + 0 8px 7px lighten(@black, 5%); + + + &:hover{ + color: @white; + text-decoration:none; + } + } +} + +footer{ + .border-image(20px 0 0, 20 0 0, '../images/pages.png', repeat); // Again, it's a detail. I used border-image to be able to use a gradient or background color for the footer, but now it's white + padding: (@line * 2px) @column (@line * 1px); + margin-top: (@line * 4px); + color: fade(@black, 60%); +} + +.pages{ + margin-bottom: (@line * 1px); +} + +.nav li{ + list-style: none; + display: inline; + padding-right: 10px; +} + +p[role="contentinfo"]{ + margin-top: (@line / 2px); // If you don't use the Twitter button, delete this line + .small; +} + +.content{ + margin:0 @column; +} + +.meta{ + background: lighten(@black, 95%); + padding-top: (@line * 1px); + padding-bottom: (@line * 1px); + .rounded(); +} + +time{ + .small; + text-transform: uppercase; +} + +.tags li{ + display: inline; + list-style: none; +} + +blockquote, code, .post ul, .post ol, p{ + margin: 0 0 (@line * 1px) 0; +} + +blockquote{ + margin-left: -(@line / 2px); + border-left: (@line / 4px) solid @link; + padding-left: (@line / 4px); +} + +code{ + display: block; + background: lighten(@black, 15%); // If you don't a dark scheme for code, we can't be friends + .box-shadow(inset 0 0 10px @black); + padding: (@line * 1px); + color: @white; + .rounded(); + .mono(); + margin-left: -(@line * 1px); +} + +.post ul li{ + list-style-image: url('../images/bullet.png'); // or use something less colorful, like list-style-type: square +} + +.main + .main{ + margin-top: (@line * 4px); +} + +.archive li{ + list-style: none; +} + +.archive a{ + display: block; + padding: (@line / 2px) 0; + border-bottom: 1px dotted lighten(@black, 80%); + + &:hover{ + text-decoration:none; + } +} + +.archive time{ + display: inline; + color: lighten(@black, 40%); +} + + +// Eight-column grid active +// ---------------------------------------------------------------------- +// Margin | # 1 2 3 4 5 6 7 8 | Margin +// 5.55555% | % 12.5 25.0 37.5 50.0 62.5 75.0 87.5 100 | 5.55555% + + +// @media screen and (min-width: 720px) +@media screen and (min-width: 45em) { + + + header .wrapper{ + width: 75%; + float: right; + } + + .meta, .pages{ + width: 25%; + float: left; + text-align: right; + } + + .pages{ + padding-top: 28px + (@line * 1px); // Twitter button size + [role="contentinfo"] margin-top. If you don't use the Twitter button, delete this line + } + + .meta{ + background: @white; + padding-top: 24px + (@line * 1.5px); // h1 font-size + margin-bottom + + time{ + margin-bottom: (@line * 1px); + } + } + + .post, .copy, .main{ + width: 75%; + float: right; + } + + .tags li{ + display: block; + } + + .tags a:hover, .nav a:hover{ + padding-right: (@line / 4px); // If prefer your links to remain still, delete this nonsense + } + + .tags a:hover:after, .nav a:hover:after, .more:hover:after{ + content: "\2192 "; + } + + .nav li{ + display: block; + padding-right: 0; + } + + .archive time{ + display: block; + width: 100/4%; // target 1 columns, context 4 columns + float: left; + } +} + + +// @media screen and (min-width: 888px) +@media screen and (min-width: 55.5em) { + + .post p, .post blockquote, .post ul, .post ol{ + width: 400/6%; // target 4 columns, context 6 columns + } + + .main{ + width: 50%; + float: none; + margin-left: 25%; + } +} + + +// @media screen and (min-width: 984px) +@media screen and (min-width: 61.5em) { + + .meta, .pages{ + width: 12.5%; + } + + .pages{ + padding-top: 0; + } + + .meta{ + padding-top: 24px + (@line * 1.5px); + } + + +} + + +// Sixteen-column grid active +// ---------------------------------------------------------------------------------------------------------------------- +// Margin | # 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 | Margin +// 5.55555% | % 6.25 12.5 18.75 25.0 31.25 37.5 43.75 50.0 56.25 62.5 68.75 75.0 81.25 87.5 93.75 100 | 5.55555% + + +// @media screen and (min-width: 1872px) +@media screen and (min-width: 117em) { + + body{ + .large; + } + + header{ + margin-bottom: (@line * 4px); + } + + footer{ + margin-top: (@line * 6px); + } + + h1{ + .gigantic; + margin-bottom: (@line * 2px); + } + + h2, header .huge{ + .massive; + } + + h2{ + margin-top: (@line * 3px); + } + + h3{ + .huge; + margin-top: (@line * 3px); + } + + h4, h5, h6{ + .large; + margin-top: (@line * 2px); + } + + .meta, .pages{ + width: 18.75%; + padding-left: 6.25%; + } + + .meta{ + padding-top: 48 * 2px; + } + + .post, .copy{ + width: 75%; + } + + .post{ + padding-right: 12.5%; + } + + .post ul{ + margin-bottom: 0; + } + .post li{ + margin-bottom: (@line * 1px); + } + + code{ + .massive; + line-height: 1.5; + } + + .post p, .post blockquote, .post ul, .post ol{ + width: 600/10%; // target 4 columns, context 6 columns + } + +} + + + +// @media screen and (min-width: 2080px) +@media screen and (min-width: 130em) { + + body { + max-width: 2560/@em; + } + +} + +@media print{ + @import "print.less"; +} \ No newline at end of file diff --git a/Just-Read/less/mixins.less b/Just-Read/less/mixins.less new file mode 100644 index 0000000..2e895f9 --- /dev/null +++ b/Just-Read/less/mixins.less @@ -0,0 +1,46 @@ +// Credits: [LESS Elements](http://lesselements.com) +// [Twitter Bootstrap](https://github.com/twitter/bootstrap) licensed under [Apache License](http://www.apache.org/licenses/LICENSE-2.0) + +.box-shadow(@arguments) { + -webkit-box-shadow: @arguments; + -moz-box-shadow: @arguments; + box-shadow: @arguments; +} + +.gradient(@startColor: #555, @endColor: #333) { + background-color: @endColor; + background-repeat: repeat-x; + background-image: -khtml-gradient(linear, left top, left bottom, from(@startColor), to(@endColor)); // Konqueror + background-image: -moz-linear-gradient(top, @startColor, @endColor); // FF 3.6+ + background-image: -ms-linear-gradient(top, @startColor, @endColor); // IE10 + background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, @startColor), color-stop(100%, @endColor)); // Safari 4+, Chrome 2+ + background-image: -webkit-linear-gradient(top, @startColor, @endColor); // Safari 5.1+, Chrome 10+ + background-image: -o-linear-gradient(top, @startColor, @endColor); // Opera 11.10 + background-image: linear-gradient(top, @startColor, @endColor); // The standard + filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",@startColor,@endColor)); // IE9 and down +} + +.rounded(@radius: 4px) { + -webkit-border-radius: @radius; + -moz-border-radius: @radius; + border-radius: @radius; + + -moz-background-clip: padding; + -webkit-background-clip: padding-box; + background-clip: padding-box; +} + +.transition(@duration:0.25s, @ease:linear) { + -webkit-transition: all @duration @ease; + -moz-transition: all @duration @ease; + -o-transition: all @duration @ease; + transition: all @duration @ease; +} + +.border-image(@width, @slice, @url, @repeat) { + border-width: @width; + -moz-border-image: url(@url) @slice @repeat; + -webkit-border-image: url(@url) @slice @repeat; + -o-border-image: url(@url) @slice @repeat; + border-image: url(@url) @slice @repeat; +} \ No newline at end of file diff --git a/Just-Read/less/print.less b/Just-Read/less/print.less new file mode 100644 index 0000000..92d636b --- /dev/null +++ b/Just-Read/less/print.less @@ -0,0 +1,76 @@ +// Credits: [HTML Boilerplate[(https://github.com/h5bp/html5-boilerplate) +// [Hartija - Css Print Framework](http://code.google.com/p/hartija/) licensed under [MIT](http://www.opensource.org/licenses/mit-license.php) + +* { + background : transparent !important; + box-shadow:none !important; + color : black !important; // Black prints faster: h5bp.com/s + filter : none !important; + -ms-filter : none !important; + text-shadow : none !important; +} + +@page { + margin : 0.5cm; +} + +a, a:visited { + color : @black !important; + text-decoration : underline; +} + +a[href]:after { + content : " (" attr(href) ")"; +} + +a[href^="javascript:"]:after, a[href^="#"]:after, .ir a:after { + content : ""; +} + +abbr[title]:after { + content : " (" attr(title) ")"; +} + +body{ + font-size: 12pt; +} + +blockquote, pre{ + page-break-inside : avoid; +} + +blockquote, pre { + margin-left: 0.5cm; + border-left : 0.2cm solid #999; + padding-left: 0.2cm; +} + +code, pre { + font: 10pt Courier, monospace; +} + +h1{ + font-size: 18pt; +} + +h2, h3 { + page-break-after : avoid; + font-size: 16pt; +} + +h2, h3, p { + orphans : 3; + widows : 3; +} + +img { + max-width : 100% !important; +} + +img, tr { + page-break-inside : avoid; +} + +thead { + display : table-header-group; +} \ No newline at end of file diff --git a/Just-Read/less/var.less b/Just-Read/less/var.less new file mode 100644 index 0000000..21fce38 --- /dev/null +++ b/Just-Read/less/var.less @@ -0,0 +1,17 @@ +// Color Variables + +@black: #000; +@white: #fff; +@color: #556270; // The color of the header and footer. If you modify this color, edit the images in the PSD folder and export them to static/images +@link: #4ECDC4; // The color of links, blockquote line and bullets. If you modify this color, edit static/images/bullet.png + + +// Typography +// If you modify the fonts, delete/modify the line 12 in base.html + +.sans, .fancy-font{ + font-family: 'Droid Sans', sans-serif; +} +.mono{ + font-family: 'Droid Sans Mono', monospace; +} \ No newline at end of file diff --git a/Just-Read/pelican.conf.py-sample.py b/Just-Read/pelican.conf.py-sample.py new file mode 100644 index 0000000..e92e4e8 --- /dev/null +++ b/Just-Read/pelican.conf.py-sample.py @@ -0,0 +1,10 @@ +AUTHOR = 'Name Lastname' +SITENAME = 'The name of your website' +SITEURL = 'http://example.com' + +DISQUS_SITENAME = '' + + +GOOGLE_ANALYTICS = 'UA-XXXXX-X' +HTML_LANG = 'en' +TWITTER_USERNAME = 'yourtwitterhandle no @ please' \ No newline at end of file diff --git a/Just-Read/psd/bullet.psd b/Just-Read/psd/bullet.psd new file mode 100644 index 0000000..e55960f Binary files /dev/null and b/Just-Read/psd/bullet.psd differ diff --git a/Just-Read/psd/bullet.pxm b/Just-Read/psd/bullet.pxm new file mode 100644 index 0000000..68b68b0 Binary files /dev/null and b/Just-Read/psd/bullet.pxm differ diff --git a/Just-Read/psd/line2px.psd b/Just-Read/psd/line2px.psd new file mode 100644 index 0000000..5154b33 Binary files /dev/null and b/Just-Read/psd/line2px.psd differ diff --git a/Just-Read/psd/line2px.pxm b/Just-Read/psd/line2px.pxm new file mode 100644 index 0000000..241b0a9 Binary files /dev/null and b/Just-Read/psd/line2px.pxm differ diff --git a/Just-Read/psd/pages.psd b/Just-Read/psd/pages.psd new file mode 100644 index 0000000..0fd74b4 Binary files /dev/null and b/Just-Read/psd/pages.psd differ diff --git a/Just-Read/psd/pages.pxm b/Just-Read/psd/pages.pxm new file mode 100644 index 0000000..f74ee8e Binary files /dev/null and b/Just-Read/psd/pages.pxm differ diff --git a/Just-Read/readme.md b/Just-Read/readme.md new file mode 100644 index 0000000..ebba988 --- /dev/null +++ b/Just-Read/readme.md @@ -0,0 +1,11 @@ +# Just Read + +"Just Read" is a theme for [Pelican](http://alexis.notmyidea.org/pelican/). The fluid-width layout is based based on the Golden Grid System by [Joni Korpi](http://jonikorpi.com/). + +## Worth mentioning files + +- **pelican.com.py-sample** contains the variables used in the theme, use it as reference to build your own configuration file. +- **var.less** defines the colors and fonts used. Much more easy to edit than the main.css file. +- the **psd folder** contains the images used in the theme, handful if you want to change the color scheme. + +*Note: I tested the theme only in the latests version of Chrome, Firefox, Opera and Safari. * \ No newline at end of file diff --git a/Just-Read/screenshot.png b/Just-Read/screenshot.png new file mode 100644 index 0000000..6659f99 Binary files /dev/null and b/Just-Read/screenshot.png differ diff --git a/Just-Read/static/css/main.css b/Just-Read/static/css/main.css new file mode 100644 index 0000000..3cb6c6a --- /dev/null +++ b/Just-Read/static/css/main.css @@ -0,0 +1,483 @@ +article, +aside, +details, +figcaption, +figure, +footer, +header, +hgroup, +nav, +section, +time { + display: block; +} +html { + font-size: 100%; + overflow-y: scroll; + -webkit-text-size-adjust: 100%; + -ms-text-size-adjust: 100%; +} +body { + margin: 0; +} +::-moz-selection { + background: #fd7; + color: #000; + text-shadow: none; +} +::selection { + background: #fd7; + color: #000; + text-shadow: none; +} +a:hover, a:active { + outline: 0; +} +ul, ol { + margin: 0; + padding: 0; +} +img { + border: 0; + -ms-interpolation-mode: bicubic; + vertical-align: middle; +} +.clearfix:before, .clearfix:after { + content: ""; + display: table; +} +.clearfix:after { + clear: both; +} +.clearfix { + *zoom: 1; +} +.sans, .fancy-font { + font-family: 'Droid Sans', sans-serif; +} +.mono { + font-family: 'Droid Sans Mono', monospace; +} +figure { + position: relative; +} +figure img, +figure object, +figure embed, +figure video { + max-width: 100%; + display: block; +} +.video-container { + position: relative; + padding-bottom: 56.25%; + padding-top: 30px; + height: 0; + overflow: hidden; + margin-bottom: 24px; +} +.video-container iframe, .video-container object, .video-container embed { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; +} +.small { + font-size: 12px; +} +.normal { + font-size: 14px; +} +.large { + font-size: 18px; +} +.huge { + font-size: 24px; +} +.massive { + font-size: 36px; +} +.gigantic { + font-size: 48px; +} +body { + font-size: 14px; + line-height: 24px; + background: #ffffff; + color: #404040; + font-family: 'Droid Sans', sans-serif; +} +.title { + line-height: 1; + font-family: 'Droid Sans', sans-serif; + font-weight: 700; +} +h1 { + line-height: 1; + font-family: 'Droid Sans', sans-serif; + font-weight: 700; + font-size: 24px; + margin: 0 0 36px 0; +} +h2 { + line-height: 1; + font-family: 'Droid Sans', sans-serif; + font-weight: 700; + font-size: 18px; + margin: 48px 0 24px; +} +h3 { + line-height: 1; + font-family: 'Droid Sans', sans-serif; + font-weight: 700; + font-size: 14px; + margin: 36px 0 24px; + text-transform: uppercase; + color: #999999; +} +h4, h5, h6 { + line-height: 1; + font-family: 'Droid Sans', sans-serif; + font-weight: 700; + font-size: 14px; + margin: 24px 0; + font-weight: 400; +} +b, strong { + font-weight: 700; +} +.wrapper { + padding: 0 0.75em; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + -o-box-sizing: border-box; + box-sizing: border-box; +} +a { + color: #4ecdc4; + text-decoration: none; + -webkit-transition: all 0.25s linear; + -moz-transition: all 0.25s linear; + -o-transition: all 0.25s linear; + transition: all 0.25s linear; +} +a:hover { + color: #113e3a; + text-decoration: underline; +} +header { + border-width: 0 0 2px; + -moz-border-image: url('../images/2px.png') 0 0 2 repeat; + -webkit-border-image: url('../images/2px.png') 0 0 2 repeat; + -o-border-image: url('../images/2px.png') 0 0 2 repeat; + border-image: url('../images/2px.png') 0 0 2 repeat; + background-color: #48535f; + background-repeat: repeat-x; + background-image: -khtml-gradient(linear, left top, left bottom, from(#556270), to(#48535f)); + background-image: -moz-linear-gradient(top, #556270, #48535f); + background-image: -ms-linear-gradient(top, #556270, #48535f); + background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #556270), color-stop(100%, #48535f)); + background-image: -webkit-linear-gradient(top, #556270, #48535f); + background-image: -o-linear-gradient(top, #556270, #48535f); + background-image: linear-gradient(top, #556270, #48535f); + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#556270', endColorstr='#48535f', GradientType=0); + padding: 48px 5.555555555555555%; + margin-bottom: 48px; +} +header h1 { + margin: 0; +} +header a { + text-decoration: none; + color: rgba(255, 255, 255, 0.8); + text-shadow: 0 1px 0 #b3b3b3, 0 2px 0 #999999, 0 3px 0 #808080, 0 4px 0 #666666, 0 5px 0 #4d4d4d, 0 6px 0 #333333, 0px 7px 0 #1a1a1a, 0 8px 7px #0d0d0d; +} +header a:hover { + color: #ffffff; + text-decoration: none; +} +footer { + border-width: 20px 0 0; + -moz-border-image: url('../images/pages.png') 20 0 0 repeat; + -webkit-border-image: url('../images/pages.png') 20 0 0 repeat; + -o-border-image: url('../images/pages.png') 20 0 0 repeat; + border-image: url('../images/pages.png') 20 0 0 repeat; + padding: 48px 5.555555555555555% 24px; + margin-top: 96px; + color: rgba(0, 0, 0, 0.6); +} +.pages { + margin-bottom: 24px; +} +.nav li { + list-style: none; + display: inline; + padding-right: 10px; +} +p[role="contentinfo"] { + margin-top: 12px; + font-size: 12px; +} +.content { + margin: 0 5.555555555555555%; +} +.meta { + background: #f2f2f2; + padding-top: 24px; + padding-bottom: 24px; + -webkit-border-radius: 4px; + -moz-border-radius: 4px; + border-radius: 4px; + -moz-background-clip: padding; + -webkit-background-clip: padding-box; + background-clip: padding-box; +} +time { + font-size: 12px; + text-transform: uppercase; +} +.tags li { + display: inline; + list-style: none; +} +blockquote, +code, +.post ul, +.post ol, +p { + margin: 0 0 24px 0; +} +blockquote { + margin-left: -12px; + border-left: 6px solid #4ecdc4; + padding-left: 6px; +} +code { + display: block; + background: #262626; + -webkit-box-shadow: inset 0 0 10px #000000; + -moz-box-shadow: inset 0 0 10px #000000; + box-shadow: inset 0 0 10px #000000; + padding: 24px; + color: #ffffff; + -webkit-border-radius: 4px; + -moz-border-radius: 4px; + border-radius: 4px; + -moz-background-clip: padding; + -webkit-background-clip: padding-box; + background-clip: padding-box; + font-family: 'Droid Sans Mono', monospace; + margin-left: -24px; +} +.post ul li { + list-style-image: url('../images/bullet.png'); +} +.main + .main { + margin-top: 96px; +} +.archive li { + list-style: none; +} +.archive a { + display: block; + padding: 12px 0; + border-bottom: 1px dotted #cccccc; +} +.archive a:hover { + text-decoration: none; +} +.archive time { + display: inline; + color: #666666; +} +@media screen and (min-width: 45em) { + header .wrapper { + width: 75%; + float: right; + } + .meta, .pages { + width: 25%; + float: left; + text-align: right; + } + .pages { + padding-top: 52px; + } + .meta { + background: #ffffff; + padding-top: 60px; + } + .meta time { + margin-bottom: 24px; + } + .post, .copy, .main { + width: 75%; + float: right; + } + .tags li { + display: block; + } + .tags a:hover, .nav a:hover { + padding-right: 6px; + } + .tags a:hover:after, .nav a:hover:after, .more:hover:after { + content: "\2192 "; + } + .nav li { + display: block; + padding-right: 0; + } + .archive time { + display: block; + width: 25%; + float: left; + } +} +@media screen and (min-width: 55.5em) { + .post p, + .post blockquote, + .post ul, + .post ol { + width: 66.66666666666667%; + } + .main { + width: 50%; + float: none; + margin-left: 25%; + } +} +@media screen and (min-width: 61.5em) { + .meta, .pages { + width: 12.5%; + } + .pages { + padding-top: 0; + } + .meta { + padding-top: 60px; + } +} +@media screen and (min-width: 117em) { + body { + font-size: 18px; + } + header { + margin-bottom: 96px; + } + footer { + margin-top: 144px; + } + h1 { + font-size: 48px; + margin-bottom: 48px; + } + h2, header .huge { + font-size: 36px; + } + h2 { + margin-top: 72px; + } + h3 { + font-size: 24px; + margin-top: 72px; + } + h4, h5, h6 { + font-size: 18px; + margin-top: 48px; + } + .meta, .pages { + width: 18.75%; + padding-left: 6.25%; + } + .meta { + padding-top: 96px; + } + .post, .copy { + width: 75%; + } + .post { + padding-right: 12.5%; + } + .post ul { + margin-bottom: 0; + } + .post li { + margin-bottom: 24px; + } + code { + font-size: 36px; + line-height: 1.5; + } + .post p, + .post blockquote, + .post ul, + .post ol { + width: 60%; + } +} +@media screen and (min-width: 130em) { + body { + max-width: 160em; + } +} +@media print { + * { + background: transparent !important; + box-shadow: none !important; + color: black !important; + filter: none !important; + -ms-filter: none !important; + text-shadow: none !important; + } + @page { + margin: 0.5cm; + } + a, a:visited { + color: #000000 !important; + text-decoration: underline; + } + a[href]:after { + content: " (" attr(href) ")"; + } + a[href^="javascript:"]:after, a[href^="#"]:after, .ir a:after { + content: ""; + } + abbr[title]:after { + content: " (" attr(title) ")"; + } + body { + font-size: 12pt; + } + blockquote, pre { + page-break-inside: avoid; + } + blockquote, pre { + margin-left: 0.5cm; + border-left: 0.2cm solid #999; + padding-left: 0.2cm; + } + code, pre { + font: 10pt Courier, monospace; + } + h1 { + font-size: 18pt; + } + h2, h3 { + page-break-after: avoid; + font-size: 16pt; + } + h2, h3, p { + orphans: 3; + widows: 3; + } + img { + max-width: 100% !important; + } + img, tr { + page-break-inside: avoid; + } + thead { + display: table-header-group; + } +} diff --git a/Just-Read/static/images/2px.png b/Just-Read/static/images/2px.png new file mode 100644 index 0000000..31b24fc Binary files /dev/null and b/Just-Read/static/images/2px.png differ diff --git a/Just-Read/static/images/bullet.png b/Just-Read/static/images/bullet.png new file mode 100644 index 0000000..b821648 Binary files /dev/null and b/Just-Read/static/images/bullet.png differ diff --git a/Just-Read/static/images/pages.png b/Just-Read/static/images/pages.png new file mode 100644 index 0000000..93ed30e Binary files /dev/null and b/Just-Read/static/images/pages.png differ diff --git a/Just-Read/templates/archives.html b/Just-Read/templates/archives.html new file mode 100644 index 0000000..355fe6f --- /dev/null +++ b/Just-Read/templates/archives.html @@ -0,0 +1,21 @@ +{% extends "base.html" %} +{% block title %}{{ SITENAME }} [archive]{% endblock %} +{% block content %} +
+
+ {% for year, date_year in dates|groupby( 'date.year' ) %} +

{{ year }}

+ {% for month, articles in date_year|groupby( 'date.month' ) %} +

{{ articles[ 0 ].date.strftime( '%B' ) }}

+ +
    + {% for article in articles %} +
  1. {{ article.title }}
    2. + {% endfor %} +
+ + {% endfor %} + {% endfor %} +
+
+{% endblock %} \ No newline at end of file diff --git a/Just-Read/templates/article.html b/Just-Read/templates/article.html new file mode 100644 index 0000000..a5bf08f --- /dev/null +++ b/Just-Read/templates/article.html @@ -0,0 +1,29 @@ +{% extends "base.html" %} +{% block title %}{{ article.title }} - {{ SITENAME }}{% endblock %} +{% block content %} +
+
+
+

{{ article.title }}

+ {{ article.content }} + + {% if DISQUS_SITENAME %} +
+

Comments !

+
+ +
+ {% endif %} +
+ + {% include 'metadata.html' %} +
+
+{% endblock %} \ No newline at end of file diff --git a/Just-Read/templates/base.html b/Just-Read/templates/base.html new file mode 100644 index 0000000..7a14567 --- /dev/null +++ b/Just-Read/templates/base.html @@ -0,0 +1,65 @@ + + + + + {% block title %}{{ SITENAME }}{%endblock%} + + + + + + + + + + + + + {% if FEED_RSS %} + + {% endif %} + + + + + + {% block content %} + {% endblock %} + + + + + + + \ No newline at end of file diff --git a/Just-Read/templates/categories.html b/Just-Read/templates/categories.html new file mode 100644 index 0000000..6b889e8 --- /dev/null +++ b/Just-Read/templates/categories.html @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/Just-Read/templates/category.html b/Just-Read/templates/category.html new file mode 100644 index 0000000..20cdc17 --- /dev/null +++ b/Just-Read/templates/category.html @@ -0,0 +1,17 @@ +{% extends "base.html" %} +{% block title %}{{ category }} - {{ SITENAME }}{% endblock %} + +{% block content %} +
+
+

Posts categorized under: {{ category }}

+ +
    + {% for article in articles %} +
  1. {{ article.title }}
    2. + {% endfor %} +
+ +
+
+{% endblock %} \ No newline at end of file diff --git a/Just-Read/templates/index.html b/Just-Read/templates/index.html new file mode 100644 index 0000000..262c23e --- /dev/null +++ b/Just-Read/templates/index.html @@ -0,0 +1,26 @@ +{% extends "base.html" %} +{% block content_title %}{% endblock %} + +{% block content %} +
+{% for article in articles %} + + {% if loop.index == 1 %} + + + {% if loop.length > 1 %} +
+

More posts

+
    + {% endif %} + {% else %} +
  1. {{ article.title }}
    2. + {% endif %} + {% endfor %} +
+
+
+{% endblock content %} \ No newline at end of file diff --git a/Just-Read/templates/metadata.html b/Just-Read/templates/metadata.html new file mode 100644 index 0000000..842a5d8 --- /dev/null +++ b/Just-Read/templates/metadata.html @@ -0,0 +1,12 @@ +
+ + + {% if PDF_PROCESSOR %}

Download the .pdf

{% endif %} +
\ No newline at end of file diff --git a/Just-Read/templates/page.html b/Just-Read/templates/page.html new file mode 100644 index 0000000..9402f36 --- /dev/null +++ b/Just-Read/templates/page.html @@ -0,0 +1,10 @@ +{% extends "base.html" %} +{% block title %}{{ article.title }}{% endblock %} +{% block content %} +
+
+

{{ page.title }}

+ {{ page.content }} +
+
+{% endblock %} \ No newline at end of file diff --git a/Just-Read/templates/tag.html b/Just-Read/templates/tag.html new file mode 100644 index 0000000..f5ebd56 --- /dev/null +++ b/Just-Read/templates/tag.html @@ -0,0 +1,16 @@ +{% extends "base.html" %} +{% block title %}{{ tag }} - {{ SITENAME }}{% endblock %} +{% block content %} +
+
+

Post tagged: {{ tag }}

+ +
    + {% for article in articles %} +
  1. {{ article.title }}
    2. + {% endfor %} +
+ +
+
+{% endblock %} \ No newline at end of file diff --git a/Just-Read/templates/tags.html b/Just-Read/templates/tags.html new file mode 100644 index 0000000..6b889e8 --- /dev/null +++ b/Just-Read/templates/tags.html @@ -0,0 +1 @@ + \ No newline at end of file -- cgit v1.1