Permalink
Browse files

more layout work

  • Loading branch information...
1 parent 8c108f6 commit 9dd46d87e977af0a687727bd7df88fdd2dc56918 @jschementi committed Apr 3, 2010
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
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.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
@@ -3,16 +3,26 @@
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
<title>Jimmy.Schementi.com</title>
- <script src="http://code.jquery.com/jquery-1.4.1.min.js" type="text/javascript"></script>
+ <!--<script src="http://code.jquery.com/jquery-1.4.1.min.js" type="text/javascript"></script> -->
+ <script src="jquery-1.4.1.min.js" type="text/javascript"></script>
<style type="text/css" media="screen">
body {
padding: 0; margin: 0;
font-family: helvetica, arial, sans-serif;
font-size: 12px;
text-align: center;
- background-color: #efefef;
+ background-color: white;
+ color: #111;
}
-
+
+ a {
+ color: #0077CC;
+ text-decoration: none;
+ }
+ a:hover {
+ text-decoration: underline;
+ }
+
#page {
margin: 0 auto;
text-align: left;
@@ -36,6 +46,9 @@
color: black;
text-decoration: none;
}
+ #header h1 a:hover {
+ color: #444;
+ }
#header ul#main-menu {
padding: 0;
@@ -62,57 +75,24 @@
padding: 0 5px;
margin: 0;
}
- #header ul#main-menu li a:hover {
+ #navigation {
+ }
+ #navigation #main-menu li a:hover {
color: #444;
}
- #header ul#main-menu li a#active {
+ #main-menu a#active {
font-size: 1.5em;
}
- #header ul#main-menu li a:hover#active {
+ #navigation #main-menu li a:hover#active {
color: black;
}
#body {
padding: 1em;
}
- .article {
- border: 1px solid black;
- padding: 5px;
- margin-bottom: 5px;
- }
- .article h3 {
- margin: 0;
- }
-
- .date {
- border: 1px solid black;
- text-align: center;
- display: block;
- float: left;
- width: 44px;
- height: 44px;
- padding: 4px;
- margin-right: 10px;
- }
- .date .month {
- font-size: 0.9em;
- line-height: 0.5em;
- display: block;
- }
- .date .day {
- font-size: 2.4em;
- display: block;
- }
- .date .year {
- font-size: 0.8em;
- line-height: 0.5em;
- display: block;
- }
-
.section {
float: left;
- border: 1px solid gray;
margin-bottom: 1%;
margin-left: 1%;
}
@@ -133,45 +113,85 @@
width: 73%;
}
+ .section h2 {
+ margin: 0;
+ font-weight: normal;
+ font-size: 2.5em;
+ }
+
+ .islands {
+ border-left: 10px solid #ddd;
+ margin-top: 10px;
+ }
+ .area {
+ padding: 10px;
+ }
+ .island {
+ padding: 10px;
+ }
+ .island:hover {
+ cursor: pointer;
+ }
+
+ .article h3 {
+ margin: 0;
+ font-size: 1.5em;
+ }
+
+ #home-projects h3 {
+ margin: 0;
+ }
+ #home-projects h3 a img {
+ border: 0;
+ }
+ #home-projects .project p {
+ margin: 0px;
+ margin-top: 10px;
+ }
</style>
<script type="text/javascript">
var navigateTo = function(topic) {
$('.topic').hide();
$(topic).show();
- $('#main-menu a').removeAttr('id');
- $('#main-menu a[href=' + topic + ']').attr('id', 'active');
+ $('#navigation a').removeAttr('id');
+ $('#navigation a[href=' + topic + ']').attr('id', 'active');
}
$(document).ready(function() {
$('.topic').hide();
if (location.hash.length == 0) {
- navigateTo('#me');
+ navigateTo('#home');
} else {
navigateTo(location.hash)
}
- var onMenuClick = function() {
+ $('#navigation a').click(function() {
navigateTo($(this).attr('href'));
- }
- $('#main-menu a').click(onMenuClick);
- $('#header h1 a').click(onMenuClick);
+ }
+ );
+ $('.island').click(function() {
+ window.location.href = $('h3 a', $(this)).attr('href')
+ });
})
+
</script>
</head>
<body>
<div id="page">
<div id="header">
- <h1><a href="#home">Jimmy Schementi</a></h1>
- <ul id="main-menu">
- <li class='arrow'>&rsaquo;</li>
- <li><a href="#code">code</a></li>
- <li><a href="#writing">write</a></li>
- <li><a href="#music">music</a></li>
- <li><a href="#photos">photo</a></li>
- <li><a href="#art">art</a></li>
- </ul>
+ <div id="navigation">
+ <h1><a href="#home">Jimmy Schementi</a></h1>
+ <ul id="main-menu">
+ <li class='arrow'>&rsaquo;</li>
+ <li><a href="#code">code</a></li>
+ <li><a href="#writing">write</a></li>
+ <li><a href="#music">music</a></li>
+ <li><a href="#photos">photo</a></li>
+ <li><a href="#art">art</a></li>
+ </ul>
+ </div>
</div>
<div id="body">
@@ -180,74 +200,94 @@ <h1><a href="#home">Jimmy Schementi</a></h1>
<a name="home"></a>
<div id="home-writing" class='section half first'>
- <div class='article'>
- <span class='date'>
- <span class='month'>Mar</span>
- <span class='day'>24</span>
- <span class='year'>2010</span>
- </span>
+ <h2>Writing</h2>
+ <div class='islands'>
+ <div class='article island'>
<h3 class='title'><a href="">MIX10 - IronRuby and IronPython - Part 1 (Intro)</a></h3>
<div class="body">
This past week I had the pleasure of attending and speaking at MIX10 in Las Vegas
about using IronRuby and IronPython on the web. If you're a TV-person instead of
a reading-person, here's a video of the talk ...
</div>
- <div class="actions">
- <a href="">Read more &raquo;</a>
+ <div class='tags'>
+ <a href=''>Python</a>, <a href=''>Ruby</a>, <a href="">IronRuby</a>, <a href=''>IronPython</a>, <a href=''>Silverlight</a>
</div>
</div>
- <div class='article'>
- <span class='date'>
- <span class='month'>Mar</span>
- <span class='day'>5</span>
- <span class='year'>2010</span>
- </span>
- <h3 class='title'><a href=''>PyCon 2010: Python in the browser</a></h3>
+ <div class='article island'>
+ <h3 class='title'><a href="">PyCon 2010 - Python in the browser</a></h3>
<div class='body'>
Last weekend I was very fortunate to speak at PyCon 2010 in Atlanta about writing
browser-based applications in Python. A majority of the IronPython team was also there;
Dino Viehland spoke about IronPython Tooling ...
</div>
- <div class="actions">
- <a href="">Read more &raquo;</a>
+ <div class="tags">
+ <a href=''>Python</a>, <a href=''>IronPython</a>, <a href=''>Silverlight</a>
</div>
</div>
</div>
+ </div>
<div id="home-projects" class='section quarter'>
- <h2>Projects</h2>
- <h3><a href="http://ironruby.net">IronRuby</a></h3>
- <p>
- About IronRuby
- </p>
- <h3><a href="http://cite.me">Cite.me</a></h3>
- <p>
- About SourceAid
- </p>
- <h3><a href="http://assistment.org">Assistment</a></h3>
- <p>
- About Assistment
- </p>
+ <h2>Software projects</h2>
+ <div class='islands'>
+ <div class='project island'>
+ <h3><a id='ironruby' href="ironruby"><img src='images/projects/ir-logo.png' width='150' height='42' alt='IronRuby' /></a></h3>
+ <p>
+ IronRuby is a implementation of the Ruby programming language for the
+ Microsoft.NET and Mono frameworks. Ruby developers can run
+ their applications on .NET, existing .NET developers can use Ruby as
+ a scripting and embedding language, and client web-developers can use
+ Ruby as a programming language in the browser.
+ </p>
+ </div>
+ <div class='project island'>
+ <h3><a id='sourceaid' href="sourceaid"><img src='images/projects/sourceaid_logo.gif' width='150' height='60' alt='SourceAid' /></a></h3>
+ <p>
+ SourceAid provides research and citation tools and resources to
+ students, professors, and entire institutions to help stop plagiarism
+ across all sectors of academic communities.
+ </p>
+ </div>
+ <div class='project island'>
+ <h3><a id='assistment' href="assistment"><img src='images/projects/assistment-logo.png' width='150' height='32' alt='Assistment' /></a></h3>
+ <p>
+ The Assistment system assists students in learning mathematics and gives
+ teachers assessment of their students' progress.
+ </p>
+ </div>
+ </div>
</div>
<div id="home-connections" class='section quarter'>
- <ul>
- <li><a href="http://www.linkedin.com/in/jschementi">LinkedIn</a>: professional network</li>
- <li><a href="http://www.facebook.com/profile.php?id=29100024">Facebook</a>: personal network</li>
- </ul>
+ <h2>About me</h2>
+ <div class='islands'>
+ <div class='area'>
+ <a href="http://www.linkedin.com/in/jschementi" >
+ <img src="http://www.linkedin.com/img/webpromo/btn_viewmy_160x33.png" width="160" height="33" border="0" alt="View Jimmy Schementi's profile on LinkedIn">
+ </a>
+ </div>
+ <div class='area'>
+ <a href="http://www.facebook.com/jschementi" title="Jimmy Schementi" target="_TOP"><img src="http://badge.facebook.com/badge/29100024.194.1526369336.png" width="120" height="132" style="border: 0px;" /></a>
+ <br />
+ <a href="http://www.facebook.com/jschementi">Personal network</a>
+ </div>
+ </div>
</div>
<div id="home-photos" class='section third first'>
+ <h2>Photography</h2>
TODO flickr photos
</div>
<div id='home-music' class='section third'>
+ <h2>Music</h2>
TODO music
</div>
<div id='home-art' class='section third'>
- TODO paintings/sketches
+ <h2>Artwork</h2>
+ TODO paintings sketches
</div>
</div>
Oops, something went wrong.

0 comments on commit 9dd46d8

Please sign in to comment.