finishing

content/html/en/blog/Category-Theory-Presentation.erb

@@ -6,7 +6,7 @@ created_at:     2012-12-12T10:06:40+02:00
 title: Category Theory Presentation
 author_name: Yann Esposito
 author_uri: yannesposito.com
-layout: article2
+layout: article3
 macros:
  latex: '<span style="text-transform: uppercase">L<sup style="vertical-align: 0.15em; margin-left: -0.36em; margin-right: -0.15em; font-size: .85em">a</sup>T<sub style="vertical-align: -0.5ex; margin-left: -0.1667em; margin-right: -0.125em; font-size: 1em">e</sub>X</span>'
 tags:

content/html/en/blog/Higher-order-function-in-zsh.md

@@ -89,7 +89,7 @@ done
 
 After ⇒
 
-<code class="zsh">
+<code class="bash">
 gif_to_png() { convert $1 ${1:r}.png && \rm -f $1 }
 
 handle_resources() { map gif_to_png $1/resources/*.gif(.N) }

content/html/en/blog/Typography-and-the-Web.md

@@ -43,20 +43,20 @@ What is the problem between the Web and ligatures?
 The first one is: you cannot search them. For example, try to search the word "first":
 
 - first ← No ligature, no problem[^1]
-- <span style="color: #800">fi</span>r<span style="color: #800">st </span> ← ligature nice but unsearchable
+- <span class="red">fi</span>r<span class="red">st </span> ← ligature nice but unsearchable
 
 [^1]: In fact, you might see a ligature and the search works because I now use some CSS ninja skills: `text-rendering: optimizelegibility`. But it also works because I use the right font; Computer Modern. Steal my CSS at will.
 
 The second one is the rendering, for example, try to use a ligature character with small caps:
 
 - <sc>first</sc>
-- <sc><span style="color:#800">fi</span>r<span style="color:#800">st</span></sc>
+- <sc><span class="red">fi</span>r<span class="red">st</span></sc>
 
 Here is a screenshot of what I see:
 
 blogimage("first_sc_screenshot.png", "Screenshot of first in small caps with and without ligatures.")
 
-The browser isn't able to understand that the ligature character "<span style="color:#800">fi</span>" should render as <sc>fi</sc> when rendered in small caps. And one part of the problem is you should choose to display a character in small caps using %css.
+The browser isn't able to understand that the ligature character "<span class="red">fi</span>" should render as <sc>fi</sc> when rendered in small caps. And one part of the problem is you should choose to display a character in small caps using %css.
 
 This way, how could you use a ligature Unicode character on a site on which you could change the %css?
 
@@ -73,7 +73,7 @@ If you take attention to detail, you'll see the first "first" contains a ligatur
 
 %latex was intelligent enough to create himself the ligatures when needed.
 
-The "<span style="color:#800">st</span>" ligature is rare and not rendered in %latex by default. But if you want you could also render rare ligature using %xelatex:
+The "<span class="red">st</span>" ligature is rare and not rendered in %latex by default. But if you want you could also render rare ligature using %xelatex:
 
 blogimage("xelatex_ligatures.jpg","XeLaTeX ligatures")
 

content/html/fr/blog/Category-Theory-Presentation.erb

@@ -6,7 +6,7 @@ created_at:     2012-12-12T10:06:40+02:00
 title: Category Theory Presentation
 author_name: Yann Esposito
 author_uri: yannesposito.com
-layout: article2
+layout: article3
 macros:
  latex: '<span style="text-transform: uppercase">L<sup style="vertical-align: 0.15em; margin-left: -0.36em; margin-right: -0.15em; font-size: .85em">a</sup>T<sub style="vertical-align: -0.5ex; margin-left: -0.1667em; margin-right: -0.125em; font-size: 1em">e</sub>X</span>'
 tags:

content/html/fr/blog/Higher-order-function-in-zsh.md

@@ -91,7 +91,7 @@ done
 
 Après
 
-<code class="zsh">
+<code class="bash">
 gif_to_png() { convert $1 ${1:r}.png && \rm -f $1 }
 
 handle_resources() { map gif_to_png $1/resources/*.gif(.N) }

content/html/fr/blog/Typography-and-the-Web.md

@@ -48,20 +48,20 @@ Quel est le problème des ligatures sur le web ?
 Le premier c'est que vous ne pouvez pas chercher les mots qui contiennent ces ligatures. Par exemple essayez de chercher le mot "first".
 
 - first ←  Pas de ligature, pas de problème[^1].
-- <span style="color: #800">fi</span>r<span style="color: #800">st </span> ← Une jolie ligature, mais introuvable avec une recherche (<code>C-f</code>).
+- <span class="red">fi</span>r<span class="red">st </span> ← Une jolie ligature, mais introuvable avec une recherche (<code>C-f</code>).
 
 [^1]: En réalité, vous devriez pouvoir voir une ligature. Maintenant j'utilise : `text-rendering: optimizelegibility`. Le rendu est correct parce que j'utilise une fonte correct, à savoir Computer Modern de Donald Knuth.
 
 Le second problème est le rendu. Par exemple, essayer d'utiliser un charactère de ligature en petites capitales :
 
 - <sc>first</sc>
-- <sc><span style="color:#800">fi</span>r<span style="color:#800">st</span></sc>
+- <sc><span class="red">fi</span>r<span class="red">st</span></sc>
 
 Voici une capture d'écran pour que vous voyez ce que je vois :
 
 blogimage("first_sc_screenshot.png", "Screenshot of first in small caps with and without ligatures.")
 
-Le navigateur est incapable de comprendre que le caractère de ligature "<span style="color:#800">fi</span>" doit être rendu comme <sc>fi</sc> lorsqu'il est en petites capitales. 
+Le navigateur est incapable de comprendre que le caractère de ligature "<span class="red">fi</span>" doit être rendu comme <sc>fi</sc> lorsqu'il est en petites capitales. 
 Et une part du problème est que l'on peut décider d'écrire en petite majuscule dans le %css.
 
 Comment par exemple utiliser un charactère de ligature unicode sur un site qui possède différents rendus via différentes %css ?
@@ -79,7 +79,7 @@ Si vous faites attention au détail, vous constaterez que le premier "first" con
 
 %latex a été suffisamment intelligent pour créer les ligatures si nécessaire.
 
-La ligature "<span style="color:#800">st</span>" est rare et n'est pas rendu par défaut par %latex. 
+La ligature "<span class="red">st</span>" est rare et n'est pas rendu par défaut par %latex. 
 Si vous voulez voir des ligatures rares, vous pouvez utiliser %xelatex:
 
 blogimage("xelatex_ligatures.jpg","XeLaTeX ligatures")

layouts/article3.html

@@ -0,0 +1,188 @@
+-----
+-----
+<% language, languages, blog, article = setItemConf %><?xml version="1.0" encoding="utf-8"?>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" lang="fr" xml:lang="fr">
+    <head>
+        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><%
+        t=tags
+        if t.length > 0
+%>        <meta name="keywords" content="<%= t %>"><%
+        end
+%>        <link rel="shortcut icon" type="image/x-icon" href="<%=@config[:webprefix]%>/img/favicon.ico" />
+        <link rel="stylesheet" type="text/css" href="<%=@config[:webprefix]%>/assets/css/darkmodern.css" />
+        <link rel="stylesheet" type="text/css" href="<%=@config[:webprefix]%>/css/solarized_striped.css" />
+        <link rel="stylesheet" type="text/css" href="<%=@config[:webprefix]%>/css/idc.css" />
+        <link href='http://fonts.googleapis.com/css?family=Inconsolata' rel='stylesheet' type='text/css'>
+		<link href='http://fonts.googleapis.com/css?family=Droid+Sans:400,700' rel='stylesheet' type='text/css'>
+        <link rel="alternate" type="application/rss+xml" title="RSS" href="http://feeds.feedburner.com/yannespositocom<%= language %>"/><%
+        languages.each do |lang|
+            item_for_lang=item_of_language(lang)
+                if not item_for_lang.nil? %>
+        <link rel="alternate" lang="<%= lang %>" xml:lang="<%= lang %>" title="<%= item_for_lang[:title] %>" type="text/html" hreflang="<%= lang %>" href="<%= item_for_lang.reps[0].path %>" /> <%
+                end
+            end
+%>
+        <!--[if lt IE 9]>
+        <script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
+        <![endif]-->
+        <title><%= @item[:title] %></title>
+    </head>
+    <body lang="<%= language %>" class="article">
+        <script type="text/javascript">// <![CDATA[
+            document.write('<div id="blackpage"><div><%= tradOf(:welcomeloading)%><img src="<%=@config[:webprefix]%>/img/loading.gif" alt="<%= tradOf(:loading) %>"/></div></div>');
+            // ]]>
+        </script>
+
+        <div id="content">
+            <div id="choix">
+                <div class="return"><a href="#entete">&darr; Menu &darr;</a></div>
+                <div id="choixlang"><%=
+                languages.map do |l|
+                    dest=@item_rep.path.sub(%r{#{@config[:webprefix]}/../}, %{#{config[:webprefix]}/#{l}/})
+                    if @item_rep.path != dest
+                        %{<a href="#{dest}" onclick="setLanguage('#{l}')">#{ tradOfKeywordIn(:switchTo,l)}</a>}
+                    else
+                        nil
+                    end
+                end.join() %>
+                </div>
+				<script type="text/javascript">// <![CDATA[
+				document.write('<div id="switchcss"><a href="#"><%= tradOf(:switchCss) %></a></div>');
+				// ]]>
+				</script>
+                <div class="flush"></div>
+            </div>
+            <div id="titre">
+                <h1>
+                    <%= @item[:title] %>
+                </h1>
+                <% unless @item[:subtitle].nil? %>
+                <h2>
+                    <%= @item[:subtitle] %>
+                </h2>
+                <% end %>
+            </div>
+            <div class="flush"></div>
+
+            <% if content_for(@item,:summary) %>
+            <div class="corps summary">
+                <% content_for(@item,:summary) %>
+            </div>
+            <% end %>
+
+            <%= generateSubMenu %>
+
+            <div class="flush"></div>
+            <div id="afterheader">
+                <div class="corps">
+                    <%= yield %>
+                </div>
+                <% depth = depthOf(@item) %>
+                <% if depth > 3 or ( depth == 3 and @item.children.length > 0 ) %>
+                <div class="navigation">
+                    <div class="navigationprev"><%= previousFor(@item) %></div>
+                    <div class="navigationnext"><%= nextFor(@item) %></div>
+                </div>
+                <div class="flush"></div>
+                <% end %>
+
+                <div id="social">
+                    <div class="left"> <%= twitter_share_button %> </div>
+                    <div  class="left"> <%= google_plus_button %> </div>
+                    <div class="flush"></div>
+                </div>
+                <div id="choixrss">
+                    <a id="rss" href="http://feeds.feedburner.com/yannespositocom<%= language %>">
+                        <%= tradOf(:subscribe) %>
+                    </a>
+                </div>
+                <div class="flush"></div>
+
+                <div class="corps" id="comment">
+                    <h2 class="first"><%= tradOf(:comment) %></h2>
+
+					<div id="disqus_thread"></div>
+        			<script type="text/javascript">
+        			    /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
+        			    var disqus_shortname = 'yannesposito'; // required: replace example with your forum shortname
+
+        			    /* * * DON'T EDIT BELOW THIS LINE * * */
+        			    (function() {
+        			        var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
+        			        dsq.src = 'http://' + disqus_shortname + '.disqus.com/embed.js';
+        			        (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
+        			    })();
+        			</script>
+        			<noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
+        			<a href="http://disqus.com" class="dsq-brlink">comments powered by <span class="logo-disqus">Disqus</span></a>
+				</div>
+
+                <div id="entete" class="corps_spaced">
+                    <div id="liens">
+                        <%= generateMenu %>
+                    </div>
+                    <div class="flush"></div>
+                    <hr/>
+                    <div id="next_before_articles">
+                        <div id="previous_articles">
+                            <%= tradOf(:previousArticles) %>
+                            <%
+                            (1..3).each do |n|
+                            a=article_brother(-n)
+                            if not a.nil?
+                            %>
+                            <div class="previous_article">
+                                <%= link_to( %{<span class="nicer">«</span>&nbsp;}+ a[:title], a)  %>
+                            </div>
+                            <% end %>
+                            <% end %>
+                        </div>
+                        <div id="next_articles">
+                            <%= tradOf(:nextArticles) %>
+                            <%
+                            (1..3).each do |n|
+                            a=article_brother(n)
+                            if not a.nil?
+                            %>
+                            <div class="next_article">
+                                <%= link_to(a[:title] + %{&nbsp;<span class="nicer">»</span>}, a)  %>
+                            </div>
+                            <% end %>
+                            <% end %>
+                        </div>
+                        <div class="flush"></div>
+                    </div>
+                </div>
+
+
+                <div id="bottom">
+                    <div>
+                        <a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
+                    </div>
+                    <div>
+                        <%=tradOf(:copyright) %>
+                    </div>
+                    <div id="lastmod">
+                        <%=tradOf(:created_at)%>: <%= @item[:created_at].strftime(@config[:dateFormat][language.intern]) %>
+                        <%=tradOf(:last_modified)%>: <%= gitmtime.strftime(@config[:dateFormat][language.intern]) %>
+                    </div>
+                    <div>
+                        <%= tradOf(:entirely_done_with) %>
+                        <a href="http://www.vim.org">Vim</a>
+                        <%= tradOf(:and) %>
+                        <a href="http://nanoc.stoneship.org">nanoc</a>
+                    </div>
+                </div>
+                <div class="clear"></div>
+            </div>
+        </div>
+    </body>
+    <script type="text/javascript" src="<%=@config[:webprefix]%>/js/jquery-1.3.1.min.js"></script>
+    <script type="text/javascript" src="<%=@config[:webprefix]%>/js/jquery.cookie.js"></script>
+    <script type="text/javascript" src="<%=@config[:webprefix]%>/js/index.js"></script>
+    <script type="text/javascript" src="<%=@config[:webprefix]%>/js/highlight/highlight.pack.js"></script>
+    <script type="text/javascript" src="<%=@config[:webprefix]%>/js/article.js"></script>
+    <script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
+</html>

multi/blog/Category-Theory-Presentation.erb

@@ -7,7 +7,7 @@ en: title: Category Theory Presentation
 fr: title: Category Theory Presentation
 author_name: Yann Esposito
 author_uri: yannesposito.com
-layout: article2
+layout: article3
 macros:
  latex: '<span style="text-transform: uppercase">L<sup style="vertical-align: 0.15em; margin-left: -0.36em; margin-right: -0.15em; font-size: .85em">a</sup>T<sub style="vertical-align: -0.5ex; margin-left: -0.1667em; margin-right: -0.125em; font-size: 1em">e</sub>X</span>'
 tags:

output/Scratch/js/index.js

@@ -95,8 +95,7 @@ function switchCssTo(style) {
 	styles.forEach(function(trystyle){
 		if ($('link[href="'+trystyle+'"]').length > 0) {
 			$('link[href="'+trystyle+'"]').attr('href',style);
-			styleindex = $.inArray(style,styles);
+			styleindex=styles.indexOf(style);
-			console.log('styleindex = ' + styleindex + ', style = ' + style);
 		}
 	});
 	// save the preference