Skip to content

Commit bcb9997

Browse files
committedSep 25, 2012
conversations, dates, flexible layout
1 parent 3c3e2be commit bcb9997

8 files changed

+165
-75
lines changed
 

‎_config.yml

+1
Original file line numberDiff line numberDiff line change
@@ -2,3 +2,4 @@ auto: true
22
server: true
33
server_port: 8080
44
url: http://localhost:8080
5+
permalink: /:year/:month/:day/:title.html

‎_layouts/default.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@
1111
<link href='http://fonts.googleapis.com/css?family=Great+Vibes|Open+Sans|Coda' rel='stylesheet' type='text/css'>
1212
<!-- << Google Fonts -->
1313
<!-- >> Styles -->
14-
<link href="res/css/main.css" rel="stylesheet" type="text/css">
14+
<link href="/res/css/main.css" rel="stylesheet" type="text/css">
1515
<!-- << Styles -->
1616
<!-- >> Head Scripts -->
1717
<!--[if lt IE 9]>

‎_layouts/post.html

+22-2
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<div class="non-semantic-protector">
55
<h2 class="ribbon">
66
<div class="ribbon-content">
7-
<a href="{{ page.permalink }}">
7+
<a href="{{ post.url }}">
88
<span class="icon">H</span> <span class="title">{{ page.title }} feat. {{ page.feat }}</span>
99
</a>
1010
</div>
@@ -13,6 +13,9 @@ <h2 class="ribbon">
1313
<div class="hangout">
1414
<iframe width="760" height="428" src="http://www.youtube.com/embed/{{ page.youtube_id }}" frameborder="0" allowfullscreen></iframe>
1515
</div>
16+
17+
{% include date.html %}
18+
1619
<div class="info">
1720
<div class="about">
1821
<h3>Introducción</h3>
@@ -25,7 +28,24 @@ <h3>Invitado</h3>
2528
{% if page.slides %}
2629
<div class="slides">
2730
<h3>Slides</h3>
28-
<script async class="speakerdeck-embed" data-id="{{ page.slides }}" data-ratio="1.3333333333333333" src="//speakerdeck.com/assets/embed.js"></script>
31+
<script async class="speakerdeck-embed" data-id="{{ page.slides }}" data-ratio="1.3333333333333333" src="//speakerdeck.com/assets/embed.js" async="true"></script>
2932
</div>
3033
{% endif %}
34+
</div>
35+
<div class="disqus_wrapper">
36+
<div id="disqus_thread"></div>
37+
<script type="text/javascript">
38+
/* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
39+
var disqus_shortname = 'jshangouts'; // required: replace example with your forum shortname
40+
41+
/* * * DON'T EDIT BELOW THIS LINE * * */
42+
(function() {
43+
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
44+
dsq.src = 'http://' + disqus_shortname + '.disqus.com/embed.js';
45+
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
46+
})();
47+
</script>
48+
<noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
49+
<a href="http://disqus.com" class="dsq-brlink">comments powered by <span class="logo-disqus">Disqus</span></a>
50+
3151
</div>

‎_posts/2012-08-18-Socket-IO-Engine-IO-Guillermo-Rauch.textile

+2-3
Original file line numberDiff line numberDiff line change
@@ -2,10 +2,9 @@
22
layout: post
33
title: Socket.IO / Engine.IO
44
feat: Guillermo Rauch
5+
date: 2012-08-18
56
categories: [socket.io, html5, amazon, heroku]
6-
permalink: engine-io-and-socket-io.html
7-
description: Introducción a Engine.IO y Socket.IO por Guillermo
8-
Rauch, el creador de estas herramientas.
7+
description: "Introducción a Engine.IO y Socket.IO por Guillermo Rauch, el creador de estas herramientas."
98
bio: Guillermo Rauch es un desarrollador experto en Javascript...
109
youtube_id: e3FdQAiG3-o
1110
---

‎_posts/2012-09-22-JS-para-graficos-y-visualizacion-de-datos-feat-Nicolas-Carcia.textile

+1-2
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,7 @@ title: JS para Gráficos y Visualización de Datos
44
feat: Nicolás García Belmonte
55
date: 2012-09-22
66
time: "16:30 (BOG GMT-5)"
7-
permalink: JS-para-graficos-y-visualizacion-de-datos-feat-Nicolas-Carcia.html
8-
categories: [data-visualization, twitter, philogl]
7+
categories: [data_visualization, twitter, philogl]
98
description: "En este hangout, Nicolás presentará las tecnologías Web que usa y cómo las combina para crear visualizaciones de datos. Hablará sobre tecnologías como el 2D Canvas, WebGL, ES5, XHR2 y otras. También presentará dos librerías de las que es autor: el JavaScript InfoVis Toolkit y PhiloGL."
109
bio: Nicolás trabaja como Data Visualization Scientist en Twitter y es el creador de populares librerías de visualización de datos como PhiloGL y Javascript InfoVis Toolkit.
1110
youtube_id: 2HS_f9Maj28

‎index.html

+9-7
Original file line numberDiff line numberDiff line change
@@ -4,12 +4,11 @@
44
is_index: true
55

66
next_title:
7-
next_feat: Nicolás García Belmonte
8-
next_date: 2012-09-22
9-
next_time: "16:30 (BOG GMT-5)"
10-
next_categories: [data-visualization, twitter, philogl]
11-
next_description: "En este hangout, Nicolás presentará las tecnologías Web que usa y cómo las combina para crear visualizaciones de datos. Hablará sobre tecnologías como el 2D Canvas, WebGL, ES5, XHR2 y otras. También presentará dos librerías de las que es autor: el JavaScript InfoVis Toolkit y PhiloGL."
12-
next_bio: Nicolás trabaja como Data Visualization Scientist en Twitter y es el creador de populares librerías de visualización de datos como PhiloGL y Javascript InfoVis Toolkit.
7+
next_feat:
8+
next_date:
9+
next_time:
10+
next_description:
11+
next_bio:
1312
next_url:
1413
next_active:
1514
---
@@ -68,7 +67,7 @@ <h3>Invitado</h3>
6867
<div class="non-semantic-protector">
6968
<h2 class="ribbon">
7069
<div class="ribbon-content">
71-
<a href="{{ first_post.permalink }}">
70+
<a href="{{ first_post.url }}">
7271
<span class="icon">H</span> <span class="title">Última charla: {{ first_post.title }} feat. {{ first_post.feat }}</span>
7372
</a>
7473
</div>
@@ -77,6 +76,9 @@ <h2 class="ribbon">
7776
<div class="hangout">
7877
<iframe width="760" height="428" src="http://www.youtube.com/embed/{{ first_post.youtube_id }}" frameborder="0" allowfullscreen></iframe>
7978
</div>
79+
80+
{% include date.html %}
81+
8082
<div class="info">
8183
<div class="about">
8284
<h3>Introducción</h3>

‎res/css/main.css

+91-56
Large diffs are not rendered by default.

‎res/css/src/_default.scss

+38-4
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,18 @@ html{
55
body{
66
font-family: $font;
77
color: #eee;
8+
// font: 100%/1.5 $font;
9+
}
10+
11+
body.dark{
12+
color: #eee;
13+
p{
14+
color: #eee;
15+
}
16+
}
17+
18+
a{
19+
color: $blue;
820
}
921

1022
.centered{
@@ -65,7 +77,7 @@ header{
6577
text-shadow: 0 0 4px rgba(0, 0, 0, 0.4), 0 0 10px rgba(0, 0, 0, 0.4);
6678
/* This ribbon is based on a 16px font side and a 24px vertical rhythm. I've used em's to position each element for scalability. If you want to use a different font size you may have to play with the position of the ribbon elements */
6779

68-
width: 700px;
80+
max-width: 700px;
6981
position: relative;
7082
@include box-shadow(inset 20px 0 15px -15px rgba(0,0,0,0.15), inset -20px 0 15px -15px rgba(0,0,0,0.15));
7183
background-color: $red-back;
@@ -156,9 +168,15 @@ header{
156168

157169
.hangout{
158170
background: black;
159-
width: 760px;
171+
max-width: 760px;
160172
margin: auto;
161173
min-height: 400px;
174+
position: relative;
175+
z-index: 2;
176+
177+
iframe{
178+
width: 100% !important;
179+
}
162180
}
163181

164182
.comming_soon{
@@ -225,19 +243,35 @@ header{
225243
// font-weight: bold;
226244
font-family: Coda;
227245
font-size: 1.5em;
228-
color: #999;
246+
color: #bbb;
229247
margin-bottom: 0.7em;
230248
}
231249
p{
232250
line-height: 1.2em;
233-
color: #999;
251+
color: #bbb;
234252
}
235253
.slides{
236254
clear: both;
237255
margin: 0 2.5%;
238256
padding-top: 4em;
239257
}
240258
}
259+
.date_post{
260+
max-width: 760px;
261+
font-style: italic;
262+
// font-size: 0.9em;
263+
text-align: right;
264+
color: #666;
265+
margin: 0.9em auto;
266+
}
267+
268+
.disqus_wrapper{
269+
max-width: 720px;
270+
margin: auto;
271+
#disqus_thread{
272+
273+
}
274+
}
241275

242276
.previous{
243277
margin: 2em auto 0;

0 commit comments

Comments
 (0)
Please sign in to comment.