Initial commit with basic website design

.gitignore

@@ -0,0 +1 @@
+node_modules

README

@@ -0,0 +1,3 @@
+## MikeValstar.com 
+
+An example NodeJS website using Express

app.js

@@ -0,0 +1,41 @@
+/**
+ * Module dependencies.
+ */
+
+require.paths.unshift(__dirname + '/lib');
+
+var express = require('express');
+var app = module.exports = express.createServer();
+var sqlite = require('sqlite');
+
+// Configuration
+
+app.configure(function(){
+  app.set('views', __dirname + '/views');
+  app.set('view engine', 'jade');
+  app.use(express.bodyParser());
+  app.use(express.methodOverride());
+  app.use(app.router);
+  app.use(express.static(__dirname + '/htdocs'));
+});
+
+app.configure('development', function(){
+  app.use(express.errorHandler({ dumpExceptions: true, showStack: true })); 
+});
+
+app.configure('production', function(){
+  app.use(express.errorHandler()); 
+});
+
+// Internal Page Handlers
+var static_pages = require('StaticPages');
+
+// Routes
+app.get('/', function(req, res){
+  res.render('index', {
+    title: 'Home'
+  });
+});
+
+app.listen(3000);
+console.log("Express server listening on port %d in %s mode", app.address().port, app.settings.env);

assets/design/css/css.css

@@ -0,0 +1,60 @@
+html{}
+body{ 
+		margin: 0; 
+		padding: 0; 
+		background: #F1F1F1 url('../img/bg.png'); 
+		font-family: "Trebuchet MS", Helvetica, sans-serif;
+		color: #252525;
+		font-size: 14px;
+	}
+
+/* Common Items */
+img{ border: 0; }
+
+.clear{ clear: both; }
+.clearl{ clear: left; }
+.hide{ display: none; }
+
+/* Outer Container */
+#O{ width: 1150px; padding: 0 25px; margin: auto; padding-top: 5.5em; /* border: 1px solid green; */ }
+
+/* Header */
+#H{}
+#H h1{ font-weight: bold; margin: 0; padding: 0; font-size: 2.1em; text-transform: uppercase; }
+#H #Social{ float: right; padding-right: 3em; }
+#H #Social img{ padding-left: 5px; }
+#H h2{ font-weight: bold; margin: 0; padding: 0; font-size: 0.9em; text-transform: uppercase; color: #B4B4B4; }
+
+/* Nav Tabs */
+#Nav{}
+#Nav>ul{ display: block; margin: 0; padding: 1.8em 0 0 0; }
+#Nav>ul>li{ display: block; float: left; padding: 0; }
+#Nav>ul>li{ width: 20%; margin: 0 2.2%; border: 2px solid #D4D4D4; padding: 25px 0; height: 50px; }
+#Nav>ul>li>a{ display: block; width: 50%; padding: 0.5em 1em; }
+#Nav>ul>li>a:hover{ padding: 0.5em 1em 0.5em 2em; }
+
+#Nav ul li#NBlog{ background: white url('../img/nav-blog.png'); background-position: center; }
+#Nav ul li#NBlog a{ color: white; font-size: 1.6em; text-decoration: none; background: #a3a049; }
+#Nav ul li#NProjects{ background: white url('../img/nav-code.png'); }
+#Nav ul li#NProjects a{ color: white; font-size: 1.6em; text-decoration: none; background: #99432e; }
+#Nav ul li#NAbout{ background: white url('../img/nav-about.png'); }
+#Nav ul li#NAbout a{ color: white; font-size: 1.6em; text-decoration: none; background: #382c1f; }
+#Nav ul li#NTwitter{ background: white url('../img/nav-twitter.png'); overflow: hidden; }
+
+#Nav.ex{} /* Expanded navigation, main page only */
+#Nav.ex>ul>li{ height: 300px; padding: 150px 0; }
+#Nav.ex>ul>li#NTwitter{ height: 550px; padding: 25px 0; }
+
+/* Twitter Feed */
+#NTwitter>div{ padding: 0 0.75em; font-size: 0.8em; }
+#NTwitter ul{ list-style: none; margin: 0; padding: 0;}
+#NTwitter ul li{ clear: left; padding-bottom: 1em; }
+#NTwitter ul li img{ padding-right: .5em; padding-bottom: 1em; float: left; }
+#NTwitter a{ color: #0084B4; text-decoration: none; }
+
+/* Content */
+#C{}
+#CC{ width: 92%; margin: auto; }
+
+/* Footer */
+#F{ margin-top: 3em; font-weight: bold; padding-left: 5em; font-size: 0.9em; text-transform: uppercase; color: #B4B4B4; }

assets/design/css/jquery.tweet.css

@@ -0,0 +1,43 @@
+.tweet,
+.query {
+	font: 120% Georgia, serif;
+	color: #085258;
+}
+
+	.tweet_list {
+		-webkit-border-radius: 0.5em;
+		-moz-border-radius: 0.5em;
+		border-radius: 0.5em;
+		list-style: none;
+		margin: 0;
+		padding: 0;
+		overflow-y: hidden;
+		background-color: #8ADEE2;
+	}
+
+		.tweet_list .awesome,
+		.tweet_list .epic {
+			text-transform: uppercase;
+		}
+
+		.tweet_list li {
+			overflow-y: auto;
+			overflow-x: hidden;
+			padding: 0.5em;
+		}
+
+			.tweet_list li a {
+				color: #0C717A;
+			}
+
+		.tweet_list .tweet_even {
+			background-color: #91E5E7;
+		}
+
+		.tweet_list .tweet_avatar {
+			padding-right: .5em; float: left;
+		}
+
+			.tweet_list .tweet_avatar img {
+				vertical-align: middle;
+			}

assets/design/index.html

@@ -0,0 +1,65 @@
+<html>
+<head>	
+
+	<title>Mike Valstar - Programming &amp; Web Development</title>
+
+	<link rel="stylesheet" href="css/css.css" type="text/css" />
+
+	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
+	<script src="js/jquery.tweet.js" type="text/javascript"></script>
+	<script src="js/mikevalstar.js" type="text/javascript"></script>
+
+</head>
+<body id="mikevalstar">
+
+<div id="O">
+
+	<div id="H">
+		<h1>Mike Valstar</h1>
+		<div id="social">
+			<a href="#"><img src="img/rss.png" alt="RSS" /></a>
+			<a href="#"><img src="img/github.png" alt="Github" /></a>
+			<a href="#"><img src="img/google-plus.png" alt="Google+" /></a>
+			<a href="#"><img src="img/twitter.png" alt="Twitter" /></a>
+		</div>
+		<h2>Web Development, Programming, Random Thoughts</h2>
+	</div>
+
+	<div id="Nav" class="ex">
+		<ul>
+			<li id="NBlog"><a href="Blog">Blog</a></li>
+			<li id="NProjects"><a href="Projects">Projects</a></li>
+			<li id="NAbout"><a href="About">About</a></li>
+			<li id="NTwitter"><div>Twitter here later</div></li>
+		</ul>
+		<div class="clear"></div>
+	</div>
+
+	<div id="C" class="hide">
+		<div id="CC">
+			<!-- start slipsum code -->
+			<h2>Page Title</h2>
+
+			<h3>No man, I don't eat pork</h3>
+			<p>Now that we know who you are, I know who I am. I'm not a mistake! It all makes sense! In a comic, you know how you can tell who the arch-villain's going to be? He's the exact opposite of the hero. And most times they're friends, like you and me! I should've known way back when... You know why, David? Because of the kids. They called me Mr Glass.</p>
+
+			<h3>I'm serious as a heart attack</h3>
+			<p>The path of the righteous man is beset on all sides by the iniquities of the selfish and the tyranny of evil men. Blessed is he who, in the name of charity and good will, shepherds the weak through the valley of darkness, for he is truly his brother's keeper and the finder of lost children. And I will strike down upon thee with great vengeance and furious anger those who would attempt to poison and destroy My brothers. And you will know My name is the Lord when I lay My vengeance upon thee.</p>
+
+			<h3>Are you ready for the truth?</h3>
+			<p>My money's in that office, right? If she start giving me some bullshit about it ain't there, and we got to go someplace else and get it, I'm gonna shoot you in the head then and there. Then I'm gonna shoot that bitch in the kneecaps, find out where my goddamn money is. She gonna tell me too. Hey, look at me when I'm talking to you, motherfucker. You listen: we go in there, and that nigga Winston or anybody else is in there, you the first motherfucker to get shot. You understand?</p>
+
+
+			<!-- end slipsum code -->
+
+		</div>
+	</div>
+
+	<div id="F">
+		Mike Valstar &copy; 2011
+	</div>
+
+</div>
+
+</body>
+</html>