${page.name} - Pyramid tutorial wiki (based on TurboGears 20-Minute Wiki)

From ee9676a8691dd18b88d3247fd8c1306c5aaa1543 Mon Sep 17 00:00:00 2001 From: Steve Piercy Date: Sun, 24 May 2015 19:15:22 -0700 Subject: - make templates html5 compliant - punctuation, grammar, spelling - fix linenos references - update outputs --- .../wiki2/src/views/tutorial/templates/edit.pt | 28 ++++++++++------------ .../wiki2/src/views/tutorial/templates/view.pt | 24 +++++++++---------- docs/tutorials/wiki2/src/views/tutorial/views.py | 1 + 3 files changed, 25 insertions(+), 28 deletions(-) (limited to 'docs/tutorials/wiki2/src') diff --git a/docs/tutorials/wiki2/src/views/tutorial/templates/edit.pt b/docs/tutorials/wiki2/src/views/tutorial/templates/edit.pt index 5f962bbf5..9320e0a50 100644 --- a/docs/tutorials/wiki2/src/views/tutorial/templates/edit.pt +++ b/docs/tutorials/wiki2/src/views/tutorial/templates/edit.pt @@ -1,22 +1,20 @@ - - + + + ${page.name} - Pyramid tutorial wiki (based on TurboGears 20-Minute Wiki) - - - + + + href="${request.static_url('tutorial:static/favicon.ico')}"> + type="text/css" media="screen"> @@ -25,7 +23,7 @@

+ src="${request.static_url('tutorial:static/pyramid-small.png')}">

@@ -33,9 +31,9 @@

Editing Page Name Goes - Here
+ Here
You can return to the - FrontPage.
+ FrontPage.

@@ -44,8 +42,8 @@

<br/>
-          <input type="submit" name="form.submitted" value="Save"/>
+                    cols="60"><br>
+          <input type="submit" name="form.submitted" value="Save">
         </form>
       </div>
     </div>
diff --git a/docs/tutorials/wiki2/src/views/tutorial/templates/view.pt b/docs/tutorials/wiki2/src/views/tutorial/templates/view.pt
index 78c0d2d4c..f73d92f0f 100644
--- a/docs/tutorials/wiki2/src/views/tutorial/templates/view.pt
+++ b/docs/tutorials/wiki2/src/views/tutorial/templates/view.pt
@@ -1,22 +1,20 @@
-<!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" xml:lang="en"
-      xmlns:tal="http://xml.zope.org/namespaces/tal">
+<!DOCTYPE html>
+<html lang="en">
 <head>
+  <meta charset="utf-8">
   <title>${page.name} - Pyramid tutorial wiki (based on
     TurboGears 20-Minute Wiki)</title>
-  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
-  <meta name="keywords" content="python web application" />
-  <meta name="description" content="pyramid web application" />
+  <meta name="keywords" content="python web application">
+  <meta name="description" content="pyramid web application">
   <link rel="shortcut icon"
-        href="${request.static_url('tutorial:static/favicon.ico')}" />
+        href="${request.static_url('tutorial:static/favicon.ico')}">
   <link rel="stylesheet"
         href="${request.static_url('tutorial:static/pylons.css')}"
-        type="text/css" media="screen" charset="utf-8" />
+        type="text/css" media="screen">
   
 </head>
 <body>
@@ -25,7 +23,7 @@
       <div class="top-small align-center">
         <div>
           <img width="220" height="50" alt="pyramid"
-        src="${request.static_url('tutorial:static/pyramid-small.png')}" />
+        src="${request.static_url('tutorial:static/pyramid-small.png')}">
         </div>
       </div>
     </div>
@@ -33,9 +31,9 @@
       <div class="middle align-right">
         <div id="left" class="app-welcome align-left">
           Viewing <b><span tal:replace="page.name">Page Name
-              Goes Here</span></b><br/>
+              Goes Here</span></b><br>
           You can return to the
-          <a href="${request.application_url}">FrontPage</a>.<br/>
+          <a href="${request.application_url}">FrontPage</a>.<br>
         </div>
         <div id="right" class="app-welcome align-right"></div>
       </div>
diff --git a/docs/tutorials/wiki2/src/views/tutorial/views.py b/docs/tutorials/wiki2/src/views/tutorial/views.py
index b41d4ab40..a3707dab5 100644
--- a/docs/tutorials/wiki2/src/views/tutorial/views.py
+++ b/docs/tutorials/wiki2/src/views/tutorial/views.py
@@ -6,6 +6,7 @@ from pyramid.httpexceptions import (
     HTTPFound,
     HTTPNotFound,
     )
+
 from pyramid.view import view_config
 
 from .models import (
-- 
cgit v1.2.3

From ed119682634aed82a17e0321e31a35982bda3615 Mon Sep 17 00:00:00 2001
From: Steve Piercy <web@stevepiercy.com>
Date: Sun, 24 May 2015 22:12:29 -0700
Subject: use current theme derived from new alchemy scaffold

---
 .../wiki2/src/views/tutorial/templates/edit.pt     | 107 +++++++++++---------
 .../wiki2/src/views/tutorial/templates/view.pt     | 110 ++++++++++++---------
 2 files changed, 124 insertions(+), 93 deletions(-)

(limited to 'docs/tutorials/wiki2/src')

diff --git a/docs/tutorials/wiki2/src/views/tutorial/templates/edit.pt b/docs/tutorials/wiki2/src/views/tutorial/templates/edit.pt
index 9320e0a50..c0c1b6c20 100644
--- a/docs/tutorials/wiki2/src/views/tutorial/templates/edit.pt
+++ b/docs/tutorials/wiki2/src/views/tutorial/templates/edit.pt
@@ -1,52 +1,69 @@
 <!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="utf-8">
-  <title>${page.name} - Pyramid tutorial wiki (based on
+<html lang="${request.locale_name}">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="pyramid web application">
+    <meta name="author" content="Pylons Project">
+    <link rel="shortcut icon" href="${request.static_url('tutorial:static/pyramid-16x16.png')}">
+
+    <title>${page.name} - Pyramid tutorial wiki (based on
     TurboGears 20-Minute Wiki)</title>
-  <meta name="keywords" content="python web application">
-  <meta name="description" content="pyramid web application">
-  <link rel="shortcut icon"
-        href="${request.static_url('tutorial:static/favicon.ico')}">
-  <link rel="stylesheet"
-        href="${request.static_url('tutorial:static/pylons.css')}"
-        type="text/css" media="screen">
-  
-</head>
-<body>
-  <div id="wrap">
-    <div id="top-small">
-      <div class="top-small align-center">
-        <div>
-          <img width="220" height="50" alt="pyramid"
-        src="${request.static_url('tutorial:static/pyramid-small.png')}">
+
+    
+    <link href="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
+
+    
+    <link href="${request.static_url('tutorial:static/theme.css')}" rel="stylesheet">
+
+    
+    
+  </head>
+  <body>
+
+    <div class="starter-template">
+      <div class="container">
+        <div class="row">
+          <div class="col-md-2">
+            <img class="logo img-responsive" src="${request.static_url('tutorial:static/pyramid.png')}" alt="pyramid web framework">
+          </div>
+          <div class="col-md-10">
+            <div class="content">
+              <p>
+                Editing <strong><span tal:replace="page.name">Page Name Goes
+                Here</span></strong>
+              </p>
+              <p>You can return to the
+                <a href="${request.application_url}">FrontPage</a>.
+              </p>
+              <form action="${save_url}" method="post">
+                <div class="form-group">
+                  <textarea class="form-control" name="body" tal:content="page.data" rows="10" cols="60">

+ +

+ + + - - -

- Editing Page Name Goes - Here
- You can return to the - FrontPage.
+

<br>
-          <input type="submit" name="form.submitted" value="Save">
-        </form>
       </div>
     </div>
-  </div>
-</body>
+
+
+    
+    
+    <script src="//oss.maxcdn.com/libs/jquery/1.10.2/jquery.min.js"></script>
+    <script src="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/js/bootstrap.min.js"></script>
+  </body>
 </html>
diff --git a/docs/tutorials/wiki2/src/views/tutorial/templates/view.pt b/docs/tutorials/wiki2/src/views/tutorial/templates/view.pt
index f73d92f0f..0f564b16c 100644
--- a/docs/tutorials/wiki2/src/views/tutorial/templates/view.pt
+++ b/docs/tutorials/wiki2/src/views/tutorial/templates/view.pt
@@ -1,55 +1,69 @@
 <!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="utf-8">
-  <title>${page.name} - Pyramid tutorial wiki (based on
+<html lang="${request.locale_name}">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="pyramid web application">
+    <meta name="author" content="Pylons Project">
+    <link rel="shortcut icon" href="${request.static_url('tutorial:static/pyramid-16x16.png')}">
+
+    <title>${page.name} - Pyramid tutorial wiki (based on
     TurboGears 20-Minute Wiki)</title>
-  <meta name="keywords" content="python web application">
-  <meta name="description" content="pyramid web application">
-  <link rel="shortcut icon"
-        href="${request.static_url('tutorial:static/favicon.ico')}">
-  <link rel="stylesheet"
-        href="${request.static_url('tutorial:static/pylons.css')}"
-        type="text/css" media="screen">
-  
-</head>
-<body>
-  <div id="wrap">
-    <div id="top-small">
-      <div class="top-small align-center">
-        <div>
-          <img width="220" height="50" alt="pyramid"
-        src="${request.static_url('tutorial:static/pyramid-small.png')}">
+
+    
+    <link href="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
+
+    
+    <link href="${request.static_url('tutorial:static/theme.css')}" rel="stylesheet">
+
+    
+    
+  </head>
+  <body>
+
+    <div class="starter-template">
+      <div class="container">
+        <div class="row">
+          <div class="col-md-2">
+            <img class="logo img-responsive" src="${request.static_url('tutorial:static/pyramid.png')}" alt="pyramid web framework">
+          </div>
+          <div class="col-md-10">
+            <div class="content">
+              <div tal:replace="structure content">
+                Page text goes here.
+              </div>
+              <p>
+                <a tal:attributes="href edit_url" href="">
+                  Edit this page
+                </a>
+              </p>
+              <p>
+                  Viewing <strong><span tal:replace="page.name">
+                  Page Name Goes Here</span></strong>
+              </p>
+              <p>You can return to the
+                <a href="${request.application_url}">FrontPage</a>.
+              </p>
+            </div>
+          </div>
         </div>
-      </div>
-    </div>
-    <div id="middle">
-      <div class="middle align-right">
-        <div id="left" class="app-welcome align-left">
-          Viewing <b><span tal:replace="page.name">Page Name
-              Goes Here</span></b><br>
-          You can return to the
-          <a href="${request.application_url}">FrontPage</a>.<br>
-        </div>
-        <div id="right" class="app-welcome align-right"></div>
-      </div>
-    </div>
-    <div id="bottom">
-      <div class="bottom">
-        <div tal:replace="structure content">
-          Page text goes here.
+        <div class="row">
+          <div class="copyright">
+            Copyright © Pylons Project
+          </div>
         </div>
-        <p>
-          <a tal:attributes="href edit_url" href="">
-            Edit this page
-          </a>
-        </p>
       </div>
     </div>
-  </div>
-</body>
+
+
+    
+    
+    <script src="//oss.maxcdn.com/libs/jquery/1.10.2/jquery.min.js"></script>
+    <script src="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/js/bootstrap.min.js"></script>
+  </body>
 </html>
-- 
cgit v1.2.3

From 84dccb790c73183e44facda3a04d2605f7ec0fcf Mon Sep 17 00:00:00 2001
From: Steve Piercy <web@stevepiercy.com>
Date: Sun, 24 May 2015 23:06:41 -0700
Subject: update static assets for wiki tutorial

---
 .../wiki2/src/views/tutorial/static/favicon.ico    | Bin 1406 -> 0 bytes
 .../wiki2/src/views/tutorial/static/footerbg.png   | Bin 333 -> 0 bytes
 .../wiki2/src/views/tutorial/static/headerbg.png   | Bin 203 -> 0 bytes
 .../wiki2/src/views/tutorial/static/ie6.css        |   8 -
 .../wiki2/src/views/tutorial/static/middlebg.png   | Bin 2797 -> 0 bytes
 .../wiki2/src/views/tutorial/static/pylons.css     | 372 ---------------------
 .../src/views/tutorial/static/pyramid-16x16.png    | Bin 0 -> 1319 bytes
 .../src/views/tutorial/static/pyramid-small.png    | Bin 7044 -> 0 bytes
 .../wiki2/src/views/tutorial/static/pyramid.png    | Bin 33055 -> 12901 bytes
 .../wiki2/src/views/tutorial/static/theme.css      | 154 +++++++++
 .../wiki2/src/views/tutorial/static/theme.min.css  |   1 +
 .../src/views/tutorial/static/transparent.gif      | Bin 49 -> 0 bytes
 12 files changed, 155 insertions(+), 380 deletions(-)
 delete mode 100644 docs/tutorials/wiki2/src/views/tutorial/static/favicon.ico
 delete mode 100644 docs/tutorials/wiki2/src/views/tutorial/static/footerbg.png
 delete mode 100644 docs/tutorials/wiki2/src/views/tutorial/static/headerbg.png
 delete mode 100644 docs/tutorials/wiki2/src/views/tutorial/static/ie6.css
 delete mode 100644 docs/tutorials/wiki2/src/views/tutorial/static/middlebg.png
 delete mode 100644 docs/tutorials/wiki2/src/views/tutorial/static/pylons.css
 create mode 100644 docs/tutorials/wiki2/src/views/tutorial/static/pyramid-16x16.png
 delete mode 100644 docs/tutorials/wiki2/src/views/tutorial/static/pyramid-small.png
 create mode 100644 docs/tutorials/wiki2/src/views/tutorial/static/theme.css
 create mode 100644 docs/tutorials/wiki2/src/views/tutorial/static/theme.min.css
 delete mode 100644 docs/tutorials/wiki2/src/views/tutorial/static/transparent.gif

(limited to 'docs/tutorials/wiki2/src')

diff --git a/docs/tutorials/wiki2/src/views/tutorial/static/favicon.ico b/docs/tutorials/wiki2/src/views/tutorial/static/favicon.ico
deleted file mode 100644
index 71f837c9e..000000000
Binary files a/docs/tutorials/wiki2/src/views/tutorial/static/favicon.ico and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/views/tutorial/static/footerbg.png b/docs/tutorials/wiki2/src/views/tutorial/static/footerbg.png
deleted file mode 100644
index 1fbc873da..000000000
Binary files a/docs/tutorials/wiki2/src/views/tutorial/static/footerbg.png and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/views/tutorial/static/headerbg.png b/docs/tutorials/wiki2/src/views/tutorial/static/headerbg.png
deleted file mode 100644
index 0596f2020..000000000
Binary files a/docs/tutorials/wiki2/src/views/tutorial/static/headerbg.png and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/views/tutorial/static/ie6.css b/docs/tutorials/wiki2/src/views/tutorial/static/ie6.css
deleted file mode 100644
index b7c8493d8..000000000
--- a/docs/tutorials/wiki2/src/views/tutorial/static/ie6.css
+++ /dev/null
@@ -1,8 +0,0 @@
-* html img,
-* html .png{position:relative;behavior:expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",
-this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "',sizingMethod='image')",
-this.src = "static/transparent.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
-this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "',sizingMethod='crop')",
-this.runtimeStyle.backgroundImage = "none")),this.pngSet=true)
-);}
-#wrap{display:table;height:100%}
diff --git a/docs/tutorials/wiki2/src/views/tutorial/static/middlebg.png b/docs/tutorials/wiki2/src/views/tutorial/static/middlebg.png
deleted file mode 100644
index 2369cfb7d..000000000
Binary files a/docs/tutorials/wiki2/src/views/tutorial/static/middlebg.png and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/views/tutorial/static/pylons.css b/docs/tutorials/wiki2/src/views/tutorial/static/pylons.css
deleted file mode 100644
index 4b1c017cd..000000000
--- a/docs/tutorials/wiki2/src/views/tutorial/static/pylons.css
+++ /dev/null
@@ -1,372 +0,0 @@
-html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td
-{
-  margin: 0;
-  padding: 0;
-  border: 0;
-  outline: 0;
-  font-size: 100%; /* 16px */
-  vertical-align: baseline;
-  background: transparent;
-}
-
-body
-{
-  line-height: 1;
-}
-
-ol, ul
-{
-  list-style: none;
-}
-
-blockquote, q
-{
-  quotes: none;
-}
-
-blockquote:before, blockquote:after, q:before, q:after
-{
-  content: '';
-  content: none;
-}
-
-:focus
-{
-  outline: 0;
-}
-
-ins
-{
-  text-decoration: none;
-}
-
-del
-{
-  text-decoration: line-through;
-}
-
-table
-{
-  border-collapse: collapse;
-  border-spacing: 0;
-}
-
-sub
-{
-  vertical-align: sub;
-  font-size: smaller;
-  line-height: normal;
-}
-
-sup
-{
-  vertical-align: super;
-  font-size: smaller;
-  line-height: normal;
-}
-
-ul, menu, dir
-{
-  display: block;
-  list-style-type: disc;
-  margin: 1em 0;
-  padding-left: 40px;
-}
-
-ol
-{
-  display: block;
-  list-style-type: decimal-leading-zero;
-  margin: 1em 0;
-  padding-left: 40px;
-}
-
-li
-{
-  display: list-item;
-}
-
-ul ul, ul ol, ul dir, ul menu, ul dl, ol ul, ol ol, ol dir, ol menu, ol dl, dir ul, dir ol, dir dir, dir menu, dir dl, menu ul, menu ol, menu dir, menu menu, menu dl, dl ul, dl ol, dl dir, dl menu, dl dl
-{
-  margin-top: 0;
-  margin-bottom: 0;
-}
-
-ol ul, ul ul, menu ul, dir ul, ol menu, ul menu, menu menu, dir menu, ol dir, ul dir, menu dir, dir dir
-{
-  list-style-type: circle;
-}
-
-ol ol ul, ol ul ul, ol menu ul, ol dir ul, ol ol menu, ol ul menu, ol menu menu, ol dir menu, ol ol dir, ol ul dir, ol menu dir, ol dir dir, ul ol ul, ul ul ul, ul menu ul, ul dir ul, ul ol menu, ul ul menu, ul menu menu, ul dir menu, ul ol dir, ul ul dir, ul menu dir, ul dir dir, menu ol ul, menu ul ul, menu menu ul, menu dir ul, menu ol menu, menu ul menu, menu menu menu, menu dir menu, menu ol dir, menu ul dir, menu menu dir, menu dir dir, dir ol ul, dir ul ul, dir menu ul, dir dir ul, dir ol menu, dir ul menu, dir menu menu, dir dir menu, dir ol dir, dir ul dir, dir menu dir, dir dir dir
-{
-  list-style-type: square;
-}
-
-.hidden
-{
-  display: none;
-}
-
-p
-{
-  line-height: 1.5em;
-}
-
-h1
-{
-  font-size: 1.75em;
-  line-height: 1.7em;
-  font-family: helvetica, verdana;
-}
-
-h2
-{
-  font-size: 1.5em;
-  line-height: 1.7em;
-  font-family: helvetica, verdana;
-}
-
-h3
-{
-  font-size: 1.25em;
-  line-height: 1.7em;
-  font-family: helvetica, verdana;
-}
-
-h4
-{
-  font-size: 1em;
-  line-height: 1.7em;
-  font-family: helvetica, verdana;
-}
-
-html, body
-{
-  width: 100%;
-  height: 100%;
-}
-
-body
-{
-  margin: 0;
-  padding: 0;
-  background-color: #fff;
-  position: relative;
-  font: 16px/24px NobileRegular, "Lucida Grande", Lucida, Verdana, sans-serif;
-}
-
-a
-{
-  color: #1b61d6;
-  text-decoration: none;
-}
-
-a:hover
-{
-  color: #e88f00;
-  text-decoration: underline;
-}
-
-body h1, body h2, body h3, body h4, body h5, body h6
-{
-  font-family: NeutonRegular, "Lucida Grande", Lucida, Verdana, sans-serif;
-  font-weight: 400;
-  color: #373839;
-  font-style: normal;
-}
-
-#wrap
-{
-  min-height: 100%;
-}
-
-#header, #footer
-{
-  width: 100%;
-  color: #fff;
-  height: 40px;
-  position: absolute;
-  text-align: center;
-  line-height: 40px;
-  overflow: hidden;
-  font-size: 12px;
-  vertical-align: middle;
-}
-
-#header
-{
-  background: #000;
-  top: 0;
-  font-size: 14px;
-}
-
-#footer
-{
-  bottom: 0;
-  background: #000 url(footerbg.png) repeat-x 0 top;
-  position: relative;
-  margin-top: -40px;
-  clear: both;
-}
-
-.header, .footer
-{
-  width: 750px;
-  margin-right: auto;
-  margin-left: auto;
-}
-
-.wrapper
-{
-  width: 100%;
-}
-
-#top, #top-small, #bottom
-{
-  width: 100%;
-}
-
-#top
-{
-  color: #000;
-  height: 230px;
-  background: #fff url(headerbg.png) repeat-x 0 top;
-  position: relative;
-}
-
-#top-small
-{
-  color: #000;
-  height: 60px;
-  background: #fff url(headerbg.png) repeat-x 0 top;
-  position: relative;
-}
-
-#bottom
-{
-  color: #222;
-  background-color: #fff;
-}
-
-.top, .top-small, .middle, .bottom
-{
-  width: 750px;
-  margin-right: auto;
-  margin-left: auto;
-}
-
-.top
-{
-  padding-top: 40px;
-}
-
-.top-small
-{
-  padding-top: 10px;
-}
-
-#middle
-{
-  width: 100%;
-  height: 100px;
-  background: url(middlebg.png) repeat-x;
-  border-top: 2px solid #fff;
-  border-bottom: 2px solid #b2b2b2;
-}
-
-.app-welcome
-{
-  margin-top: 25px;
-}
-
-.app-name
-{
-  color: #000;
-  font-weight: 700;
-}
-
-.bottom
-{
-  padding-top: 50px;
-}
-
-#left
-{
-  width: 350px;
-  float: left;
-  padding-right: 25px;
-}
-
-#right
-{
-  width: 350px;
-  float: right;
-  padding-left: 25px;
-}
-
-.align-left
-{
-  text-align: left;
-}
-
-.align-right
-{
-  text-align: right;
-}
-
-.align-center
-{
-  text-align: center;
-}
-
-ul.links
-{
-  margin: 0;
-  padding: 0;
-}
-
-ul.links li
-{
-  list-style-type: none;
-  font-size: 14px;
-}
-
-form
-{
-  border-style: none;
-}
-
-fieldset
-{
-  border-style: none;
-}
-
-input
-{
-  color: #222;
-  border: 1px solid #ccc;
-  font-family: sans-serif;
-  font-size: 12px;
-  line-height: 16px;
-}
-
-input[type=text], input[type=password]
-{
-  width: 205px;
-}
-
-input[type=submit]
-{
-  background-color: #ddd;
-  font-weight: 700;
-}
-
-/*Opera Fix*/
-body:before
-{
-  content: "";
-  height: 100%;
-  float: left;
-  width: 0;
-  margin-top: -32767px;
-}
diff --git a/docs/tutorials/wiki2/src/views/tutorial/static/pyramid-16x16.png b/docs/tutorials/wiki2/src/views/tutorial/static/pyramid-16x16.png
new file mode 100644
index 000000000..979203112
Binary files /dev/null and b/docs/tutorials/wiki2/src/views/tutorial/static/pyramid-16x16.png differ
diff --git a/docs/tutorials/wiki2/src/views/tutorial/static/pyramid-small.png b/docs/tutorials/wiki2/src/views/tutorial/static/pyramid-small.png
deleted file mode 100644
index a5bc0ade7..000000000
Binary files a/docs/tutorials/wiki2/src/views/tutorial/static/pyramid-small.png and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/views/tutorial/static/pyramid.png b/docs/tutorials/wiki2/src/views/tutorial/static/pyramid.png
index 347e05549..4ab837be9 100644
Binary files a/docs/tutorials/wiki2/src/views/tutorial/static/pyramid.png and b/docs/tutorials/wiki2/src/views/tutorial/static/pyramid.png differ
diff --git a/docs/tutorials/wiki2/src/views/tutorial/static/theme.css b/docs/tutorials/wiki2/src/views/tutorial/static/theme.css
new file mode 100644
index 000000000..0f4b1a4d4
--- /dev/null
+++ b/docs/tutorials/wiki2/src/views/tutorial/static/theme.css
@@ -0,0 +1,154 @@
+@import url(//fonts.googleapis.com/css?family=Open+Sans:300,400,600,700);
+body {
+  font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-weight: 300;
+  color: #ffffff;
+  background: #bc2131;
+}
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-weight: 300;
+}
+p {
+  font-weight: 300;
+}
+.font-normal {
+  font-weight: 400;
+}
+.font-semi-bold {
+  font-weight: 600;
+}
+.font-bold {
+  font-weight: 700;
+}
+.starter-template {
+  margin-top: 250px;
+}
+.starter-template .content {
+  margin-left: 10px;
+}
+.starter-template .content h1 {
+  margin-top: 10px;
+  font-size: 60px;
+}
+.starter-template .content h1 .smaller {
+  font-size: 40px;
+  color: #f2b7bd;
+}
+.starter-template .content .lead {
+  font-size: 25px;
+  color: #f2b7bd;
+}
+.starter-template .content .lead .font-normal {
+  color: #ffffff;
+}
+.starter-template .links {
+  float: right;
+  right: 0;
+  margin-top: 125px;
+}
+.starter-template .links ul {
+  display: block;
+  padding: 0;
+  margin: 0;
+}
+.starter-template .links ul li {
+  list-style: none;
+  display: inline;
+  margin: 0 10px;
+}
+.starter-template .links ul li:first-child {
+  margin-left: 0;
+}
+.starter-template .links ul li:last-child {
+  margin-right: 0;
+}
+.starter-template .links ul li.current-version {
+  color: #f2b7bd;
+  font-weight: 400;
+}
+.starter-template .links ul li a, a {
+  color: #f2b7bd;
+  text-decoration: underline;
+}
+.starter-template .links ul li a:hover, a:hover {
+  color: #ffffff;
+  text-decoration: underline;
+}
+.starter-template .links ul li .icon-muted {
+  color: #eb8b95;
+  margin-right: 5px;
+}
+.starter-template .links ul li:hover .icon-muted {
+  color: #ffffff;
+}
+.starter-template .copyright {
+  margin-top: 10px;
+  font-size: 0.9em;
+  color: #f2b7bd;
+  text-transform: lowercase;
+  float: right;
+  right: 0;
+}
+@media (max-width: 1199px) {
+  .starter-template .content h1 {
+    font-size: 45px;
+  }
+  .starter-template .content h1 .smaller {
+    font-size: 30px;
+  }
+  .starter-template .content .lead {
+    font-size: 20px;
+  }
+}
+@media (max-width: 991px) {
+  .starter-template {
+    margin-top: 0;
+  }
+  .starter-template .logo {
+    margin: 40px auto;
+  }
+  .starter-template .content {
+    margin-left: 0;
+    text-align: center;
+  }
+  .starter-template .content h1 {
+    margin-bottom: 20px;
+  }
+  .starter-template .links {
+    float: none;
+    text-align: center;
+    margin-top: 60px;
+  }
+  .starter-template .copyright {
+    float: none;
+    text-align: center;
+  }
+}
+@media (max-width: 767px) {
+  .starter-template .content h1 .smaller {
+    font-size: 25px;
+    display: block;
+  }
+  .starter-template .content .lead {
+    font-size: 16px;
+  }
+  .starter-template .links {
+    margin-top: 40px;
+  }
+  .starter-template .links ul li {
+    display: block;
+    margin: 0;
+  }
+  .starter-template .links ul li .icon-muted {
+    display: none;
+  }
+  .starter-template .copyright {
+    margin-top: 20px;
+  }
+}
diff --git a/docs/tutorials/wiki2/src/views/tutorial/static/theme.min.css b/docs/tutorials/wiki2/src/views/tutorial/static/theme.min.css
new file mode 100644
index 000000000..0d25de5b6
--- /dev/null
+++ b/docs/tutorials/wiki2/src/views/tutorial/static/theme.min.css
@@ -0,0 +1 @@
+@import url(//fonts.googleapis.com/css?family=Open+Sans:300,400,600,700);body{font-family:"Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:300;color:#fff;background:#bc2131}h1,h2,h3,h4,h5,h6{font-family:"Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:300}p{font-weight:300}.font-normal{font-weight:400}.font-semi-bold{font-weight:600}.font-bold{font-weight:700}.starter-template{margin-top:250px}.starter-template .content{margin-left:10px}.starter-template .content h1{margin-top:10px;font-size:60px}.starter-template .content h1 .smaller{font-size:40px;color:#f2b7bd}.starter-template .content .lead{font-size:25px;color:#f2b7bd}.starter-template .content .lead .font-normal{color:#fff}.starter-template .links{float:right;right:0;margin-top:125px}.starter-template .links ul{display:block;padding:0;margin:0}.starter-template .links ul li{list-style:none;display:inline;margin:0 10px}.starter-template .links ul li:first-child{margin-left:0}.starter-template .links ul li:last-child{margin-right:0}.starter-template .links ul li.current-version{color:#f2b7bd;font-weight:400}.starter-template .links ul li a,a{color:#f2b7bd;text-decoration:underline}.starter-template .links ul li a:hover,a:hover{color:#fff;text-decoration:underline}.starter-template .links ul li .icon-muted{color:#eb8b95;margin-right:5px}.starter-template .links ul li:hover .icon-muted{color:#fff}.starter-template .copyright{margin-top:10px;font-size:.9em;color:#f2b7bd;text-transform:lowercase;float:right;right:0}@media (max-width:1199px){.starter-template .content h1{font-size:45px}.starter-template .content h1 .smaller{font-size:30px}.starter-template .content .lead{font-size:20px}}@media (max-width:991px){.starter-template{margin-top:0}.starter-template .logo{margin:40px auto}.starter-template .content{margin-left:0;text-align:center}.starter-template .content h1{margin-bottom:20px}.starter-template .links{float:none;text-align:center;margin-top:60px}.starter-template .copyright{float:none;text-align:center}}@media (max-width:767px){.starter-template .content h1 .smaller{font-size:25px;display:block}.starter-template .content .lead{font-size:16px}.starter-template .links{margin-top:40px}.starter-template .links ul li{display:block;margin:0}.starter-template .links ul li .icon-muted{display:none}.starter-template .copyright{margin-top:20px}}
diff --git a/docs/tutorials/wiki2/src/views/tutorial/static/transparent.gif b/docs/tutorials/wiki2/src/views/tutorial/static/transparent.gif
deleted file mode 100644
index 0341802e5..000000000
Binary files a/docs/tutorials/wiki2/src/views/tutorial/static/transparent.gif and /dev/null differ
-- 
cgit v1.2.3

From 492f6945b2be2874a97071a93fd786c28515efa6 Mon Sep 17 00:00:00 2001
From: Steve Piercy <web@stevepiercy.com>
Date: Mon, 25 May 2015 00:09:57 -0700
Subject: update templates and static assets for each step

---
 .../src/authorization/tutorial/static/favicon.ico  | Bin 1406 -> 0 bytes
 .../src/authorization/tutorial/static/footerbg.png | Bin 333 -> 0 bytes
 .../src/authorization/tutorial/static/headerbg.png | Bin 203 -> 0 bytes
 .../src/authorization/tutorial/static/ie6.css      |   8 -
 .../src/authorization/tutorial/static/middlebg.png | Bin 2797 -> 0 bytes
 .../src/authorization/tutorial/static/pylons.css   | 372 ---------------------
 .../tutorial/static/pyramid-16x16.png              | Bin 0 -> 1319 bytes
 .../tutorial/static/pyramid-small.png              | Bin 7044 -> 0 bytes
 .../src/authorization/tutorial/static/pyramid.png  | Bin 33055 -> 12901 bytes
 .../src/authorization/tutorial/static/theme.css    | 154 +++++++++
 .../authorization/tutorial/static/theme.min.css    |   1 +
 .../authorization/tutorial/static/transparent.gif  | Bin 49 -> 0 bytes
 .../src/authorization/tutorial/templates/edit.pt   | 124 +++----
 .../authorization/tutorial/templates/mytemplate.pt | 130 ++++---
 .../src/authorization/tutorial/templates/view.pt   | 127 +++----
 .../src/basiclayout/tutorial/static/favicon.ico    | Bin 1406 -> 0 bytes
 .../src/basiclayout/tutorial/static/footerbg.png   | Bin 333 -> 0 bytes
 .../src/basiclayout/tutorial/static/headerbg.png   | Bin 203 -> 0 bytes
 .../wiki2/src/basiclayout/tutorial/static/ie6.css  |   8 -
 .../src/basiclayout/tutorial/static/middlebg.png   | Bin 2797 -> 0 bytes
 .../src/basiclayout/tutorial/static/pylons.css     | 372 ---------------------
 .../basiclayout/tutorial/static/pyramid-16x16.png  | Bin 0 -> 1319 bytes
 .../basiclayout/tutorial/static/pyramid-small.png  | Bin 7044 -> 0 bytes
 .../src/basiclayout/tutorial/static/pyramid.png    | Bin 33055 -> 12901 bytes
 .../src/basiclayout/tutorial/static/theme.css      | 154 +++++++++
 .../src/basiclayout/tutorial/static/theme.min.css  |   1 +
 .../basiclayout/tutorial/static/transparent.gif    | Bin 49 -> 0 bytes
 .../basiclayout/tutorial/templates/mytemplate.pt   | 127 ++++---
 .../wiki2/src/models/tutorial/static/favicon.ico   | Bin 1406 -> 0 bytes
 .../wiki2/src/models/tutorial/static/footerbg.png  | Bin 333 -> 0 bytes
 .../wiki2/src/models/tutorial/static/headerbg.png  | Bin 203 -> 0 bytes
 .../wiki2/src/models/tutorial/static/ie6.css       |   8 -
 .../wiki2/src/models/tutorial/static/middlebg.png  | Bin 2797 -> 0 bytes
 .../wiki2/src/models/tutorial/static/pylons.css    | 372 ---------------------
 .../src/models/tutorial/static/pyramid-16x16.png   | Bin 0 -> 1319 bytes
 .../src/models/tutorial/static/pyramid-small.png   | Bin 7044 -> 0 bytes
 .../wiki2/src/models/tutorial/static/pyramid.png   | Bin 33055 -> 12901 bytes
 .../wiki2/src/models/tutorial/static/theme.css     | 154 +++++++++
 .../wiki2/src/models/tutorial/static/theme.min.css |   1 +
 .../src/models/tutorial/static/transparent.gif     | Bin 49 -> 0 bytes
 .../src/models/tutorial/templates/mytemplate.pt    | 127 ++++---
 .../wiki2/src/tests/tutorial/static/favicon.ico    | Bin 1406 -> 0 bytes
 .../wiki2/src/tests/tutorial/static/footerbg.png   | Bin 333 -> 0 bytes
 .../wiki2/src/tests/tutorial/static/headerbg.png   | Bin 203 -> 0 bytes
 .../wiki2/src/tests/tutorial/static/ie6.css        |   8 -
 .../wiki2/src/tests/tutorial/static/middlebg.png   | Bin 2797 -> 0 bytes
 .../wiki2/src/tests/tutorial/static/pylons.css     | 372 ---------------------
 .../src/tests/tutorial/static/pyramid-16x16.png    | Bin 0 -> 1319 bytes
 .../src/tests/tutorial/static/pyramid-small.png    | Bin 7044 -> 0 bytes
 .../wiki2/src/tests/tutorial/static/pyramid.png    | Bin 33055 -> 12901 bytes
 .../wiki2/src/tests/tutorial/static/theme.css      | 154 +++++++++
 .../wiki2/src/tests/tutorial/static/theme.min.css  |   1 +
 .../src/tests/tutorial/static/transparent.gif      | Bin 49 -> 0 bytes
 .../wiki2/src/tests/tutorial/templates/edit.pt     | 120 ++++---
 .../src/tests/tutorial/templates/mytemplate.pt     | 127 ++++---
 .../wiki2/src/tests/tutorial/templates/view.pt     | 123 ++++---
 .../src/views/tutorial/templates/mytemplate.pt     | 127 ++++---
 57 files changed, 1192 insertions(+), 2080 deletions(-)
 delete mode 100644 docs/tutorials/wiki2/src/authorization/tutorial/static/favicon.ico
 delete mode 100644 docs/tutorials/wiki2/src/authorization/tutorial/static/footerbg.png
 delete mode 100644 docs/tutorials/wiki2/src/authorization/tutorial/static/headerbg.png
 delete mode 100644 docs/tutorials/wiki2/src/authorization/tutorial/static/ie6.css
 delete mode 100644 docs/tutorials/wiki2/src/authorization/tutorial/static/middlebg.png
 delete mode 100644 docs/tutorials/wiki2/src/authorization/tutorial/static/pylons.css
 create mode 100644 docs/tutorials/wiki2/src/authorization/tutorial/static/pyramid-16x16.png
 delete mode 100644 docs/tutorials/wiki2/src/authorization/tutorial/static/pyramid-small.png
 create mode 100644 docs/tutorials/wiki2/src/authorization/tutorial/static/theme.css
 create mode 100644 docs/tutorials/wiki2/src/authorization/tutorial/static/theme.min.css
 delete mode 100644 docs/tutorials/wiki2/src/authorization/tutorial/static/transparent.gif
 delete mode 100644 docs/tutorials/wiki2/src/basiclayout/tutorial/static/favicon.ico
 delete mode 100644 docs/tutorials/wiki2/src/basiclayout/tutorial/static/footerbg.png
 delete mode 100644 docs/tutorials/wiki2/src/basiclayout/tutorial/static/headerbg.png
 delete mode 100644 docs/tutorials/wiki2/src/basiclayout/tutorial/static/ie6.css
 delete mode 100644 docs/tutorials/wiki2/src/basiclayout/tutorial/static/middlebg.png
 delete mode 100644 docs/tutorials/wiki2/src/basiclayout/tutorial/static/pylons.css
 create mode 100644 docs/tutorials/wiki2/src/basiclayout/tutorial/static/pyramid-16x16.png
 delete mode 100644 docs/tutorials/wiki2/src/basiclayout/tutorial/static/pyramid-small.png
 create mode 100644 docs/tutorials/wiki2/src/basiclayout/tutorial/static/theme.css
 create mode 100644 docs/tutorials/wiki2/src/basiclayout/tutorial/static/theme.min.css
 delete mode 100644 docs/tutorials/wiki2/src/basiclayout/tutorial/static/transparent.gif
 delete mode 100644 docs/tutorials/wiki2/src/models/tutorial/static/favicon.ico
 delete mode 100644 docs/tutorials/wiki2/src/models/tutorial/static/footerbg.png
 delete mode 100644 docs/tutorials/wiki2/src/models/tutorial/static/headerbg.png
 delete mode 100644 docs/tutorials/wiki2/src/models/tutorial/static/ie6.css
 delete mode 100644 docs/tutorials/wiki2/src/models/tutorial/static/middlebg.png
 delete mode 100644 docs/tutorials/wiki2/src/models/tutorial/static/pylons.css
 create mode 100644 docs/tutorials/wiki2/src/models/tutorial/static/pyramid-16x16.png
 delete mode 100644 docs/tutorials/wiki2/src/models/tutorial/static/pyramid-small.png
 create mode 100644 docs/tutorials/wiki2/src/models/tutorial/static/theme.css
 create mode 100644 docs/tutorials/wiki2/src/models/tutorial/static/theme.min.css
 delete mode 100644 docs/tutorials/wiki2/src/models/tutorial/static/transparent.gif
 delete mode 100644 docs/tutorials/wiki2/src/tests/tutorial/static/favicon.ico
 delete mode 100644 docs/tutorials/wiki2/src/tests/tutorial/static/footerbg.png
 delete mode 100644 docs/tutorials/wiki2/src/tests/tutorial/static/headerbg.png
 delete mode 100644 docs/tutorials/wiki2/src/tests/tutorial/static/ie6.css
 delete mode 100644 docs/tutorials/wiki2/src/tests/tutorial/static/middlebg.png
 delete mode 100644 docs/tutorials/wiki2/src/tests/tutorial/static/pylons.css
 create mode 100644 docs/tutorials/wiki2/src/tests/tutorial/static/pyramid-16x16.png
 delete mode 100644 docs/tutorials/wiki2/src/tests/tutorial/static/pyramid-small.png
 create mode 100644 docs/tutorials/wiki2/src/tests/tutorial/static/theme.css
 create mode 100644 docs/tutorials/wiki2/src/tests/tutorial/static/theme.min.css
 delete mode 100644 docs/tutorials/wiki2/src/tests/tutorial/static/transparent.gif

(limited to 'docs/tutorials/wiki2/src')

diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/static/favicon.ico b/docs/tutorials/wiki2/src/authorization/tutorial/static/favicon.ico
deleted file mode 100644
index 71f837c9e..000000000
Binary files a/docs/tutorials/wiki2/src/authorization/tutorial/static/favicon.ico and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/static/footerbg.png b/docs/tutorials/wiki2/src/authorization/tutorial/static/footerbg.png
deleted file mode 100644
index 1fbc873da..000000000
Binary files a/docs/tutorials/wiki2/src/authorization/tutorial/static/footerbg.png and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/static/headerbg.png b/docs/tutorials/wiki2/src/authorization/tutorial/static/headerbg.png
deleted file mode 100644
index 0596f2020..000000000
Binary files a/docs/tutorials/wiki2/src/authorization/tutorial/static/headerbg.png and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/static/ie6.css b/docs/tutorials/wiki2/src/authorization/tutorial/static/ie6.css
deleted file mode 100644
index b7c8493d8..000000000
--- a/docs/tutorials/wiki2/src/authorization/tutorial/static/ie6.css
+++ /dev/null
@@ -1,8 +0,0 @@
-* html img,
-* html .png{position:relative;behavior:expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",
-this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "',sizingMethod='image')",
-this.src = "static/transparent.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
-this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "',sizingMethod='crop')",
-this.runtimeStyle.backgroundImage = "none")),this.pngSet=true)
-);}
-#wrap{display:table;height:100%}
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/static/middlebg.png b/docs/tutorials/wiki2/src/authorization/tutorial/static/middlebg.png
deleted file mode 100644
index 2369cfb7d..000000000
Binary files a/docs/tutorials/wiki2/src/authorization/tutorial/static/middlebg.png and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/static/pylons.css b/docs/tutorials/wiki2/src/authorization/tutorial/static/pylons.css
deleted file mode 100644
index 4b1c017cd..000000000
--- a/docs/tutorials/wiki2/src/authorization/tutorial/static/pylons.css
+++ /dev/null
@@ -1,372 +0,0 @@
-html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td
-{
-  margin: 0;
-  padding: 0;
-  border: 0;
-  outline: 0;
-  font-size: 100%; /* 16px */
-  vertical-align: baseline;
-  background: transparent;
-}
-
-body
-{
-  line-height: 1;
-}
-
-ol, ul
-{
-  list-style: none;
-}
-
-blockquote, q
-{
-  quotes: none;
-}
-
-blockquote:before, blockquote:after, q:before, q:after
-{
-  content: '';
-  content: none;
-}
-
-:focus
-{
-  outline: 0;
-}
-
-ins
-{
-  text-decoration: none;
-}
-
-del
-{
-  text-decoration: line-through;
-}
-
-table
-{
-  border-collapse: collapse;
-  border-spacing: 0;
-}
-
-sub
-{
-  vertical-align: sub;
-  font-size: smaller;
-  line-height: normal;
-}
-
-sup
-{
-  vertical-align: super;
-  font-size: smaller;
-  line-height: normal;
-}
-
-ul, menu, dir
-{
-  display: block;
-  list-style-type: disc;
-  margin: 1em 0;
-  padding-left: 40px;
-}
-
-ol
-{
-  display: block;
-  list-style-type: decimal-leading-zero;
-  margin: 1em 0;
-  padding-left: 40px;
-}
-
-li
-{
-  display: list-item;
-}
-
-ul ul, ul ol, ul dir, ul menu, ul dl, ol ul, ol ol, ol dir, ol menu, ol dl, dir ul, dir ol, dir dir, dir menu, dir dl, menu ul, menu ol, menu dir, menu menu, menu dl, dl ul, dl ol, dl dir, dl menu, dl dl
-{
-  margin-top: 0;
-  margin-bottom: 0;
-}
-
-ol ul, ul ul, menu ul, dir ul, ol menu, ul menu, menu menu, dir menu, ol dir, ul dir, menu dir, dir dir
-{
-  list-style-type: circle;
-}
-
-ol ol ul, ol ul ul, ol menu ul, ol dir ul, ol ol menu, ol ul menu, ol menu menu, ol dir menu, ol ol dir, ol ul dir, ol menu dir, ol dir dir, ul ol ul, ul ul ul, ul menu ul, ul dir ul, ul ol menu, ul ul menu, ul menu menu, ul dir menu, ul ol dir, ul ul dir, ul menu dir, ul dir dir, menu ol ul, menu ul ul, menu menu ul, menu dir ul, menu ol menu, menu ul menu, menu menu menu, menu dir menu, menu ol dir, menu ul dir, menu menu dir, menu dir dir, dir ol ul, dir ul ul, dir menu ul, dir dir ul, dir ol menu, dir ul menu, dir menu menu, dir dir menu, dir ol dir, dir ul dir, dir menu dir, dir dir dir
-{
-  list-style-type: square;
-}
-
-.hidden
-{
-  display: none;
-}
-
-p
-{
-  line-height: 1.5em;
-}
-
-h1
-{
-  font-size: 1.75em;
-  line-height: 1.7em;
-  font-family: helvetica, verdana;
-}
-
-h2
-{
-  font-size: 1.5em;
-  line-height: 1.7em;
-  font-family: helvetica, verdana;
-}
-
-h3
-{
-  font-size: 1.25em;
-  line-height: 1.7em;
-  font-family: helvetica, verdana;
-}
-
-h4
-{
-  font-size: 1em;
-  line-height: 1.7em;
-  font-family: helvetica, verdana;
-}
-
-html, body
-{
-  width: 100%;
-  height: 100%;
-}
-
-body
-{
-  margin: 0;
-  padding: 0;
-  background-color: #fff;
-  position: relative;
-  font: 16px/24px NobileRegular, "Lucida Grande", Lucida, Verdana, sans-serif;
-}
-
-a
-{
-  color: #1b61d6;
-  text-decoration: none;
-}
-
-a:hover
-{
-  color: #e88f00;
-  text-decoration: underline;
-}
-
-body h1, body h2, body h3, body h4, body h5, body h6
-{
-  font-family: NeutonRegular, "Lucida Grande", Lucida, Verdana, sans-serif;
-  font-weight: 400;
-  color: #373839;
-  font-style: normal;
-}
-
-#wrap
-{
-  min-height: 100%;
-}
-
-#header, #footer
-{
-  width: 100%;
-  color: #fff;
-  height: 40px;
-  position: absolute;
-  text-align: center;
-  line-height: 40px;
-  overflow: hidden;
-  font-size: 12px;
-  vertical-align: middle;
-}
-
-#header
-{
-  background: #000;
-  top: 0;
-  font-size: 14px;
-}
-
-#footer
-{
-  bottom: 0;
-  background: #000 url(footerbg.png) repeat-x 0 top;
-  position: relative;
-  margin-top: -40px;
-  clear: both;
-}
-
-.header, .footer
-{
-  width: 750px;
-  margin-right: auto;
-  margin-left: auto;
-}
-
-.wrapper
-{
-  width: 100%;
-}
-
-#top, #top-small, #bottom
-{
-  width: 100%;
-}
-
-#top
-{
-  color: #000;
-  height: 230px;
-  background: #fff url(headerbg.png) repeat-x 0 top;
-  position: relative;
-}
-
-#top-small
-{
-  color: #000;
-  height: 60px;
-  background: #fff url(headerbg.png) repeat-x 0 top;
-  position: relative;
-}
-
-#bottom
-{
-  color: #222;
-  background-color: #fff;
-}
-
-.top, .top-small, .middle, .bottom
-{
-  width: 750px;
-  margin-right: auto;
-  margin-left: auto;
-}
-
-.top
-{
-  padding-top: 40px;
-}
-
-.top-small
-{
-  padding-top: 10px;
-}
-
-#middle
-{
-  width: 100%;
-  height: 100px;
-  background: url(middlebg.png) repeat-x;
-  border-top: 2px solid #fff;
-  border-bottom: 2px solid #b2b2b2;
-}
-
-.app-welcome
-{
-  margin-top: 25px;
-}
-
-.app-name
-{
-  color: #000;
-  font-weight: 700;
-}
-
-.bottom
-{
-  padding-top: 50px;
-}
-
-#left
-{
-  width: 350px;
-  float: left;
-  padding-right: 25px;
-}
-
-#right
-{
-  width: 350px;
-  float: right;
-  padding-left: 25px;
-}
-
-.align-left
-{
-  text-align: left;
-}
-
-.align-right
-{
-  text-align: right;
-}
-
-.align-center
-{
-  text-align: center;
-}
-
-ul.links
-{
-  margin: 0;
-  padding: 0;
-}
-
-ul.links li
-{
-  list-style-type: none;
-  font-size: 14px;
-}
-
-form
-{
-  border-style: none;
-}
-
-fieldset
-{
-  border-style: none;
-}
-
-input
-{
-  color: #222;
-  border: 1px solid #ccc;
-  font-family: sans-serif;
-  font-size: 12px;
-  line-height: 16px;
-}
-
-input[type=text], input[type=password]
-{
-  width: 205px;
-}
-
-input[type=submit]
-{
-  background-color: #ddd;
-  font-weight: 700;
-}
-
-/*Opera Fix*/
-body:before
-{
-  content: "";
-  height: 100%;
-  float: left;
-  width: 0;
-  margin-top: -32767px;
-}
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/static/pyramid-16x16.png b/docs/tutorials/wiki2/src/authorization/tutorial/static/pyramid-16x16.png
new file mode 100644
index 000000000..979203112
Binary files /dev/null and b/docs/tutorials/wiki2/src/authorization/tutorial/static/pyramid-16x16.png differ
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/static/pyramid-small.png b/docs/tutorials/wiki2/src/authorization/tutorial/static/pyramid-small.png
deleted file mode 100644
index a5bc0ade7..000000000
Binary files a/docs/tutorials/wiki2/src/authorization/tutorial/static/pyramid-small.png and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/static/pyramid.png b/docs/tutorials/wiki2/src/authorization/tutorial/static/pyramid.png
index 347e05549..4ab837be9 100644
Binary files a/docs/tutorials/wiki2/src/authorization/tutorial/static/pyramid.png and b/docs/tutorials/wiki2/src/authorization/tutorial/static/pyramid.png differ
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/static/theme.css b/docs/tutorials/wiki2/src/authorization/tutorial/static/theme.css
new file mode 100644
index 000000000..0f4b1a4d4
--- /dev/null
+++ b/docs/tutorials/wiki2/src/authorization/tutorial/static/theme.css
@@ -0,0 +1,154 @@
+@import url(//fonts.googleapis.com/css?family=Open+Sans:300,400,600,700);
+body {
+  font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-weight: 300;
+  color: #ffffff;
+  background: #bc2131;
+}
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-weight: 300;
+}
+p {
+  font-weight: 300;
+}
+.font-normal {
+  font-weight: 400;
+}
+.font-semi-bold {
+  font-weight: 600;
+}
+.font-bold {
+  font-weight: 700;
+}
+.starter-template {
+  margin-top: 250px;
+}
+.starter-template .content {
+  margin-left: 10px;
+}
+.starter-template .content h1 {
+  margin-top: 10px;
+  font-size: 60px;
+}
+.starter-template .content h1 .smaller {
+  font-size: 40px;
+  color: #f2b7bd;
+}
+.starter-template .content .lead {
+  font-size: 25px;
+  color: #f2b7bd;
+}
+.starter-template .content .lead .font-normal {
+  color: #ffffff;
+}
+.starter-template .links {
+  float: right;
+  right: 0;
+  margin-top: 125px;
+}
+.starter-template .links ul {
+  display: block;
+  padding: 0;
+  margin: 0;
+}
+.starter-template .links ul li {
+  list-style: none;
+  display: inline;
+  margin: 0 10px;
+}
+.starter-template .links ul li:first-child {
+  margin-left: 0;
+}
+.starter-template .links ul li:last-child {
+  margin-right: 0;
+}
+.starter-template .links ul li.current-version {
+  color: #f2b7bd;
+  font-weight: 400;
+}
+.starter-template .links ul li a, a {
+  color: #f2b7bd;
+  text-decoration: underline;
+}
+.starter-template .links ul li a:hover, a:hover {
+  color: #ffffff;
+  text-decoration: underline;
+}
+.starter-template .links ul li .icon-muted {
+  color: #eb8b95;
+  margin-right: 5px;
+}
+.starter-template .links ul li:hover .icon-muted {
+  color: #ffffff;
+}
+.starter-template .copyright {
+  margin-top: 10px;
+  font-size: 0.9em;
+  color: #f2b7bd;
+  text-transform: lowercase;
+  float: right;
+  right: 0;
+}
+@media (max-width: 1199px) {
+  .starter-template .content h1 {
+    font-size: 45px;
+  }
+  .starter-template .content h1 .smaller {
+    font-size: 30px;
+  }
+  .starter-template .content .lead {
+    font-size: 20px;
+  }
+}
+@media (max-width: 991px) {
+  .starter-template {
+    margin-top: 0;
+  }
+  .starter-template .logo {
+    margin: 40px auto;
+  }
+  .starter-template .content {
+    margin-left: 0;
+    text-align: center;
+  }
+  .starter-template .content h1 {
+    margin-bottom: 20px;
+  }
+  .starter-template .links {
+    float: none;
+    text-align: center;
+    margin-top: 60px;
+  }
+  .starter-template .copyright {
+    float: none;
+    text-align: center;
+  }
+}
+@media (max-width: 767px) {
+  .starter-template .content h1 .smaller {
+    font-size: 25px;
+    display: block;
+  }
+  .starter-template .content .lead {
+    font-size: 16px;
+  }
+  .starter-template .links {
+    margin-top: 40px;
+  }
+  .starter-template .links ul li {
+    display: block;
+    margin: 0;
+  }
+  .starter-template .links ul li .icon-muted {
+    display: none;
+  }
+  .starter-template .copyright {
+    margin-top: 20px;
+  }
+}
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/static/theme.min.css b/docs/tutorials/wiki2/src/authorization/tutorial/static/theme.min.css
new file mode 100644
index 000000000..2f924bcc5
--- /dev/null
+++ b/docs/tutorials/wiki2/src/authorization/tutorial/static/theme.min.css
@@ -0,0 +1 @@
+@import url(//fonts.googleapis.com/css?family=Open+Sans:300,400,600,700);body{font-family:"Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:300;color:#fff;background:#bc2131}h1,h2,h3,h4,h5,h6{font-family:"Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:300}p{font-weight:300}.font-normal{font-weight:400}.font-semi-bold{font-weight:600}.font-bold{font-weight:700}.starter-template{margin-top:250px}.starter-template .content{margin-left:10px}.starter-template .content h1{margin-top:10px;font-size:60px}.starter-template .content h1 .smaller{font-size:40px;color:#f2b7bd}.starter-template .content .lead{font-size:25px;color:#f2b7bd}.starter-template .content .lead .font-normal{color:#fff}.starter-template .links{float:right;right:0;margin-top:125px}.starter-template .links ul{display:block;padding:0;margin:0}.starter-template .links ul li{list-style:none;display:inline;margin:0 10px}.starter-template .links ul li:first-child{margin-left:0}.starter-template .links ul li:last-child{margin-right:0}.starter-template .links ul li.current-version{color:#f2b7bd;font-weight:400}.starter-template .links ul li a{color:#fff}.starter-template .links ul li a:hover{text-decoration:underline}.starter-template .links ul li .icon-muted{color:#eb8b95;margin-right:5px}.starter-template .links ul li:hover .icon-muted{color:#fff}.starter-template .copyright{margin-top:10px;font-size:.9em;color:#f2b7bd;text-transform:lowercase;float:right;right:0}@media (max-width:1199px){.starter-template .content h1{font-size:45px}.starter-template .content h1 .smaller{font-size:30px}.starter-template .content .lead{font-size:20px}}@media (max-width:991px){.starter-template{margin-top:0}.starter-template .logo{margin:40px auto}.starter-template .content{margin-left:0;text-align:center}.starter-template .content h1{margin-bottom:20px}.starter-template .links{float:none;text-align:center;margin-top:60px}.starter-template .copyright{float:none;text-align:center}}@media (max-width:767px){.starter-template .content h1 .smaller{font-size:25px;display:block}.starter-template .content .lead{font-size:16px}.starter-template .links{margin-top:40px}.starter-template .links ul li{display:block;margin:0}.starter-template .links ul li .icon-muted{display:none}.starter-template .copyright{margin-top:20px}}
\ No newline at end of file
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/static/transparent.gif b/docs/tutorials/wiki2/src/authorization/tutorial/static/transparent.gif
deleted file mode 100644
index 0341802e5..000000000
Binary files a/docs/tutorials/wiki2/src/authorization/tutorial/static/transparent.gif and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/templates/edit.pt b/docs/tutorials/wiki2/src/authorization/tutorial/templates/edit.pt
index ca28b9fa5..50e55c850 100644
--- a/docs/tutorials/wiki2/src/authorization/tutorial/templates/edit.pt
+++ b/docs/tutorials/wiki2/src/authorization/tutorial/templates/edit.pt
@@ -1,62 +1,74 @@
-<!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" xml:lang="en"
-      xmlns:tal="http://xml.zope.org/namespaces/tal">
-<head>
-  <title>${page.name} - Pyramid tutorial wiki (based on
+<!DOCTYPE html>
+<html lang="${request.locale_name}">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="pyramid web application">
+    <meta name="author" content="Pylons Project">
+    <link rel="shortcut icon" href="${request.static_url('tutorial:static/pyramid-16x16.png')}">
+
+    <title>${page.name} - Pyramid tutorial wiki (based on
     TurboGears 20-Minute Wiki)</title>
-  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
-  <meta name="keywords" content="python web application" />
-  <meta name="description" content="pyramid web application" />
-  <link rel="shortcut icon"
-        href="${request.static_url('tutorial:static/favicon.ico')}" />
-  <link rel="stylesheet"
-        href="${request.static_url('tutorial:static/pylons.css')}"
-        type="text/css" media="screen" charset="utf-8" />
-  
-</head>
-<body>
-  <div id="wrap">
-    <div id="top-small">
-      <div class="top-small align-center">
-        <div>
-          <img width="220" height="50" alt="pyramid"
-        src="${request.static_url('tutorial:static/pyramid-small.png')}" />
+
+    
+    <link href="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
+
+    
+    <link href="${request.static_url('tutorial:static/theme.css')}" rel="stylesheet">
+
+    
+    
+  </head>
+  <body>
+
+    <div class="starter-template">
+      <div class="container">
+        <div class="row">
+          <div class="col-md-2">
+            <img class="logo img-responsive" src="${request.static_url('tutorial:static/pyramid.png')}" alt="pyramid web framework">
+          </div>
+          <div class="col-md-10">
+            <div class="content">
+              <p>
+                Editing <strong><span tal:replace="page.name">Page Name Goes
+                Here</span></strong>
+              </p>
+              <p>You can return to the
+                <a href="${request.application_url}">FrontPage</a>.
+              </p>
+              <p class="pull-right">
+                <span tal:condition="logged_in">
+                  <a href="${request.application_url}/logout">Logout</a>
+                </span>
+              </p>
+              <form action="${save_url}" method="post">
+                <div class="form-group">
+                  <textarea class="form-control" name="body" tal:content="page.data" rows="10" cols="60">

+ +

- - -

- Editing Page Name - Goes Here
- You can return to the - FrontPage.
-

- - Logout - +

<br/>
-          <input type="submit" name="form.submitted" value="Save"/>
-        </form>
-      </div>
-    </div>
-  </div>
-  <div id="footer">
-    <div class="footer"
-         >© Copyright 2008-2011, Agendaless Consulting.</div>
-  </div>
-</body>
+
+
+    
+    
+    <script src="//oss.maxcdn.com/libs/jquery/1.10.2/jquery.min.js"></script>
+    <script src="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/js/bootstrap.min.js"></script>
+  </body>
 </html>
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/templates/mytemplate.pt b/docs/tutorials/wiki2/src/authorization/tutorial/templates/mytemplate.pt
index cf3da2073..c9b0cec21 100644
--- a/docs/tutorials/wiki2/src/authorization/tutorial/templates/mytemplate.pt
+++ b/docs/tutorials/wiki2/src/authorization/tutorial/templates/mytemplate.pt
@@ -1,76 +1,66 @@
-<!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" xml:lang="en" xmlns:tal="http://xml.zope.org/namespaces/tal">
-<head>
-  <title>The Pyramid Web Framework</title>
-  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
-  <meta name="keywords" content="python web application" />
-  <meta name="description" content="pyramid web application" />
-  <link rel="shortcut icon" href="${request.static_url('tutorial:static/favicon.ico')}" />
-  <link rel="stylesheet" href="http://static.pylonsproject.org/fonts/nobile/stylesheet.css" media="screen" />
-  <link rel="stylesheet" href="http://static.pylonsproject.org/fonts/neuton/stylesheet.css" media="screen" />
-  <link rel="stylesheet" href="${request.static_url('tutorial:static/pylons.css')}" type="text/css" media="screen" charset="utf-8" />
-  
-</head>
-<body>
-  <div id="wrap">
-    <div id="top">
-      <div class="top align-center">
-        <div><img src="${request.static_url('tutorial:static/pyramid.png')}" width="750" height="169" alt="pyramid"/></div>
-      </div>
-    </div>
-    <div id="middle">
-      <div class="middle align-center">
-        <p class="app-welcome">
-          Welcome to <span class="app-name">${project}</span>, an application generated by<br/>
-          the Pyramid Web Framework.
-        </p>
-      </div>
-    </div>
-    <div id="bottom">
-      <div class="bottom">
-        <div id="left" class="align-right">
-          <h2>Search documentation</h2>
-          <form method="get" action="http://docs.pylonsproject.org/projects/pyramid/current/search.html">
-                <input type="text" id="q" name="q" value="" />
-                <input type="submit" id="x" value="Go" />
-            </form>
+<!DOCTYPE html>
+<html lang="${request.locale_name}">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="pyramid web application">
+    <meta name="author" content="Pylons Project">
+    <link rel="shortcut icon" href="${request.static_url('tutorial:static/pyramid-16x16.png')}">
+
+    <title>Alchemy Scaffold for The Pyramid Web Framework</title>
+
+    
+    <link href="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
+
+    
+    <link href="${request.static_url('tutorial:static/theme.css')}" rel="stylesheet">
+
+    
+    
+  </head>
+
+  <body>
+
+    <div class="starter-template">
+      <div class="container">
+        <div class="row">
+          <div class="col-md-2">
+            <img class="logo img-responsive" src="${request.static_url('tutorial:static/pyramid.png')}" alt="pyramid web framework">
+          </div>
+          <div class="col-md-10">
+            <div class="content">
+              <h1><span class="font-semi-bold">Pyramid</span> <span class="smaller">Alchemy scaffold</span></h1>
+              <p class="lead">Welcome to <span class="font-normal">${project}</span>, an application generated by<br>the <span class="font-normal">Pyramid Web Framework</span>.</p>
+            </div>
+          </div>
         </div>
-        <div id="right" class="align-left">
-          <h2>Pyramid links</h2>
-          <ul class="links">
-            <li>
-              <a href="http://pylonsproject.org">Pylons Website</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#narrative-documentation">Narrative Documentation</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#api-documentation">API Documentation</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#tutorials">Tutorials</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#change-history">Change History</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#sample-applications">Sample Applications</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#support-and-development">Support and Development</a>
-            </li>
-            <li>
-              <a href="irc://irc.freenode.net#pyramid">IRC Channel</a>
-            </li>
+        <div class="row">
+          <div class="links">
+            <ul>
+              <li><i class="glyphicon glyphicon-bookmark icon-muted"></i><a href="http://docs.pylonsproject.org/projects/pyramid/en/latest/">Docs</a></li>
+              <li><i class="glyphicon glyphicon-cog icon-muted"></i><a href="https://github.com/Pylons/pyramid">Github Project</a></li>
+              <li><i class="glyphicon glyphicon-globe icon-muted"></i><a href="irc://irc.freenode.net#pyramid">IRC Channel</a></li>
+              <li><i class="glyphicon glyphicon-home icon-muted"></i><a href="http://pylonsproject.org">Pylons Project</a></li>
             </ul>
+          </div>
+        </div>
+        <div class="row">
+          <div class="copyright">
+            Copyright © Pylons Project
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <div id="footer">
-    <div class="footer">© Copyright 2008-2011, Agendaless Consulting.</div>
-  </div>
-</body>
+
+
+    
+    
+    <script src="//oss.maxcdn.com/libs/jquery/1.10.2/jquery.min.js"></script>
+    <script src="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/js/bootstrap.min.js"></script>
+  </body>
 </html>
diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/templates/view.pt b/docs/tutorials/wiki2/src/authorization/tutorial/templates/view.pt
index 5a69818c1..4e5772de0 100644
--- a/docs/tutorials/wiki2/src/authorization/tutorial/templates/view.pt
+++ b/docs/tutorials/wiki2/src/authorization/tutorial/templates/view.pt
@@ -1,65 +1,74 @@
-<!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" xml:lang="en"
-      xmlns:tal="http://xml.zope.org/namespaces/tal">
-<head>
-  <title>${page.name} - Pyramid tutorial wiki (based on
+<!DOCTYPE html>
+<html lang="${request.locale_name}">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="pyramid web application">
+    <meta name="author" content="Pylons Project">
+    <link rel="shortcut icon" href="${request.static_url('tutorial:static/pyramid-16x16.png')}">
+
+    <title>${page.name} - Pyramid tutorial wiki (based on
     TurboGears 20-Minute Wiki)</title>
-  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
-  <meta name="keywords" content="python web application" />
-  <meta name="description" content="pyramid web application" />
-  <link rel="shortcut icon"
-        href="${request.static_url('tutorial:static/favicon.ico')}" />
-  <link rel="stylesheet"
-        href="${request.static_url('tutorial:static/pylons.css')}"
-        type="text/css" media="screen" charset="utf-8" />
-  
-</head>
-<body>
-  <div id="wrap">
-    <div id="top-small">
-      <div class="top-small align-center">
-        <div>
-          <img width="220" height="50" alt="pyramid"
-        src="${request.static_url('tutorial:static/pyramid-small.png')}" />
+
+    
+    <link href="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
+
+    
+    <link href="${request.static_url('tutorial:static/theme.css')}" rel="stylesheet">
+
+    
+    
+  </head>
+  <body>
+
+    <div class="starter-template">
+      <div class="container">
+        <div class="row">
+          <div class="col-md-2">
+            <img class="logo img-responsive" src="${request.static_url('tutorial:static/pyramid.png')}" alt="pyramid web framework">
+          </div>
+          <div class="col-md-10">
+            <div class="content">
+              <div tal:replace="structure content">
+                Page text goes here.
+              </div>
+              <p>
+                <a tal:attributes="href edit_url" href="">
+                  Edit this page
+                </a>
+              </p>
+              <p>
+                  Viewing <strong><span tal:replace="page.name">
+                  Page Name Goes Here</span></strong>
+              </p>
+              <p>You can return to the
+                <a href="${request.application_url}">FrontPage</a>.
+              </p>
+              <p class="pull-right">
+                <span tal:condition="logged_in">
+                  <a href="${request.application_url}/logout">Logout</a>
+                </span>
+              </p>
+            </div>
+          </div>
         </div>
-      </div>
-    </div>
-    <div id="middle">
-      <div class="middle align-right">
-        <div id="left" class="app-welcome align-left">
-          Viewing <b><span tal:replace="page.name">Page Name
-            Goes Here</span></b><br/>
-          You can return to the
-          <a href="${request.application_url}">FrontPage</a>.<br/>
-        </div>
-        <div id="right" class="app-welcome align-right">
-          <span tal:condition="logged_in">
-            <a href="${request.application_url}/logout">Logout</a>
-          </span>
-        </div>
-      </div>
-    </div>
-    <div id="bottom">
-      <div class="bottom">
-        <div tal:replace="structure content">
-          Page text goes here.
+        <div class="row">
+          <div class="copyright">
+            Copyright © Pylons Project
+          </div>
         </div>
-        <p>
-          <a tal:attributes="href edit_url" href="">
-            Edit this page
-          </a>
-        </p>
       </div>
     </div>
-  </div>
-  <div id="footer">
-    <div class="footer"
-         >© Copyright 2008-2011, Agendaless Consulting.</div>
-  </div>
-</body>
+
+
+    
+    
+    <script src="//oss.maxcdn.com/libs/jquery/1.10.2/jquery.min.js"></script>
+    <script src="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/js/bootstrap.min.js"></script>
+  </body>
 </html>
diff --git a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/favicon.ico b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/favicon.ico
deleted file mode 100644
index 71f837c9e..000000000
Binary files a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/favicon.ico and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/footerbg.png b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/footerbg.png
deleted file mode 100644
index 1fbc873da..000000000
Binary files a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/footerbg.png and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/headerbg.png b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/headerbg.png
deleted file mode 100644
index 0596f2020..000000000
Binary files a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/headerbg.png and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/ie6.css b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/ie6.css
deleted file mode 100644
index b7c8493d8..000000000
--- a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/ie6.css
+++ /dev/null
@@ -1,8 +0,0 @@
-* html img,
-* html .png{position:relative;behavior:expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",
-this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "',sizingMethod='image')",
-this.src = "static/transparent.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
-this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "',sizingMethod='crop')",
-this.runtimeStyle.backgroundImage = "none")),this.pngSet=true)
-);}
-#wrap{display:table;height:100%}
diff --git a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/middlebg.png b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/middlebg.png
deleted file mode 100644
index 2369cfb7d..000000000
Binary files a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/middlebg.png and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/pylons.css b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/pylons.css
deleted file mode 100644
index 4b1c017cd..000000000
--- a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/pylons.css
+++ /dev/null
@@ -1,372 +0,0 @@
-html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td
-{
-  margin: 0;
-  padding: 0;
-  border: 0;
-  outline: 0;
-  font-size: 100%; /* 16px */
-  vertical-align: baseline;
-  background: transparent;
-}
-
-body
-{
-  line-height: 1;
-}
-
-ol, ul
-{
-  list-style: none;
-}
-
-blockquote, q
-{
-  quotes: none;
-}
-
-blockquote:before, blockquote:after, q:before, q:after
-{
-  content: '';
-  content: none;
-}
-
-:focus
-{
-  outline: 0;
-}
-
-ins
-{
-  text-decoration: none;
-}
-
-del
-{
-  text-decoration: line-through;
-}
-
-table
-{
-  border-collapse: collapse;
-  border-spacing: 0;
-}
-
-sub
-{
-  vertical-align: sub;
-  font-size: smaller;
-  line-height: normal;
-}
-
-sup
-{
-  vertical-align: super;
-  font-size: smaller;
-  line-height: normal;
-}
-
-ul, menu, dir
-{
-  display: block;
-  list-style-type: disc;
-  margin: 1em 0;
-  padding-left: 40px;
-}
-
-ol
-{
-  display: block;
-  list-style-type: decimal-leading-zero;
-  margin: 1em 0;
-  padding-left: 40px;
-}
-
-li
-{
-  display: list-item;
-}
-
-ul ul, ul ol, ul dir, ul menu, ul dl, ol ul, ol ol, ol dir, ol menu, ol dl, dir ul, dir ol, dir dir, dir menu, dir dl, menu ul, menu ol, menu dir, menu menu, menu dl, dl ul, dl ol, dl dir, dl menu, dl dl
-{
-  margin-top: 0;
-  margin-bottom: 0;
-}
-
-ol ul, ul ul, menu ul, dir ul, ol menu, ul menu, menu menu, dir menu, ol dir, ul dir, menu dir, dir dir
-{
-  list-style-type: circle;
-}
-
-ol ol ul, ol ul ul, ol menu ul, ol dir ul, ol ol menu, ol ul menu, ol menu menu, ol dir menu, ol ol dir, ol ul dir, ol menu dir, ol dir dir, ul ol ul, ul ul ul, ul menu ul, ul dir ul, ul ol menu, ul ul menu, ul menu menu, ul dir menu, ul ol dir, ul ul dir, ul menu dir, ul dir dir, menu ol ul, menu ul ul, menu menu ul, menu dir ul, menu ol menu, menu ul menu, menu menu menu, menu dir menu, menu ol dir, menu ul dir, menu menu dir, menu dir dir, dir ol ul, dir ul ul, dir menu ul, dir dir ul, dir ol menu, dir ul menu, dir menu menu, dir dir menu, dir ol dir, dir ul dir, dir menu dir, dir dir dir
-{
-  list-style-type: square;
-}
-
-.hidden
-{
-  display: none;
-}
-
-p
-{
-  line-height: 1.5em;
-}
-
-h1
-{
-  font-size: 1.75em;
-  line-height: 1.7em;
-  font-family: helvetica, verdana;
-}
-
-h2
-{
-  font-size: 1.5em;
-  line-height: 1.7em;
-  font-family: helvetica, verdana;
-}
-
-h3
-{
-  font-size: 1.25em;
-  line-height: 1.7em;
-  font-family: helvetica, verdana;
-}
-
-h4
-{
-  font-size: 1em;
-  line-height: 1.7em;
-  font-family: helvetica, verdana;
-}
-
-html, body
-{
-  width: 100%;
-  height: 100%;
-}
-
-body
-{
-  margin: 0;
-  padding: 0;
-  background-color: #fff;
-  position: relative;
-  font: 16px/24px NobileRegular, "Lucida Grande", Lucida, Verdana, sans-serif;
-}
-
-a
-{
-  color: #1b61d6;
-  text-decoration: none;
-}
-
-a:hover
-{
-  color: #e88f00;
-  text-decoration: underline;
-}
-
-body h1, body h2, body h3, body h4, body h5, body h6
-{
-  font-family: NeutonRegular, "Lucida Grande", Lucida, Verdana, sans-serif;
-  font-weight: 400;
-  color: #373839;
-  font-style: normal;
-}
-
-#wrap
-{
-  min-height: 100%;
-}
-
-#header, #footer
-{
-  width: 100%;
-  color: #fff;
-  height: 40px;
-  position: absolute;
-  text-align: center;
-  line-height: 40px;
-  overflow: hidden;
-  font-size: 12px;
-  vertical-align: middle;
-}
-
-#header
-{
-  background: #000;
-  top: 0;
-  font-size: 14px;
-}
-
-#footer
-{
-  bottom: 0;
-  background: #000 url(footerbg.png) repeat-x 0 top;
-  position: relative;
-  margin-top: -40px;
-  clear: both;
-}
-
-.header, .footer
-{
-  width: 750px;
-  margin-right: auto;
-  margin-left: auto;
-}
-
-.wrapper
-{
-  width: 100%;
-}
-
-#top, #top-small, #bottom
-{
-  width: 100%;
-}
-
-#top
-{
-  color: #000;
-  height: 230px;
-  background: #fff url(headerbg.png) repeat-x 0 top;
-  position: relative;
-}
-
-#top-small
-{
-  color: #000;
-  height: 60px;
-  background: #fff url(headerbg.png) repeat-x 0 top;
-  position: relative;
-}
-
-#bottom
-{
-  color: #222;
-  background-color: #fff;
-}
-
-.top, .top-small, .middle, .bottom
-{
-  width: 750px;
-  margin-right: auto;
-  margin-left: auto;
-}
-
-.top
-{
-  padding-top: 40px;
-}
-
-.top-small
-{
-  padding-top: 10px;
-}
-
-#middle
-{
-  width: 100%;
-  height: 100px;
-  background: url(middlebg.png) repeat-x;
-  border-top: 2px solid #fff;
-  border-bottom: 2px solid #b2b2b2;
-}
-
-.app-welcome
-{
-  margin-top: 25px;
-}
-
-.app-name
-{
-  color: #000;
-  font-weight: 700;
-}
-
-.bottom
-{
-  padding-top: 50px;
-}
-
-#left
-{
-  width: 350px;
-  float: left;
-  padding-right: 25px;
-}
-
-#right
-{
-  width: 350px;
-  float: right;
-  padding-left: 25px;
-}
-
-.align-left
-{
-  text-align: left;
-}
-
-.align-right
-{
-  text-align: right;
-}
-
-.align-center
-{
-  text-align: center;
-}
-
-ul.links
-{
-  margin: 0;
-  padding: 0;
-}
-
-ul.links li
-{
-  list-style-type: none;
-  font-size: 14px;
-}
-
-form
-{
-  border-style: none;
-}
-
-fieldset
-{
-  border-style: none;
-}
-
-input
-{
-  color: #222;
-  border: 1px solid #ccc;
-  font-family: sans-serif;
-  font-size: 12px;
-  line-height: 16px;
-}
-
-input[type=text], input[type=password]
-{
-  width: 205px;
-}
-
-input[type=submit]
-{
-  background-color: #ddd;
-  font-weight: 700;
-}
-
-/*Opera Fix*/
-body:before
-{
-  content: "";
-  height: 100%;
-  float: left;
-  width: 0;
-  margin-top: -32767px;
-}
diff --git a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/pyramid-16x16.png b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/pyramid-16x16.png
new file mode 100644
index 000000000..979203112
Binary files /dev/null and b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/pyramid-16x16.png differ
diff --git a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/pyramid-small.png b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/pyramid-small.png
deleted file mode 100644
index a5bc0ade7..000000000
Binary files a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/pyramid-small.png and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/pyramid.png b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/pyramid.png
index 347e05549..4ab837be9 100644
Binary files a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/pyramid.png and b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/pyramid.png differ
diff --git a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/theme.css b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/theme.css
new file mode 100644
index 000000000..0f4b1a4d4
--- /dev/null
+++ b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/theme.css
@@ -0,0 +1,154 @@
+@import url(//fonts.googleapis.com/css?family=Open+Sans:300,400,600,700);
+body {
+  font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-weight: 300;
+  color: #ffffff;
+  background: #bc2131;
+}
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-weight: 300;
+}
+p {
+  font-weight: 300;
+}
+.font-normal {
+  font-weight: 400;
+}
+.font-semi-bold {
+  font-weight: 600;
+}
+.font-bold {
+  font-weight: 700;
+}
+.starter-template {
+  margin-top: 250px;
+}
+.starter-template .content {
+  margin-left: 10px;
+}
+.starter-template .content h1 {
+  margin-top: 10px;
+  font-size: 60px;
+}
+.starter-template .content h1 .smaller {
+  font-size: 40px;
+  color: #f2b7bd;
+}
+.starter-template .content .lead {
+  font-size: 25px;
+  color: #f2b7bd;
+}
+.starter-template .content .lead .font-normal {
+  color: #ffffff;
+}
+.starter-template .links {
+  float: right;
+  right: 0;
+  margin-top: 125px;
+}
+.starter-template .links ul {
+  display: block;
+  padding: 0;
+  margin: 0;
+}
+.starter-template .links ul li {
+  list-style: none;
+  display: inline;
+  margin: 0 10px;
+}
+.starter-template .links ul li:first-child {
+  margin-left: 0;
+}
+.starter-template .links ul li:last-child {
+  margin-right: 0;
+}
+.starter-template .links ul li.current-version {
+  color: #f2b7bd;
+  font-weight: 400;
+}
+.starter-template .links ul li a, a {
+  color: #f2b7bd;
+  text-decoration: underline;
+}
+.starter-template .links ul li a:hover, a:hover {
+  color: #ffffff;
+  text-decoration: underline;
+}
+.starter-template .links ul li .icon-muted {
+  color: #eb8b95;
+  margin-right: 5px;
+}
+.starter-template .links ul li:hover .icon-muted {
+  color: #ffffff;
+}
+.starter-template .copyright {
+  margin-top: 10px;
+  font-size: 0.9em;
+  color: #f2b7bd;
+  text-transform: lowercase;
+  float: right;
+  right: 0;
+}
+@media (max-width: 1199px) {
+  .starter-template .content h1 {
+    font-size: 45px;
+  }
+  .starter-template .content h1 .smaller {
+    font-size: 30px;
+  }
+  .starter-template .content .lead {
+    font-size: 20px;
+  }
+}
+@media (max-width: 991px) {
+  .starter-template {
+    margin-top: 0;
+  }
+  .starter-template .logo {
+    margin: 40px auto;
+  }
+  .starter-template .content {
+    margin-left: 0;
+    text-align: center;
+  }
+  .starter-template .content h1 {
+    margin-bottom: 20px;
+  }
+  .starter-template .links {
+    float: none;
+    text-align: center;
+    margin-top: 60px;
+  }
+  .starter-template .copyright {
+    float: none;
+    text-align: center;
+  }
+}
+@media (max-width: 767px) {
+  .starter-template .content h1 .smaller {
+    font-size: 25px;
+    display: block;
+  }
+  .starter-template .content .lead {
+    font-size: 16px;
+  }
+  .starter-template .links {
+    margin-top: 40px;
+  }
+  .starter-template .links ul li {
+    display: block;
+    margin: 0;
+  }
+  .starter-template .links ul li .icon-muted {
+    display: none;
+  }
+  .starter-template .copyright {
+    margin-top: 20px;
+  }
+}
diff --git a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/theme.min.css b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/theme.min.css
new file mode 100644
index 000000000..2f924bcc5
--- /dev/null
+++ b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/theme.min.css
@@ -0,0 +1 @@
+@import url(//fonts.googleapis.com/css?family=Open+Sans:300,400,600,700);body{font-family:"Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:300;color:#fff;background:#bc2131}h1,h2,h3,h4,h5,h6{font-family:"Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:300}p{font-weight:300}.font-normal{font-weight:400}.font-semi-bold{font-weight:600}.font-bold{font-weight:700}.starter-template{margin-top:250px}.starter-template .content{margin-left:10px}.starter-template .content h1{margin-top:10px;font-size:60px}.starter-template .content h1 .smaller{font-size:40px;color:#f2b7bd}.starter-template .content .lead{font-size:25px;color:#f2b7bd}.starter-template .content .lead .font-normal{color:#fff}.starter-template .links{float:right;right:0;margin-top:125px}.starter-template .links ul{display:block;padding:0;margin:0}.starter-template .links ul li{list-style:none;display:inline;margin:0 10px}.starter-template .links ul li:first-child{margin-left:0}.starter-template .links ul li:last-child{margin-right:0}.starter-template .links ul li.current-version{color:#f2b7bd;font-weight:400}.starter-template .links ul li a{color:#fff}.starter-template .links ul li a:hover{text-decoration:underline}.starter-template .links ul li .icon-muted{color:#eb8b95;margin-right:5px}.starter-template .links ul li:hover .icon-muted{color:#fff}.starter-template .copyright{margin-top:10px;font-size:.9em;color:#f2b7bd;text-transform:lowercase;float:right;right:0}@media (max-width:1199px){.starter-template .content h1{font-size:45px}.starter-template .content h1 .smaller{font-size:30px}.starter-template .content .lead{font-size:20px}}@media (max-width:991px){.starter-template{margin-top:0}.starter-template .logo{margin:40px auto}.starter-template .content{margin-left:0;text-align:center}.starter-template .content h1{margin-bottom:20px}.starter-template .links{float:none;text-align:center;margin-top:60px}.starter-template .copyright{float:none;text-align:center}}@media (max-width:767px){.starter-template .content h1 .smaller{font-size:25px;display:block}.starter-template .content .lead{font-size:16px}.starter-template .links{margin-top:40px}.starter-template .links ul li{display:block;margin:0}.starter-template .links ul li .icon-muted{display:none}.starter-template .copyright{margin-top:20px}}
\ No newline at end of file
diff --git a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/transparent.gif b/docs/tutorials/wiki2/src/basiclayout/tutorial/static/transparent.gif
deleted file mode 100644
index 0341802e5..000000000
Binary files a/docs/tutorials/wiki2/src/basiclayout/tutorial/static/transparent.gif and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/basiclayout/tutorial/templates/mytemplate.pt b/docs/tutorials/wiki2/src/basiclayout/tutorial/templates/mytemplate.pt
index ca4e0af26..c9b0cec21 100644
--- a/docs/tutorials/wiki2/src/basiclayout/tutorial/templates/mytemplate.pt
+++ b/docs/tutorials/wiki2/src/basiclayout/tutorial/templates/mytemplate.pt
@@ -1,73 +1,66 @@
-<!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" xml:lang="en" xmlns:tal="http://xml.zope.org/namespaces/tal">
-<head>
-  <title>The Pyramid Web Framework</title>
-  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
-  <meta name="keywords" content="python web application" />
-  <meta name="description" content="pyramid web application" />
-  <link rel="shortcut icon" href="${request.static_url('tutorial:static/favicon.ico')}" />
-  <link rel="stylesheet" href="${request.static_url('tutorial:static/pylons.css')}" type="text/css" media="screen" charset="utf-8" />
-  <link rel="stylesheet" href="http://static.pylonsproject.org/fonts/nobile/stylesheet.css" media="screen" />
-  <link rel="stylesheet" href="http://static.pylonsproject.org/fonts/neuton/stylesheet.css" media="screen" />
-  
-</head>
-<body>
-  <div id="wrap">
-    <div id="top">
-      <div class="top align-center">
-        <div><img src="${request.static_url('tutorial:static/pyramid.png')}" width="750" height="169" alt="pyramid"/></div>
-      </div>
-    </div>
-    <div id="middle">
-      <div class="middle align-center">
-        <p class="app-welcome">
-          Welcome to <span class="app-name">${project}</span>, an application generated by<br/>
-          the Pyramid Web Framework.
-        </p>
-      </div>
-    </div>
-    <div id="bottom">
-      <div class="bottom">
-        <div id="left" class="align-right">
-          <h2>Search documentation</h2>
-          <form method="get" action="http://docs.pylonsproject.org/projects/pyramid/current/search.html">
-                <input type="text" id="q" name="q" value="" />
-                <input type="submit" id="x" value="Go" />
-            </form>
+<!DOCTYPE html>
+<html lang="${request.locale_name}">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="pyramid web application">
+    <meta name="author" content="Pylons Project">
+    <link rel="shortcut icon" href="${request.static_url('tutorial:static/pyramid-16x16.png')}">
+
+    <title>Alchemy Scaffold for The Pyramid Web Framework</title>
+
+    
+    <link href="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
+
+    
+    <link href="${request.static_url('tutorial:static/theme.css')}" rel="stylesheet">
+
+    
+    
+  </head>
+
+  <body>
+
+    <div class="starter-template">
+      <div class="container">
+        <div class="row">
+          <div class="col-md-2">
+            <img class="logo img-responsive" src="${request.static_url('tutorial:static/pyramid.png')}" alt="pyramid web framework">
+          </div>
+          <div class="col-md-10">
+            <div class="content">
+              <h1><span class="font-semi-bold">Pyramid</span> <span class="smaller">Alchemy scaffold</span></h1>
+              <p class="lead">Welcome to <span class="font-normal">${project}</span>, an application generated by<br>the <span class="font-normal">Pyramid Web Framework</span>.</p>
+            </div>
+          </div>
         </div>
-        <div id="right" class="align-left">
-          <h2>Pyramid links</h2>
-          <ul class="links">
-            <li>
-              <a href="http://pylonsproject.org">Pylons Website</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#narrative-documentation">Narrative Documentation</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#api-documentation">API Documentation</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#tutorials">Tutorials</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#change-history">Change History</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#sample-applications">Sample Applications</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#support-and-development">Support and Development</a>
-            </li>
-            <li>
-              <a href="irc://irc.freenode.net#pyramid">IRC Channel</a>
-            </li>
+        <div class="row">
+          <div class="links">
+            <ul>
+              <li><i class="glyphicon glyphicon-bookmark icon-muted"></i><a href="http://docs.pylonsproject.org/projects/pyramid/en/latest/">Docs</a></li>
+              <li><i class="glyphicon glyphicon-cog icon-muted"></i><a href="https://github.com/Pylons/pyramid">Github Project</a></li>
+              <li><i class="glyphicon glyphicon-globe icon-muted"></i><a href="irc://irc.freenode.net#pyramid">IRC Channel</a></li>
+              <li><i class="glyphicon glyphicon-home icon-muted"></i><a href="http://pylonsproject.org">Pylons Project</a></li>
             </ul>
+          </div>
+        </div>
+        <div class="row">
+          <div class="copyright">
+            Copyright © Pylons Project
+          </div>
         </div>
       </div>
     </div>
-  </div>
-</body>
+
+
+    
+    
+    <script src="//oss.maxcdn.com/libs/jquery/1.10.2/jquery.min.js"></script>
+    <script src="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/js/bootstrap.min.js"></script>
+  </body>
 </html>
diff --git a/docs/tutorials/wiki2/src/models/tutorial/static/favicon.ico b/docs/tutorials/wiki2/src/models/tutorial/static/favicon.ico
deleted file mode 100644
index 71f837c9e..000000000
Binary files a/docs/tutorials/wiki2/src/models/tutorial/static/favicon.ico and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/models/tutorial/static/footerbg.png b/docs/tutorials/wiki2/src/models/tutorial/static/footerbg.png
deleted file mode 100644
index 1fbc873da..000000000
Binary files a/docs/tutorials/wiki2/src/models/tutorial/static/footerbg.png and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/models/tutorial/static/headerbg.png b/docs/tutorials/wiki2/src/models/tutorial/static/headerbg.png
deleted file mode 100644
index 0596f2020..000000000
Binary files a/docs/tutorials/wiki2/src/models/tutorial/static/headerbg.png and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/models/tutorial/static/ie6.css b/docs/tutorials/wiki2/src/models/tutorial/static/ie6.css
deleted file mode 100644
index b7c8493d8..000000000
--- a/docs/tutorials/wiki2/src/models/tutorial/static/ie6.css
+++ /dev/null
@@ -1,8 +0,0 @@
-* html img,
-* html .png{position:relative;behavior:expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",
-this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "',sizingMethod='image')",
-this.src = "static/transparent.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
-this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "',sizingMethod='crop')",
-this.runtimeStyle.backgroundImage = "none")),this.pngSet=true)
-);}
-#wrap{display:table;height:100%}
diff --git a/docs/tutorials/wiki2/src/models/tutorial/static/middlebg.png b/docs/tutorials/wiki2/src/models/tutorial/static/middlebg.png
deleted file mode 100644
index 2369cfb7d..000000000
Binary files a/docs/tutorials/wiki2/src/models/tutorial/static/middlebg.png and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/models/tutorial/static/pylons.css b/docs/tutorials/wiki2/src/models/tutorial/static/pylons.css
deleted file mode 100644
index 4b1c017cd..000000000
--- a/docs/tutorials/wiki2/src/models/tutorial/static/pylons.css
+++ /dev/null
@@ -1,372 +0,0 @@
-html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td
-{
-  margin: 0;
-  padding: 0;
-  border: 0;
-  outline: 0;
-  font-size: 100%; /* 16px */
-  vertical-align: baseline;
-  background: transparent;
-}
-
-body
-{
-  line-height: 1;
-}
-
-ol, ul
-{
-  list-style: none;
-}
-
-blockquote, q
-{
-  quotes: none;
-}
-
-blockquote:before, blockquote:after, q:before, q:after
-{
-  content: '';
-  content: none;
-}
-
-:focus
-{
-  outline: 0;
-}
-
-ins
-{
-  text-decoration: none;
-}
-
-del
-{
-  text-decoration: line-through;
-}
-
-table
-{
-  border-collapse: collapse;
-  border-spacing: 0;
-}
-
-sub
-{
-  vertical-align: sub;
-  font-size: smaller;
-  line-height: normal;
-}
-
-sup
-{
-  vertical-align: super;
-  font-size: smaller;
-  line-height: normal;
-}
-
-ul, menu, dir
-{
-  display: block;
-  list-style-type: disc;
-  margin: 1em 0;
-  padding-left: 40px;
-}
-
-ol
-{
-  display: block;
-  list-style-type: decimal-leading-zero;
-  margin: 1em 0;
-  padding-left: 40px;
-}
-
-li
-{
-  display: list-item;
-}
-
-ul ul, ul ol, ul dir, ul menu, ul dl, ol ul, ol ol, ol dir, ol menu, ol dl, dir ul, dir ol, dir dir, dir menu, dir dl, menu ul, menu ol, menu dir, menu menu, menu dl, dl ul, dl ol, dl dir, dl menu, dl dl
-{
-  margin-top: 0;
-  margin-bottom: 0;
-}
-
-ol ul, ul ul, menu ul, dir ul, ol menu, ul menu, menu menu, dir menu, ol dir, ul dir, menu dir, dir dir
-{
-  list-style-type: circle;
-}
-
-ol ol ul, ol ul ul, ol menu ul, ol dir ul, ol ol menu, ol ul menu, ol menu menu, ol dir menu, ol ol dir, ol ul dir, ol menu dir, ol dir dir, ul ol ul, ul ul ul, ul menu ul, ul dir ul, ul ol menu, ul ul menu, ul menu menu, ul dir menu, ul ol dir, ul ul dir, ul menu dir, ul dir dir, menu ol ul, menu ul ul, menu menu ul, menu dir ul, menu ol menu, menu ul menu, menu menu menu, menu dir menu, menu ol dir, menu ul dir, menu menu dir, menu dir dir, dir ol ul, dir ul ul, dir menu ul, dir dir ul, dir ol menu, dir ul menu, dir menu menu, dir dir menu, dir ol dir, dir ul dir, dir menu dir, dir dir dir
-{
-  list-style-type: square;
-}
-
-.hidden
-{
-  display: none;
-}
-
-p
-{
-  line-height: 1.5em;
-}
-
-h1
-{
-  font-size: 1.75em;
-  line-height: 1.7em;
-  font-family: helvetica, verdana;
-}
-
-h2
-{
-  font-size: 1.5em;
-  line-height: 1.7em;
-  font-family: helvetica, verdana;
-}
-
-h3
-{
-  font-size: 1.25em;
-  line-height: 1.7em;
-  font-family: helvetica, verdana;
-}
-
-h4
-{
-  font-size: 1em;
-  line-height: 1.7em;
-  font-family: helvetica, verdana;
-}
-
-html, body
-{
-  width: 100%;
-  height: 100%;
-}
-
-body
-{
-  margin: 0;
-  padding: 0;
-  background-color: #fff;
-  position: relative;
-  font: 16px/24px NobileRegular, "Lucida Grande", Lucida, Verdana, sans-serif;
-}
-
-a
-{
-  color: #1b61d6;
-  text-decoration: none;
-}
-
-a:hover
-{
-  color: #e88f00;
-  text-decoration: underline;
-}
-
-body h1, body h2, body h3, body h4, body h5, body h6
-{
-  font-family: NeutonRegular, "Lucida Grande", Lucida, Verdana, sans-serif;
-  font-weight: 400;
-  color: #373839;
-  font-style: normal;
-}
-
-#wrap
-{
-  min-height: 100%;
-}
-
-#header, #footer
-{
-  width: 100%;
-  color: #fff;
-  height: 40px;
-  position: absolute;
-  text-align: center;
-  line-height: 40px;
-  overflow: hidden;
-  font-size: 12px;
-  vertical-align: middle;
-}
-
-#header
-{
-  background: #000;
-  top: 0;
-  font-size: 14px;
-}
-
-#footer
-{
-  bottom: 0;
-  background: #000 url(footerbg.png) repeat-x 0 top;
-  position: relative;
-  margin-top: -40px;
-  clear: both;
-}
-
-.header, .footer
-{
-  width: 750px;
-  margin-right: auto;
-  margin-left: auto;
-}
-
-.wrapper
-{
-  width: 100%;
-}
-
-#top, #top-small, #bottom
-{
-  width: 100%;
-}
-
-#top
-{
-  color: #000;
-  height: 230px;
-  background: #fff url(headerbg.png) repeat-x 0 top;
-  position: relative;
-}
-
-#top-small
-{
-  color: #000;
-  height: 60px;
-  background: #fff url(headerbg.png) repeat-x 0 top;
-  position: relative;
-}
-
-#bottom
-{
-  color: #222;
-  background-color: #fff;
-}
-
-.top, .top-small, .middle, .bottom
-{
-  width: 750px;
-  margin-right: auto;
-  margin-left: auto;
-}
-
-.top
-{
-  padding-top: 40px;
-}
-
-.top-small
-{
-  padding-top: 10px;
-}
-
-#middle
-{
-  width: 100%;
-  height: 100px;
-  background: url(middlebg.png) repeat-x;
-  border-top: 2px solid #fff;
-  border-bottom: 2px solid #b2b2b2;
-}
-
-.app-welcome
-{
-  margin-top: 25px;
-}
-
-.app-name
-{
-  color: #000;
-  font-weight: 700;
-}
-
-.bottom
-{
-  padding-top: 50px;
-}
-
-#left
-{
-  width: 350px;
-  float: left;
-  padding-right: 25px;
-}
-
-#right
-{
-  width: 350px;
-  float: right;
-  padding-left: 25px;
-}
-
-.align-left
-{
-  text-align: left;
-}
-
-.align-right
-{
-  text-align: right;
-}
-
-.align-center
-{
-  text-align: center;
-}
-
-ul.links
-{
-  margin: 0;
-  padding: 0;
-}
-
-ul.links li
-{
-  list-style-type: none;
-  font-size: 14px;
-}
-
-form
-{
-  border-style: none;
-}
-
-fieldset
-{
-  border-style: none;
-}
-
-input
-{
-  color: #222;
-  border: 1px solid #ccc;
-  font-family: sans-serif;
-  font-size: 12px;
-  line-height: 16px;
-}
-
-input[type=text], input[type=password]
-{
-  width: 205px;
-}
-
-input[type=submit]
-{
-  background-color: #ddd;
-  font-weight: 700;
-}
-
-/*Opera Fix*/
-body:before
-{
-  content: "";
-  height: 100%;
-  float: left;
-  width: 0;
-  margin-top: -32767px;
-}
diff --git a/docs/tutorials/wiki2/src/models/tutorial/static/pyramid-16x16.png b/docs/tutorials/wiki2/src/models/tutorial/static/pyramid-16x16.png
new file mode 100644
index 000000000..979203112
Binary files /dev/null and b/docs/tutorials/wiki2/src/models/tutorial/static/pyramid-16x16.png differ
diff --git a/docs/tutorials/wiki2/src/models/tutorial/static/pyramid-small.png b/docs/tutorials/wiki2/src/models/tutorial/static/pyramid-small.png
deleted file mode 100644
index a5bc0ade7..000000000
Binary files a/docs/tutorials/wiki2/src/models/tutorial/static/pyramid-small.png and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/models/tutorial/static/pyramid.png b/docs/tutorials/wiki2/src/models/tutorial/static/pyramid.png
index 347e05549..4ab837be9 100644
Binary files a/docs/tutorials/wiki2/src/models/tutorial/static/pyramid.png and b/docs/tutorials/wiki2/src/models/tutorial/static/pyramid.png differ
diff --git a/docs/tutorials/wiki2/src/models/tutorial/static/theme.css b/docs/tutorials/wiki2/src/models/tutorial/static/theme.css
new file mode 100644
index 000000000..0f4b1a4d4
--- /dev/null
+++ b/docs/tutorials/wiki2/src/models/tutorial/static/theme.css
@@ -0,0 +1,154 @@
+@import url(//fonts.googleapis.com/css?family=Open+Sans:300,400,600,700);
+body {
+  font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-weight: 300;
+  color: #ffffff;
+  background: #bc2131;
+}
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-weight: 300;
+}
+p {
+  font-weight: 300;
+}
+.font-normal {
+  font-weight: 400;
+}
+.font-semi-bold {
+  font-weight: 600;
+}
+.font-bold {
+  font-weight: 700;
+}
+.starter-template {
+  margin-top: 250px;
+}
+.starter-template .content {
+  margin-left: 10px;
+}
+.starter-template .content h1 {
+  margin-top: 10px;
+  font-size: 60px;
+}
+.starter-template .content h1 .smaller {
+  font-size: 40px;
+  color: #f2b7bd;
+}
+.starter-template .content .lead {
+  font-size: 25px;
+  color: #f2b7bd;
+}
+.starter-template .content .lead .font-normal {
+  color: #ffffff;
+}
+.starter-template .links {
+  float: right;
+  right: 0;
+  margin-top: 125px;
+}
+.starter-template .links ul {
+  display: block;
+  padding: 0;
+  margin: 0;
+}
+.starter-template .links ul li {
+  list-style: none;
+  display: inline;
+  margin: 0 10px;
+}
+.starter-template .links ul li:first-child {
+  margin-left: 0;
+}
+.starter-template .links ul li:last-child {
+  margin-right: 0;
+}
+.starter-template .links ul li.current-version {
+  color: #f2b7bd;
+  font-weight: 400;
+}
+.starter-template .links ul li a, a {
+  color: #f2b7bd;
+  text-decoration: underline;
+}
+.starter-template .links ul li a:hover, a:hover {
+  color: #ffffff;
+  text-decoration: underline;
+}
+.starter-template .links ul li .icon-muted {
+  color: #eb8b95;
+  margin-right: 5px;
+}
+.starter-template .links ul li:hover .icon-muted {
+  color: #ffffff;
+}
+.starter-template .copyright {
+  margin-top: 10px;
+  font-size: 0.9em;
+  color: #f2b7bd;
+  text-transform: lowercase;
+  float: right;
+  right: 0;
+}
+@media (max-width: 1199px) {
+  .starter-template .content h1 {
+    font-size: 45px;
+  }
+  .starter-template .content h1 .smaller {
+    font-size: 30px;
+  }
+  .starter-template .content .lead {
+    font-size: 20px;
+  }
+}
+@media (max-width: 991px) {
+  .starter-template {
+    margin-top: 0;
+  }
+  .starter-template .logo {
+    margin: 40px auto;
+  }
+  .starter-template .content {
+    margin-left: 0;
+    text-align: center;
+  }
+  .starter-template .content h1 {
+    margin-bottom: 20px;
+  }
+  .starter-template .links {
+    float: none;
+    text-align: center;
+    margin-top: 60px;
+  }
+  .starter-template .copyright {
+    float: none;
+    text-align: center;
+  }
+}
+@media (max-width: 767px) {
+  .starter-template .content h1 .smaller {
+    font-size: 25px;
+    display: block;
+  }
+  .starter-template .content .lead {
+    font-size: 16px;
+  }
+  .starter-template .links {
+    margin-top: 40px;
+  }
+  .starter-template .links ul li {
+    display: block;
+    margin: 0;
+  }
+  .starter-template .links ul li .icon-muted {
+    display: none;
+  }
+  .starter-template .copyright {
+    margin-top: 20px;
+  }
+}
diff --git a/docs/tutorials/wiki2/src/models/tutorial/static/theme.min.css b/docs/tutorials/wiki2/src/models/tutorial/static/theme.min.css
new file mode 100644
index 000000000..2f924bcc5
--- /dev/null
+++ b/docs/tutorials/wiki2/src/models/tutorial/static/theme.min.css
@@ -0,0 +1 @@
+@import url(//fonts.googleapis.com/css?family=Open+Sans:300,400,600,700);body{font-family:"Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:300;color:#fff;background:#bc2131}h1,h2,h3,h4,h5,h6{font-family:"Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:300}p{font-weight:300}.font-normal{font-weight:400}.font-semi-bold{font-weight:600}.font-bold{font-weight:700}.starter-template{margin-top:250px}.starter-template .content{margin-left:10px}.starter-template .content h1{margin-top:10px;font-size:60px}.starter-template .content h1 .smaller{font-size:40px;color:#f2b7bd}.starter-template .content .lead{font-size:25px;color:#f2b7bd}.starter-template .content .lead .font-normal{color:#fff}.starter-template .links{float:right;right:0;margin-top:125px}.starter-template .links ul{display:block;padding:0;margin:0}.starter-template .links ul li{list-style:none;display:inline;margin:0 10px}.starter-template .links ul li:first-child{margin-left:0}.starter-template .links ul li:last-child{margin-right:0}.starter-template .links ul li.current-version{color:#f2b7bd;font-weight:400}.starter-template .links ul li a{color:#fff}.starter-template .links ul li a:hover{text-decoration:underline}.starter-template .links ul li .icon-muted{color:#eb8b95;margin-right:5px}.starter-template .links ul li:hover .icon-muted{color:#fff}.starter-template .copyright{margin-top:10px;font-size:.9em;color:#f2b7bd;text-transform:lowercase;float:right;right:0}@media (max-width:1199px){.starter-template .content h1{font-size:45px}.starter-template .content h1 .smaller{font-size:30px}.starter-template .content .lead{font-size:20px}}@media (max-width:991px){.starter-template{margin-top:0}.starter-template .logo{margin:40px auto}.starter-template .content{margin-left:0;text-align:center}.starter-template .content h1{margin-bottom:20px}.starter-template .links{float:none;text-align:center;margin-top:60px}.starter-template .copyright{float:none;text-align:center}}@media (max-width:767px){.starter-template .content h1 .smaller{font-size:25px;display:block}.starter-template .content .lead{font-size:16px}.starter-template .links{margin-top:40px}.starter-template .links ul li{display:block;margin:0}.starter-template .links ul li .icon-muted{display:none}.starter-template .copyright{margin-top:20px}}
\ No newline at end of file
diff --git a/docs/tutorials/wiki2/src/models/tutorial/static/transparent.gif b/docs/tutorials/wiki2/src/models/tutorial/static/transparent.gif
deleted file mode 100644
index 0341802e5..000000000
Binary files a/docs/tutorials/wiki2/src/models/tutorial/static/transparent.gif and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/models/tutorial/templates/mytemplate.pt b/docs/tutorials/wiki2/src/models/tutorial/templates/mytemplate.pt
index ca4e0af26..c9b0cec21 100644
--- a/docs/tutorials/wiki2/src/models/tutorial/templates/mytemplate.pt
+++ b/docs/tutorials/wiki2/src/models/tutorial/templates/mytemplate.pt
@@ -1,73 +1,66 @@
-<!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" xml:lang="en" xmlns:tal="http://xml.zope.org/namespaces/tal">
-<head>
-  <title>The Pyramid Web Framework</title>
-  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
-  <meta name="keywords" content="python web application" />
-  <meta name="description" content="pyramid web application" />
-  <link rel="shortcut icon" href="${request.static_url('tutorial:static/favicon.ico')}" />
-  <link rel="stylesheet" href="${request.static_url('tutorial:static/pylons.css')}" type="text/css" media="screen" charset="utf-8" />
-  <link rel="stylesheet" href="http://static.pylonsproject.org/fonts/nobile/stylesheet.css" media="screen" />
-  <link rel="stylesheet" href="http://static.pylonsproject.org/fonts/neuton/stylesheet.css" media="screen" />
-  
-</head>
-<body>
-  <div id="wrap">
-    <div id="top">
-      <div class="top align-center">
-        <div><img src="${request.static_url('tutorial:static/pyramid.png')}" width="750" height="169" alt="pyramid"/></div>
-      </div>
-    </div>
-    <div id="middle">
-      <div class="middle align-center">
-        <p class="app-welcome">
-          Welcome to <span class="app-name">${project}</span>, an application generated by<br/>
-          the Pyramid Web Framework.
-        </p>
-      </div>
-    </div>
-    <div id="bottom">
-      <div class="bottom">
-        <div id="left" class="align-right">
-          <h2>Search documentation</h2>
-          <form method="get" action="http://docs.pylonsproject.org/projects/pyramid/current/search.html">
-                <input type="text" id="q" name="q" value="" />
-                <input type="submit" id="x" value="Go" />
-            </form>
+<!DOCTYPE html>
+<html lang="${request.locale_name}">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="pyramid web application">
+    <meta name="author" content="Pylons Project">
+    <link rel="shortcut icon" href="${request.static_url('tutorial:static/pyramid-16x16.png')}">
+
+    <title>Alchemy Scaffold for The Pyramid Web Framework</title>
+
+    
+    <link href="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
+
+    
+    <link href="${request.static_url('tutorial:static/theme.css')}" rel="stylesheet">
+
+    
+    
+  </head>
+
+  <body>
+
+    <div class="starter-template">
+      <div class="container">
+        <div class="row">
+          <div class="col-md-2">
+            <img class="logo img-responsive" src="${request.static_url('tutorial:static/pyramid.png')}" alt="pyramid web framework">
+          </div>
+          <div class="col-md-10">
+            <div class="content">
+              <h1><span class="font-semi-bold">Pyramid</span> <span class="smaller">Alchemy scaffold</span></h1>
+              <p class="lead">Welcome to <span class="font-normal">${project}</span>, an application generated by<br>the <span class="font-normal">Pyramid Web Framework</span>.</p>
+            </div>
+          </div>
         </div>
-        <div id="right" class="align-left">
-          <h2>Pyramid links</h2>
-          <ul class="links">
-            <li>
-              <a href="http://pylonsproject.org">Pylons Website</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#narrative-documentation">Narrative Documentation</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#api-documentation">API Documentation</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#tutorials">Tutorials</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#change-history">Change History</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#sample-applications">Sample Applications</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#support-and-development">Support and Development</a>
-            </li>
-            <li>
-              <a href="irc://irc.freenode.net#pyramid">IRC Channel</a>
-            </li>
+        <div class="row">
+          <div class="links">
+            <ul>
+              <li><i class="glyphicon glyphicon-bookmark icon-muted"></i><a href="http://docs.pylonsproject.org/projects/pyramid/en/latest/">Docs</a></li>
+              <li><i class="glyphicon glyphicon-cog icon-muted"></i><a href="https://github.com/Pylons/pyramid">Github Project</a></li>
+              <li><i class="glyphicon glyphicon-globe icon-muted"></i><a href="irc://irc.freenode.net#pyramid">IRC Channel</a></li>
+              <li><i class="glyphicon glyphicon-home icon-muted"></i><a href="http://pylonsproject.org">Pylons Project</a></li>
             </ul>
+          </div>
+        </div>
+        <div class="row">
+          <div class="copyright">
+            Copyright © Pylons Project
+          </div>
         </div>
       </div>
     </div>
-  </div>
-</body>
+
+
+    
+    
+    <script src="//oss.maxcdn.com/libs/jquery/1.10.2/jquery.min.js"></script>
+    <script src="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/js/bootstrap.min.js"></script>
+  </body>
 </html>
diff --git a/docs/tutorials/wiki2/src/tests/tutorial/static/favicon.ico b/docs/tutorials/wiki2/src/tests/tutorial/static/favicon.ico
deleted file mode 100644
index 71f837c9e..000000000
Binary files a/docs/tutorials/wiki2/src/tests/tutorial/static/favicon.ico and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/tests/tutorial/static/footerbg.png b/docs/tutorials/wiki2/src/tests/tutorial/static/footerbg.png
deleted file mode 100644
index 1fbc873da..000000000
Binary files a/docs/tutorials/wiki2/src/tests/tutorial/static/footerbg.png and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/tests/tutorial/static/headerbg.png b/docs/tutorials/wiki2/src/tests/tutorial/static/headerbg.png
deleted file mode 100644
index 0596f2020..000000000
Binary files a/docs/tutorials/wiki2/src/tests/tutorial/static/headerbg.png and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/tests/tutorial/static/ie6.css b/docs/tutorials/wiki2/src/tests/tutorial/static/ie6.css
deleted file mode 100644
index b7c8493d8..000000000
--- a/docs/tutorials/wiki2/src/tests/tutorial/static/ie6.css
+++ /dev/null
@@ -1,8 +0,0 @@
-* html img,
-* html .png{position:relative;behavior:expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",
-this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "',sizingMethod='image')",
-this.src = "static/transparent.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
-this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "',sizingMethod='crop')",
-this.runtimeStyle.backgroundImage = "none")),this.pngSet=true)
-);}
-#wrap{display:table;height:100%}
diff --git a/docs/tutorials/wiki2/src/tests/tutorial/static/middlebg.png b/docs/tutorials/wiki2/src/tests/tutorial/static/middlebg.png
deleted file mode 100644
index 2369cfb7d..000000000
Binary files a/docs/tutorials/wiki2/src/tests/tutorial/static/middlebg.png and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/tests/tutorial/static/pylons.css b/docs/tutorials/wiki2/src/tests/tutorial/static/pylons.css
deleted file mode 100644
index 4b1c017cd..000000000
--- a/docs/tutorials/wiki2/src/tests/tutorial/static/pylons.css
+++ /dev/null
@@ -1,372 +0,0 @@
-html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td
-{
-  margin: 0;
-  padding: 0;
-  border: 0;
-  outline: 0;
-  font-size: 100%; /* 16px */
-  vertical-align: baseline;
-  background: transparent;
-}
-
-body
-{
-  line-height: 1;
-}
-
-ol, ul
-{
-  list-style: none;
-}
-
-blockquote, q
-{
-  quotes: none;
-}
-
-blockquote:before, blockquote:after, q:before, q:after
-{
-  content: '';
-  content: none;
-}
-
-:focus
-{
-  outline: 0;
-}
-
-ins
-{
-  text-decoration: none;
-}
-
-del
-{
-  text-decoration: line-through;
-}
-
-table
-{
-  border-collapse: collapse;
-  border-spacing: 0;
-}
-
-sub
-{
-  vertical-align: sub;
-  font-size: smaller;
-  line-height: normal;
-}
-
-sup
-{
-  vertical-align: super;
-  font-size: smaller;
-  line-height: normal;
-}
-
-ul, menu, dir
-{
-  display: block;
-  list-style-type: disc;
-  margin: 1em 0;
-  padding-left: 40px;
-}
-
-ol
-{
-  display: block;
-  list-style-type: decimal-leading-zero;
-  margin: 1em 0;
-  padding-left: 40px;
-}
-
-li
-{
-  display: list-item;
-}
-
-ul ul, ul ol, ul dir, ul menu, ul dl, ol ul, ol ol, ol dir, ol menu, ol dl, dir ul, dir ol, dir dir, dir menu, dir dl, menu ul, menu ol, menu dir, menu menu, menu dl, dl ul, dl ol, dl dir, dl menu, dl dl
-{
-  margin-top: 0;
-  margin-bottom: 0;
-}
-
-ol ul, ul ul, menu ul, dir ul, ol menu, ul menu, menu menu, dir menu, ol dir, ul dir, menu dir, dir dir
-{
-  list-style-type: circle;
-}
-
-ol ol ul, ol ul ul, ol menu ul, ol dir ul, ol ol menu, ol ul menu, ol menu menu, ol dir menu, ol ol dir, ol ul dir, ol menu dir, ol dir dir, ul ol ul, ul ul ul, ul menu ul, ul dir ul, ul ol menu, ul ul menu, ul menu menu, ul dir menu, ul ol dir, ul ul dir, ul menu dir, ul dir dir, menu ol ul, menu ul ul, menu menu ul, menu dir ul, menu ol menu, menu ul menu, menu menu menu, menu dir menu, menu ol dir, menu ul dir, menu menu dir, menu dir dir, dir ol ul, dir ul ul, dir menu ul, dir dir ul, dir ol menu, dir ul menu, dir menu menu, dir dir menu, dir ol dir, dir ul dir, dir menu dir, dir dir dir
-{
-  list-style-type: square;
-}
-
-.hidden
-{
-  display: none;
-}
-
-p
-{
-  line-height: 1.5em;
-}
-
-h1
-{
-  font-size: 1.75em;
-  line-height: 1.7em;
-  font-family: helvetica, verdana;
-}
-
-h2
-{
-  font-size: 1.5em;
-  line-height: 1.7em;
-  font-family: helvetica, verdana;
-}
-
-h3
-{
-  font-size: 1.25em;
-  line-height: 1.7em;
-  font-family: helvetica, verdana;
-}
-
-h4
-{
-  font-size: 1em;
-  line-height: 1.7em;
-  font-family: helvetica, verdana;
-}
-
-html, body
-{
-  width: 100%;
-  height: 100%;
-}
-
-body
-{
-  margin: 0;
-  padding: 0;
-  background-color: #fff;
-  position: relative;
-  font: 16px/24px NobileRegular, "Lucida Grande", Lucida, Verdana, sans-serif;
-}
-
-a
-{
-  color: #1b61d6;
-  text-decoration: none;
-}
-
-a:hover
-{
-  color: #e88f00;
-  text-decoration: underline;
-}
-
-body h1, body h2, body h3, body h4, body h5, body h6
-{
-  font-family: NeutonRegular, "Lucida Grande", Lucida, Verdana, sans-serif;
-  font-weight: 400;
-  color: #373839;
-  font-style: normal;
-}
-
-#wrap
-{
-  min-height: 100%;
-}
-
-#header, #footer
-{
-  width: 100%;
-  color: #fff;
-  height: 40px;
-  position: absolute;
-  text-align: center;
-  line-height: 40px;
-  overflow: hidden;
-  font-size: 12px;
-  vertical-align: middle;
-}
-
-#header
-{
-  background: #000;
-  top: 0;
-  font-size: 14px;
-}
-
-#footer
-{
-  bottom: 0;
-  background: #000 url(footerbg.png) repeat-x 0 top;
-  position: relative;
-  margin-top: -40px;
-  clear: both;
-}
-
-.header, .footer
-{
-  width: 750px;
-  margin-right: auto;
-  margin-left: auto;
-}
-
-.wrapper
-{
-  width: 100%;
-}
-
-#top, #top-small, #bottom
-{
-  width: 100%;
-}
-
-#top
-{
-  color: #000;
-  height: 230px;
-  background: #fff url(headerbg.png) repeat-x 0 top;
-  position: relative;
-}
-
-#top-small
-{
-  color: #000;
-  height: 60px;
-  background: #fff url(headerbg.png) repeat-x 0 top;
-  position: relative;
-}
-
-#bottom
-{
-  color: #222;
-  background-color: #fff;
-}
-
-.top, .top-small, .middle, .bottom
-{
-  width: 750px;
-  margin-right: auto;
-  margin-left: auto;
-}
-
-.top
-{
-  padding-top: 40px;
-}
-
-.top-small
-{
-  padding-top: 10px;
-}
-
-#middle
-{
-  width: 100%;
-  height: 100px;
-  background: url(middlebg.png) repeat-x;
-  border-top: 2px solid #fff;
-  border-bottom: 2px solid #b2b2b2;
-}
-
-.app-welcome
-{
-  margin-top: 25px;
-}
-
-.app-name
-{
-  color: #000;
-  font-weight: 700;
-}
-
-.bottom
-{
-  padding-top: 50px;
-}
-
-#left
-{
-  width: 350px;
-  float: left;
-  padding-right: 25px;
-}
-
-#right
-{
-  width: 350px;
-  float: right;
-  padding-left: 25px;
-}
-
-.align-left
-{
-  text-align: left;
-}
-
-.align-right
-{
-  text-align: right;
-}
-
-.align-center
-{
-  text-align: center;
-}
-
-ul.links
-{
-  margin: 0;
-  padding: 0;
-}
-
-ul.links li
-{
-  list-style-type: none;
-  font-size: 14px;
-}
-
-form
-{
-  border-style: none;
-}
-
-fieldset
-{
-  border-style: none;
-}
-
-input
-{
-  color: #222;
-  border: 1px solid #ccc;
-  font-family: sans-serif;
-  font-size: 12px;
-  line-height: 16px;
-}
-
-input[type=text], input[type=password]
-{
-  width: 205px;
-}
-
-input[type=submit]
-{
-  background-color: #ddd;
-  font-weight: 700;
-}
-
-/*Opera Fix*/
-body:before
-{
-  content: "";
-  height: 100%;
-  float: left;
-  width: 0;
-  margin-top: -32767px;
-}
diff --git a/docs/tutorials/wiki2/src/tests/tutorial/static/pyramid-16x16.png b/docs/tutorials/wiki2/src/tests/tutorial/static/pyramid-16x16.png
new file mode 100644
index 000000000..979203112
Binary files /dev/null and b/docs/tutorials/wiki2/src/tests/tutorial/static/pyramid-16x16.png differ
diff --git a/docs/tutorials/wiki2/src/tests/tutorial/static/pyramid-small.png b/docs/tutorials/wiki2/src/tests/tutorial/static/pyramid-small.png
deleted file mode 100644
index a5bc0ade7..000000000
Binary files a/docs/tutorials/wiki2/src/tests/tutorial/static/pyramid-small.png and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/tests/tutorial/static/pyramid.png b/docs/tutorials/wiki2/src/tests/tutorial/static/pyramid.png
index 347e05549..4ab837be9 100644
Binary files a/docs/tutorials/wiki2/src/tests/tutorial/static/pyramid.png and b/docs/tutorials/wiki2/src/tests/tutorial/static/pyramid.png differ
diff --git a/docs/tutorials/wiki2/src/tests/tutorial/static/theme.css b/docs/tutorials/wiki2/src/tests/tutorial/static/theme.css
new file mode 100644
index 000000000..0f4b1a4d4
--- /dev/null
+++ b/docs/tutorials/wiki2/src/tests/tutorial/static/theme.css
@@ -0,0 +1,154 @@
+@import url(//fonts.googleapis.com/css?family=Open+Sans:300,400,600,700);
+body {
+  font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-weight: 300;
+  color: #ffffff;
+  background: #bc2131;
+}
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-weight: 300;
+}
+p {
+  font-weight: 300;
+}
+.font-normal {
+  font-weight: 400;
+}
+.font-semi-bold {
+  font-weight: 600;
+}
+.font-bold {
+  font-weight: 700;
+}
+.starter-template {
+  margin-top: 250px;
+}
+.starter-template .content {
+  margin-left: 10px;
+}
+.starter-template .content h1 {
+  margin-top: 10px;
+  font-size: 60px;
+}
+.starter-template .content h1 .smaller {
+  font-size: 40px;
+  color: #f2b7bd;
+}
+.starter-template .content .lead {
+  font-size: 25px;
+  color: #f2b7bd;
+}
+.starter-template .content .lead .font-normal {
+  color: #ffffff;
+}
+.starter-template .links {
+  float: right;
+  right: 0;
+  margin-top: 125px;
+}
+.starter-template .links ul {
+  display: block;
+  padding: 0;
+  margin: 0;
+}
+.starter-template .links ul li {
+  list-style: none;
+  display: inline;
+  margin: 0 10px;
+}
+.starter-template .links ul li:first-child {
+  margin-left: 0;
+}
+.starter-template .links ul li:last-child {
+  margin-right: 0;
+}
+.starter-template .links ul li.current-version {
+  color: #f2b7bd;
+  font-weight: 400;
+}
+.starter-template .links ul li a, a {
+  color: #f2b7bd;
+  text-decoration: underline;
+}
+.starter-template .links ul li a:hover, a:hover {
+  color: #ffffff;
+  text-decoration: underline;
+}
+.starter-template .links ul li .icon-muted {
+  color: #eb8b95;
+  margin-right: 5px;
+}
+.starter-template .links ul li:hover .icon-muted {
+  color: #ffffff;
+}
+.starter-template .copyright {
+  margin-top: 10px;
+  font-size: 0.9em;
+  color: #f2b7bd;
+  text-transform: lowercase;
+  float: right;
+  right: 0;
+}
+@media (max-width: 1199px) {
+  .starter-template .content h1 {
+    font-size: 45px;
+  }
+  .starter-template .content h1 .smaller {
+    font-size: 30px;
+  }
+  .starter-template .content .lead {
+    font-size: 20px;
+  }
+}
+@media (max-width: 991px) {
+  .starter-template {
+    margin-top: 0;
+  }
+  .starter-template .logo {
+    margin: 40px auto;
+  }
+  .starter-template .content {
+    margin-left: 0;
+    text-align: center;
+  }
+  .starter-template .content h1 {
+    margin-bottom: 20px;
+  }
+  .starter-template .links {
+    float: none;
+    text-align: center;
+    margin-top: 60px;
+  }
+  .starter-template .copyright {
+    float: none;
+    text-align: center;
+  }
+}
+@media (max-width: 767px) {
+  .starter-template .content h1 .smaller {
+    font-size: 25px;
+    display: block;
+  }
+  .starter-template .content .lead {
+    font-size: 16px;
+  }
+  .starter-template .links {
+    margin-top: 40px;
+  }
+  .starter-template .links ul li {
+    display: block;
+    margin: 0;
+  }
+  .starter-template .links ul li .icon-muted {
+    display: none;
+  }
+  .starter-template .copyright {
+    margin-top: 20px;
+  }
+}
diff --git a/docs/tutorials/wiki2/src/tests/tutorial/static/theme.min.css b/docs/tutorials/wiki2/src/tests/tutorial/static/theme.min.css
new file mode 100644
index 000000000..2f924bcc5
--- /dev/null
+++ b/docs/tutorials/wiki2/src/tests/tutorial/static/theme.min.css
@@ -0,0 +1 @@
+@import url(//fonts.googleapis.com/css?family=Open+Sans:300,400,600,700);body{font-family:"Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:300;color:#fff;background:#bc2131}h1,h2,h3,h4,h5,h6{font-family:"Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:300}p{font-weight:300}.font-normal{font-weight:400}.font-semi-bold{font-weight:600}.font-bold{font-weight:700}.starter-template{margin-top:250px}.starter-template .content{margin-left:10px}.starter-template .content h1{margin-top:10px;font-size:60px}.starter-template .content h1 .smaller{font-size:40px;color:#f2b7bd}.starter-template .content .lead{font-size:25px;color:#f2b7bd}.starter-template .content .lead .font-normal{color:#fff}.starter-template .links{float:right;right:0;margin-top:125px}.starter-template .links ul{display:block;padding:0;margin:0}.starter-template .links ul li{list-style:none;display:inline;margin:0 10px}.starter-template .links ul li:first-child{margin-left:0}.starter-template .links ul li:last-child{margin-right:0}.starter-template .links ul li.current-version{color:#f2b7bd;font-weight:400}.starter-template .links ul li a{color:#fff}.starter-template .links ul li a:hover{text-decoration:underline}.starter-template .links ul li .icon-muted{color:#eb8b95;margin-right:5px}.starter-template .links ul li:hover .icon-muted{color:#fff}.starter-template .copyright{margin-top:10px;font-size:.9em;color:#f2b7bd;text-transform:lowercase;float:right;right:0}@media (max-width:1199px){.starter-template .content h1{font-size:45px}.starter-template .content h1 .smaller{font-size:30px}.starter-template .content .lead{font-size:20px}}@media (max-width:991px){.starter-template{margin-top:0}.starter-template .logo{margin:40px auto}.starter-template .content{margin-left:0;text-align:center}.starter-template .content h1{margin-bottom:20px}.starter-template .links{float:none;text-align:center;margin-top:60px}.starter-template .copyright{float:none;text-align:center}}@media (max-width:767px){.starter-template .content h1 .smaller{font-size:25px;display:block}.starter-template .content .lead{font-size:16px}.starter-template .links{margin-top:40px}.starter-template .links ul li{display:block;margin:0}.starter-template .links ul li .icon-muted{display:none}.starter-template .copyright{margin-top:20px}}
\ No newline at end of file
diff --git a/docs/tutorials/wiki2/src/tests/tutorial/static/transparent.gif b/docs/tutorials/wiki2/src/tests/tutorial/static/transparent.gif
deleted file mode 100644
index 0341802e5..000000000
Binary files a/docs/tutorials/wiki2/src/tests/tutorial/static/transparent.gif and /dev/null differ
diff --git a/docs/tutorials/wiki2/src/tests/tutorial/templates/edit.pt b/docs/tutorials/wiki2/src/tests/tutorial/templates/edit.pt
index 2004273fe..50e55c850 100644
--- a/docs/tutorials/wiki2/src/tests/tutorial/templates/edit.pt
+++ b/docs/tutorials/wiki2/src/tests/tutorial/templates/edit.pt
@@ -1,58 +1,74 @@
-<!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" xml:lang="en"
-      xmlns:tal="http://xml.zope.org/namespaces/tal">
-<head>
-  <title>${page.name} - Pyramid tutorial wiki (based on
+<!DOCTYPE html>
+<html lang="${request.locale_name}">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="pyramid web application">
+    <meta name="author" content="Pylons Project">
+    <link rel="shortcut icon" href="${request.static_url('tutorial:static/pyramid-16x16.png')}">
+
+    <title>${page.name} - Pyramid tutorial wiki (based on
     TurboGears 20-Minute Wiki)</title>
-  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
-  <meta name="keywords" content="python web application" />
-  <meta name="description" content="pyramid web application" />
-  <link rel="shortcut icon"
-        href="${request.static_url('tutorial:static/favicon.ico')}" />
-  <link rel="stylesheet"
-        href="${request.static_url('tutorial:static/pylons.css')}"
-        type="text/css" media="screen" charset="utf-8" />
-  
-</head>
-<body>
-  <div id="wrap">
-    <div id="top-small">
-      <div class="top-small align-center">
-        <div>
-          <img width="220" height="50" alt="pyramid"
-        src="${request.static_url('tutorial:static/pyramid-small.png')}" />
+
+    
+    <link href="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
+
+    
+    <link href="${request.static_url('tutorial:static/theme.css')}" rel="stylesheet">
+
+    
+    
+  </head>
+  <body>
+
+    <div class="starter-template">
+      <div class="container">
+        <div class="row">
+          <div class="col-md-2">
+            <img class="logo img-responsive" src="${request.static_url('tutorial:static/pyramid.png')}" alt="pyramid web framework">
+          </div>
+          <div class="col-md-10">
+            <div class="content">
+              <p>
+                Editing <strong><span tal:replace="page.name">Page Name Goes
+                Here</span></strong>
+              </p>
+              <p>You can return to the
+                <a href="${request.application_url}">FrontPage</a>.
+              </p>
+              <p class="pull-right">
+                <span tal:condition="logged_in">
+                  <a href="${request.application_url}/logout">Logout</a>
+                </span>
+              </p>
+              <form action="${save_url}" method="post">
+                <div class="form-group">
+                  <textarea class="form-control" name="body" tal:content="page.data" rows="10" cols="60">

+ +

- - -

- Editing Page Name - Goes Here
- You can return to the - FrontPage.
-

- - Logout - +

<br/>
-          <input type="submit" name="form.submitted" value="Save"/>
-        </form>
-      </div>
-    </div>
-  </div>
-</body>
+
+
+    
+    
+    <script src="//oss.maxcdn.com/libs/jquery/1.10.2/jquery.min.js"></script>
+    <script src="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/js/bootstrap.min.js"></script>
+  </body>
 </html>
diff --git a/docs/tutorials/wiki2/src/tests/tutorial/templates/mytemplate.pt b/docs/tutorials/wiki2/src/tests/tutorial/templates/mytemplate.pt
index 6c1ca924a..c9b0cec21 100644
--- a/docs/tutorials/wiki2/src/tests/tutorial/templates/mytemplate.pt
+++ b/docs/tutorials/wiki2/src/tests/tutorial/templates/mytemplate.pt
@@ -1,73 +1,66 @@
-<!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" xml:lang="en" xmlns:tal="http://xml.zope.org/namespaces/tal">
-<head>
-  <title>The Pyramid Web Framework</title>
-  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
-  <meta name="keywords" content="python web application" />
-  <meta name="description" content="pyramid web application" />
-  <link rel="shortcut icon" href="${request.static_url('tutorial:static/favicon.ico')}" />
-  <link rel="stylesheet" href="http://static.pylonsproject.org/fonts/nobile/stylesheet.css" media="screen" />
-  <link rel="stylesheet" href="http://static.pylonsproject.org/fonts/neuton/stylesheet.css" media="screen" />
-  <link rel="stylesheet" href="${request.static_url('tutorial:static/pylons.css')}" type="text/css" media="screen" charset="utf-8" />
-  
-</head>
-<body>
-  <div id="wrap">
-    <div id="top">
-      <div class="top align-center">
-        <div><img src="${request.static_url('tutorial:static/pyramid.png')}" width="750" height="169" alt="pyramid"/></div>
-      </div>
-    </div>
-    <div id="middle">
-      <div class="middle align-center">
-        <p class="app-welcome">
-          Welcome to <span class="app-name">${project}</span>, an application generated by<br/>
-          the Pyramid Web Framework.
-        </p>
-      </div>
-    </div>
-    <div id="bottom">
-      <div class="bottom">
-        <div id="left" class="align-right">
-          <h2>Search documentation</h2>
-          <form method="get" action="http://docs.pylonsproject.org/projects/pyramid/current/search.html">
-                <input type="text" id="q" name="q" value="" />
-                <input type="submit" id="x" value="Go" />
-            </form>
+<!DOCTYPE html>
+<html lang="${request.locale_name}">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="pyramid web application">
+    <meta name="author" content="Pylons Project">
+    <link rel="shortcut icon" href="${request.static_url('tutorial:static/pyramid-16x16.png')}">
+
+    <title>Alchemy Scaffold for The Pyramid Web Framework</title>
+
+    
+    <link href="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
+
+    
+    <link href="${request.static_url('tutorial:static/theme.css')}" rel="stylesheet">
+
+    
+    
+  </head>
+
+  <body>
+
+    <div class="starter-template">
+      <div class="container">
+        <div class="row">
+          <div class="col-md-2">
+            <img class="logo img-responsive" src="${request.static_url('tutorial:static/pyramid.png')}" alt="pyramid web framework">
+          </div>
+          <div class="col-md-10">
+            <div class="content">
+              <h1><span class="font-semi-bold">Pyramid</span> <span class="smaller">Alchemy scaffold</span></h1>
+              <p class="lead">Welcome to <span class="font-normal">${project}</span>, an application generated by<br>the <span class="font-normal">Pyramid Web Framework</span>.</p>
+            </div>
+          </div>
         </div>
-        <div id="right" class="align-left">
-          <h2>Pyramid links</h2>
-          <ul class="links">
-            <li>
-              <a href="http://pylonsproject.org">Pylons Website</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#narrative-documentation">Narrative Documentation</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#api-documentation">API Documentation</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#tutorials">Tutorials</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#change-history">Change History</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#sample-applications">Sample Applications</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#support-and-development">Support and Development</a>
-            </li>
-            <li>
-              <a href="irc://irc.freenode.net#pyramid">IRC Channel</a>
-            </li>
+        <div class="row">
+          <div class="links">
+            <ul>
+              <li><i class="glyphicon glyphicon-bookmark icon-muted"></i><a href="http://docs.pylonsproject.org/projects/pyramid/en/latest/">Docs</a></li>
+              <li><i class="glyphicon glyphicon-cog icon-muted"></i><a href="https://github.com/Pylons/pyramid">Github Project</a></li>
+              <li><i class="glyphicon glyphicon-globe icon-muted"></i><a href="irc://irc.freenode.net#pyramid">IRC Channel</a></li>
+              <li><i class="glyphicon glyphicon-home icon-muted"></i><a href="http://pylonsproject.org">Pylons Project</a></li>
             </ul>
+          </div>
+        </div>
+        <div class="row">
+          <div class="copyright">
+            Copyright © Pylons Project
+          </div>
         </div>
       </div>
     </div>
-  </div>
-</body>
+
+
+    
+    
+    <script src="//oss.maxcdn.com/libs/jquery/1.10.2/jquery.min.js"></script>
+    <script src="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/js/bootstrap.min.js"></script>
+  </body>
 </html>
diff --git a/docs/tutorials/wiki2/src/tests/tutorial/templates/view.pt b/docs/tutorials/wiki2/src/tests/tutorial/templates/view.pt
index 19c50fb36..4e5772de0 100644
--- a/docs/tutorials/wiki2/src/tests/tutorial/templates/view.pt
+++ b/docs/tutorials/wiki2/src/tests/tutorial/templates/view.pt
@@ -1,61 +1,74 @@
-<!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" xml:lang="en"
-      xmlns:tal="http://xml.zope.org/namespaces/tal">
-<head>
-  <title>${page.name} - Pyramid tutorial wiki (based on
+<!DOCTYPE html>
+<html lang="${request.locale_name}">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="pyramid web application">
+    <meta name="author" content="Pylons Project">
+    <link rel="shortcut icon" href="${request.static_url('tutorial:static/pyramid-16x16.png')}">
+
+    <title>${page.name} - Pyramid tutorial wiki (based on
     TurboGears 20-Minute Wiki)</title>
-  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
-  <meta name="keywords" content="python web application" />
-  <meta name="description" content="pyramid web application" />
-  <link rel="shortcut icon"
-        href="${request.static_url('tutorial:static/favicon.ico')}" />
-  <link rel="stylesheet"
-        href="${request.static_url('tutorial:static/pylons.css')}"
-        type="text/css" media="screen" charset="utf-8" />
-  
-</head>
-<body>
-  <div id="wrap">
-    <div id="top-small">
-      <div class="top-small align-center">
-        <div>
-          <img width="220" height="50" alt="pyramid"
-        src="${request.static_url('tutorial:static/pyramid-small.png')}" />
+
+    
+    <link href="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
+
+    
+    <link href="${request.static_url('tutorial:static/theme.css')}" rel="stylesheet">
+
+    
+    
+  </head>
+  <body>
+
+    <div class="starter-template">
+      <div class="container">
+        <div class="row">
+          <div class="col-md-2">
+            <img class="logo img-responsive" src="${request.static_url('tutorial:static/pyramid.png')}" alt="pyramid web framework">
+          </div>
+          <div class="col-md-10">
+            <div class="content">
+              <div tal:replace="structure content">
+                Page text goes here.
+              </div>
+              <p>
+                <a tal:attributes="href edit_url" href="">
+                  Edit this page
+                </a>
+              </p>
+              <p>
+                  Viewing <strong><span tal:replace="page.name">
+                  Page Name Goes Here</span></strong>
+              </p>
+              <p>You can return to the
+                <a href="${request.application_url}">FrontPage</a>.
+              </p>
+              <p class="pull-right">
+                <span tal:condition="logged_in">
+                  <a href="${request.application_url}/logout">Logout</a>
+                </span>
+              </p>
+            </div>
+          </div>
         </div>
-      </div>
-    </div>
-    <div id="middle">
-      <div class="middle align-right">
-        <div id="left" class="app-welcome align-left">
-          Viewing <b><span tal:replace="page.name">Page Name
-            Goes Here</span></b><br/>
-          You can return to the
-          <a href="${request.application_url}">FrontPage</a>.<br/>
-        </div>
-        <div id="right" class="app-welcome align-right">
-          <span tal:condition="logged_in">
-            <a href="${request.application_url}/logout">Logout</a>
-          </span>
-        </div>
-      </div>
-    </div>
-    <div id="bottom">
-      <div class="bottom">
-        <div tal:replace="structure content">
-          Page text goes here.
+        <div class="row">
+          <div class="copyright">
+            Copyright © Pylons Project
+          </div>
         </div>
-        <p>
-          <a tal:attributes="href edit_url" href="">
-            Edit this page
-          </a>
-        </p>
       </div>
     </div>
-  </div>
-</body>
+
+
+    
+    
+    <script src="//oss.maxcdn.com/libs/jquery/1.10.2/jquery.min.js"></script>
+    <script src="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/js/bootstrap.min.js"></script>
+  </body>
 </html>
diff --git a/docs/tutorials/wiki2/src/views/tutorial/templates/mytemplate.pt b/docs/tutorials/wiki2/src/views/tutorial/templates/mytemplate.pt
index ca4e0af26..c9b0cec21 100644
--- a/docs/tutorials/wiki2/src/views/tutorial/templates/mytemplate.pt
+++ b/docs/tutorials/wiki2/src/views/tutorial/templates/mytemplate.pt
@@ -1,73 +1,66 @@
-<!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" xml:lang="en" xmlns:tal="http://xml.zope.org/namespaces/tal">
-<head>
-  <title>The Pyramid Web Framework</title>
-  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
-  <meta name="keywords" content="python web application" />
-  <meta name="description" content="pyramid web application" />
-  <link rel="shortcut icon" href="${request.static_url('tutorial:static/favicon.ico')}" />
-  <link rel="stylesheet" href="${request.static_url('tutorial:static/pylons.css')}" type="text/css" media="screen" charset="utf-8" />
-  <link rel="stylesheet" href="http://static.pylonsproject.org/fonts/nobile/stylesheet.css" media="screen" />
-  <link rel="stylesheet" href="http://static.pylonsproject.org/fonts/neuton/stylesheet.css" media="screen" />
-  
-</head>
-<body>
-  <div id="wrap">
-    <div id="top">
-      <div class="top align-center">
-        <div><img src="${request.static_url('tutorial:static/pyramid.png')}" width="750" height="169" alt="pyramid"/></div>
-      </div>
-    </div>
-    <div id="middle">
-      <div class="middle align-center">
-        <p class="app-welcome">
-          Welcome to <span class="app-name">${project}</span>, an application generated by<br/>
-          the Pyramid Web Framework.
-        </p>
-      </div>
-    </div>
-    <div id="bottom">
-      <div class="bottom">
-        <div id="left" class="align-right">
-          <h2>Search documentation</h2>
-          <form method="get" action="http://docs.pylonsproject.org/projects/pyramid/current/search.html">
-                <input type="text" id="q" name="q" value="" />
-                <input type="submit" id="x" value="Go" />
-            </form>
+<!DOCTYPE html>
+<html lang="${request.locale_name}">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="pyramid web application">
+    <meta name="author" content="Pylons Project">
+    <link rel="shortcut icon" href="${request.static_url('tutorial:static/pyramid-16x16.png')}">
+
+    <title>Alchemy Scaffold for The Pyramid Web Framework</title>
+
+    
+    <link href="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
+
+    
+    <link href="${request.static_url('tutorial:static/theme.css')}" rel="stylesheet">
+
+    
+    
+  </head>
+
+  <body>
+
+    <div class="starter-template">
+      <div class="container">
+        <div class="row">
+          <div class="col-md-2">
+            <img class="logo img-responsive" src="${request.static_url('tutorial:static/pyramid.png')}" alt="pyramid web framework">
+          </div>
+          <div class="col-md-10">
+            <div class="content">
+              <h1><span class="font-semi-bold">Pyramid</span> <span class="smaller">Alchemy scaffold</span></h1>
+              <p class="lead">Welcome to <span class="font-normal">${project}</span>, an application generated by<br>the <span class="font-normal">Pyramid Web Framework</span>.</p>
+            </div>
+          </div>
         </div>
-        <div id="right" class="align-left">
-          <h2>Pyramid links</h2>
-          <ul class="links">
-            <li>
-              <a href="http://pylonsproject.org">Pylons Website</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#narrative-documentation">Narrative Documentation</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#api-documentation">API Documentation</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#tutorials">Tutorials</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#change-history">Change History</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#sample-applications">Sample Applications</a>
-            </li>
-            <li>
-              <a href="http://docs.pylonsproject.org/projects/pyramid/current/#support-and-development">Support and Development</a>
-            </li>
-            <li>
-              <a href="irc://irc.freenode.net#pyramid">IRC Channel</a>
-            </li>
+        <div class="row">
+          <div class="links">
+            <ul>
+              <li><i class="glyphicon glyphicon-bookmark icon-muted"></i><a href="http://docs.pylonsproject.org/projects/pyramid/en/latest/">Docs</a></li>
+              <li><i class="glyphicon glyphicon-cog icon-muted"></i><a href="https://github.com/Pylons/pyramid">Github Project</a></li>
+              <li><i class="glyphicon glyphicon-globe icon-muted"></i><a href="irc://irc.freenode.net#pyramid">IRC Channel</a></li>
+              <li><i class="glyphicon glyphicon-home icon-muted"></i><a href="http://pylonsproject.org">Pylons Project</a></li>
             </ul>
+          </div>
+        </div>
+        <div class="row">
+          <div class="copyright">
+            Copyright © Pylons Project
+          </div>
         </div>
       </div>
     </div>
-  </div>
-</body>
+
+
+    
+    
+    <script src="//oss.maxcdn.com/libs/jquery/1.10.2/jquery.min.js"></script>
+    <script src="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/js/bootstrap.min.js"></script>
+  </body>
 </html>
-- 
cgit v1.2.3

From 8d88c0ffa7b8e08215c7a06e130c84b2963f3279 Mon Sep 17 00:00:00 2001
From: Steve Piercy <web@stevepiercy.com>
Date: Mon, 25 May 2015 02:48:32 -0700
Subject: update templates, line numbers, file references

---
 .../src/authorization/tutorial/templates/edit.pt   |   8 +-
 .../src/authorization/tutorial/templates/login.pt  | 122 ++++++++++++---------
 .../src/authorization/tutorial/templates/view.pt   |   8 +-
 3 files changed, 75 insertions(+), 63 deletions(-)

(limited to 'docs/tutorials/wiki2/src')

diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/templates/edit.pt b/docs/tutorials/wiki2/src/authorization/tutorial/templates/edit.pt
index 50e55c850..ed355434d 100644
--- a/docs/tutorials/wiki2/src/authorization/tutorial/templates/edit.pt
+++ b/docs/tutorials/wiki2/src/authorization/tutorial/templates/edit.pt
@@ -33,6 +33,9 @@
           </div>
           <div class="col-md-10">
             <div class="content">
+              <p tal:condition="logged_in" class="pull-right">
+                <a href="${request.application_url}/logout">Logout</a>
+              </p>
               <p>
                 Editing <strong><span tal:replace="page.name">Page Name Goes
                 Here</span></strong>
@@ -40,11 +43,6 @@
               <p>You can return to the
                 <a href="${request.application_url}">FrontPage</a>.
               </p>
-              <p class="pull-right">
-                <span tal:condition="logged_in">
-                  <a href="${request.application_url}/logout">Logout</a>
-                </span>
-              </p>
               <form action="${save_url}" method="post">
                 <div class="form-group">
                   <textarea class="form-control" name="body" tal:content="page.data" rows="10" cols="60">

diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/templates/login.pt b/docs/tutorials/wiki2/src/authorization/tutorial/templates/login.pt index 64e592ea9..331d52d2a 100644 --- a/docs/tutorials/wiki2/src/authorization/tutorial/templates/login.pt +++ b/docs/tutorials/wiki2/src/authorization/tutorial/templates/login.pt @@ -1,58 +1,74 @@ - - - - Login - Pyramid tutorial wiki (based on TurboGears - 20-Minute Wiki) - - - - - - - - -

+ + + + + + + + + + + Login - Pyramid tutorial wiki (based on + TurboGears 20-Minute Wiki) + + + + + + + + + + + + +

+ + Login + + +

+ + +

+ Username + +

+ Password + +

+ +

- Login
- +

- - + + + + + + + diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/templates/view.pt b/docs/tutorials/wiki2/src/authorization/tutorial/templates/view.pt index 4e5772de0..02cb8e73b 100644 --- a/docs/tutorials/wiki2/src/authorization/tutorial/templates/view.pt +++ b/docs/tutorials/wiki2/src/authorization/tutorial/templates/view.pt @@ -33,6 +33,9 @@

+ Logout +

Page text goes here.

@@ -48,11 +51,6 @@

You can return to the FrontPage.

- - Logout - -

-- cgit v1.2.3 From 5f375c7603c0e240a60b884bf0ef39352c25c879 Mon Sep 17 00:00:00 2001 From: Steve Piercy Date: Wed, 27 May 2015 02:44:38 -0700 Subject: - clean up and make consistent across both wikis authorization.rst - update templates and static assets to new theme --- docs/tutorials/wiki2/src/authorization/tutorial/templates/login.pt | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'docs/tutorials/wiki2/src') diff --git a/docs/tutorials/wiki2/src/authorization/tutorial/templates/login.pt b/docs/tutorials/wiki2/src/authorization/tutorial/templates/login.pt index 331d52d2a..4a938e9bb 100644 --- a/docs/tutorials/wiki2/src/authorization/tutorial/templates/login.pt +++ b/docs/tutorials/wiki2/src/authorization/tutorial/templates/login.pt @@ -36,7 +36,7 @@

Login - +