blago
/
Blog
1
0
Fork 0
Code Issues Pull Requests Releases Activity
Browse Source

1. Some general styling improvements especially for syntax and navigation 

2. JS line numbering now supports embedded gists
3. Added a favicon
unreleased_contents
Brandon Mathis 14 years ago
parent
ab29d45ae8
commit
b0405cc3c2
7 changed files with 105 additions and 58 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 1
      themes/classic/sass/default/core/_theme.scss
  2. 8
      themes/classic/sass/default/core/_utilities.scss
  3. 7
      themes/classic/sass/default/partials/_navigation.scss
  4. 99
      themes/classic/sass/default/partials/_syntax.scss
  5. 3
      themes/classic/source/_includes/head.html
  6. BIN
      themes/classic/source/images/favicon.png
  7. 45
      themes/classic/source/javascripts/octopress.js

1
themes/classic/sass/default/core/_theme.scss
View File

@ -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); }

8
themes/classic/sass/default/core/_utilities.scss
View File

@ -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; }
}
}

7
themes/classic/sass/default/partials/_navigation.scss
View File

@ -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;
}
}
}

99
themes/classic/sass/default/partials/_syntax.scss
View File

@ -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;
}

3
themes/classic/source/_includes/head.html
View File

@ -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>

BIN
themes/classic/source/images/favicon.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 400 B

45
themes/classic/source/javascripts/octopress.js
View File

@ -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&hellip;</option>');
$($('body > nav ul[role=main-nav] a').concat($('body > nav ul[role=subscription] a'))).each(function(link) {
select.append('<option value="'+link.href+'">&bull; '+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&hellip;</option>');
$($('body > nav ul[role=main-nav] a')).each(function(link) {
mobileNav.children('select').append('<option value="'+link.href+'">&bull; '+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""}}}();

Write Preview
Loading…
Cancel
Save