Permalink
Browse files

New look again :D

  • Loading branch information...
1 parent 9928bdb commit b5473649ea0c36f1dcc0d5349dad2f6c0cfaf728 @excid3 committed Feb 9, 2011
Showing with 55 additions and 95 deletions.
  1. BIN images/email.png
  2. BIN images/github.png
  3. BIN images/twitter.png
  4. +15 −30 index.html
  5. +40 −65 style.css
View
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
@@ -13,42 +13,27 @@
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
</head>
<body>
- <div id="container">
- <div id="main">
+ <div id="container">
+ <div id="header">
+ <a href="/"><img class="avatar" src="http://www.gravatar.com/avatar/ce795239ba5dd2384fc2f88ffaff5451" /></a>
<div class="name">Hi, I'm Chris Oliver.</div>
- <div class="dev">I'm a developer &amp; love to create</div>
- </div>
-
- <div id="projects">
- <a href="http://keryxproject.org">
- <img src="images/keryx.png" alt="Keryx" />
- <p>Install Software Offline</p>
- </a>
- <a href="http://fluttrly.com">
- <img src="images/fluttrly.png" alt="Fluttr" />
- <p>Fluttrly Todo List</p>
- </a>
- <a href="http://excid3.com/blog">
- <img src="images/blog.png" alt="Blog" />
- <p>Read My Thoughts</p>
- </a>
- <a href="http://github.com/excid3">
- <img src="images/github.png" alt="Github" />
- <p>Fork Me On Github</p>
- </a>
+ <div class="dev">I'm a software engineer</div>
+ <div>
+ <a href="http://twitter.com/excid3"><img src="images/twitter.png" alt="twitter" /></a>
+ <a href="http://github.com/excid3"><img src="images/github.png" alt="Github" /></a>
+ <a href="mailto:excid3@gmail.com"><img src="images/email.png" alt="email" /></a><D-r>
+ </div>
</div>
- <div style="clear:both"></div>
+ <ul id="projects">
+ <li class="first"><a href="http://excid3.com/blog">My blog about linux, programming, and life.</a></li>
+ <li>I created a package management system for offline Linux users called <a href="http://keryxproject.org">Keryx</a>.</li>
+ <li><a href="http://fluttrly.com">Fluttrly</a> is a minimalist todo list app I wrote.</li>
+ <li>A <a href="http://projects.excid3.com">list of projects</a> I'm currently working on.</li>
+ </ul>
- <div id="footer">
- <a href="mailto:excid3@gmail.com">Email</a> |
- <a href="http://twitter.com/excid3">Twitter</a> |
- <a href="http://github.com/excid3">Github</a> |
- <a href="http://excid3.com/blog">Blog</a>
- </div>
</div>
-
<!-- Google Analytics -->
<script type="text/javascript">
View
105 style.css
@@ -10,82 +10,57 @@ a img{border:none;}
/* Page
-------------------------------------------------------------- */
body {
- background: #FAFAFA;
- background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, .15)), color-stop(.75, transparent))
- font-family: "minion-pro-1","minion-pro-2", "Times New Roman", Georgia, serif;
- text-align: center;
- text-shadow: white 1px 1px 0;
+ background: white;
+ font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
+ text-shadow: #DFDFDF 1px 1px 0;
}
+a { color: #36B; text-decoration: none; }
+a:hover { text-decoration: underline; }
+
#container {
- margin: 0px auto 35px;
- width:825px;
- padding-top: 60px;
+ margin: 10px auto;
+ padding: 0;
+ width: 400px;
}
-
-#main {
- line-height: .9;
+#header {
+ margin-top: 140px;
+ overflow: hidden;
+ width: 400px;
}
-
-#footer {
- clear: both;
- color: #666;
- font: 13.34px helvetica,arial,freesans,clean,sans-serif;
- margin-top: 15px;
-}
-
-
-#projects a {
- background: white;
- background: -moz-gradient(linear, left top, left bottom, from(white), to(#E8E8E8)) !important;
- background: -webkit-gradient(linear, left top, left bottom, from(white), to(#E8E8E8)) !important;
- border: 1px solid #CCC;
- border-radius: 5px;
- -moz-border-radius: 5px;
- -webkit-border-radius: 5px;
- box-shadow: 0 0 5px #FFF;
- -moz-box-shadow: 0 0 5px #FFF;
- -webkit-box-shadow: 0 0 5px #FFF;
- color: #369;
- font: 13.34px helvetica,arial,freesans,clean,sans-serif;
- font-weight: bold;
+#header .avatar {
+ border: 1px solid #DFDFDF;
float: left;
- margin: 15px 20px 5px 0;
- padding: 20px 10px 10px;
- text-decoration: none;
- width: 160px;
-}
-#projects a:hover {
- background: -moz-gradient(linear, left bottom, left top, from(white), to(#E8E8E8)) !important;
- background: -webkit-gradient(linear, left bottom, left top, from(white), to(#E8E8E8)) !important;
- color: #222;
- -webkit-transition: all .1s ease-out;
-}
-
-#footer, #footer a {
- color: #888;
- text-decoration: none;
+ margin-right: 15px;
+ padding: 5px;
}
+#header .avatar:hover {
+ border: 1px solid #CCC;
-#footer {
- margin-top: 45px;
+ box-shadow: 1px 1px 5px #999;
+ -moz-box-shadow: 1px 1px 5px #999;
+ -webkit-box-shadow: 1px 1px 5px #999;
}
-#footer a {
- margin: 0 10px;
+#header .name {
+ font-size: 28px;
+ letter-spacing: -1px;
+ padding-top: 5px;
}
-#footer a:hover {
- color: #000;
+#header .dev {
+ color: #C00;
+ font-size: 18px;
+ margin-bottom: 5px;
}
-.name {
- font-size: 78px;
- letter-spacing: -2px;
+#projects {
+ list-style: none;
+ margin: 25px auto;
}
-.dev {
- color: #C00;
- font-size: 24px;
- letter-spacing: 5px;
- line-height: 1;
- margin-bottom:45px;
- text-transform: uppercase;
+#projects li {
+ border-top: 1px solid #EFEFEF;
+ padding: 15px;
+ text-align: center;
+}
+#projects .first {
+ border: none;
}

0 comments on commit b547364

Please sign in to comment.