Commit c5cc4ba0 authored by Pete Oliver-Krueger's avatar Pete Oliver-Krueger
Browse files

Updates for the draft new homepage.

parent be16e787
......@@ -7,6 +7,35 @@ title: Get Involved
body .navbar:first-child {
display: none;
}
.hero {
background-repeat: no-repeat;
background-color: #222;
background-position: center center;
background-size: 100%;
min-height: 14em;
padding-top: 1em;
padding-bottom: 1em;
}
.hero-text {
margin: 0;
}
.hero-text a {
color: #13538A;
font-weight: bold;
text-decoration: none;
}
h1.hero-text {
font-size: 2em;
margin-top: 1em;
padding-bottom: 0em;
}
div.hero-text {
font-size: 1em;
padding-top: 2em;
padding-bottom: 3em;
font-weight: normal;
color: #CCC;
}
</style>
<div class="navbar navbar-inverse navbar-fixed-top">
......@@ -19,18 +48,23 @@ body .navbar:first-child {
<a class="navbar-brand" href="/index.html"><img src="/images/c4dc-logo-white-30x58.png"/></a>
<div class="nav-collapse collapse">
<ul class="nav navbar-nav" id="navbar-nav">
<li><a href="/index.html">Home</a></li>
<li><a href="/index-pete.html">Home</a></li>
<li><a href="/projects.html">Projects</a></li>
<li><a href="/index.html">Get Involved</a></li>
<li><a href="/volunteer.html">Get Involved</a></li>
<li><a href="/press.html">Press</a></li>
<li><a href="/blog/">Blog</a></li>
</ul>
<p class="nav navbar-nav navbar-right"><a href="/index-pete.html">Code for DC</a></p>
</div><!--/.nav-collapse -->
</div>
</div>
<div class="col-lg-12 hero">
<div class="hero-text">Code for DC</div>
<h1 class="hero-text">Code ~ Activism ~ Empanadas</h1>
<div class="hero-text">
<div>Code for DC is the DC chapter of the <a href="http://brigade.codeforamerica.org" target="_blank">Code for America Brigade</a>.</div>
<div>We are a group of volunteer civic hackers working together to solve local issues and help people engage with the city.</div>
</div>
</div>
<div class="container">
......@@ -57,10 +91,34 @@ The Code for DC Blog has arrived! We'll use this space to share updates on our
-->
<div class="col-lg-12">
<h1 class="h0">Join us</h1>
<p class="lead">Code for DC is the DC chapter of the <a href="http://brigade.codeforamerica.org" target="_blank">Code for America Brigade</a>. We are a group of volunteer civic hackers working together to solve local issues and help people engage with the city.
</p>
<h1 class="">What are you passionate about?</h1>
</div>
<div class="col-lg-12"><hr/></div>
<div class="col-lg-12">
<div class="col-lg-4">
<img src="images/captain.png" alt="CfA Brigade Captain" />
<h2>Housing</h2>
<p>Casual meetups for geeks, activists, policy makers, and journalists, every other week.</p>
<p><a href="http://www.meetup.com/code-for-dc" target="_blank">Read more and RSVP &raquo;</a></p>
</div>
<div class="col-lg-4">
<img src="images/octocat.png" alt="Community" />
<h2>Education</h2>
<p>An open conversation online about DC, what we're doing now, and what's next.
</p>
<p><a href="http://groups.google.com/forum/#!forum/dc-cfa-brigade" target="_blank">Learn and Share &raquo;</a></p>
</div>
<div class="col-lg-4">
<img src="images/launch.png" alt="Community" />
<h2>Start your own project</h2>
<p>Whether you're a communicator or a coder, we need you. Jump right in!</a>
</p>
<p><a href="projects.html">Find a project &raquo;</a></p>
</div>
</div>
<div class="col-lg-12"><hr/></div>
<div class="col-lg-12">
<div class="col-lg-4">
......
---
layout: default
title: Projects
---
<div class="container">
<div class="col-lg-1"></div>
<div class="col-lg-10 ">
<div class="col-lg-12 starter-template">
<h1>Projects</h1>
<p class="lead">Code for DC is a collaborative environment in which people with many different skillsets tackle issues they see facing the community. Our projects are always looking for help. Browse below and you're bound to find a project that needs you!</p>
</div>
<div id="project-list"><!-- populated by js --></div>
<div class="col-lg-1"></div>
</div>
</div><!-- /.container -->
{% include _global_js.html %}
<script src="assets/js/jquery.csv-0.71.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$.get('/data/projects.csv', function(data){
var content = $.csv.toArrays(data);
content.splice(0,1); //get rid of column headers
var html = '';
var pname = '';
var pcontact = '';
var pdesc = '';
var pgithub = '';
var pneeds = '';
var plink = '';
var pstatus = '';
var row_switch = false;
for(var row in content){
pstatus = content[row][7];
if(pstatus != "inactive" && pstatus !="not started"){
projectId = "project" + row;
pname = content[row][0];
if(pname == ""){
pname = "Unnamed project"
}
pdesc = content[row][1];
pcontact = content[row][2];
if(pcontact == ""){
pcontact == "Matt Bailey";
}
ptwitter = content[row][3];
if(ptwitter == "" && pcontact == "Matt Bailey"){
ptwitter == "@mattbailey0";
}
pemail = content[row][4];
pneeds = content[row][5];
if(pstatus == "not started"){
pneeds = "This project hasn't started! Get in touch to kick it off."
}
purl_info = content[row][8];
pgithub = content[row][9];
purl_home = content[row][10];
if(!row_switch){
html += '<div class="col-lg-12">';
}
html += '<div class="col-lg-2 project-icon"><img src="images/launch.png" width="100px"/></div>';
html += '<div class="col-lg-10 project-text" id="' + projectId + '"> <h3><a name="'+ pname + '">' + pname + '</a></h3>';
html += "<p class='project-content'>"
if(pdesc != ""){html += pdesc + '<br/>';}
html += 'Contact: ' + pcontact;
if(ptwitter != ""){
html += ' (<a href="http://www.twitter.com/' + ptwitter.substring(1) +'">'+ ptwitter +'</a>)';
}
html += '</br>';
if(pneeds != ""){html += 'Needs: '+ pneeds + '<br/>';}
if(purl_info != ""){html += '<a href="'+ purl_info +'" target="_blank">Read more about this project</a><br/>';}
if(pgithub != ""){
html += '<a href="'+ pgithub +'" target="_blank">Browse the code</a><br/>';
getGitContent(projectId,pgithub);
}
if(purl_home != "" && purl_home.indexOf("www.codefordc.org") == -1 ){html += '<a href="'+ purl_home +'" target="_blank">Check out the website</a>';}
html += '</p></div>';
if(row_switch){
html += '</div>';
}
row_switch = !row_switch;
}
}
$("#project-list").html(html);
});
});
function getGitContent(project, url){
var projectElement = "#" + project + " .project-content";
var chunked_url = url.split("/");
git_user = chunked_url[3];
git_repo = chunked_url[4];
$.get('https://api.github.com/repos/' + git_user + '/' + git_repo + '/contributors').done(function(data){
var val = '';
$.each( data, function(index, value ){
$(projectElement).before("<img src='" + value.avatar_url + "' class='project-git-human' /> ");
});
});
}
</script>
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment