diff --git a/css/site.css b/css/site.css index 0b31ba6..2b20b39 100644 --- a/css/site.css +++ b/css/site.css @@ -1,7 +1,6 @@ /* Page Specific CSS */ -body {font-family: Lato; background: #fff; color: #333; font-size: 16px; border: 52px #F8F8F8 solid; margin: 0px; padding: 20px 20px 200px 20px; } -h1, h2, h3, h4, h5, h6 {} +body {font-family: Lato; background: #fff; color: #333; font-size: 16px; border: 52px #F8F8F8 solid; margin: 0px; padding: 20px 20px 200px 20px;} h1 {font-size: 80px; font-family: Amatic SC; font-weight: normal; margin: 0px;} h2 {font-size: 50px; font-family: Amatic SC; font-weight: normal; margin: 11px 0px;} h3 {font-family: Amatic SC; font-size: 30px; margin: 10px 0px;} @@ -60,18 +59,11 @@ ul.nav li a:hover {border-bottom: 1px #FD9393 solid;} .hideRow {display: none;} .selectedRow {color: #FF4C0D;} - - -/*@media (max-width: 1024px) { - body {border: 20px #F8F8F8 solid; margin: 0px; padding: 20px 20px 80px 20px; } - #rightSide {max-width: 100%; float: left;} - #map {max-width: 100%;} - -}*/ - @media only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 320px) and (max-width: 1024px) { - body {border: 20px #F8F8F8 solid; margin: 0px; padding: 20px 20px 80px 20px; } + body {background: #ff00ff;} + body {border: 20px #F8F8F8 solid; margin: 0px; padding: 20px 20px 80px 20px;} #tableFilter, .clear, .resetMap {display: none;} - #wrapper {max-width: 460px; padding-top: 20px;} - #hackSpotsTable, #map {min-width: 224px;} - } \ No newline at end of file + #wrapper {max-width: 460px; padding-top: 20px;} + #hackSpotsTable, #map {min-width: 224px;} +} + diff --git a/index.html b/index.html index ea83acd..af5294f 100644 --- a/index.html +++ b/index.html @@ -2,16 +2,16 @@ Hack Spots - - + + - - + + @@ -44,9 +44,9 @@

Info

When I'm visiting a new city I'd like to know which coffee shops have the best vibes, great coffee and are good for hunkering down and having a good hack. Yelp will tell you where the Starbucks is and Foursquare will tell you where your friend's have been - but did they like it and was it a grab in go place or a hack place? Plus, what about the people I don't follow on Foursquare or who can't check-in when in other countries?

-

This website is hooked up to this Google Spreadsheet, which I've shared with friends. They add their favorite spots and every visitor to the site gets the latest data.

+

This website is hooked up to this Google Spreadsheet, which I've shared (so click and add your favorite hack spots!. They add their favorite spots and every visitor to the site gets the latest data.

-

Besides being a list I've wanted to have, it's a fantastic (or I think so) way of using sheetsee.js, which is a little JavaScript library I've been working on. Sheetsee.js helps you hook a website to a Google spreadsheet that you then use to create or collaborate on data.

+

Besides being a list I've wanted to have, it's a fantastic (or I think so) way of using sheetsee.js, which is a little JavaScript library I've been working on. Sheetsee.js helps you hook a Google Spreadsheet (awesome for data and collaboration!) to a website to make data more visual (maps, tables, charts).

@@ -216,9 +216,5 @@ } - - \ No newline at end of file diff --git a/readme.md b/readme.md index 2845cee..287969b 100644 --- a/readme.md +++ b/readme.md @@ -1,11 +1,21 @@ # Hi! -I'm refining this a bit -- I have an idea -- but please, file some issues, fork it and set it up for yourself and let me know how it goes! - ![screenshot](https://raw.github.com/jlord/hack-spots/gh-pages/img/hackspotsss.png) This is the code for a website that shows the spots myself, my friends (or Twitter friends) have found to be excelent hacking spots around the whole wide world. +### Fork -n- Go! + +In a bit I'll do some more refining (and documentation) - but here's a fun fact: + +This repo only has a **gh-pages** branch, which means as soon as you **fork** it, you have a hosted and live version of it yourself! + +Next, create a spreadsheet with the same column headers as [the original](https://docs.google.com/spreadsheet/ccc?key=0Ao5u1U6KYND7dFVkcnJRNUtHWUNKamxoRGg4ZzNiT3c#gid=0). + +Click on the `index.html` file, click edit and change **line 107**. Replace the existing spreadsheet URL key with your spreadsheet's key. You'll find that by clicking (in Google Spreadsheets) File > Publish to the Web > Start Publishing, it will then display the key in a window. ![get key](https://raw.github.com/jllord/sheetsee-cache/master/img/key.png) + +Commit those changes and **LIKE WOAH** you now have a version of this website hooked to a spreadsheet that you can distrubute however you'd like. + ## But How? A Google Spreadsheet holds all the data and it is connected to this website using the goodies in [sheetsee.js](http://www.github.com/jlord/sheetsee.js). Everytime you visit the website, you'll have the most up to date data that has been entered into the spreadsheet.