Change .span to .col-md- and .offset to .col-md-offset-

templates/404.html

@@ -9,19 +9,19 @@ Page does not exist at {{ SITENAME|striptags|e }} blog.
 {% endblock head_description %}
 {% block content %}
 <div class="row">
-    <header class="page-header span10 offset2">
+    <header class="page-header col-md-10 col-md-offset-2">
     <h1>That page doesn't exist!</h1>
     </header>
 </div>
 
 
 <div class="row">
-    <div class="span8 offset2">
+    <div class="col-md-8 col-md-offset-2">
         <p>Sorry, but the page you are looking for cannot be found. It seems that the page you were trying to reach doesn't exist, or may be it has just moved, or it no longer exists.</p>
         <p>The best thing to do is to use the search form or start again from the <a href="{{ SITEURL }}">home page</a>.</p>
         <div class="input-append">
             <form action="{{ SITEURL }}/search.html" onsubmit="return validateForm(this.elements['q'].value)">
-                <input type="text" class="span12" placeholder="Search" name="q" id="tipue_search_input_404">
+                <input type="text" class="col-md-12" placeholder="Search" name="q" id="tipue_search_input_404">
                 <button class="btn" type="submit">Search</button>
             </form>
         </div>

templates/archives.html

@@ -27,12 +27,12 @@ Full archives of {{ SITENAME|striptags|e }} blog.
 {% block content %}
 
 <div class="row">
-    <header class="page-header span10 offset2">
+    <header class="page-header col-md-10 col-md-offset-2">
     <h1><a href="{{ SITEURL }}/archives.html">All Posts</a></h1>
     </header>
 </div>
 <div class="row">
-    <div class="span10 offset2">
+    <div class="col-md-10 col-md-offset-2">
         <div class="blog-archives">
             {% set last_year = 0 %}
             {% for article in dates %}

templates/article.html

@@ -23,22 +23,22 @@
 {% block content %}
 <article>
 <div class="row">
-    <header class="page-header span10 offset2">
+    <header class="page-header col-md-10 col-md-offset-2">
     <h1><a href="{{ SITEURL }}/{{ article.url }}"> {{ article.title }} {%if article.subtitle %} <small> {{ article.subtitle }} </small> {% endif %} </a></h1>
     </header>
 </div>
 
 <div class="row">
     {% if article.toc %}
-    <div class="span2 table-of-content">
+    <div class="col-md-2 table-of-content">
         <nav>
         <h4>Contents</h4>
         {{ article.toc }}
         </nav>
     </div>
-    <div class="span8 article-content">
+    <div class="col-md-8 article-content">
        {% else %}
-        <div class="span8 offset2 article-content">
+        <div class="col-md-8 col-md-offset-2 article-content">
             {% endif %}
 
             {% import '_includes/translations.html' as translations with context %}
@@ -78,7 +78,7 @@
             {% endif %}
         </div>
         <section>
-        <div class="span2" style="float:right;font-size:0.9em;">
+        <div class="col-md-2" style="float:right;font-size:0.9em;">
             {% if article.date %}
             <h4>Published</h4>
             {% set day = article.date.strftime('%d')|int %}

templates/base.html

@@ -80,12 +80,12 @@
         </div>
         <div class="container-fluid">
             <div class="row">
-                <div class="span1"></div>
-                <div class="span10">
+                <div class="col-md-1"></div>
+                <div class="col-md-10">
                     {% block content %}
                     {% endblock content %}
                 </div>
-                <div class="span1"></div>
+                <div class="col-md-1"></div>
             </div>
         </div>
         <div id="push"></div>

templates/categories.html

@@ -31,14 +31,14 @@ All categories of the {{ SITENAME|striptags|e }} blog.
 
 {% block content %}
 <div class="row">
-    <header class="page-header span10 offset2">
+    <header class="page-header col-md-10 col-md-offset-2">
     <h1><a href="{{ SITEURL }}/categories.html">All Categories</a></h1>
     </header>
 </div>
 
 
 <div class="row">
-    <div class="span8 offset2">
+    <div class="col-md-8 col-md-offset-2">
         <div class="accordion" id="accordion2">
             {% for category, articles in categories %}
             <div class="accordion-group">

templates/index.html

@@ -34,9 +34,9 @@
 {% from '_includes/_defaults.html' import PROJECTS with context %}
 <div class="row">
     {% if LANDING_PAGE_ABOUT and LANDING_PAGE_ABOUT.title %}
-    {% set css_class = 'span10 offset2' %}
+    {% set css_class = 'col-md-10 col-md-offset-2' %}
     {% if PROJECTS and LANDING_PAGE_ABOUT %}
-    {% set css_class = 'span12' %}
+    {% set css_class = 'col-md-12' %}
     {% endif %}
     <header class="page-header {{css_class}}">
     <h1><a href="{{ SITEURL }}">{{ LANDING_PAGE_ABOUT.title }}</a></h1>
@@ -45,9 +45,9 @@
 
     <div class="row">
         {% if LANDING_PAGE_ABOUT and LANDING_PAGE_ABOUT.details %}
-        {% set css_class = 'span8 offset2' %}
+        {% set css_class = 'col-md-8 col-md-offset-2' %}
         {% if PROJECTS and LANDING_PAGE_ABOUT %}
-        {% set css_class = 'span8' %}
+        {% set css_class = 'col-md-8' %}
         {% endif %}
         <div class="{{css_class}}">
             <header>
@@ -60,9 +60,9 @@
         {% endif %}
 
         {% if PROJECTS %}
-        {% set css_class = 'span8 offset2' %}
+        {% set css_class = 'col-md-8 col-md-offset-2' %}
         {% if PROJECTS and LANDING_PAGE_ABOUT %}
-        {% set css_class = 'span4' %}
+        {% set css_class = 'col-md-4' %}
         {% endif %}
         <div class="{{css_class}}">
             <header>
@@ -80,9 +80,9 @@
     </div>
 
     {% if articles %}
-    {% set css_class = 'span8 offset2' %}
+    {% set css_class = 'col-md-8 col-md-offset-2' %}
     {% if articles and PROJECTS and LANDING_PAGE_ABOUT %}
-    {% set css_class = 'span12' %}
+    {% set css_class = 'col-md-12' %}
     {% endif %}
     <div class="row">
         <div class="{{css_class}}">

templates/page.html

@@ -23,22 +23,22 @@
 {% block content %}
 <article>
 <div class="row">
-    <header class="page-header span10 offset2">
+    <header class="page-header col-md-10 col-md-offset-2">
     <h1><a href="{{ SITEURL }}/{{ page.url }}"> {{ page.title }} {%if page.subtitle %} <small> {{ page.subtitle }} </small> {% endif %} </a></h1>
     </header>
 </div>
 
 <div class="row">
     {% if page.toc %}
-    <div class="span2 table-of-content">
+    <div class="col-md-2 table-of-content">
         <nav>
         <h4>Contents</h4>
         {{ page.toc }}
         </nav>
     </div>
-    <div class="span8 article-content">
+    <div class="col-md-8 article-content">
         {% else %}
-        <div class="span8 offset2 article-content">
+        <div class="col-md-8 col-md-offset-2 article-content">
             {% endif %}
 
             {{ page.content }}
@@ -46,7 +46,7 @@
             {{ comments(page) }}
         </div>
         <section>
-        <div class="span2" style="float:right;font-size:0.9em;">
+        <div class="col-md-2" style="float:right;font-size:0.9em;">
             {% include '_includes/social_links.html' %}
             {% include '_includes/mailchimp.html' %}
         </div>

templates/search.html

@@ -55,7 +55,7 @@ $(document).ready(function() {
 
 {% block content %}
 <article>
-    <div class="span8 offset2">
+    <div class="col-md-8 col-md-offset-2">
         <div id="tipue_search_content"><div id="tipue_search_loading"></div></div>
     </div>
 </article>

templates/tags.html

@@ -32,12 +32,12 @@ All tags used in the {{ SITENAME|striptags|e }} blog.
 {% block content %}
 
 <div class="row">
-    <header class="page-header span10 offset2">
+    <header class="page-header col-md-10 col-md-offset-2">
     <h1><a href="{{ SITEURL }}/tags.html">All Tags</a></h1>
     </header>
 </div>
 <div class="row">
-    <div class="span8 offset2">
+    <div class="col-md-8 col-md-offset-2">
         <form class="form-search">
             <input type="text" class="input-medium search-query filterinput" placeholder="Find a tag">
         </form>
@@ -53,7 +53,7 @@ All tags used in the {{ SITENAME|striptags|e }} blog.
 </div>
 
 <div class="row">
-    <div class="span8 offset2">
+    <div class="col-md-8 col-md-offset-2">
         {% for tag, articles in tags|sort %}
         <h2 id="{{ tag.slug }}-ref" class="tag-title">{{ tag }}</h2>
         <ul class="articles-in-tag list-articles-category">