diff options
author | Natalia Ventre <natalia.ventre@gmail.com> | 2012-02-08 21:58:21 -0200 |
---|---|---|
committer | Natalia Ventre <natalia.ventre@gmail.com> | 2012-02-08 21:58:21 -0200 |
commit | 612ca2d53693f2ba41b6a654a1dc554238787a5a (patch) | |
tree | 6db0daf0c21f5f2a8f2f953277b1ba2eedc55648 /Just-Read | |
parent | 7fc66f3071afb214d26bf0a7b20048a751f223db (diff) | |
download | pelican-themes-612ca2d53693f2ba41b6a654a1dc554238787a5a.zip pelican-themes-612ca2d53693f2ba41b6a654a1dc554238787a5a.tar.gz pelican-themes-612ca2d53693f2ba41b6a654a1dc554238787a5a.tar.bz2 |
added Just Read theme
Diffstat (limited to 'Just-Read')
29 files changed, 1389 insertions, 0 deletions
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 Binary files differnew file mode 100644 index 0000000..e55960f --- /dev/null +++ b/Just-Read/psd/bullet.psd diff --git a/Just-Read/psd/bullet.pxm b/Just-Read/psd/bullet.pxm Binary files differnew file mode 100644 index 0000000..68b68b0 --- /dev/null +++ b/Just-Read/psd/bullet.pxm diff --git a/Just-Read/psd/line2px.psd b/Just-Read/psd/line2px.psd Binary files differnew file mode 100644 index 0000000..5154b33 --- /dev/null +++ b/Just-Read/psd/line2px.psd diff --git a/Just-Read/psd/line2px.pxm b/Just-Read/psd/line2px.pxm Binary files differnew file mode 100644 index 0000000..241b0a9 --- /dev/null +++ b/Just-Read/psd/line2px.pxm diff --git a/Just-Read/psd/pages.psd b/Just-Read/psd/pages.psd Binary files differnew file mode 100644 index 0000000..0fd74b4 --- /dev/null +++ b/Just-Read/psd/pages.psd diff --git a/Just-Read/psd/pages.pxm b/Just-Read/psd/pages.pxm Binary files differnew file mode 100644 index 0000000..f74ee8e --- /dev/null +++ b/Just-Read/psd/pages.pxm 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 Binary files differnew file mode 100644 index 0000000..6659f99 --- /dev/null +++ b/Just-Read/screenshot.png 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 Binary files differnew file mode 100644 index 0000000..31b24fc --- /dev/null +++ b/Just-Read/static/images/2px.png diff --git a/Just-Read/static/images/bullet.png b/Just-Read/static/images/bullet.png Binary files differnew file mode 100644 index 0000000..b821648 --- /dev/null +++ b/Just-Read/static/images/bullet.png diff --git a/Just-Read/static/images/pages.png b/Just-Read/static/images/pages.png Binary files differnew file mode 100644 index 0000000..93ed30e --- /dev/null +++ b/Just-Read/static/images/pages.png 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 }} <small>[archive]</small>{% endblock %} +{% block content %} +<div role="main" class="content clearfix"> +<div class="wrapper main"> + {% for year, date_year in dates|groupby( 'date.year' ) %} + <h2>{{ year }}</h2> + {% for month, articles in date_year|groupby( 'date.month' ) %} + <h3>{{ articles[ 0 ].date.strftime( '%B' ) }}</h3> + + <ol class="archive"> + {% for article in articles %} + <li class="clearfix"><a href="{{ article.url }}"><time datetime="{{ article.date.isoformat() }}" pubdate>{{ article.locale_date }}</time> {{ article.title }}</a></li> + {% endfor %} + </ol> + + {% endfor %} + {% endfor %} +</div> +</div> +{% 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 %} +<div role="main" class="content clearfix"> + <article> + <div class="post wrapper"> + <h1>{{ article.title }}</h1> + {{ article.content }} + + {% if DISQUS_SITENAME %} + <div class="comments"> + <h2>Comments !</h2> + <div id="disqus_thread"></div> + <script type="text/javascript"> + var disqus_identifier = "{{ article.url }}"; + (function() { + var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true; + dsq.src = 'http://{{ DISQUS_SITENAME }}.disqus.com/embed.js'; + (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq); + })(); + </script> + </div> + {% endif %} + </div> + + {% include 'metadata.html' %} + </article> +</div> +{% 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 @@ +<!doctype html> +<html lang="{{ HTML_LANG }}"> +<head> + <meta charset="utf-8"/> + <title>{% block title %}{{ SITENAME }}{%endblock%}</title> + <meta name="author" content="{{ AUTHOR }}"> + + <meta name="HandheldFriendly" content="True"> + <meta name="MobileOptimized" content="320"> + <meta name="viewport" content="width=device-width, target-densitydpi=160dpi, initial-scale=1.0"> + + <link href='http://fonts.googleapis.com/css?family=Droid+Sans:700,400|Droid+Sans+Mono' rel='stylesheet' type='text/css'> + <link rel="stylesheet" href="{{ SITEURL }}/theme/css/{{ CSS_FILE }}" type="text/css" /> + + <!--[if lt IE 9]> + <script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script> + <![endif]--> + + <link href="{{ SITEURL }}/{{ FEED }}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} ATOM Feed" /> + {% if FEED_RSS %} + <link href="{{ SITEURL }}/{{ FEED_RSS }}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} RSS Feed" /> + {% endif %} +</head> + +<body> + <header class="clearfix" role="banner"> + <div class="wrapper"> + <h1 class="huge"><a href="{{ SITEURL }}">{{ SITENAME }}</a></h1> + </div> + </header> + + {% block content %} + {% endblock %} + + + <footer class="clearfix"> + <div class="wrapper pages"> + <ul class="nav"> + {% for p in PAGES %} + <li><a href="{{ SITEURL }}/pages/{{ p.url }}">{{ p.title }}</a></li> + {% endfor %} + <li><a href="{{ SITEURL }}/archives.html">Archive</a></li> + {% if FEED_RSS %} + <li><a href="{{ SITEURL }}/{{ FEED_RSS }}">RSS Feed</a></li> + {% endif %} + </ul> + </div> + + <div class="copy wrapper"> + <a href="https://twitter.com/{{ TWITTER_USERNAME }}" class="twitter-follow-button" data-show-count="false" data-size="large">Follow @{{ TWITTER_USERNAME }}</a> + <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script> + + <p role="contentinfo">© 2012 {{ AUTHOR }}<br> + Proudly powered by <a href="http://alexis.notmyidea.org/pelican/">Pelican</a>, which takes great advantages of <a href="http://python.org">Python</a>.</p> + </div> + </footer> + + <script> + var _gaq=[['_setAccount','{{ GOOGLE_ANALYTICS }}'],['_trackPageview']]; + (function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0]; + g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js'; + s.parentNode.insertBefore(g,s)}(document,'script')); + </script> +</body> +</html>
\ 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 @@ +<!--must list all the tags. Can be a tag cloud.-->
\ 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 %} +<div role="main" class="content clearfix"> +<div class="wrapper main"> + <h2>Posts categorized under: {{ category }}</h2> + + <ol class="archive"> + {% for article in articles %} + <li class="clearfix"><a href="{{ SITEURL }}/{{ article.url }}"><time datetime="{{ article.date.isoformat() }}" pubdate>{{ article.locale_date }}</time> {{ article.title }}</a></li> + {% endfor %} + </ol> + +</div> +</div> +{% 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 %} +<div role="main" class="content clearfix"> +{% for article in articles %} + + {% if loop.index == 1 %} + <article class="wrapper main"> + <h1><a href="{{ SITEURL }}/{{ article.url }}">{{ article.title }}</a></h1> + {{ article.summary }} <a class="more" href="{{ SITEURL }}/{{ article.url }}">read more</a> + </article> + + {% if loop.length > 1 %} + <div class="wrapper main"> + <h3>More posts</h3> + <ol class="archive"> + {% endif %} + {% else %} + <li class="clearfix"><a href="{{ SITEURL }}/{{ article.url }}" rel="bookmark" title="Permalink to {{ article.title}}"><time datetime="{{ article.date.isoformat() }}" pubdate>{{ article.locale_date }}</time> {{ article.title }}</a></li> + {% endif %} + {% endfor %} + </ol> + </div> +</div> +{% 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 @@ +<div class="meta wrapper"> + <time datetime="{{ article.date.isoformat() }}" pubdate>{{ article.locale_date }}</time> + <ul class="tags"> + <li><a href="{{ SITEURL }}/category/{{ article.category }}.html">{{ article.category }}</a></li> +{% if article.tags %} + {% for tag in article.tags %} + <li><a href="{{ SITEURL }}/tag/{{ tag }}.html">{{ tag }}</a></li> + {% endfor %} +{% endif %} + </ul> + {% if PDF_PROCESSOR %}<p><a href="{{ SITEURL }}/pdf/{{ article.slug }}.pdf">Download the .pdf</a></p>{% endif %} +</div>
\ 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 %} +<div role="main" class="content clearfix"> + <div class="post wrapper"> + <h1>{{ page.title }}</h1> + {{ page.content }} + </div> +</div> +{% 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 %} +<div role="main" class="content clearfix"> +<div class="wrapper main"> + <h2>Post tagged: {{ tag }}</h2> + + <ol class="archive"> + {% for article in articles %} + <li class="clearfix"><a href="{{ SITEURL }}/{{ article.url }}"><time datetime="{{ article.date.isoformat() }}" pubdate>{{ article.locale_date }}</time> {{ article.title }}</a></li> + {% endfor %} + </ol> + +</div> +</div> +{% 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 @@ +<!--must list all the tags. Can be a tag cloud.-->
\ No newline at end of file |