diff --git a/.gitignore b/.gitignore index b405514..8aba46b 100644 --- a/.gitignore +++ b/.gitignore @@ -1,3 +1,4 @@ .DS_* .sass-cache *.esproj +public/ diff --git a/Gemfile b/Gemfile new file mode 100644 index 0000000..78f63ec --- /dev/null +++ b/Gemfile @@ -0,0 +1,9 @@ +source "http://rubygems.org" + +# gem "rails" +gem "stasis" +gem "hpricot" +gem "haml" +gem "sass" +gem "redcarpet" +gem "coffee-script" diff --git a/Gemfile.lock b/Gemfile.lock new file mode 100644 index 0000000..93508f6 --- /dev/null +++ b/Gemfile.lock @@ -0,0 +1,36 @@ +GEM + remote: http://rubygems.org/ + specs: + coffee-script (2.2.0) + coffee-script-source + execjs + coffee-script-source (1.3.3) + directory_watcher (1.4.1) + execjs (1.4.0) + multi_json (~> 1.0) + haml (3.1.6) + hpricot (0.8.6) + multi_json (1.3.6) + redcarpet (2.1.1) + redis (2.2.2) + sass (3.1.20) + slop (2.1.0) + stasis (0.1.23) + directory_watcher (~> 1.4.1) + redis (~> 2.2.2) + slop (~> 2.1.0) + tilt (~> 1.3.3) + yajl-ruby (~> 1.0.0) + tilt (1.3.3) + yajl-ruby (1.0.0) + +PLATFORMS + ruby + +DEPENDENCIES + coffee-script + haml + hpricot + redcarpet + sass + stasis diff --git a/controller.rb b/controller.rb new file mode 100644 index 0000000..009c40e --- /dev/null +++ b/controller.rb @@ -0,0 +1,6 @@ +ignore /\/_.*/ +ignore /\/stylesheets\/_.*/ +ignore /Gemfile.*/ +ignore /\/\..+/ + +layout "layouts/main.html.haml" diff --git a/css/style.css b/css/style.css deleted file mode 100644 index 437d566..0000000 --- a/css/style.css +++ /dev/null @@ -1,622 +0,0 @@ -/* ==================================================== - * - * Dan Barber CV Styles - * Based on: - * 320 and Up boilerplate extension - * - * Author: Andy Clarke - * Version: 0.9b - * URL: http://stuffandnonsense.co.uk/projects/320andup/ - * _____________________________________________________ - * - * 1.ROOT - * 2.HEADINGS - * 3.TYPOGRAPHY - * 4.LINKS - * 5.FIGURES & IMAGES - * 6.TABLES - * 7.FORMS (See css/mylibs/forms.css) - * 8.BANNER header[role="banner"] - * 9.NAVIGATION nav[role="navigation"] - * 10.CONTENT - * 11.MAIN div[role="main"] - * 12.COMPLIMENTARY div[role="complementary"] - * 13.CONTENTINFO footer[role="contentinfo"] - * 14.GLOBAL OBJECTS - * 15.VENDOR-SPECIFIC - * 16.TEMPLATE SPECIFICS - * 17.MODERNIZR - * - * COLOURS */ -html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { - margin: 0; - padding: 0; - border: 0; - font-size: 100%; - font: inherit; - vertical-align: baseline; } - -article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { - display: block; } - -abbr[title] { - border-bottom: 1px dotted; - cursor: help; } - -/* 1.ROOT */ -html { - overflow-y: scroll; - background: #f9f5eb; } - -body { - margin: 0 auto; - padding: 0 0; - font: 100%/1.4 "museo-sans-1", "museo-sans-2", sans-serif; - font-weight: 100; - color: #1e2832; - background-color: transparent; } - -.container { - margin: 0 auto; - padding: 0 0; - width: 90%; } - -/* 2.HEADINGS */ -h1, h2, h3, h4, h5, h6 { - font-family: "museo-slab-1", "museo-slab-2", "Helvetica Neue", Helvetica, Arial, serif; - font-weight: black; - text-shadow: 1px 1px 1px white; - text-rendering: optimizeLegibility; } - -h1 { - margin-top: 0; - margin-bottom: 0.1em; - font-size: 3em; - /* 48 / 16 = 3 */ - line-height: 1.2; - font-weight: 900; - text-align: center; - width: 100%; } - h1:before { - content: ""; - display: block; - height: 130px; - font-size: 3em; - margin-top: 0; - text-align: center; - background: url(../img/l/danbarberlogo.png) center center no-repeat; - background-size: 95px; } - -/* Hide the logomark in ie7/8 as it just doesn't work correctly. It's not essential. */ -.ie8 h1:before, .ie7 h1:before { - border: 1px solid red; - display: none; } - -h2 { - margin-bottom: 0.75em; - font-size: 1.7em; - /* 36 / 16 = 2 */ - line-height: 1.2; - text-align: center; } - -h3 { - text-transform: uppercase; - margin-bottom: 1em; - font-size: 1.4em; - /* 24 / 16 = 1.5 */ - line-height: 1.3; } - -h4 { - margin-bottom: 0.75em; - margin-top: 1.7em; - font-size: 1.2em; - /* 20 / 16 = 1.25 */ - line-height: 1.25; - font-weight: 500; } - -h5 { - margin-bottom: 1.5em; - font-size: 1em; - /* 16 / 16 = 1 */ } - -h6 { - font-size: 1em; - /* 16 / 16 = 1 */ } - -/* 3.TYPOGRAPHY */ -.period { - font-style: italic; } - -p, ol, ul, dl, address { - margin-bottom: 0.75em; - font-size: 1em; - /* 16 / 16 = 1 */ } - -ul, ol { - margin: 0 0 0 -24px; - padding-left: 24px; } - -ul { - list-style-type: disc; } - ul ul { - padding-left: 0; } - -ol { - list-style-type: decimal; } - -li ul, li ol { - margin: 0; - font-size: 1em; - /* 16 / 16 = 1 */ } - -.container > section { - border-top: 2px solid #666666; - padding-top: 1em; - margin-bottom: 2em; } - .container > section ul, .container > section ol { - list-style: none; } - -dl, dd { - margin-bottom: 1.5em; } - -dt { - font-weight: normal; } - -blockquote { - margin: 0 0 1.5em -24px; - padding-left: 24px; - border-left: 1px solid #c8c8c8; - font-style: italic; } - blockquote:before, blockquote:after { - content: ""; - content: none; } - -q:before, q:after { - content: ""; - content: none; } - -b, strong { - font-weight: bold; } - -i, em { - font-style: italic; } - -sup, sub { - position: relative; - font-size: 75%; - line-height: 0; } - -sup { - top: -0.5em; } - -sub { - bottom: -0.25em; } - -address { - font-style: normal; } - -pre { - margin-bottom: 1.5em; - white-space: pre; - white-space: pre-wrap; - word-wrap: break-word; - font: 0.875em "andale mono", "lucida console", monospace; - line-height: 1.5; } - -code { - font: 0.875em "andale mono", "lucida console", monospace; - line-height: 1.5; } - -small { - font-size: 1em; - /* 16 / 16 = 1 */ } - -/* 4.LINKS */ -a { - outline: none; - color: #1777af; - text-decoration: none; } - a:visited { - outline: none; - color: #1777af; - text-decoration: none; } - a:hover, a:focus { - outline: none; - color: #282828; - text-decoration: underline; } - a:active { - outline: none; - color: black; } - -/* 5.FIGURES & IMAGES */ -figure { - margin-bottom: 1.5em; } - figure img, figure object, figure embed { - margin-bottom: 0.75em; - max-width: 100%; } - -figcaption { - display: block; - font-weight: normal; } - -/* 6.TABLES */ -table { - border-collapse: collapse; - border-spacing: 0; - margin-bottom: 1.4em; - width: 100%; - font-size: 0.875em; - /* 14 / 16 = .875 */ } - -th { - font-weight: bold; - padding: 0.25em 10px 0.25em 5px; } - -td, caption { - padding: 0.25em 10px 0.25em 5px; } - -tfoot { - font-style: italic; } - -caption { - background-color: transparent; } - -/* 7.FORMS (See css/mylibs/forms.css) */ -/* 8.BANNER */ -/* 9.NAVIGATION */ -/* 10.CONTENT */ -/* 11.MAIN */ -/* 12.COMPLIMENTARY */ -/* 13.CONTENTINFO */ -/* 14.GLOBAL OBJECTS */ -.clearfix { - zoom: 1; } - .clearfix:before { - content: "\0020"; - display: block; - height: 0; - overflow: hidden; } - .clearfix:after { - content: "\0020"; - display: block; - height: 0; - overflow: hidden; - clear: both; } - -/* 15.VENDOR-SPECIFIC */ -body { - -webkit-text-size-adjust: 100%; - -ms-text-size-adjust: 100%; } - -a:link { - -webkit-tap-highlight-color: #349edb; } - -::-webkit-selection { - background: #1777af; - color: #fafafa; - text-shadow: none; } - -::-moz-selection { - background: #1777af; - color: #fafafa; - text-shadow: none; } - -::selection { - background: #1777af; - color: #fafafa; - text-shadow: none; } - -::-webkit-input-placeholder { - padding: 10px; - font-size: 0.875em; - line-height: 1.4; } - -/* input[type=search] { -webkit-appearance: none; } - * - *input[type="search"]::-webkit-search-decoration, - *input[type="search"]::-webkit-search-cancel-button { display: none; } */ -input:-moz-placeholder { - padding: 10px; - font-size: 0.875em; - line-height: 1.4; } - -.ie7 img, .iem7 img { - -ms-interpolation-mode: bicubic; } - -div, input, textarea { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - -o-box-sizing: border-box; - box-sizing: border-box; } - -/* Non-semantic helper classes */ -/* Image replacement */ -.ir { - display: block; - text-indent: -999em; - overflow: hidden; - background-repeat: no-repeat; - text-align: left; - direction: ltr; } - -/* Hide for screenreaders and visual browsers */ -.hidden { - display: none; - visibility: hidden; } - -/* Hide visually */ -.visuallyhidden { - position: absolute; - clip: rect(0 0 0 0); - overflow: hidden; - margin: -1px; - padding: 0; - height: 1px; - width: 1px; - border: 0; } - .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { - position: static; - clip: auto; - overflow: visible; - height: auto; - margin: 0; - width: auto; } - -/* Allow an element to be focusable via keyboard */ -/* Hide but maintain layout */ -.invisible { - visibility: hidden; } - -/* 16.TEMPLATE SPECIFICS */ -#goog-fixurl ul { - list-style-type: none; } -#goog-fixurl input { - margin-bottom: 1.5em; } - -/* 17.MODERNIZR */ -/* MEDIA QUERIES */ -/*Print __________________________________________________________________________________________________________ */ -@media print { - * { - background: transparent !important; - color: black !important; - text-shadow: none !important; - filter: none !important; - -ms-filter: none !important; } - - a { - color: #444444 !important; - text-decoration: underline; } - a:visited { - color: #444444 !important; - text-decoration: underline; } - a[href]:after { - content: " (" attr(href) ")"; } - - abbr[title]:after { - content: " (" attr(title) ")"; } - - a[href^="javascript:"]:after, a[href^="#"]:after { - content: ""; } - - pre, blockquote { - border: 1px solid #999999; - page-break-inside: avoid; } - - thead { - display: table-header-group; } - - tr, img { - page-break-inside: avoid; } - - @page { - margin: 0.5cm; } - - p, h2, h3 { - orphans: 3; - widows: 3; } - - h2, h3 { - page-break-after: avoid; } } -/*/mediaquery */ -/*480px __________________________________________________________________________________________________________ */ -@media only screen and (min-width: 480px) { - /* 1.ROOT */ - body { - font-size: 1.05em; } - - /* 2.HEADINGS */ - h1 { - margin-top: 0.5em; - text-align: left; - margin-bottom: 0; - font-size: 3.3em; } - h1:before { - float: right; - font-size: 2em; - width: 78px; - background-size: 78px; - background-position: top center; - position: relative; - top: 0em; - text-align: right; - margin-bottom: -0.5em; } - - h2 { - text-align: left; } - - /* 3.TYPOGRAPHY */ - /* 4.LINKS */ - /* 5.FIGURES & IMAGES */ - /* 6.TABLES */ - /* 7.FORMS */ - /* 8.BANNER */ - /* 9.NAVIGATION */ - /* 10.CONTENT */ - /* #experience h4 { float: left; margin-top: 0; } - *#experience li { margin-top: 2.2em; } - *#experience .period { clear: none; text-align: right; position: relative; top: 0.1em; } - *#experience p { clear: both; } */ - /* 11.MAIN */ - /* 12.COMPLIMENTARY */ - /* 13.CONTENTINFO */ - /* 14.GLOBAL OBJECTS */ - /* 15.VENDOR-SPECIFIC */ - /* 16.TEMPLATE SPECIFICS */ - /* 17.MODERNIZR */ } -/*/mediaquery */ -/*480px __________________________________________________________________________________________________________ */ -@media only screen and (min-width: 540px) { - /* 1.ROOT */ - /* 2.HEADINGS */ - /* 3.TYPOGRAPHY */ - /* 4.LINKS */ - /* 5.FIGURES & IMAGES */ - /* 6.TABLES */ - /* 7.FORMS */ - /* 8.BANNER */ - /* 9.NAVIGATION */ - /* 10.CONTENT */ - #profile, #experience { - float: left; - width: 63%; } - - #skills { - float: right; - width: 30%; - margin-left: 7%; } - - #portfolio { - float: left; - width: 63%; } - - #interests, #contact { - float: right; - width: 30%; - margin-left: 7%; } - - /* 11.MAIN */ - /* 12.COMPLIMENTARY */ - /* 13.CONTENTINFO */ - /* 14.GLOBAL OBJECTS */ - /* 15.VENDOR-SPECIFIC */ - /* 16.TEMPLATE SPECIFICS */ - /* 17.MODERNIZR */ } -/*/mediaquery */ -/*768px __________________________________________________________________________________________________________ */ -@media only screen and (min-width: 768px) { - /* 1.ROOT */ - body { - font-size: 1.1em; } - - /* 2.HEADINGS */ - h1 { - font-size: 5em; - margin-bottom: 0em; } - h1:before { - width: 130px; - background-size: 130px; - background-position: top center; - position: relative; - top: 0em; } - - h2 { - font-size: 2em; } - - /* 3.TYPOGRAPHY */ - /* 4.LINKS */ - /* 5.FIGURES & IMAGES */ - /* 6.TABLES */ - /* 7.FORMS */ - /* 8.BANNER */ - /* 9.NAVIGATION */ - /* 10.CONTENT */ - /* 11.MAIN */ - /* 12.COMPLIMENTARY */ - /* 13.CONTENTINFO */ - /* 14.GLOBAL OBJECTS */ - /* 15.VENDOR-SPECIFIC */ - /* 16.TEMPLATE SPECIFICS */ - /* 17.MODERNIZR */ } -/*/mediaquery */ -/*992px __________________________________________________________________________________________________________ */ -@media only screen and (min-width: 992px) { - /* 1.ROOT */ - .container { - width: 890px; } - - /* 2.HEADINGS */ - /* 3.TYPOGRAPHY */ - /* 4.LINKS */ - /* 5.FIGURES & IMAGES */ - /* 6.TABLES */ - /* 7.FORMS */ - /* 8.BANNER */ - /* 9.NAVIGATION */ - /* 10.CONTENT */ - /* 11.MAIN */ - /* 12.COMPLIMENTARY */ - /* 13.CONTENTINFO */ - /* 14.GLOBAL OBJECTS */ - /* 15.VENDOR-SPECIFIC */ - /* 16.TEMPLATE SPECIFICS */ - /* 17.MODERNIZR */ } -/*/mediaquery */ -/*1382px __________________________________________________________________________________________________________ */ -@media only screen and (min-width: 1382px) { - /* 1.ROOT */ - /* 2.HEADINGS */ - /* 3.TYPOGRAPHY */ - /* 4.LINKS */ - /* 5.FIGURES & IMAGES */ - /* 6.TABLES */ - /* 7.FORMS */ - /* 8.BANNER */ - /* 9.NAVIGATION */ - /* 10.CONTENT */ - /* 11.MAIN */ - /* 12.COMPLIMENTARY */ - /* 13.CONTENTINFO */ - /* 14.GLOBAL OBJECTS */ - /* 15.VENDOR-SPECIFIC */ - /* 16.TEMPLATE SPECIFICS */ - /* 17.MODERNIZR */ } -/*/mediaquery */ -/*2x __________________________________________________________________________________________________________ */ -@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) { - /* 1.ROOT */ - /* 2.HEADINGS */ - h1:before { - background-image: url(../img/h/danbarberlogo.png); } - - /* 3.TYPOGRAPHY */ - /* 4.LINKS */ - /* 5.FIGURES & IMAGES */ - /* 6.TABLES */ - /* 7.FORMS */ - /* 8.BANNER */ - /* 9.NAVIGATION */ - /* 10.CONTENT */ - /* 11.MAIN */ - /* 12.COMPLIMENTARY */ - /* 13.CONTENTINFO */ - /* 14.GLOBAL OBJECTS */ - /* 15.VENDOR-SPECIFIC */ - /* 16.TEMPLATE SPECIFICS */ - /* 17.MODERNIZR */ } -/*/mediaquery */ -/* Sources: - * http://meyerweb.com/eric/tools/css/reset - * http://people.opera.com/patrickl/experiments/keyboard/test - * http://gist.github.com/413930 - * http://pathf.com/blogs/2008/05/formatting-quoted-code-in-blog-posts-css21-white-space-pre-wrap - * http://sitepoint.com/blogs/2010/08/20/ie-remove-textarea-scrollbars - * http://tjkdesign.com/ez-css/css/base.css - * http://viget.com/inspire/styling-the-button-element-in-internet-explorer - * http://code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing - * http://html5doctor.com/html-5-reset-stylesheet/ - * http://praegnanz.de/weblog/htmlcssjs-kickstart/ - * http://camendesign.com/design/ - * http://yui.yahooapis.com/2.8.1/build/base/base.css - * http://webaim.org/techniques/css/invisiblecontent/ - * http://drupal.org/node/897638 */ diff --git a/css/style.sass b/css/style.css.sass similarity index 98% rename from css/style.sass rename to css/style.css.sass index f83c538..6ca827b 100644 --- a/css/style.sass +++ b/css/style.css.sass @@ -48,16 +48,24 @@ abbr[title] html overflow-y: scroll - background: #F9F5EB + background: white body margin: 0 auto padding: 0 0 font: 100% / 1.4 "museo-sans-1", "museo-sans-2", sans-serif font-weight: 100 - color: rgb(30, 40, 50) + color: #262626 background-color: transparent +#stripe + background: #262626 + height: 12px + box-shadow: 0 4px 5px rgba(0, 0, 0, 0.1) + canvas + height: 12px + width: 100% + .container margin: 0 auto padding: 0 0 @@ -129,6 +137,9 @@ h6 /* 3.TYPOGRAPHY +.link + float: right + .period font-style: italic diff --git a/humans.txt b/humans.txt index 21a5b67..8452639 100644 --- a/humans.txt +++ b/humans.txt @@ -3,41 +3,12 @@ /* TEAM */ - : - Site: - Twitter: - Location: - -/* THANKS */ - Names (& URL): + Designer & Coder: Dan Barber + Site: http://danbarber.me + Twitter: @danbee + Location: UK /* SITE */ Standards: HTML5, CSS3 Components: Modernizr, jQuery - Software: - - - - -o/- - +oo//- - :ooo+//: - -ooooo///- - /oooooo//: - :ooooooo+//- - -+oooooooo///- - -://////////////+oooooooooo++////////////:: - :+ooooooooooooooooooooooooooooooooooooo+:::- - -/+ooooooooooooooooooooooooooooooo+/::////:- - -:+oooooooooooooooooooooooooooo/::///////:- - --/+ooooooooooooooooooooo+::://////:- - -:+ooooooooooooooooo+:://////:-- - /ooooooooooooooooo+//////:- - -ooooooooooooooooooo////- - /ooooooooo+oooooooooo//: - :ooooooo+/::/+oooooooo+//- - -oooooo/::///////+oooooo///- - /ooo+::://////:---:/+oooo//: - -o+/::///////:- -:/+o+//- - :-:///////:- -:/:// - -////:- --//: - -- -: + Software: Stasis, HAML, SASS, Vim diff --git a/img/h/danbarberlogo.png b/img/h/danbarberlogo.png index fd34e32..a9017f0 100644 Binary files a/img/h/danbarberlogo.png and b/img/h/danbarberlogo.png differ diff --git a/img/l/danbarberlogo.png b/img/l/danbarberlogo.png index d5a5502..37966f3 100644 Binary files a/img/l/danbarberlogo.png and b/img/l/danbarberlogo.png differ diff --git a/index.html b/index.html index 83b13be..1af0d8f 100644 --- a/index.html +++ b/index.html @@ -121,24 +121,28 @@ URL: http://pixelhum.com/cv
  • Pixelhum

    -

    -

    pixelhum.com
    Pixelhum is my own freelance/contract business. I build custom web applications for clients using PHP and Ruby on Rails.

    + +

    +

    Pixelhum is my own freelance/contract business. I build custom web applications for clients using PHP and Ruby on Rails.

  • Abiquo

    -

    + +

    Updating and maintaining Abiquo’s websites, written in both PHP and Ruby on Rails. This includes the virtual image exchange site Thunderflash (thunderflash.com) which I rebuilt on Rails 3.

  • Deep Blue Sound

    -

    + +

    Administering and augmenting the existing web systems including Moodle, SugarCRM and others. Deputising for the System Administrator.

  • Footwork Solutions

    -

    -

    footworksolutions.co.uk
    I was a lead developer and designer on the Halo care co-ordination system, including training and documentation and support. I was also the System Administrator for both the local network and remote server farm.

    + +

    –​

    +

    I was a lead developer and designer on the Halo care co-ordination system, including training and documentation and support. I was also the System Administrator for both the local network and remote server farm.

  • Granite Internet

    @@ -184,6 +188,11 @@ URL: http://pixelhum.com/cv

    wedding.coweyes.co.uk

    My own wedding photo site. Design and implementation of theme for ZenPhoto.

  • +
  • +

    My CV

    +

    http://pixelhum.com/cv

    +

    My CV is a responsive design that makes extensive use of HTML5, CSS3, typography and web fonts.

    +
  • diff --git a/index.html.haml b/index.html.haml new file mode 100644 index 0000000..89ff694 --- /dev/null +++ b/index.html.haml @@ -0,0 +1,17 @@ +.content.clearfix + %div{:role => "main"} + .container.clearfix + %section#profile + = render "sections/profile.markdown" + %section#skills + = render "sections/skills.markdown" + %section#experience + = render "sections/experience.markdown" + .container.clearfix + %section#portfolio + = render "sections/portfolio.markdown" + %section#interests + = render "sections/interests.markdown" + %section#contact.vcard + = render "sections/contact.html.haml" + %div{:role => "complementary"} diff --git a/js/script.js b/js/script.js deleted file mode 100644 index 068d663..0000000 --- a/js/script.js +++ /dev/null @@ -1,12 +0,0 @@ -if (navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPad/i)) { -var viewportmeta = document.querySelectorAll('meta[name="viewport"]')[0]; -if (viewportmeta) { -viewportmeta.content = 'width=device-width, minimum-scale=1.0, maximum-scale=1.0'; -document.body.addEventListener('gesturestart', function() { -viewportmeta.content = 'width=device-width, minimum-scale=0.25, maximum-scale=1.6'; -}, false); -} -} - -$(function() { -}); \ No newline at end of file diff --git a/js/script.js.coffee b/js/script.js.coffee new file mode 100644 index 0000000..1195357 --- /dev/null +++ b/js/script.js.coffee @@ -0,0 +1,17 @@ +if navigator.userAgent.match(/iPhone/i) or navigator.userAgent.match(/iPad/i) + viewportmeta = document.querySelectorAll("meta[name=\"viewport\"]")[0] + if viewportmeta + viewportmeta.content = "width=device-width, minimum-scale=1.0, maximum-scale=1.0" + document.body.addEventListener "gesturestart", (-> + viewportmeta.content = "width=device-width, minimum-scale=0.25, maximum-scale=1.6" + ), false + +$ -> + canvas = document.getElementById("colours") + context = canvas.getContext("2d") + colours = ['#FF5579', '#8ED600', '#00BAEB'] + offset = 0 + for colour in colours + context.fillStyle = colour + context.fillRect(offset, 0, 48, 12) + offset += 48 diff --git a/layouts/main.html.haml b/layouts/main.html.haml new file mode 100644 index 0000000..7de1fea --- /dev/null +++ b/layouts/main.html.haml @@ -0,0 +1,18 @@ +!!! +/ + Dan Barber's CV + Author: Dan Barber + URL: http://pixelhum.com/cv +/[if IEMobile 7 ] +/[if lt IE 7 ] +/[if IE 7 ] +/[if IE 8 ] +/ [if (gte IE 9)|(gt IEMobile 7)|!(IEMobile)|!(IE)]> "en", :manifest => "default.appcache?v=1"} + / "contentinfo"} +/ mathiasbynens.be/notes/async-analytics-snippet Change UA-XXXXX-X to be your site's ID +%script{:src => "//ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js"} +:javascript + window.jQuery || document.write(' + + +/ http://t.co/HZe9oJ4 +:javascript + var _gaq=[['_setAccount','UA-603600-3'],['_trackPageview']]; // Change UA-XXXXX-X to be your site's ID + (function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];g.async=1; + g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js'; + s.parentNode.insertBefore(g,s)}(document,'script')); +%noscript Your browser does not support JavaScript! diff --git a/partials/_head.html.haml b/partials/_head.html.haml new file mode 100644 index 0000000..415a607 --- /dev/null +++ b/partials/_head.html.haml @@ -0,0 +1,25 @@ +%meta{:charset => "utf-8"}/ +%title Dan Barber - Web Developer & Designer +%meta{:content => "", :name => "description"}/ +%meta{:content => "", :name => "author"}/ +/ http://t.co/dKP3o1e +%meta{:content => "True", :name => "HandheldFriendly"}/ +%meta{:content => "320", :name => "MobileOptimized"}/ +%meta{:content => "width=device-width, target-densitydpi=160dpi, initial-scale=1", :name => "viewport"}/ +/ + For less capable mobile browsers + +/ For all browsers +%link{:href => "css/style.css?v=1", :rel => "stylesheet"}/ +/ JavaScript at bottom except for Modernizr and Typekit +%script{:src => "js/libs/modernizr-1.7.min.js"} +/ Typekit +%script{:src => "http://use.typekit.com/ewi2mjz.js", :type => "text/javascript"} +:javascript + try{Typekit.load();}catch(e){} +%link{:href => "favicon.png", :rel => "shortcut icon"}/ +/ Microsoft. Delete if not required +%meta{:content => "on", "http-equiv" => "cleartype"}/ +%meta{:content => "IE=edge,chrome=1", "http-equiv" => "X-UA-Compatible"}/ +/ http://t.co/y1jPVnT +%link{:href => "/", :rel => "canonical"}/ diff --git a/partials/_header.html.haml b/partials/_header.html.haml new file mode 100644 index 0000000..0c974c5 --- /dev/null +++ b/partials/_header.html.haml @@ -0,0 +1,8 @@ +%div#stripe + .container + %canvas#colours{ :width => 890, :height => 12 } + +%header.clearfix{:role => "banner"} + .container + %h1#main_heading Dan Barber + %h2 Web Designer & Developer diff --git a/sections/contact.html.haml b/sections/contact.html.haml new file mode 100644 index 0000000..e477527 --- /dev/null +++ b/sections/contact.html.haml @@ -0,0 +1,17 @@ +%h3 Contact +%p.fn.n + %span.given-name Dan + %span.family-name Barber +%p.adr + %span.street-address 41D Longacre + %br/ + %span.locality Plymouth + %br/ + %span.postal-code PL7 4RQ + %br/ + %span.country-name United Kingdom +%p + %a.email{:href => "mailto:dan.barber@pixelhum.com"} dan.barber@pixelhum.com +%p.tel +44 (0) 1752 546981 +%p + %a.url{:href => "http://pixelhum.com"} http://pixelhum.com diff --git a/sections/experience.markdown b/sections/experience.markdown new file mode 100644 index 0000000..5f0ce7c --- /dev/null +++ b/sections/experience.markdown @@ -0,0 +1,43 @@ +### Experience + +#### [Pixelhum](http://pixelhum.com) + +Aug 2010 – Present + +Pixelhum is my own freelance/contract business. I build custom web applications for clients using PHP and Ruby on Rails. + +#### [WebBased Ltd](http://www.webbased.co.uk/webbased) + +Dec 2011 – Present + +Continued development of a CRM product built using Rails 2.3. Moved version control from SVN to git and brought the Rspec test suite up to date. + +#### [Abiquo](http://www.abiquo.com) + +June 2010 – Oct 2011 + +Updating and maintaining Abiquo’s websites, written in both PHP and Ruby on Rails. This includes the virtual image exchange site Thunderflash (thunderflash.com) which I rebuilt on Rails 3. + +#### [Deep Blue Sound](http://dbsmusic.co.uk) + +Aug 2008 – June 2010 + +Administering and augmenting the existing web systems including Moodle, SugarCRM and others. Deputising for the System Administrator. + +#### [Footwork Solutions](http://footworksolutions.co.uk) + +Nov 2002 – Aug 2008 + +I was a lead developer and designer on the Halo care co-ordination system, including training and documentation and support. I was also the System Administrator for both the local network and remote server farm. + +#### Granite Internet + +2000 – 2002 + +Designed and developed and maintained several property company websites based on a single code base. Setup Windows, Linux and FreeBSD servers. + +#### North Devon Journal + +1998 – 2000 + +Set advertisements using QuarkXpress and was responsible for laying out the classified pages. Developed a love for typography. diff --git a/sections/interests.markdown b/sections/interests.markdown new file mode 100644 index 0000000..41a818d --- /dev/null +++ b/sections/interests.markdown @@ -0,0 +1,7 @@ +#### Interests + +* Drumming +* Music +* Sound Engineering & Recording +* Photography +* Cycling diff --git a/sections/portfolio.markdown b/sections/portfolio.markdown new file mode 100644 index 0000000..f5d3d47 --- /dev/null +++ b/sections/portfolio.markdown @@ -0,0 +1,43 @@ +### Portfolio + +#### Soundunlimited + +[soundunlimited.co.uk](http://www.soundunlimited.co.uk) + +Complete online shop system implemented using Ruby on Rails. Rspec was used for testing. + +#### NeoMPC + +[pixelhum.com/neompc](http://pixelhum.com/neompc) + +Web based MPD client. Design and execution. Built on PHP and jQuery and uses mpd.class.php. + +#### Footwork Solutions + +[footworksolutions.co.uk](http://footworksolutions.co.uk) + +Company logo and site design. I built the HTML for the Drupal template. + +#### Halo + +haloteam.com + +Hosted care co-ordination system for drug treatment agencies. Design, initial implementation and ongoing development of key modules. + +#### Dan Barber Photo + +[danbarberphoto.com](http://danbarberphoto.com) + +My own photography portfolio site. Designed and implemented the whole site using Ruby on Rails and jQuery, including backend admin pages. + +#### Dan & Katie + +[wedding.coweyes.co.uk](http://wedding.coweyes.co.uk) + +My own wedding photo site. Design and implementation of theme for ZenPhoto. + +#### My CV + +[danbarber.me/cv](http://danbarber.me/cv) + +My CV is a responsive design built using Stasis, HAML, SASS and Markdown that makes extensive use of HTML5, CSS3, typography and web fonts. diff --git a/sections/profile.markdown b/sections/profile.markdown new file mode 100644 index 0000000..c4de414 --- /dev/null +++ b/sections/profile.markdown @@ -0,0 +1,3 @@ +### Profile + +I have 12 years of experience building web sites and web applications, from small simple websites and services to large enterprise level systems. I focus on simple, usable interfaces and prefer to work by prototyping ideas. diff --git a/sections/skills.markdown b/sections/skills.markdown new file mode 100644 index 0000000..5e49462 --- /dev/null +++ b/sections/skills.markdown @@ -0,0 +1,34 @@ +### Skills + +#### Web Technologies + +* HTML5/CSS3 +* Javascript/jQuery +* Ruby on Rails +* PHP + +#### Databases + +* SQL +* PostgreSQL +* MySQL +* SQLite3 + +#### Design + +* Photoshop/GIMP +* Illustrator +* InDesign +* Typography + +#### Linux Servers + +* Web (Apache) +* MySQL +* PostgreSQL +* DNS +* Samba + +#### Networking + +Good knowledge of cabling, routing and protocols.