Skip to content
Browse files

improvements to sidebar

  • Loading branch information...
1 parent 25f8dd3 commit 8fa3ad2b1613da172a6e48b1a232b12c339d8bd8 @adamcooke committed Dec 12, 2013
View
144 assets/css/screen.css
@@ -2,12 +2,79 @@
html { font-family:'proxima-nova', Arial, sans-serif; font-size:12px;}
+/* Icons */
+@font-face {
+ font-family: "icons";
+ src:url("../fonts/blog.eot");
+ src:url("../fonts/blog.eot?#iefix") format("embedded-opentype"),
+ url("../fonts/blog.woff") format("woff"),
+ url("../fonts/blog.ttf") format("truetype"),
+ url("../fonts/blog.svg#blog") format("svg");
+ font-weight: normal;
+ font-style: normal;
+}
+
+[data-icon]:before {
+ font-family: "icons" !important;
+ content: attr(data-icon);
+ font-style: normal !important;
+ font-weight: normal !important;
+ font-variant: normal !important;
+ text-transform: none !important;
+ speak: none;
+ line-height: 1;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+}
+
+[class^="icon-"]:before,
+[class*=" icon-"]:before {
+ font-family: "icons" !important;
+ font-style: normal !important;
+ font-weight: normal !important;
+ font-variant: normal !important;
+ text-transform: none !important;
+ speak: none;
+ line-height: 1;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+}
+
+.icon-opensource:before {
+ content: "a";
+}
+.icon-blog:before {
+ content: "b";
+}
+.icon-about:before {
+ content: "c";
+}
+.icon-projects:before {
+ content: "d";
+}
+.icon-linkedin:before {
+ content: "e";
+}
+.icon-twitter:before {
+ content: "f";
+}
+.icon-github:before {
+ content: "g";
+}
+.icon-youtube:before {
+ content: "h";
+}
+.icon-dribbble:before {
+ content: "j";
+}
+
+
/*
Navigation
*/
nav.main {
- background:url('../img/me.png') #292422 no-repeat -25px bottom;
+ background:url('../img/me.png') #292422 no-repeat -35px bottom;
background-size:150px;
width:300px;
position:fixed;
@@ -19,7 +86,7 @@ nav.main {
nav.main div.inner {
position:fixed;
bottom:0;
- height:560px;
+ height:460px;
width:240px;
padding-left:40px;
}
@@ -59,14 +126,38 @@ nav.main div.inner ul.social li a b {
color:#afa29a;
}
-nav.main div.inner div.group.pages ul.social li a{
- font-size:1.1em;
+nav.main div.inner div.group ul.nav li {
+ clear:both;
+ margin-bottom:15px;
}
-nav.main div.inner div.group.pages ul.social li a b{
+nav.main div.inner div.group ul.nav li:last-child {
+ margin-bottom:0;
+}
+
+nav.main div.inner div.group ul.nav li a {
+ margin-left:5px;
color:#fff;
+ font-size:1.3em;
+ text-decoration:none;
+ padding-bottom:2px;
}
+nav.main div.inner div.group ul.nav li i {
+ color:rgba(255,255,255,0.3);
+ float:left;
+ margin-top:-2px;
+ width:28px;
+ height:28px;
+ font-size:1.5em;
+}
+
+nav.main div.inner div.group ul.nav li a:hover {
+ border-bottom:1px solid #726358;
+}
+
+
+
/*
Header
@@ -77,13 +168,13 @@ header.main {
color:#fff;
width:300px;
bottom:0;
- height:100px;
+ height:120px;
left:0;
z-index:10;
}
header.main h1, header.main p {
- margin-left:105px;
+ margin-left:100px;
}
header.main h1 a {
@@ -92,12 +183,39 @@ header.main h1 a {
text-decoration:none;
}
-header.main p {
+header.main p.title {
margin-top:2px;
font-family:adelle, georgia, sans-serif;
color:rgba(255,255,255,0.4);
}
+header.main p.social {
+ margin-top:8px;
+}
+
+header.main p.social a {
+ color:#fff;
+ text-decoration:none;
+ margin-right:5px;
+ display:inline-block;
+ height:20px;
+ width:20px;
+}
+
+
+header.main p.social a i {
+ font-size:1.6em;
+ color:#797674;
+}
+
+header.main p.social a:hover i {
+ color:#fff;
+}
+
+header.main p.social a span {
+ display:none;
+}
+
/*
Content area
*/
@@ -335,24 +453,23 @@ section.content footer.global {
Small
*/
-@media all and (max-height:650px) {
- nav.main div.inner div.group.elsewhere { display:none; }
- nav.main div.inner { height:400px; }
-}
-
@media all and (max-width:900px), (max-height:500px) {
nav.main { position:relative; background:#F8F5F3; width:inherit;border-bottom:1px solid #ded1c9;}
nav.main div.inner { position:relative;height:inherit; padding:20px 40px; overflow:hidden; width:inherit;}
nav.main div.inner h2 { color:#292422;}
+ nav.main div.inner div.group.pages ul li a { color:#292422;}
+ nav.main div.inner div.group.pages ul li i { color:#292422;}
nav.main div.inner div.group ul.social li a b { color:#292422 !important; }
nav.main div.inner div.group { float:left;clear:none; margin-top:0; margin-right:60px;}
nav.main div.inner div.group:last-child { margin-right:0;}
header.main {background-color:#292422; width:inherit; padding:20px 40px; height:inherit; position:relative;}
header.main h1, header.main p { margin-left:0;}
header.main h1 { font-size:0.7em; float:left; margin-right:15px}
header.main p { margin-left:5px;}
+ header.main p.social { float:right;margin-top:-20px;}
+ header.main p.social a { margin-right:0; margin-left:5px;}
section.content { margin-left:0; padding:40px;}
}
@@ -363,6 +480,7 @@ section.content footer.global {
@media all and (max-width:560px) {
nav.main div.inner div.group.companies { display:none; }
+ header.main p.social { display:none;}
}
@media all and (max-width:400px) {
View
BIN assets/fonts/blog.eot
Binary file not shown.
View
19 assets/fonts/blog.svg
@@ -0,0 +1,19 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg">
+<metadata>Generated by Fontastic.me</metadata>
+<defs>
+<font id="adam-cookes-blog" horiz-adv-x="512">
+<font-face font-family="adam-cookes-blog" units-per-em="512" ascent="480" descent="-32"/>
+<missing-glyph horiz-adv-x="512" />
+
+<glyph unicode="&#97;" d="m309 405l-117 0c-6 0-11-4-11-10c0-6 5-11 11-11l117 0c6 0 11 5 11 11c0 6-5 10-11 10z m0-64l-117 0c-6 0-11-4-11-10c0-6 5-11 11-11l117 0c6 0 11 5 11 11c0 6-5 10-11 10z m0-64l-117 0c-6 0-11-4-11-10c0-6 5-11 11-11l117 0c6 0 11 5 11 11c0 6-5 10-11 10z m0-64l-117 0c-6 0-11-4-11-10c0-6 5-11 11-11l117 0c6 0 11 5 11 11c0 6-5 10-11 10z m139 299c-3 0-5 0-8-1c-1 1-2 1-3 1l-256 0c-41 0-74-33-74-75l0-288l-32 0c-41 0-75-33-75-74c0-42 34-75 75-75l256 0c41 0 74 33 74 75l0 352l96 0c6 0 11 4 11 10c0 44-26 75-64 75z m-373-491c-30 0-54 24-54 54c0 29 24 53 54 53l203 0c-13-14-22-32-22-53c0-21 9-40 22-54z m309 54c0-30-24-54-53-54c-30 0-54 24-54 54c0 29 24 53 54 53c6 0 10 5 10 11c0 6-4 10-10 10l-203 0l0 288c0 30 24 54 53 54l219 0c-10-12-16-27-16-43z m21 373c0 24 19 43 43 43c23 0 39-17 42-43z"/>
+<glyph unicode="&#98;" d="m269 43l42 0c6 0 11 4 11 10c0 6-5 11-11 11l-42 0c-6 0-11-5-11-11c0-6 5-10 11-10z m-107 128c6 0 11 4 11 10l0 278c0 6-5 10-11 10c-6 0-11-4-11-10l0-278c0-6 5-10 11-10z m21-22l-42 0c-6 0-11-4-11-10l0-86c0-6 5-10 11-10l42 0c6 0 11 4 11 10l0 86c0 6-5 10-11 10z m-10-85l-22 0l0 64l22 0z m117 21c6 0 11 5 11 11l0 192c0 6-5 11-11 11c-6 0-11-5-11-11l0-192c0-6 5-11 11-11z m-235 299c-6 0-10-5-10-11l0-298c0-6 4-11 10-11c6 0 11 5 11 11l0 298c0 6-5 11-11 11z m457-355l-107 413c-1 6-7 10-13 8l-62-16c-3-1-5-2-6-5c-2-2-2-5-2-8l21-80l-106 0l0 160c0 6-5 11-11 11l-128 0c-6 0-11-5-11-11l0-53l-74 0c-6 0-11-5-11-11l0-426c0-6 5-11 11-11l341 0c6 0 11 5 11 11l0 246l64-249c1-5 6-8 10-8c1 0 2 0 3 0l62 16c6 2 9 8 8 13z m-489 398l64 0l0-406l-64 0z m86 10l0 54l106 0l0-470l-106 0z m234-416l-106 0l0 299l106 0z m104 3l-101 392l41 11l101-393z"/>
+<glyph unicode="&#99;" d="m256 512c-141 0-256-115-256-256c0-68 26-132 74-180c49-49 113-76 182-76c69 0 134 27 182 76c0 0 0 0 0 0c48 48 74 112 74 180c0 141-115 256-256 256z m0-491c-59 0-114 22-157 61c22 12 54 23 86 35c11 4 22 8 32 12c4 1 7 5 7 10l0 53c0 5-3 9-7 10c-1 0-25 10-25 54c0 6-4 11-10 11c-1 0-3 4-3 10c0 6 2 10 2 11c6 0 11 5 11 11c0 2-1 5-3 11c-3 11-11 41-4 51c1 1 3 3 8 3c3 0 5-1 8-1c5-1 11 2 12 8c3 14 28 24 59 24c31 0 56-10 59-24c5-20-4-47-8-60c-2-6-3-9-3-12c0-6 4-11 10-11c1-1 3-5 3-11c0-6-2-10-2-10c-6 0-11-5-11-11c0-44-24-54-25-54c-4-1-7-5-7-10l0-53c0-5 3-9 7-10c11-5 23-9 34-13c32-12 63-23 84-34c-43-39-98-61-157-61z m173 76c-22 14-55 26-92 39c-9 3-19 7-28 10l0 39c11 7 30 24 32 63c8 5 14 16 14 29c0 13-5 23-12 28c6 16 15 46 9 71c-8 30-48 40-80 40c-29 0-64-8-76-31c-15 1-23-6-28-11c-13-18-4-51 1-69c-7-5-12-15-12-28c0-13 6-24 14-29c2-39 21-56 32-63l0-39c-9-3-17-6-25-9c-35-13-71-26-95-40c-40 44-62 100-62 159c0 129 106 235 235 235c129 0 235-106 235-235c0-59-22-115-62-159z"/>
+<glyph unicode="&#100;" d="m480 320l-129 0c-5 48-46 85-95 85c-49 0-90-37-95-85l-129 0c-6 0-11-5-11-11l0-298c0-6 5-11 11-11l448 0c6 0 11 5 11 11l0 298c0 6-5 11-11 11z m-224 64c38 0 69-28 74-64l-148 0c5 36 36 64 74 64z m213-85l0-86l-170 0l0 11c0 6-5 11-11 11l-64 0c-6 0-11-5-11-11l0-11l-170 0l0 86z m-234-86l42 0l0-64l-42 0z m-192-192l0 171l170 0l0-53c0-6 5-11 11-11l64 0c6 0 11 5 11 11l0 53l170 0l0-171z"/>
+<glyph unicode="&#101;" d="m450 483l-393 0c-19 0-34-14-34-33l0-394c0-19 15-34 34-34l393 0c19 0 34 15 34 34l0 394c0 19-15 33-34 33z m-287-385l-70 0l0 208l70 0z m-35 236l0 0c-24 0-39 16-39 36c0 20 16 36 39 36c24 0 39-16 39-36c0-20-15-36-39-36z m286-236l-70 0l0 111c0 28-10 47-35 47c-19 0-31-13-36-25c-2-5-2-11-2-17l0-116l-70 0c0 0 1 188 0 208l70 0l0-30c9 14 26 35 63 35c45 0 80-30 80-94z m-143 177c0 1 0 1 0 1l0-1z"/>
+<glyph unicode="&#102;" d="m434 274c26 2 44 13 50 29c-9-5-38-12-54-6c-1 4-2 8-2 11c-13 45-54 81-98 76c3 2 7 3 11 4c4 2 33 7 28 17c-4 9-38-7-45-9c9 3 23 9 25 19c-13-2-26-8-36-17c3 4 6 8 7 13c-35-22-56-67-73-111c-13 13-24 23-34 28c-29 16-64 32-119 52c-1-18 9-42 40-58c-7 1-19-1-29-3c4-21 17-38 52-46c-16-1-24-5-32-13c8-14 25-31 57-27c-35-16-14-44 15-40c-50-50-127-47-171-4c116-158 368-94 405 59c29-1 45 9 55 20c-16-2-39 0-52 6z"/>
+<glyph unicode="&#103;" d="m362 435c6-14 10-36 4-53c24-20 32-69 21-109c33-3 73 1 99-9c-24 3-57 9-88 7c-6-1-15 0-15-8c37-3 73-6 102-16c-29 5-65 13-102 14c-15-30-45-45-87-48c4-10 13-14 15-29c3-24-5-59 3-74c4-8 10-8 14-15c-10-12-35 2-38 15c-5 22 7 56-6 71c1-24-6-58 1-80c2-8 10-11 8-19c-48-5-28 62-36 102c-7-1-4-11-4-16c0-38 8-91-34-86c-1 8 6 11 8 18c8 22-1 54 3 81c-16-12 1-54-9-76c-5-12-24-17-37-12c1 9 11 8 15 17c6 11 0 29 2 46c-29-6-52 1-63 19c-5 9-6 18-13 26c-5 7-15 8-18 18c36 9 38-37 71-38c10-1 15 2 24 5c3 11 8 20 16 26c-40 6-74 18-89 49c-37-2-71-7-102-15c28 11 63 14 101 16c-3 13-22 9-34 9c-22-1-51-4-68-7c25 9 62 8 96 8c-10 33-7 86 17 106c-7 17-5 44 4 57c26-1 42-12 58-23c20 5 42 8 69 7c12-1 24-6 33-5c9 1 18 10 26 14c11 5 21 7 33 7z"/>
+<glyph unicode="&#104;" d="m389 149l-25 0l0 15c0 7 5 12 12 12l1 0c7 0 12-5 12-12z m-95 32c-6 0-12-4-12-10l0-71c0-5 6-10 12-10c6 0 12 5 12 10l0 71c0 6-6 10-12 10z m154 40l0-136c0-33-28-59-63-59l-258 0c-35 0-63 26-63 59l0 136c0 32 28 59 63 59l258 0c35 0 63-27 63-59z m-304-151l0 143l32 0l0 21l-85 1l0-21l26 0l0-144z m96 122l-27 0l0-76c0-12 1-17 0-19c-2-6-12-12-15-1c-1 2 0 8 0 19l-1 77l-26 0l0-76c0-11 0-20 0-24c1-7 0-15 7-20c12-8 35 2 41 14l0-16l21 0l0 122z m85-88l0 64c0 24-18 39-42 19l0 47l-27 0l0-163l22 1l2 10c28-26 46-8 45 22z m84 9l-20 0c0-1 0-2 0-3l0-11c0-6-5-11-11-11l-4 0c-6 0-11 5-11 11l0 29l46 0l0 17c0 13 0 26-1 33c-4 23-36 26-52 15c-5-4-9-9-11-15c-2-7-3-16-3-27l0-38c0-63 76-54 67 0z m-103 206c2-4 4-6 7-8c3-2 6-3 11-3c4 0 7 1 10 3c3 2 5 5 7 9l0-10l30 0l0 127l-24 0l0-99c0-5-4-10-10-10c-5 0-9 5-9 10l0 99l-25 0l0-86c0-11 0-18 1-22c0-3 1-7 2-10z m-90 71c0 12 1 22 3 29c2 7 6 12 11 16c5 4 12 6 20 6c7 0 13-1 18-4c5-2 9-6 11-10c3-4 5-9 6-13c1-5 1-12 1-21l0-32c0-12 0-20-1-26c-1-5-3-10-6-15c-3-5-7-8-11-11c-5-2-10-3-16-3c-7 0-13 1-18 3c-4 2-8 5-11 9c-2 4-4 8-5 14c-1 5-2 14-2 25l0 33z m23-50c0-7 6-13 12-13c7 0 12 6 12 13l0 67c0 8-5 13-12 13c-6 0-12-5-12-13z m-82-34l28 0l0 97l33 83l-30 0l-18-62l-18 62l-30 0l35-83z"/>
+<glyph unicode="&#106;" d="m256 486c-127 0-230-103-230-230c0-127 103-230 230-230c127 0 230 103 230 230c0 127-103 230-230 230z m141-119c23-29 37-64 38-103c-26 6-50 9-73 9l0 0l0 0c-19 0-36-2-52-5c-4 10-8 19-12 28c36 16 71 39 99 71z m-141 69c42 0 81-15 112-40c-23-28-55-48-88-63c-24 46-47 78-62 98c12 3 25 5 38 5z m-79-19c12-15 37-47 64-98c-55-16-109-20-142-20c-1 0-2 0-3 0l0 0c-6 0-10 0-14 1c12 51 48 94 95 117z m-101-161c0 1 0 2 0 3c5-1 12-1 20-1l0 0c36 0 99 3 163 24c4-8 7-16 11-24c-43-14-77-37-102-60c-24-22-40-43-49-58c-27 32-43 72-43 116z m180-180c-40 0-77 13-107 36c7 10 20 30 42 51c22 21 53 43 93 57c14-39 26-83 36-132c-20-8-42-12-64-12z m102 32c-9 45-21 85-33 121c11 2 23 3 36 3l1 0c21 0 45-3 70-9c-8-47-36-88-74-115z"/>
+</font></defs></svg>
View
BIN assets/fonts/blog.ttf
Binary file not shown.
View
BIN assets/fonts/blog.woff
Binary file not shown.
View
21 default.hbs
@@ -21,16 +21,24 @@
<header class='main'>
<h1><a href='/'>Adam Cooke</a></h1>
<p class='title'>Software designer &amp; developer</p>
+ <p class="social">
+ <a href='http://twitter.com/adamcooke'><i class='icon-twitter'></i><span>Follow me on <b>Twitter</b></span></a>
+ <a href='http://github.com/adamcooke'><i class='icon-github'></i><span>Check out my code on <b>GitHub</b></span></a>
+ <a href='http://dribbble.com/adamcooke'><i class='icon-dribbble'></i><span>View some of my designs on <b>Dribbble</span></b></a>
+ <a href='http://uk.linkedin.com/in/adamcooke'><i class='icon-linkedin'></i><span>Take a look at my <b>Linked In</b> profile</span></a>
+ <a href='http://www.youtube.com/channel/UCCbaAVqi9Kt7Wm_dBbDYVmg/videos'><i class='icon-youtube'></i><span>Watch my videos on <b>YouTube</b></span></a>
+
+ </p>
</header>
<nav class='main'>
<div class='inner'>
<div class='group pages'>
- <ul class='social'>
- <li><a href='/'><b>My blog</b> - my rambling blog posts</a></li>
- <li><a href='/me/'><b>About me</b> - a little about me</a></li>
- <li><a href='/projects/'><b>Things I've done</b> - a projects list</a></li>
- <li><a href='/opensource/'><b>Open source projects</b> - giving back</a></li>
+ <ul class='nav'>
+ <li><i class='icon-blog'></i><a class='blog' href='/'>Home</a></li>
+ <li><i class='icon-about'></i><a class='about' href='/me/'>About me</a></li>
+ <li><i class='icon-projects'></i><a class='projects' href='/projects/'>Things I've done</a></li>
+ <li><i class='icon-opensource'></i><a class='opensource' href='/opensource/'>Open source projects</a></li>
</ul>
</div>
@@ -43,6 +51,8 @@
<li><a href='http://fusionwifi.com'><b>FusionWiFi</b> - business WiFi solutions</a></li>
</ul>
</div>
+
+ <!---
<div class='group elsewhere'>
<h2>Elsewhere</h2>
<ul class='social'>
@@ -52,6 +62,7 @@
<li><a href='http://uk.linkedin.com/in/adamcooke'>Take a look at my <b>Linked In</b> profile</a></li>
</ul>
</div>
+ -->
</div>
</nav>

0 comments on commit 8fa3ad2

Please sign in to comment.
Something went wrong with that request. Please try again.