diff options
Diffstat (limited to 'themes')
-rw-r--r-- | themes/classic/sass/default/core/_theme.scss | 1 | ||||
-rw-r--r-- | themes/classic/sass/default/core/_utilities.scss | 8 | ||||
-rw-r--r-- | themes/classic/sass/default/partials/_navigation.scss | 7 | ||||
-rw-r--r-- | themes/classic/sass/default/partials/_syntax.scss | 99 | ||||
-rw-r--r-- | themes/classic/source/_includes/head.html | 3 | ||||
-rw-r--r-- | themes/classic/source/images/favicon.png | bin | 0 -> 400 bytes | |||
-rw-r--r-- | themes/classic/source/javascripts/octopress.js | 45 |
7 files changed, 105 insertions, 58 deletions
diff --git a/themes/classic/sass/default/core/_theme.scss b/themes/classic/sass/default/core/_theme.scss index 5b95175a..6d73f2e0 100644 --- a/themes/classic/sass/default/core/_theme.scss +++ b/themes/classic/sass/default/core/_theme.scss @@ -50,3 +50,4 @@ $textinput-border-focus: #989898; #articles a, #articles + aside a { @include link-colors($link-color, $hover: saturate(darken($link_color, 15), 20), $focus: saturate(darken($link_color, 15), 20), $visited: darken(adjust_hue($link_color, 70), 10)); } +a { @include transition(color, .5s); } diff --git a/themes/classic/sass/default/core/_utilities.scss b/themes/classic/sass/default/core/_utilities.scss index 992c7750..8b718cdc 100644 --- a/themes/classic/sass/default/core/_utilities.scss +++ b/themes/classic/sass/default/core/_utilities.scss @@ -5,11 +5,11 @@ height: image-height($img); } -@mixin selection($bg: #b4d5fe, $color: inherit){ +@mixin selection($bg, $color: inherit, $text-shadow: none){ * { - &::-moz-selection { background: $bg; color: $color; text-shadow: darken($bg, 20) 0 1px 1px; } - &::-webkit-selection { background: $bg; color: $color; text-shadow: darken($bg, 20) 0 1px 1px;} - &::selection { background: $bg; color: $color; text-shadow: darken($bg, 20) 0 1px 1px; } + &::-moz-selection { background: $bg; color: $color; text-shadow: $text-shadow; } + &::-webkit-selection { background: $bg; color: $color; text-shadow: $text-shadow; } + &::selection { background: $bg; color: $color; text-shadow: $text-shadow; } } } diff --git a/themes/classic/sass/default/partials/_navigation.scss b/themes/classic/sass/default/partials/_navigation.scss index 3d34c3c7..3d5ee8fb 100644 --- a/themes/classic/sass/default/partials/_navigation.scss +++ b/themes/classic/sass/default/partials/_navigation.scss @@ -14,6 +14,7 @@ body > nav { .search { padding: .3em .5em 0; font-size: .85em; + @extend .sans; line-height: 1.1em; width: 95%; @include border-radius(.5em); @@ -58,7 +59,7 @@ body > nav { text-shadow: lighten($nav-bg, 12) 0 1px; float: left; text-decoration: none; - font-size: .9em; + font-size: 1em; padding: .1em 0; line-height: 1.5em; } @@ -82,7 +83,7 @@ body > nav { } } ul[data-subscription$=email] + form { - width: $sidebar-width-medium - $pad-medium*2 - $sidebar-pad-medium - 48px; + width: $sidebar-width-medium - $pad-medium*2 - $sidebar-pad-medium - 58px; .search { width: 91%; } } fieldset[role=mobile-nav] { display: none; } @@ -94,7 +95,7 @@ body > nav { width: $sidebar-width-wide - $pad-wide - $sidebar-pad-wide*2 + 5px; } ul[data-subscription$=email] + form { - width: $sidebar-width-wide - $pad-wide - $sidebar-pad-wide*2 - 48px; + width: $sidebar-width-wide - $pad-wide - $sidebar-pad-wide*2 - 58px; } } } diff --git a/themes/classic/sass/default/partials/_syntax.scss b/themes/classic/sass/default/partials/_syntax.scss index 5797c28f..2258ac46 100644 --- a/themes/classic/sass/default/partials/_syntax.scss +++ b/themes/classic/sass/default/partials/_syntax.scss @@ -25,51 +25,73 @@ $green: #859900; //$base2: $base02; //$base3: $base03; -.gutter { - .line-numbers { +.highlight, html .gist .gist-file .gist-syntax .gist-highlight { + pre.line-numbers { text-align: right; background: $base02 !important; - border-right: 1px solid darken($base03, 2); + border-right: 1px solid darken($base03, 2) !important; @include box-shadow(lighten($base02, 2) -1px 0 inset); text-shadow: darken($base02, 10) 0 -1px; span { color: $base01 !important; } + padding-left: .8em !important; + padding-right: .8em !important; } } html .gist .gist-file { margin-bottom: 1.5em; + position: relative; border: none; + padding-top: image-height("code_bg.png") !important; .gist-syntax { - border-bottom: 1px solid #515151 !important; + border-bottom: 1px solid darken($base03, 2) !important; .gist-highlight{ background: $base03 !important; pre { @extend .pre; - overflow-y: hidden; - overflow-x: auto; + } + pre.line-numbers { + } } } .gist-meta { - @include background(linear-gradient(#b0b0b0, #a7a7a7)); - padding: 0.5em; - background-color: #bababa !important; - border: 1px solid #9c9c9c; - border-top: 1px solid #d0d0d0; - border-bottom: 1px solid #777777; - font-size: .7em !important; - font-family: "Helvetica Neue", Arial, sans-serif !important; - color: #464646 !important; - line-height: 1.4em; + padding: .6em 0.8em; + border: 1px solid lighten($base02, 2) !important; + color: $base01; + font-size: .7em !important; + background: $base02; + @extend .sans; + line-height: 1.5em; + a { + color: mix($base1, $base01) !important; + @include hover-link; + &:hover { color: $base1 !important; } + } + a[href*='#file'] { + position: absolute; top: 0; left:0; right:-10px; + color: #474747 !important; + @extend .code-title; + &:hover { color: $link-color !important; } + } + a[href*=raw]{ + @extend .download-source; + top: .4em; + } } } pre { @extend .pre; } .pre { @extend .mono; + @include selection(adjust-color($base03, $lightness: 23%, $saturation: -65%), $text-shadow: $base03 0 1px); font-size: .8em; + overflow: scroll; + overflow-y: hidden; + overflow-x: auto; line-height: 1.45em; padding: 1em 1.2em !important; background: $base03 !important; + code { background: $base03 !important; overflow: hidden; } color: $base1 !important; span { color: $base1 !important; } span { font-style: normal !important; font-weight: normal !important; } @@ -84,13 +106,13 @@ pre { @extend .pre; } .o { color: $base1 !important; font-weight: bold !important; } /* Operator */ .p { color: $base1 !important; } /* Operator */ .ow { color: $cyan !important; font-weight: bold !important; } /* Operator.Word */ - .gd { color: $base1 !important; background-color: mix($red, $base03, 25%) !important; display: block; } /* Generic.Deleted */ - .gd .x { color: $base1 !important; background-color: mix($red, $base03, 35%) !important; display: block; } /* Generic.Deleted.Specific */ + .gd { color: $base1 !important; background-color: mix($red, $base03, 25%) !important; display: inline-block; } /* Generic.Deleted */ + .gd .x { color: $base1 !important; background-color: mix($red, $base03, 35%) !important; display: inline-block; } /* Generic.Deleted.Specific */ .ge { color: $base1 !important; font-style: italic !important; } /* Generic.Emph */ //.gr { color: #aa0000 } /* Generic.Error */ .gh { color: $base01 !important; } /* Generic.Heading */ - .gi { color: $base1 !important; background-color: mix($green, $base03, 20%) !important; display: block; } /* Generic.Inserted */ - .gi .x { color: $base1 !important; background-color: mix($green, $base03, 40%) !important; display: block; } /* Generic.Inserted.Specific */ + .gi { color: $base1 !important; background-color: mix($green, $base03, 20%) !important; display: inline-block; } /* Generic.Inserted */ + .gi .x { color: $base1 !important; background-color: mix($green, $base03, 40%) !important; display: inline-block; } /* Generic.Inserted.Specific */ //.go { color: #888888 } /* Generic.Output */ //.gp { color: #555555 } /* Generic.Prompt */ .gs { color: $base1 !important; font-weight: bold !important; } /* Generic.Strong */ @@ -136,28 +158,37 @@ pre { @extend .pre; } .s1 { color: $cyan !important; } /* Literal.String.Single */ //.ss { color: #990073 } /* Literal.String.Symbol */ //.il { color: #009999 } /* Literal.Number.Integer.Long */ + div { .gd, .gd .x, .gi, .gi .x { display: block; }} } -.highlight { +.highlight, .gist-highlight { margin-bottom: 1.5em; + background: $base03; overflow-y: hidden; - .gutter pre { - padding-left: .8em !important; - padding-right: .8em !important; + overflow-x: auto; + pre { overflow: visible; } +} +figure { + margin-bottom: 1.5em; + figcaption { + position: relative; + @extend .code-title; + a { @extend .download-source; } } + .highlight { margin-bottom: 0; border-bottom: 1px solid darken($base03, 2) !important; } } - -h3.filename { +h3.filename { @extend .code-title; } +.code-title { + text-align: center; font-size: 13px; line-height: 2em; - text-align: center; text-shadow: #cbcccc 0 1px 0; color: #474747; font-style: normal; margin-bottom: 0; @include border-top-radius(5px); - font-family: "Helvetica Neue",Arial, "Lucida Grande", "Lucida Sans Unicode", Lucida, sans-serif; + font-family: "Helvetica Neue", Arial, "Lucida Grande", "Lucida Sans Unicode", Lucida, sans-serif; background: #aaaaaa image-url("code_bg.png") top repeat-x; border: 1px solid #565656; border-top-color: #cbcbcb; @@ -165,3 +196,15 @@ h3.filename { border-right-color: #a5a5a5; border-bottom: 0; } + +.download-source { + position: absolute; right: .8em; + @include hover-link; + color: #666 !important; + &:hover { color: $link-color !important; } + z-index: 1; + font-size: 13px; + text-shadow: #cbcccc 0 1px 0; + padding-left: 3em; +} + diff --git a/themes/classic/source/_includes/head.html b/themes/classic/source/_includes/head.html index bf93b7b6..d97a6a0a 100644 --- a/themes/classic/source/_includes/head.html +++ b/themes/classic/source/_includes/head.html @@ -23,10 +23,13 @@ <meta name="keywords" content="{{page.keywords}}"/> {% endif %} + <link href="/images/favicon.png" rel="shortcut icon" /> <link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css"> <script src="/javascripts/modernizr-2.0.js"></script> <script src="/javascripts/ender.js"></script> <script src="/javascripts/octopress.js" type="text/javascript"></script> + <link href='http://fonts.googleapis.com/css?family=PT+Serif:regular,italic,bold,bolditalic' rel='stylesheet' type='text/css'> + <link href='http://fonts.googleapis.com/css?family=PT+Sans:regular,italic,bold,bolditalic' rel='stylesheet' type='text/css'> {% include google_analytics.html %} <link href="/atom.xml" rel="alternate" title="{{site.title}}" type="application/atom+xml"/> </head> diff --git a/themes/classic/source/images/favicon.png b/themes/classic/source/images/favicon.png Binary files differnew file mode 100644 index 00000000..0f250673 --- /dev/null +++ b/themes/classic/source/images/favicon.png diff --git a/themes/classic/source/javascripts/octopress.js b/themes/classic/source/javascripts/octopress.js index 591a0ecd..611357a9 100644 --- a/themes/classic/source/javascripts/octopress.js +++ b/themes/classic/source/javascripts/octopress.js @@ -1,12 +1,11 @@ function getNav(){ - var fieldset = $('body > nav fieldset[role=site-search]').after('<fieldset role="mobile-nav"></fieldset>').next(); - var select = $(fieldset).append('<select></select>').children(); - select.append('<option value="">Navigate…</option>'); - $($('body > nav ul[role=main-nav] a').concat($('body > nav ul[role=subscription] a'))).each(function(link) { - select.append('<option value="'+link.href+'">• '+link.text+'</option>') + var mobileNav = $('body > nav fieldset[role=site-search]').after('<fieldset role="mobile-nav"></fieldset>').next().append('<select></select>'); + mobileNav.children('select').append('<option value="">Navigate…</option>'); + $($('body > nav ul[role=main-nav] a')).each(function(link) { + mobileNav.children('select').append('<option value="'+link.href+'">• '+link.text+'</option>') }); - select.bind('change', function(event){ - if (select.val()) window.location.href = select.val(); + mobileNav.children('select').bind('change', function(event){ + if (event.target.value) window.location.href = event.target.value; }); } function addSidebarToggler() { @@ -37,20 +36,10 @@ function testFeatures() { } } -function addDivLines(){ - $('div.highlight pre code').each(function(el){ - var content = bonzo(el).html(); - var lines = content.replace(/\s*$/g, '').split('\n'); - var count = lines.length; - bonzo(lines).each(function(line, index){ - if(line == '') line = ' '; - lines[index] = '<div class="line">' + line + '</div>'; - }); - $(el).html(lines.join('')); - }); -} -function preToTable(){ - $('div.highlight').each(function(code){ +function addCodeLineNumbers(){ + if (navigator.appName == 'Microsoft Internet Explorer') { return } + $('div.highlight pre code').each(function(el){ addDivLines(el); }); + $('div.highlight, div.gist-highlight').each(function(code){ var tableStart = '<table cellpadding="0" cellspacing="0"><tbody><tr><td class="gutter">'; var lineNumbers = '<pre class="line-numbers">'; var tableMiddle = '</pre></td><td class="code" width="100%">'; @@ -63,6 +52,16 @@ function preToTable(){ $(code).html(table); }); } +function addDivLines(el){ + var content = $(el).html(); + var lines = content.replace(/\s*$/g, '').split(/\n/); + var count = lines.length; + $(lines).each(function(line, index){ + if(line == '') line = ' '; + lines[index] = '<div class="line">' + line + '</div>'; + }); + $(el).html(lines.join('')); +} function flashVideoFallback(){ var flashplayerlocation = "/assets/jwplayer/player.swf", @@ -102,10 +101,9 @@ function wrapFlashVideos(){ $.domReady(function(){ testFeatures(); - addDivLines(); flashVideoFallback(); wrapFlashVideos(); - preToTable(); + addCodeLineNumbers(); getNav(); addSidebarToggler(); }); @@ -144,3 +142,4 @@ b=j.userAgent.toLowerCase(),d=j.platform.toLowerCase(),g=d?/win/.test(d):/win/.t a&&b&&d&&i&&k){d+="";i+="";var p={};if(f&&typeof f===o)for(var m in f)p[m]=f[m];p.data=a;p.width=d;p.height=i;a={};if(c&&typeof c===o)for(var n in c)a[n]=c[n];if(e&&typeof e===o)for(var r in e)typeof a.flashvars!=l?a.flashvars+="&"+r+"="+e[r]:a.flashvars=r+"="+e[r];if(t(k))b=s(p,a,b),j.success=!0,j.ref=b}h&&h(j)},ua:g,getFlashPlayerVersion:function(){return{major:g.pv[0],minor:g.pv[1],release:g.pv[2]}},hasFlashPlayerVersion:t,createSWF:function(a,b,d){if(g.w3)return s(a,b,d)},getQueryParamValue:function(a){var b= i.location.search||i.location.hash;if(b){/\?/.test(b)&&(b=b.split("?")[1]);if(a==null)return u(b);for(var b=b.split("&"),d=0;d<b.length;d++)if(b[d].substring(0,b[d].indexOf("="))==a)return u(b[d].substring(b[d].indexOf("=")+1))}return""}}}(); + |