gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Updated the API examples page

Browse Source
This commit is contained in:
Sahat Yalkabov
2014-06-05 14:18:51 -04:00
parent 6e364983e5
commit 8197329970
2 changed files with 61 additions and 87 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
public/css/styles.less
View File

@ -46,44 +46,18 @@ footer {
margin-top: 20px; margin-top: 20px;
} }
// Thumbnails
// -------------------------
.thumbnail {
padding: 0;
border-radius: 0;
box-shadow: 0 0 5px #ccc, inset 0 0 0 #000;
}
// Font Awesome // Font Awesome
// ------------------------- // -------------------------
.fa { .fa {
margin-right: 5px; margin-right: 5px;
} }
// API Examples
// -------------------------
.thumb {
padding-left: 0 !important;
padding-right: 0 !important;
}
.thumb img {
margin-bottom: 5px;
margin-right: 5px;
opacity: 0.2;
transition: opacity 0.2s;
}
.thumb:hover img {
opacity: 1;
box-shadow: 0 0 3px 1px @brand-primary;
}
.facebook-caption {
position: absolute;
background-color: rgba(0, 0, 0, 0.5);
font-size: 12px;
color: #fff;
padding: 3px;
bottom: 25px;
}
.api-examples {
img {
padding-right: 10px;
}
}

104
views/api/index.jade
View File

@ -4,89 +4,89 @@ block content
h2 API Examples h2 API Examples
hr hr
.row.api-examples .row
.col-sm-4 .col-sm-4
.panel.panel-default .panel.panel-default(style='background-color: #000')
.panel-body .panel-body
img(src='http://3.bp.blogspot.com/-a4mVBZ4LY-A/UvzcbDjKY7I/AAAAAAAAI-Q/V12lKmntZf8/s1600/photo_editor_by_aviary_app_icon.png', height=40) img(src='http://i.imgur.com/2AaBlpf.png', height=40)
a(href='/api/aviary') Aviary a(href='/api/github', style='color: #fff') GitHub
.col-sm-4 .col-sm-4
.panel.panel-default .panel.panel-default(style='background-color: #00abf0')
.panel-body .panel-body
img(src='https://pbs.twimg.com/profile_images/2409381044/exk4ubq6skod7svla5az.jpeg', height=40) img(src='http://i.imgur.com/EYA2FO1.png', height=40)
a(href='/api/clockwork') Clockwork SMS a(href='/api/twitter', style='color: #fff') Twitter
.col-sm-4 .col-sm-4
.panel.panel-default .panel.panel-default(style='background-color: #3b5998')
.panel-body .panel-body
img(src='http://choosenonviolence.org/sites/default/files/Facebook_logo_(square).png', height=40) img(src='http://i.imgur.com/jiztYCH.png', height=40)
a(href='/api/facebook') Facebook a(href='/api/facebook', style='color: #fff') Facebook
.col-sm-4 .col-sm-4
.panel.panel-default .panel.panel-default(style='background-color: #1cafec')
.panel-body .panel-body
img(src='https://playfoursquare.s3.amazonaws.com/press/logo/icon-512x512.png', height=40) img(src='http://i.imgur.com/PixH9li.png', height=40)
a(href='/api/foursquare') Foursquare a(href='/api/foursquare', style='color: #fff') Foursquare
.col-sm-4 .col-sm-4
.panel.panel-default .panel.panel-default(style='background-color: #517fa4')
.panel-body .panel-body
img(src='https://github.global.ssl.fastly.net/images/modules/logos_page/Octocat.png', height=40) img(src='http://i.imgur.com/aRc6LUJ.png', height=40)
a(href='/api/github') GitHub a(href='/api/instagram', style='color: #fff') Instagram
.col-sm-4 .col-sm-4
.panel.panel-default .panel.panel-default(style='background-color: #d21309')
.panel-body .panel-body
img(src='http://aweebitirish.com/wp-content/uploads/2014/03/instagram-app-icon-vector.png', height=40) img(src='http://i.imgur.com/KfZY876.png', height=40)
a(href='/api/instagram') Instagram a(href='/api/lastfm', style='color: #fff') Last.fm
.col-sm-4 .col-sm-4
.panel.panel-default .panel.panel-default(style='background-color: #007bb6')
.panel-body .panel-body
img(src='http://fontslogo.com/wp-content/uploads/2013/02/Lastfm-Logo-Font.jpg', height=40) img(src='http://i.imgur.com/sYmVWAw.png', height=40)
a(href='/api/lastfm') Last.fm a(href='/api/linkedin', style='color: #fff') LinkedIn
.col-sm-4 .col-sm-4
.panel.panel-default .panel.panel-default(style='background-color: #454442')
.panel-body .panel-body
img(src='http://kellycpas.com/wp-content/uploads/2014/01/linkedin.png', height=40) img(src='http://i.imgur.com/e3sjmYj.png', height=40)
a(href='/api/linkedin') LinkedIn a(href='/api/nyt', style='color: #fff') New York Times
.col-sm-4 .col-sm-4
.panel.panel-default .panel.panel-default(style='background-color: #000')
.panel-body .panel-body
img(src='http://icons.iconarchive.com/icons/dakirby309/windows-8-metro/256/Web-The-New-York-Times-alt-Metro-icon.png', height=40) img(src='http://i.imgur.com/1xGmKBX.jpg', height=40)
a(href='/api/nyt') New York Times a(href='/api/steam', style='color: #fff') Steam
.col-sm-4 .col-sm-4
.panel.panel-default .panel.panel-default(style='background-color: #3da8e5')
.panel-body .panel-body
img(src='http://th08.deviantart.net/fs4/200H/i/2004/242/4/7/Steam_Icon.png', height=40) img(src='http://i.imgur.com/w3s2RvW.png', height=40)
a(href='/api/steam') Steam a(href='/api/stripe', style='color: #fff') Stripe
.col-sm-4 .col-sm-4
.panel.panel-default .panel.panel-default(style='background-color: #fd0404')
.panel-body .panel-body
img(src='https://stripe.com/img/open-graph/logo.png', height=40) img(src='http://i.imgur.com/mEUd6zM.png', height=40)
a(href='/api/stripe') Stripe a(href='/api/twilio', style='color: #fff') Twilio
.col-sm-4 .col-sm-4
.panel.panel-default .panel.panel-default(style='background-color: #304e6c')
.panel-body .panel-body
img(src='http://status.twilio.com/images/logo.png', height=40) img(src='http://i.imgur.com/rZGQShS.png', height=40)
a(href='/api/twilio') Twilio a(href='/api/tumblr', style='color: #fff') Tumblr
.col-sm-4 .col-sm-4
.panel.panel-default .panel.panel-default(style='background-color: #ff6500')
.panel-body .panel-body
img(src='https://cdn1.iconfinder.com/data/icons/metro-ui-dock-icon-set--icons-by-dakirby/512/Tumblr_alt.png', height=40) img(src='http://i.imgur.com/RGCVvyR.png', height=40)
a(href='/api/tumblr') Tumblr a(href='/api/scraping', style='color: #fff') Web Scraping
.col-sm-4 .col-sm-4
.panel.panel-default .panel.panel-default(style='background-color: #1f93cf')
.panel-body .panel-body
img(src='https://g.twimg.com/Twitter_logo_blue.png', height=40) img(src='http://i.imgur.com/90tl9C8.gif', height=40)
a(href='/api/twitter') Twitter a(href='/api/venmo', style='color: #fff') Venmo
.col-sm-4 .col-sm-4
.panel.panel-default .panel.panel-default(style='background-color: #3d048b')
.panel-body .panel-body
img(src='http://37prime.net/link_icons/hackernews.png', height=40) img(src='http://i.imgur.com/Cl6WJAu.png', height=40)
a(href='/api/scraping') Web Scraping a(href='/api/yahoo', style='color: #fff') Yahoo
.col-sm-4 .col-sm-4
.panel.panel-default .panel.panel-default(style='background-color: #000')
.panel-body .panel-body
img(src='http://www.mevvy.com/wp-content/uploads/2013/09/Venmo-Logo-on-Mevvy.com_.png', height=40) img(src='http://i.imgur.com/YcdxZ5F.png', height=40)
a(href='/api/venmo') Venmo a(href='/api/clockwork', style='color: #fff') Clockwork SMS
.col-sm-4 .col-sm-4
.panel.panel-default .panel.panel-default(style='background-color: #fff')
.panel-body .panel-body
img(src='http://i.imgur.com/Gbl1F3k.png', height=40) img(src='http://i.imgur.com/npBRwMI.png', height=40)
a(href='/api/yahoo') Yahoo a(href='/api/aviary', style='color: #000') Aviary