Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

Tweaked design and layout

  • Loading branch information...
commit 38498899309e362993e6db3ab10921842fa40510 1 parent b79764b
@timols authored
Showing with 51 additions and 74 deletions.
  1. +1 −3 _layouts/base.html
  2. +3 −3 contact.html
  3. +30 −10 css/style.css
  4. +17 −58 index.html
View
4 _layouts/base.html
@@ -25,9 +25,7 @@
<div id="nav">
<a href='/'><h1 id='logo'>tim &nbsp;olshansky</h1></a>
<ul>
- <li class='first'><a href="/about.html">about</a></li>
- <li><a href="/blog.html">blog</a></li>
- <li><a href="/projects.html">projects</a></li>
+ <li class='first'><a href="/blog.html">blog</a></li>
<li class='last'><a href="/contact.html">contact</a></li>
</ul>
</div>
View
6 contact.html
@@ -7,12 +7,12 @@
<p>If you'd like to get in touch, feel free to contact me using any of the following:</p>
<ul id="contact-list">
- <li><a href="https://profiles.google.com/tim.olshansky/about"><img src="/images/google.png"></a><span>View my Google Profile</span></li>
<li><a href="http://au.linkedin.com/in/timols"><img src="/images/linkedin.png"></a><span>Connect on LinkedIn</span></li>
- <li><a href="http://twitter.com/timolsh"><img src="/images/twitter-2.png"></a><span>Follow me on Twitter</span></li>
<li><a href="https://github.com/timols"><img src="/images/github.png"></a><span>Fork a project</span></li>
- <li><a href="http://stackoverflow.com/users/627446/tim-o"><img src="/images/stackoverflow.png"></a><span>Ask me a question</span></li>
+ <li><a href="http://twitter.com/timolsh"><img src="/images/twitter-2.png"></a><span>Follow me on Twitter</span></li>
<li><a href="mailto:tim.olshansky@gmail.com"><img src="/images/email.png"></a><span>Send me an email</span></li>
+ <li><a href="https://profiles.google.com/tim.olshansky/about"><img src="/images/google.png"></a><span>View my Google Profile</span></li>
+ <li><a href="http://stackoverflow.com/users/627446/tim-o"><img src="/images/stackoverflow.png"></a><span>Ask me a question</span></li>
<li><a href="skype:tim.olshansky?call"><img src="/images/skype.png"></a><span>Call me on Skype</span></li>
<li><a href="https://tungle.me/timols"><img src="/images/tungle.png"></a><span>Schedule a meeting</span></li>
</ul>
View
40 css/style.css
@@ -188,10 +188,22 @@ body {
width: 700px;
margin: 0 auto;
}
+a {
+ text-decoration: none;
+}
+#splash a {
+ text-decoration: underline;
+ color: #6f6f6f;
+}
+
+#splash a:hover {
+ text-decoration: underline;
+ color: #6f6f6f;
+}
#logo {
float: left;
- margin: 0 245px 0 0;
+ margin: 0 410px 0 0;
}
#nav {
@@ -225,7 +237,6 @@ body {
#nav li {
font-family: mammagamma;
-/* border-left: 1px solid #000;*/
display: inline;
font-size: 18pt;
margin: 0;
@@ -269,7 +280,6 @@ body {
#main a {
color: #6f6f6f;
- text-decoration: none;
}
#main a:hover {
@@ -303,8 +313,8 @@ body {
#container { width: 700px; margin: 0 auto; padding: 0; }
#contact {
- float: right;
- margin: 30px 30px 0 0;
+ margin: 30px auto 0 auto;
+ display: block;
background-image: url('/images/contact.jpg');
width: 142px;
height: 138px;
@@ -318,15 +328,19 @@ body {
#splash { width: 700px; float: left; text-align: center; display: block; margin: 40px 0; }
#splash h1 { font-size: 66pt; font-weight: normal; margin: 30px 0 50px 0; text-align: center; }
#splash h2 { font-size: 20pt; font-weight: normal; margin: 40px 0; color: #6f6f6f; text-align: center; }
+#splash p {
+ width: 420px;
+ margin: 0 auto 15px auto;
+ font-family: "Helvetica Neue";
+}
.box {
- background-color: black;
- color: white;
+ background-color: white;
+ color: #6f6f6f;
width: 190px;
height: 34px;
- margin: 0 0 0 60px;
+ margin: 0 0 0 36px;
padding: 0;
- border: 1px solid #393939;
float: left;
text-align: center;
text-decoration: none;
@@ -338,11 +352,17 @@ body {
text-align: center;
}
.box.first { margin-left: 0px; }
-.box:hover { color: black; background-color: white; border: 1px solid white; }
+.box:hover { color: black; }
.box_div {
float: left;
text-align: center;
+ border-radius: 4px;
+}
+
+.boxes {
+ width: 420px;
+ margin: 0 auto;
}
.box_div h4 {
View
75 index.html
@@ -9,67 +9,26 @@
<div id='splash'>
<h1>tim olshansky</h1>
<h2>gets stuff done.</h2>
+ <p>Hi! I'm currently using technology to solve business problems for companies in the San Francisco Bay Area.</p>
+ <p class='no-indent'>I build products with software using the latest in web technologies and development methodologies.</p>
+ <p class='no-indent'>I like to make stuff. If you think I can help, please <a href='/contact.html'>get in touch</a>.</p>
</div><!-- splash -->
- <div id='about' class='box_div'>
- <a href='/about.html' class='box first'>
- <h3>about</h3>
- </a>
- <h4>who i am</h4>
- </div><!-- about -->
+ <div class='boxes'>
- <div id='blog' class='box_div'>
- <a href='/blog.html' class='box'>
- <h3>blog</h3>
- </a>
- <h4>what i think</h4>
- </div><!-- blog -->
+ <div id='blog' class='box_div'>
+ <a href='/blog.html' class='box first'>
+ <h3>blog</h3>
+ </a>
+ </div><!-- blog -->
- <div id='projects' class='box_div'>
- <a href='/projects.html' class='box'>
- <h3>projects</h3>
- </a>
- <h4>what i've done</h4>
- </div><!-- projects -->
+ <!-- If you're reading this and wondering what the hell is going on, take it easy. The styling and markup needs work. A job for a later date. -->
+ <div id='projects' class='box_div'>
+ <a href='/contact.html' class='box'>
+ <h3>contact</h3>
+ </a>
+ </div><!-- contact -->
-</div><!-- container -->
-<script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js"></script>
-<script>!window.jQuery && document.write(unescape('%3Cscript src="js/libs/jquery-1.5.1.min.js"%3E%3C/script%3E'))</script>
-<script type='text/javascript'>
- $(document).ready(function () {
-
- var boxes = [
- {
- box: $('#about'),
- enter: 'who i want to be',
- leave: 'who i am'
- },
- {
- box: $('#blog'),
- enter: 'what inspires me',
- leave: 'what i think'
- },
- {
- box: $('#projects'),
- enter: "what i've learned",
- leave: "what i've done"
- }
- ]
-
- $.each(boxes, function () {
- var object = this
- , box = object.box;
+ </div>
- box.find('a').bind('mouseenter', function () {
- var elem = $(this).parent('div').find('h4');
- elem.attr('innerHTML', object.enter);
- });
-
- box.find('a').bind('mouseleave', function () {
- var elem = $(this).parent('div').find('h4');
- elem.attr('innerHTML', object.leave);
- });
- });
-
- });
-</script>
+</div><!-- container -->
Please sign in to comment.
Something went wrong with that request. Please try again.