mirror of
https://github.com/danbee/cv
synced 2025-03-04 08:59:12 +00:00
Responsive layouts are in place, probable need some tweaking. Using a
chunky asterisk as a typemark placeholder.
This commit is contained in:
Dan Barber
parent
85ec44bd20
commit
b79206c4a9
1
.gitignore
vendored
Normal file
1
.gitignore
vendored
Normal file
@ -0,0 +1 @@
|
||||
.DS_*
|
||||
@ -65,13 +65,20 @@ html {
|
||||
overflow-y : scroll;
|
||||
background : rgb(255,255,255) /* url(../img/tmp/grid.png) repeat-y 50% 0 */; }
|
||||
|
||||
body {
|
||||
body {
|
||||
margin : 0 auto;
|
||||
padding : 0 0;
|
||||
font : 100%/1.4 "museo-sans-1","museo-sans-2", sans-serif;
|
||||
font-weight: 100;
|
||||
color : rgb(40,40,40);
|
||||
background-color : transparent;
|
||||
}
|
||||
|
||||
#page {
|
||||
margin : 0 auto;
|
||||
padding : 24px 0;
|
||||
padding : 0 0;
|
||||
width : 90% /* 252px */;
|
||||
font : 100%/1.4 Cambria, Georgia, Times, "Times New Roman";
|
||||
color : rgb(40,40,40);
|
||||
background-color : transparent; }
|
||||
}
|
||||
|
||||
/* 2.HEADINGS */
|
||||
|
||||
@ -80,31 +87,20 @@ h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 { font-family : "Helvetica Neue", Helvetica, Arial; font-weight : bold; }
|
||||
h6 { font-family : "museo-slab-1","museo-slab-2", "Helvetica Neue", Helvetica, Arial; font-weight : 700; }
|
||||
|
||||
h1 { margin-bottom : .75em; font-size : 3em; /* 48 / 16 = 3 */ line-height : 1.2; }
|
||||
h1 { margin-bottom : .5em; font-size : 3em; /* 48 / 16 = 3 */ line-height : 1.2; font-weight: 900; text-align: center; }
|
||||
h1:before { content: "\2731"; display: block; font-size: 3em; margin-top: 0; text-align: center; }
|
||||
|
||||
h2 {
|
||||
margin-bottom : .75em;
|
||||
font-size : 2em; /* 36 / 16 = 2 */
|
||||
line-height : 1.2; }
|
||||
h2 { margin-bottom : .75em; font-size : 2em; /* 36 / 16 = 2 */ line-height : 1.2; text-align: center; }
|
||||
|
||||
h3 {
|
||||
margin-bottom : 1em;
|
||||
font-size : 1.5em; /* 24 / 16 = 1.5 */
|
||||
line-height : 1.3; }
|
||||
h3 { margin-bottom : 1em; font-size : 1.5em; /* 24 / 16 = 1.5 */ line-height : 1.3; }
|
||||
|
||||
h4 {
|
||||
margin-bottom : 1.25em;
|
||||
font-size : 1.25em; /* 20 / 16 = 1.25 */
|
||||
line-height : 1.25; }
|
||||
h4 { font-family: "museo-sans-1","museo-sans-2", sans-serif; margin-bottom : 0.25em; font-size : 1.25em; /* 20 / 16 = 1.25 */ line-height : 1.25; font-weight: 500; }
|
||||
|
||||
h5 {
|
||||
margin-bottom : 1.5em;
|
||||
font-size : 1em; /* 16 / 16 = 1 */ }
|
||||
h5 { margin-bottom : 1.5em; font-size : 1em; /* 16 / 16 = 1 */ }
|
||||
|
||||
h6 {
|
||||
font-size : 1em; /* 16 / 16 = 1 */ }
|
||||
h6 { font-size : 1em; /* 16 / 16 = 1 */ }
|
||||
|
||||
/* 3.TYPOGRAPHY */
|
||||
|
||||
@ -132,6 +128,10 @@ li ol {
|
||||
margin : 0;
|
||||
font-size : 1em; /* 16 / 16 = 1 */ }
|
||||
|
||||
section { border-top: 2px solid black; padding-top: 1em; }
|
||||
|
||||
section ul, section ol { list-style: none; }
|
||||
|
||||
dl,
|
||||
dd {
|
||||
margin-bottom : 1.5em; }
|
||||
@ -421,7 +421,11 @@ page-break-after : avoid; }
|
||||
@media only screen and (min-width: 480px) {
|
||||
|
||||
/* 1.ROOT */
|
||||
body { font-size: 1.05em; }
|
||||
/* 2.HEADINGS */
|
||||
h1 { margin-top: 0.5em; text-align: left; }
|
||||
h1:before { float: right; font-size: 2em; position: relative; top: -0.28em; text-align: right; margin-bottom: -0.5em; }
|
||||
h2 { text-align: left; }
|
||||
/* 3.TYPOGRAPHY */
|
||||
/* 4.LINKS */
|
||||
/* 5.FIGURES & IMAGES */
|
||||
@ -444,9 +448,9 @@ page-break-after : avoid; }
|
||||
@media only screen and (min-width: 768px) {
|
||||
|
||||
/* 1.ROOT */
|
||||
|
||||
/* 1.ROOT */
|
||||
body { font-size: 1.1em; }
|
||||
/* 2.HEADINGS */
|
||||
h1 { font-size: 5em; margin-bottom: 0.25em; }
|
||||
/* 3.TYPOGRAPHY */
|
||||
/* 4.LINKS */
|
||||
/* 5.FIGURES & IMAGES */
|
||||
@ -455,6 +459,7 @@ page-break-after : avoid; }
|
||||
/* 8.BANNER */
|
||||
/* 9.NAVIGATION */
|
||||
/* 10.CONTENT */
|
||||
#skills { float: right; width: 30%; margin-left: 4em; }
|
||||
/* 11.MAIN */
|
||||
/* 12.COMPLIMENTARY */
|
||||
/* 13.CONTENTINFO */
|
||||
@ -469,6 +474,7 @@ page-break-after : avoid; }
|
||||
@media only screen and (min-width: 992px) {
|
||||
|
||||
/* 1.ROOT */
|
||||
#page { width: 890px; }
|
||||
/* 2.HEADINGS */
|
||||
/* 3.TYPOGRAPHY */
|
||||
/* 4.LINKS */
|
||||
|
||||
277
index.html
277
index.html
@ -16,7 +16,7 @@ URL: http://stuffandnonsense.co.uk/projects/320andup
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
|
||||
<title>320 and up</title>
|
||||
<title>Dan Barber - Web Developer & Designer</title>
|
||||
<meta name="description" content="">
|
||||
<meta name="author" content="">
|
||||
|
||||
@ -31,9 +31,13 @@ URL: http://stuffandnonsense.co.uk/projects/320andup
|
||||
<!-- For all browsers -->
|
||||
<link rel="stylesheet" href="css/style.css?v=1">
|
||||
|
||||
<!-- JavaScript at bottom except for Modernizr -->
|
||||
<!-- JavaScript at bottom except for Modernizr and Typekit-->
|
||||
<script src="js/libs/modernizr-1.7.min.js"></script>
|
||||
|
||||
<!-- Typekit -->
|
||||
<script type="text/javascript" src="http://use.typekit.com/ewi2mjz.js"></script>
|
||||
<script type="text/javascript">try{Typekit.load();}catch(e){}</script>
|
||||
|
||||
<!-- For iPhone 4 -->
|
||||
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="img/h/apple-touch-icon.png">
|
||||
<!-- For iPad 1-->
|
||||
@ -59,143 +63,146 @@ URL: http://stuffandnonsense.co.uk/projects/320andup
|
||||
</head>
|
||||
|
||||
<body class="clearfix">
|
||||
|
||||
<header role="banner" class="clearfix">
|
||||
<h1>Dan Barber</h1>
|
||||
<h2>Web Designer & Developer</h2>
|
||||
</header>
|
||||
|
||||
<div class="content clearfix">
|
||||
|
||||
<div role="main">
|
||||
<section>
|
||||
<h3>Profile</h3>
|
||||
<p>10 years of experience building web sites and web applications. I focus on simple, usable interfaces and prefer to work by prototyping ideas.</p>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h3>Skills</h3>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<h4>HTML/CSS</h4>
|
||||
<p>Excellent knowledge of standards and browser engines.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>PHP</h4>
|
||||
<p>Expert level.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>SQL/MySQL/PostgreSQL</h4>
|
||||
<p>Excellent knowledge of SQL and configuration.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>Javascript/jQuery</h4>
|
||||
<p>Sound working knowledge</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>Typography</h4>
|
||||
<p>Good working knowledge.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>Photoshop/GIMP</h4>
|
||||
<p>Good working knowledge.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>Linux Servers</h4>
|
||||
<p>Web (Apache), MySQL, PostgreSQL, DNS, Samba</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>Networking</h4>
|
||||
<p>Good knowledge of cabling, routing and protocols.</p>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h3>Experience</h3>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<h4>Abiquo</h4>
|
||||
<p>June 2010–Present</p>
|
||||
<p>[to be confimed]</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>Deep Blue Sound</h4>
|
||||
<p>Aug 2008–June 2010</p>
|
||||
<p>Administering and augmenting the existing web systems including Moodle, SugarCRM and others.
Deputising for the System Administrator.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>Footwork Solutions</h4>
|
||||
<p>Nov 2002–Aug 2008</p>
|
||||
<p><a href="http://footworksolutions.co.uk">footworksolutions.co.uk</a><br />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.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>Granite Internet</h4>
|
||||
<p>2000–2002</p>
|
||||
<p>Designed and developed and maintained several property company websites based on a single code base. Setup Windows, Linux and FreeBSD servers.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>North Devon Journal</h4>
|
||||
<p>1998–2000</p>
|
||||
<p>Set basic adverts using QuarkXpress and was responsible for laying out the classified pages.
Learnt a lot about typography.</p>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h3>Portfolio</h3>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<h4>NeoMPC</h4>
|
||||
<p><a href="http://pixelhum.com/neompc">pixelhum.com/neompc</a></p>
|
||||
<p>Web based MPD client. Design and execution. Built on PHP and jQuery and uses mpd.class.php.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>Footwork Solutions</h4>
|
||||
<p><a href="http://footworksolutions.co.uk">footworksolutions.co.uk</a></p>
|
||||
<p>Company logo and site design. I built the HTML for the Drupal template.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>Halo</h4>
|
||||
<p>haloteam.com</p>
|
||||
<p>Hosted care co-ordination system for drug treatment agencies. Design, initial implementation and ongoing development of key modules.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>Dan Barber Photo</h4>
|
||||
<p><a href="http://danbarberphoto.com">danbarberphoto.com</a></p>
|
||||
<p>My own photography portfolio site. Designed and implemented the whole site using Ruby on Rails and jQuery, including backend admin pages.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>Dan & Katie</h4>
|
||||
<p><a href="http://wedding.coweyes.co.uk">wedding.coweyes.co.uk</a></p>
|
||||
<p>My own wedding photo site. Design and implementation of theme for ZenPhoto.</p>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h3>Interests</h3>
|
||||
|
||||
<ul>
|
||||
<li>Drumming</li>
|
||||
<li>Music</li>
|
||||
<li>Sound Engineering & Recording</li>
|
||||
<li>Photography</li>
|
||||
<li>Cycling</li>
|
||||
</ul>
|
||||
</section>
|
||||
</div>
|
||||
<div id="page">
|
||||
|
||||
<div role="complementary">
|
||||
</div>
|
||||
<header role="banner" class="clearfix">
|
||||
<h1>Dan Barber</h1>
|
||||
<h2>Web Designer & Developer</h2>
|
||||
</header>
|
||||
|
||||
</div>
|
||||
<div class="content clearfix">
|
||||
|
||||
<footer role="contentinfo" class="clearfix">
|
||||
</footer>
|
||||
<div role="main">
|
||||
<section id="profile">
|
||||
<h3>Profile</h3>
|
||||
<p>10 years of experience building web sites and web applications. I focus on simple, usable interfaces and prefer to work by prototyping ideas.</p>
|
||||
</section>
|
||||
|
||||
<section id="skills">
|
||||
<h3>Skills</h3>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<h4>HTML/CSS</h4>
|
||||
<p>Excellent knowledge of standards and browser engines.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>PHP</h4>
|
||||
<p>Expert level.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>SQL/MySQL/PostgreSQL</h4>
|
||||
<p>Excellent knowledge of SQL and configuration.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>Javascript/jQuery</h4>
|
||||
<p>Sound working knowledge</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>Typography</h4>
|
||||
<p>Good working knowledge.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>Photoshop/GIMP</h4>
|
||||
<p>Good working knowledge.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>Linux Servers</h4>
|
||||
<p>Web (Apache), MySQL, PostgreSQL, DNS, Samba</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>Networking</h4>
|
||||
<p>Good knowledge of cabling, routing and protocols.</p>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section id="experience">
|
||||
<h3>Experience</h3>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<h4>Abiquo</h4>
|
||||
<p>June 2010–Present</p>
|
||||
<p>[to be confimed]</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>Deep Blue Sound</h4>
|
||||
<p>Aug 2008–June 2010</p>
|
||||
<p>Administering and augmenting the existing web systems including Moodle, SugarCRM and others. Deputising for the System Administrator.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>Footwork Solutions</h4>
|
||||
<p>Nov 2002–Aug 2008</p>
|
||||
<p><a href="http://footworksolutions.co.uk">footworksolutions.co.uk</a><br />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.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>Granite Internet</h4>
|
||||
<p>2000–2002</p>
|
||||
<p>Designed and developed and maintained several property company websites based on a single code base. Setup Windows, Linux and FreeBSD servers.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>North Devon Journal</h4>
|
||||
<p>1998–2000</p>
|
||||
<p>Set basic adverts using QuarkXpress and was responsible for laying out the classified pages. Learnt a lot about typography.</p>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section id="portfolio">
|
||||
<h3>Portfolio</h3>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<h4>NeoMPC</h4>
|
||||
<p><a href="http://pixelhum.com/neompc">pixelhum.com/neompc</a></p>
|
||||
<p>Web based MPD client. Design and execution. Built on PHP and jQuery and uses mpd.class.php.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>Footwork Solutions</h4>
|
||||
<p><a href="http://footworksolutions.co.uk">footworksolutions.co.uk</a></p>
|
||||
<p>Company logo and site design. I built the HTML for the Drupal template.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>Halo</h4>
|
||||
<p>haloteam.com</p>
|
||||
<p>Hosted care co-ordination system for drug treatment agencies. Design, initial implementation and ongoing development of key modules.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>Dan Barber Photo</h4>
|
||||
<p><a href="http://danbarberphoto.com">danbarberphoto.com</a></p>
|
||||
<p>My own photography portfolio site. Designed and implemented the whole site using Ruby on Rails and jQuery, including backend admin pages.</p>
|
||||
</li>
|
||||
<li>
|
||||
<h4>Dan & Katie</h4>
|
||||
<p><a href="http://wedding.coweyes.co.uk">wedding.coweyes.co.uk</a></p>
|
||||
<p>My own wedding photo site. Design and implementation of theme for ZenPhoto.</p>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
<section id="interests">
|
||||
<h3>Interests</h3>
|
||||
|
||||
<ul>
|
||||
<li>Drumming</li>
|
||||
<li>Music</li>
|
||||
<li>Sound Engineering & Recording</li>
|
||||
<li>Photography</li>
|
||||
<li>Cycling</li>
|
||||
</ul>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<div role="complementary">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<footer role="contentinfo" class="clearfix">
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
<!-- 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"></script>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user