You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
172 lines
9.6 KiB
172 lines
9.6 KiB
<!DOCTYPE html>
|
|
<!--
|
|
|
|
YES, THERE IS AN EASTER EGG
|
|
|
|
-->
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>Adam Cooper | Web Developer</title>
|
|
|
|
<!-- Bootstrap -->
|
|
<link href="bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" type="text/css">
|
|
<!-- Optional theme -->
|
|
<link rel="stylesheet" type="text/css" href="bower_components/bootstrap/dist/css/bootstrap-theme.min.css">
|
|
|
|
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
|
|
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
|
<!--[if lt IE 9]>
|
|
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
|
|
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
|
<![endif]-->
|
|
<link href='http://fonts.googleapis.com/css?family=Lato&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
|
|
<link href='http://fonts.googleapis.com/css?family=Roboto+Mono:400,400italic,500,500italic|Roboto:100,100italic,400,400italic,500,500italic,700,700italic,900,900italic' rel='stylesheet' type='text/css'>
|
|
<link rel="stylesheet" href="css/stylesheet.css" type="text/css">
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<div class="container-fluid">
|
|
<div id="lowercase">
|
|
<p class="nt" id="lineOne"><span class="hot hotAbout" id="aboutLink"><a href="#/about">a</a></span><span class="willHide">dam_</span></p>
|
|
<p class="nt" id="lineTwo"><span class="willHide">coo</span><span class="hot hotProjects" id="projectsLink"><a href="#/projects">p</a></span><span class="willHide">er</span></p>
|
|
<p class="nm willHide"><span class="underline ahidden"> </span><span class="ticker">.js</span><span class="ticker">.html</span><span class="ticker">.css</span><span class="ticker">.rb</span><span class="ticker jive"><a href="jive.html" target="_blank">.jive</a></span></p>
|
|
</div>
|
|
|
|
<div id="mlowercase">
|
|
<p class="nt" id="mlineOne"><span class="hot hotAbout" id="maboutLink">a</span><span class="willHide">dam_</span></p>
|
|
<p class="nt" id="mlineTwo"><span class="willHide">coo</span><span class="hot hotProjects" id="mprojectsLink">p</span><span class="willHide">er</span></p>
|
|
<p class="nm willHide"><span class="underline ahidden"> </span><span class="ticker">.js</span><span class="ticker">.html</span><span class="ticker">.css</span><span class="ticker">.rb</span><span class="ticker jive"><a href="jive.html" target="_blank">.jive</a></span></p>
|
|
</div>
|
|
|
|
<!-- <div id="photoPanel" class="triptych">
|
|
<img src="images/adam_bw_chair.jpg">
|
|
</div> -->
|
|
|
|
<!-- <div id="middlePanel" class="triptych">
|
|
</div> -->
|
|
|
|
<div id="bioPanel" class="triptych">
|
|
<div id="bioHeader" class="hot">bio</div>
|
|
<div id="bioText">
|
|
<p class="longText">A map is not just a map. It’s more of a conversation between the mapmaker and the map reader—and the landscape. As a student in Computer Sciences and Cartography at the University of Wisconsin, I started out exploring the intersection between maps and code. But after making maps in Scotland, writing a book, managing tech teams at companies with vastly different missions and vibes, editing a database of secret (but not entirely top secret) cutting edge drug trials, and nursing a linguistics habit on the side, I am now crafting maps out of code. I’m the developer. My users and students are the readers. The landscape is the web. Let’s <span id="talk">talk</span>.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="projectsPanel" class="panel">
|
|
<div id="projectsHeader" class="hot">projects</div>
|
|
<div class="projectSummary">
|
|
<h3>
|
|
<a href="http://theadamcooper.com:2005" target="_blank">Wheels Within Wheels</a>
|
|
<span class="projectGitHubLink"><a href="https://github.com/amcooper/wheels-within-wheels" target="_blank"><img src="images/github-64-black.png"></a></span>
|
|
</h3>
|
|
<p class="longText">The (Ruby/Sinatra) CRUD app that makes (MEAN) CRUD apps. You may never need to make a CRUD app again.</p>
|
|
</div>
|
|
<div class="projectSummary">
|
|
<h3>
|
|
Lesser Evil
|
|
<span class="projectGitHubLink"><a href="https://github.com/amcooper/lesser-evil-cli-app" target="_blank"><img src="images/github-64-black.png"></a></span>
|
|
</h3>
|
|
<p class="longText">a Ruby CLI gem for exploring the presidential election via the passion of the Twittersphere</p>
|
|
</div>
|
|
<div class="projectSummary">
|
|
<h3>
|
|
<a href="http://theadamcooper.com:2002" target="_blank">Much Better Speeches</a>
|
|
<span class="projectGitHubLink"><a href="https://github.com/amcooper/much_better_speeches" target="_blank"><img src="images/github-64-black.png"></a></span>
|
|
</h3>
|
|
<p class="longText">Fill in the blanks in history's greatest speeches and make them better. Much better. Built with JavaScript and AngularJS.</p>
|
|
</div>
|
|
<div class="projectSummary">
|
|
<h3>
|
|
<a href="http://theadamcooper.com:2001" target="_blank">Choperator</a>
|
|
<span class="projectGitHubLink"><a href="https://github.com/amcooper/choperator" target="_blank"><img src="images/github-64-black.png"></a></span>
|
|
</h3>
|
|
<p class="longText">Real-time chat application. Built with JavaScript, WebSockets, and Node.js.</p>
|
|
</div>
|
|
<div class="projectSummary">
|
|
<h3>
|
|
<a href="http://theadamcooper.com:2000/index.html" target="_blank">Dinosaur Spaceship</a>
|
|
<span class="projectGitHubLink"><a href="https://github.com/amcooper/dinosaur_spaceship" target="_blank"><img src="images/github-64-black.png"></a></span>
|
|
</h3>
|
|
<p class="longText">A library and e-reader. Built with JavaScript and Node.js.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="contactsPanel" class="panel">
|
|
<div id="contactsHeader" class="hot">contact adam</div>
|
|
<div id="mContactLinks">
|
|
<ul>
|
|
<li><a href="mailto:amcooper+website@gmail.com" title="Gmail" target="_blank"><img src="images/gmail-64-color.png"></a></li>
|
|
<li><a href="https://github.com/amcooper" title="GitHub" target="_blank"><img src="images/github-64-color.png"></a></li>
|
|
<li><a href="https://linkedin.com/in/adamcooperdev" title="LinkedIn" target="_blank"><img src="images/linkedin-64-color.png"></a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- <nav id="floatingNav" class="nn">
|
|
<div id="fNavTop">
|
|
<div id="fHomeLink" class="navLink">
|
|
<a href="#" class="navBullet" id="homeHoverHide">•</a>
|
|
<a href="#" class="navText" id="homeHoverShow">home</a>
|
|
</div>
|
|
<div id="fProjectsLink" class="navLink">
|
|
<a href="#" class="navBullet" id="projectsHoverHide">•</a>
|
|
<a href="#" class="navText" id="projectsHoverShow">projects</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="fLateralLink" class="navLink">
|
|
<div id="fPhotoLink">
|
|
<a href="#" class="navBullet lateralHoverHide"><</a>
|
|
<a href="#" class="lateralHoverShow"><span class="navText">photo </span><span class="navBullet"><</span></a>
|
|
</div>
|
|
<div id="fAboutSlash">
|
|
<a href="#" class="navBullet">/</a>
|
|
</div>
|
|
<div id="fBioLink">
|
|
<a href="#" class="navBullet lateralHoverHide">></a>
|
|
<a href="#" class="lateralHoverShow"><span class="navBullet">></span><span class="navText"> bio</span></a>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="fContactLinks" class="navLink">
|
|
<ul>
|
|
<li id="fGmailLink">
|
|
<div id="gmailHoverHide" class="navBullet">•</div>
|
|
<a href="mailto:amcooper+website@gmail.com" title="Gmail" target="_blank"><img src="images/gmail-64-color.png" id="gmailHoverShow"></a>
|
|
</li>
|
|
<li id="fGithubLink">
|
|
<div id="githubHoverHide" class="navBullet">•</div>
|
|
<a href="https://github.com/amcooper" title="GitHub" target="_blank"><img src="images/github-64-color.png" id="githubHoverShow"></a>
|
|
</li>
|
|
<li id="fLinkedinLink">
|
|
<div id="linkedinHoverHide" class="navBullet">•</div>
|
|
<a href="https://linkedin.com/in/adamcooperdev" title="LinkedIn" target="_blank"><img src="images/linkedin-64-color.png" id="linkedinHoverShow"></a>
|
|
</li>
|
|
<li id="fWordpressLink">
|
|
<div id="wordpressHoverHide" class="navBullet">•</div>
|
|
<a href="https://serverdotjive.wordpress.com" title="Wordpress" target="_blank"><img src="images/wordpress-64-color.png" id="wordpressHoverShow" alt="server-dot-jive"></a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</nav> -->
|
|
|
|
<div id="backdrop">
|
|
<video poster="images/thumbnails/adam_vintage_letters_clip.png" autoplay muted> <!-- Add "loop" in here in production. -->
|
|
<source src="images/adam_vintage_letters_clip.webmsd.webm" type="video/webm">
|
|
<source src="images/adam_vintage_letters_clip.mp4" type="video/mp4">
|
|
</video>
|
|
</div>
|
|
|
|
<script src="bower_components/jquery/dist/jquery.min.js"></script>
|
|
<script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
|
|
<script src="bower_components/velocity/velocity.min.js"></script>
|
|
<script src="bower_components/velocity/velocity.ui.min.js"></script>
|
|
<script src="js/index.js"></script>
|
|
<script src="js/neon.js"></script>
|
|
</body>
|
|
</html>
|