From 2c34a669aea2a8c51e91037689f199e4e543a3c0 Mon Sep 17 00:00:00 2001
From: Steve Piercy <web@stevepiercy.com>
Date: Mon, 25 May 2015 11:37:20 -0700
Subject: mention ZODB; punctuation

---
 docs/tutorials/wiki/index.rst | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

(limited to 'docs/tutorials/wiki')

diff --git a/docs/tutorials/wiki/index.rst b/docs/tutorials/wiki/index.rst
index 981d135c7..89c026dac 100644
--- a/docs/tutorials/wiki/index.rst
+++ b/docs/tutorials/wiki/index.rst
@@ -3,10 +3,10 @@
 ZODB + Traversal Wiki Tutorial
 ==============================
 
-This tutorial introduces a :term:`traversal` -based :app:`Pyramid`
-application to a developer familiar with Python.  It will be most familiar to
-developers with previous :term:`Zope` experience.  When we're done with the
-tutorial, the developer will have created a basic Wiki application with
+This tutorial introduces a :term:`ZODB` and :term:`traversal`-based
+:app:`Pyramid` application to a developer familiar with Python.  It will be
+most familiar to developers with previous :term:`Zope` experience.  When the
+is finished, the developer will have created a basic Wiki application with
 authentication.
 
 For cut and paste purposes, the source code for all stages of this
-- 
cgit v1.2.3


From 3e6b601d9bc557b5b698d5fd4d6eb20b151a424f Mon Sep 17 00:00:00 2001
From: Steve Piercy <web@stevepiercy.com>
Date: Mon, 25 May 2015 13:53:05 -0700
Subject: cherry pick from 1.5-branch

---
 docs/tutorials/wiki/design.rst       |  37 +++--
 docs/tutorials/wiki/installation.rst | 266 +++++++++++++++++++++++++----------
 2 files changed, 210 insertions(+), 93 deletions(-)

(limited to 'docs/tutorials/wiki')

diff --git a/docs/tutorials/wiki/design.rst b/docs/tutorials/wiki/design.rst
index 28380bd66..49c30d29a 100644
--- a/docs/tutorials/wiki/design.rst
+++ b/docs/tutorials/wiki/design.rst
@@ -2,22 +2,22 @@
 Design
 ==========
 
-Following is a quick overview of our wiki application, to help
-us understand the changes that we will be doing next in our
-default files generated by the ``zodb`` scaffold.
+Following is a quick overview of the design of our wiki application, to help
+us understand the changes that we will be making as we work through the
+tutorial.
 
 Overall
 -------
 
-We choose to use ``reStructuredText`` markup in the wiki text.
-Translation from reStructuredText to HTML is provided by the
-widely used ``docutils`` Python module.  We will add this module
-in the dependency list on the project ``setup.py`` file.
+We choose to use :term:`reStructuredText` markup in the wiki text. Translation
+from reStructuredText to HTML is provided by the widely used ``docutils``
+Python module.  We will add this module in the dependency list on the project
+``setup.py`` file.
 
 Models
 ------
 
-The root resource, named *Wiki*, will be a mapping of wiki page
+The root resource named ``Wiki`` will be a mapping of wiki page
 names to page resources.  The page resources will be instances
 of a *Page* class and they store the text content.
 
@@ -29,9 +29,9 @@ To add a page to the wiki, a new instance of the page resource
 is created and its name and reference are added to the Wiki
 mapping.
 
-A page named *FrontPage* containing the text *This is the front
-page*, will be created when the storage is initialized, and will
-be used as the wiki home page.
+A page named ``FrontPage`` containing the text *This is the front page*, will
+be created when the storage is initialized, and will be used as the wiki home
+page.
 
 Views
 -----
@@ -57,14 +57,13 @@ use to do this are below.
   corresponding passwords.
 
 - GROUPS, a dictionary mapping :term:`userids <userid>` to a
-  list of groups to which they belong to.
+  list of groups to which they belong.
 
-- ``groupfinder``, an *authorization callback* that looks up
-  USERS and GROUPS.  It will be provided in a new
-  *security.py* file.
+- ``groupfinder``, an *authorization callback* that looks up USERS and
+  GROUPS.  It will be provided in a new ``security.py`` file.
 
-- An :term:`ACL` is attached to the root :term:`resource`.  Each
-  row below details an :term:`ACE`:
+- An :term:`ACL` is attached to the root :term:`resource`.  Each row below
+  details an :term:`ACE`:
 
   +----------+----------------+----------------+
   | Action   | Principal      | Permission     |
@@ -125,7 +124,7 @@ listed in the following table:
 |                      |             |                 |  authenticate.        |            |            |
 |                      |             |                 |                       |            |            |
 |                      |             |                 |  - If authentication  |            |            |
-|                      |             |                 |    successful,        |            |            |
+|                      |             |                 |    succeeds,          |            |            |
 |                      |             |                 |    redirect to the    |            |            |
 |                      |             |                 |    page that we       |            |            |
 |                      |             |                 |    came from.         |            |            |
@@ -145,6 +144,6 @@ listed in the following table:
        when there is no view name.
 .. [2] Pyramid will return a default 404 Not Found page
        if the page *PageName* does not exist yet.
-.. [3] pyramid.exceptions.Forbidden is reached when a
+.. [3] ``pyramid.exceptions.Forbidden`` is reached when a
        user tries to invoke a view that is
        not authorized by the authorization policy.
diff --git a/docs/tutorials/wiki/installation.rst b/docs/tutorials/wiki/installation.rst
index b51254b92..20df389c6 100644
--- a/docs/tutorials/wiki/installation.rst
+++ b/docs/tutorials/wiki/installation.rst
@@ -2,125 +2,218 @@
 Installation
 ============
 
-Preparation
-===========
+Before you begin
+================
 
-Follow the steps in :ref:`installing_chapter`, but name the virtualenv
-directory ``pyramidtut``.
+This tutorial assumes that you have already followed the steps in
+:ref:`installing_chapter`, except **do not create a virtualenv or install
+Pyramid**.  Thereby you will satisfy the following requirements.
 
-Preparation, UNIX
------------------
+* Python interpreter is installed on your operating system
+* :term:`setuptools` or :term:`distribute` is installed
+* :term:`virtualenv` is installed
 
+Create directory to contain the project
+---------------------------------------
 
-#. Switch to the ``pyramidtut`` directory:
+We need a workspace for our project files.
 
-   .. code-block:: text
+On UNIX
+^^^^^^^
 
-     $ cd pyramidtut
+.. code-block:: text
+
+    $ mkdir ~/pyramidtut
+
+On Windows
+^^^^^^^^^^
+
+.. code-block:: text
+
+   c:\> mkdir pyramidtut
 
-#. Install tutorial dependencies:
+Create and use a virtual Python environment
+-------------------------------------------
 
-   .. code-block:: text
+Next let's create a `virtualenv` workspace for our project.  We will
+use the `VENV` environment variable instead of the absolute path of the
+virtual environment.
 
-     $ $VENV/bin/easy_install docutils pyramid_tm pyramid_zodbconn \
-               pyramid_debugtoolbar nose coverage
+On UNIX
+^^^^^^^
 
-Preparation, Windows
---------------------
+.. code-block:: text
+
+   $ export VENV=~/pyramidtut
+   $ virtualenv $VENV
+   New python executable in /home/foo/env/bin/python
+   Installing setuptools.............done.
+
+On Windows
+^^^^^^^^^^
 
+.. code-block:: text
+
+   c:\> set VENV=c:\pyramidtut
 
-#. Switch to the ``pyramidtut`` directory:
+Versions of Python use different paths, so you will need to adjust the
+path to the command for your Python version.
 
-   .. code-block:: text
+Python 2.7:
 
-     c:\> cd pyramidtut
+.. code-block:: text
 
-#. Install tutorial dependencies:
+   c:\> c:\Python27\Scripts\virtualenv %VENV%
 
-   .. code-block:: text
+Python 3.2:
+
+.. code-block:: text
+
+   c:\> c:\Python32\Scripts\virtualenv %VENV%
+
+Install Pyramid and tutorial dependencies into the virtual Python environment
+-----------------------------------------------------------------------------
+
+On UNIX
+^^^^^^^
+
+.. code-block:: text
+
+    $ $VENV/bin/easy_install docutils pyramid_tm pyramid_zodbconn \
+            pyramid_debugtoolbar nose coverage
+
+On Windows
+^^^^^^^^^^
+
+.. code-block:: text
 
-     c:\pyramidtut> %VENV%\Scripts\easy_install docutils pyramid_tm \
-           pyramid_zodbconn pyramid_debugtoolbar nose coverage
+     c:\> %VENV%\Scripts\easy_install docutils pyramid_tm pyramid_zodbconn \
+            pyramid_debugtoolbar nose coverage
+
+Change Directory to Your Virtual Python Environment
+---------------------------------------------------
+
+Change directory to the ``pyramidtut`` directory.
+
+On UNIX
+^^^^^^^
+
+.. code-block:: text
+
+   $ cd pyramidtut
+
+On Windows
+^^^^^^^^^^
+
+.. code-block:: text
+
+   c:\> cd pyramidtut
 
 .. _making_a_project:
 
-Make a Project
-==============
+Making a project
+================
+
+Your next step is to create a project.  For this tutorial, we will use
+the :term:`scaffold` named ``zodb``, which generates an application
+that uses :term:`ZODB` and :term:`traversal`.
 
-Your next step is to create a project.  For this tutorial, we will use the
-:term:`scaffold` named ``zodb``, which generates an application
-that uses :term:`ZODB` and :term:`traversal`.  :app:`Pyramid`
-supplies a variety of scaffolds to generate sample projects.
+:app:`Pyramid` supplies a variety of scaffolds to generate sample
+projects. We will use `pcreate`—a script that comes with Pyramid to
+quickly and easily generate scaffolds, usually with a single command—to
+create the scaffold for our project.
 
-The below instructions assume your current working directory is the
-"virtualenv" named "pyramidtut".
+By passing `zodb` into the `pcreate` command, the script creates
+the files needed to use ZODB. By passing in our application name
+`tutorial`, the script inserts that application name into all the
+required files.
 
-On UNIX:
+The below instructions assume your current working directory is "pyramidtut".
+
+On UNIX
+-------
 
 .. code-block:: text
 
-  $ $VENV/bin/pcreate -s zodb tutorial
+   $ $VENV/bin/pcreate -s zodb tutorial
 
-On Windows:
+On Windows
+----------
 
 .. code-block:: text
 
    c:\pyramidtut> %VENV%\Scripts\pcreate -s zodb tutorial
 
-.. note:: You don't have to call it `tutorial` -- the code uses
-   relative paths for imports and finding templates and static
-   resources.
+.. note:: If you are using Windows, the ``zodb``
+   scaffold may not deal gracefully with installation into a
+   location that contains spaces in the path.  If you experience
+   startup problems, try putting both the virtualenv and the project
+   into directories that do not contain spaces in their paths.
 
-.. note:: If you are using Windows, the ``zodb`` scaffold
-   doesn't currently deal gracefully with installation into a location
-   that contains spaces in the path.  If you experience startup
-   problems, try putting both the virtualenv and the project into
-   directories that do not contain spaces in their paths.
+.. _installing_project_in_dev_mode_zodb:
 
-Install the Project in "Development Mode"
-=========================================
+Installing the project in development mode
+==========================================
 
 In order to do development on the project easily, you must "register"
 the project as a development egg in your workspace using the
-``setup.py develop`` command.  In order to do so, cd to the "tutorial"
+``setup.py develop`` command.  In order to do so, cd to the `tutorial`
 directory you created in :ref:`making_a_project`, and run the
-"setup.py develop" command using virtualenv Python interpreter.
+``setup.py develop`` command using the virtualenv Python interpreter.
 
-On UNIX:
+On UNIX
+-------
 
 .. code-block:: text
 
-  $ cd tutorial
-  $ $VENV/bin/python setup.py develop
+   $ cd tutorial
+   $ $VENV/bin/python setup.py develop
 
-On Windows:
+On Windows
+----------
 
 .. code-block:: text
 
-  C:\pyramidtut> cd tutorial
-  C:\pyramidtut\tutorial> %VENV%\Scripts\python setup.py develop
+   c:\pyramidtut> cd tutorial
+   c:\pyramidtut\tutorial> %VENV%\Scripts\python setup.py develop
+
+The console will show `setup.py` checking for packages and installing
+missing packages. Success executing this command will show a line like
+the following::
+
+   Finished processing dependencies for tutorial==0.0
 
 .. _running_tests:
 
-Run the Tests
+Run the tests
 =============
 
 After you've installed the project in development mode, you may run
 the tests for the project.
 
-On UNIX:
+On UNIX
+-------
 
 .. code-block:: text
 
-  $ $VENV/bin/python setup.py test -q
+   $ $VENV/bin/python setup.py test -q
 
-On Windows:
+On Windows
+----------
 
 .. code-block:: text
 
-  c:\pyramidtut\tutorial> %VENV%\Scripts\python setup.py test -q
+   c:\pyramidtut\tutorial> %VENV%\Scripts\python setup.py test -q
 
-Expose Test Coverage Information
+For a successful test run, you should see output that ends like this::
+
+  .
+  ----------------------------------------------------------------------
+  Ran 1 test in 0.094s
+ 
+  OK
+
+Expose test coverage information
 ================================
 
 You can run the ``nosetests`` command to see test coverage
@@ -129,48 +222,73 @@ test`` does but provides additional "coverage" information, exposing
 which lines of your project are "covered" (or not covered) by the
 tests.
 
-On UNIX:
+On UNIX
+-------
 
 .. code-block:: text
 
-  $ $VENV/bin/nosetests --cover-package=tutorial --cover-erase --with-coverage
+   $ $VENV/bin/nosetests --cover-package=tutorial --cover-erase --with-coverage
 
-On Windows:
+On Windows
+----------
 
 .. code-block:: text
 
-  c:\pyramidtut\tutorial> %VENV%\Scripts\nosetests --cover-package=tutorial ^
-       --cover-erase --with-coverage
+   c:\pyramidtut\tutorial> %VENV%\Scripts\nosetests --cover-package=tutorial \
+         --cover-erase --with-coverage
+
+If successful, you will see output something like this::
 
-Looks like the code in the ``zodb`` scaffold for ZODB projects is
-missing some test coverage, particularly in the file named
-``models.py``.
+    .
+    Name                 Stmts   Miss  Cover   Missing
+    --------------------------------------------------
+    tutorial.py             12      7    42%   7-8, 14-18
+    tutorial/models.py      10      6    40%   9-14
+    tutorial/views.py        4      0   100%   
+    --------------------------------------------------
+    TOTAL                   26     13    50%   
+    ----------------------------------------------------------------------
+    Ran 1 test in 0.392s
+
+    OK
+
+Looks like our package doesn't quite have 100% test coverage.
 
 .. _wiki-start-the-application:
 
-Start the Application
+Start the application
 =====================
 
 Start the application.
 
-On UNIX:
+On UNIX
+-------
 
 .. code-block:: text
 
-  $ $VENV/bin/pserve development.ini --reload
+   $ $VENV/bin/pserve development.ini --reload
 
-On Windows:
+On Windows
+----------
 
 .. code-block:: text
 
-  c:\pyramidtut\tutorial> %VENV%\Scripts\pserve development.ini --reload
+   c:\pyramidtut\tutorial> %VENV%\Scripts\pserve development.ini --reload
 
 .. note::
 
    Your OS firewall, if any, may pop up a dialog asking for authorization
    to allow python to accept incoming network connections.
 
-Visit the Application in a Browser
+If successful, you will see something like this on your console::
+
+    Starting subprocess with file monitor
+    Starting server in PID 95736.
+    serving on http://0.0.0.0:6543
+
+This means the server is ready to accept requests.
+
+Visit the application in a browser
 ==================================
 
 In a browser, visit `http://localhost:6543/ <http://localhost:6543>`_.  You
@@ -181,7 +299,7 @@ page.  You can read more about the purpose of the icon at
 :ref:`debug_toolbar`.  It allows you to get information about your
 application while you develop.
 
-Decisions the ``zodb`` Scaffold Has Made For You
+Decisions the ``zodb`` scaffold has made for you
 ================================================
 
 Creating a project using the ``zodb`` scaffold makes the following
@@ -189,11 +307,11 @@ assumptions:
 
 - you are willing to use :term:`ZODB` as persistent storage
 
-- you are willing to use :term:`traversal` to map URLs to code.
+- you are willing to use :term:`traversal` to map URLs to code
 
 .. note::
 
    :app:`Pyramid` supports any persistent storage mechanism (e.g., a SQL
-   database or filesystem files).  :app:`Pyramid` also supports an additional
+   database or filesystem files).  It also supports an additional
    mechanism to map URLs to code (:term:`URL dispatch`).  However, for the
    purposes of this tutorial, we'll only be using traversal and ZODB.
-- 
cgit v1.2.3


From 34a913dd693695ade475000bfe61eb6e828a1dc8 Mon Sep 17 00:00:00 2001
From: Steve Piercy <web@stevepiercy.com>
Date: Mon, 25 May 2015 14:55:00 -0700
Subject: grammar, caps, minor tweaks

---
 docs/tutorials/wiki/basiclayout.rst | 49 ++++++++++++++++++++-----------------
 1 file changed, 26 insertions(+), 23 deletions(-)

(limited to 'docs/tutorials/wiki')

diff --git a/docs/tutorials/wiki/basiclayout.rst b/docs/tutorials/wiki/basiclayout.rst
index cdf52b73e..0484ebf17 100644
--- a/docs/tutorials/wiki/basiclayout.rst
+++ b/docs/tutorials/wiki/basiclayout.rst
@@ -2,25 +2,27 @@
 Basic Layout
 ============
 
-The starter files generated by the ``zodb`` scaffold are basic, but
+The starter files generated by the ``zodb`` scaffold are very basic, but
 they provide a good orientation for the high-level patterns common to most
-:term:`traversal` -based :app:`Pyramid` (and :term:`ZODB` -based) projects.
+:term:`traversal`-based (and :term:`ZODB`-based) :app:`Pyramid` projects.
 
 
-Application Configuration with ``__init__.py``
-------------------------------------------------
+Application configuration with ``__init__.py``
+----------------------------------------------
 
 A directory on disk can be turned into a Python :term:`package` by containing
 an ``__init__.py`` file.  Even if empty, this marks a directory as a Python
-package.  Our application uses ``__init__.py`` both as a package marker and
-to contain application configuration code.
+package.  We use ``__init__.py`` both as a marker, indicating the directory
+in which it's contained is a package, and to contain application configuration
+code.
 
 When you run the application using the ``pserve`` command using the
-``development.ini`` generated config file, the application configuration
-points at a Setuptools *entry point* described as ``egg:tutorial``.  In our
-application, because the application's ``setup.py`` file says so, this entry
-point happens to be the ``main`` function within the file named
-``__init__.py``:
+``development.ini`` generated configuration file, the application
+configuration points at a Setuptools *entry point* described as
+``egg:tutorial``.  In our application, because the application's ``setup.py``
+file says so, this entry point happens to be the ``main`` function within the
+file named ``__init__.py``. Let's take a look at the code and describe what
+it does:
 
    .. literalinclude:: src/basiclayout/tutorial/__init__.py
       :linenos:
@@ -28,17 +30,19 @@ point happens to be the ``main`` function within the file named
 
 #. *Lines 1-3*.  Perform some dependency imports.
 
-#. *Lines 6-8*.  Define a root factory for our Pyramid application.
+#. *Lines 6-8*.  Define a :term:`root factory` for our Pyramid application.
 
-#. *Line 14*.  We construct a :term:`Configurator` with a :term:`root
-   factory` and the settings keywords parsed by :term:`PasteDeploy`.  The root
+#. *Line 11*.  ``__init__.py`` defines a function named ``main``.
+
+#. *Line 14*.  We construct a :term:`Configurator` with a root
+   factory and the settings keywords parsed by :term:`PasteDeploy`.  The root
    factory is named ``root_factory``.
 
 #. *Line 15*.  Include support for the :term:`Chameleon` template rendering
    bindings, allowing us to use the ``.pt`` templates.
 
-#. *Line 16*.  Register a "static view" which answers requests whose URL path
-   start with ``/static`` using the
+#. *Line 16*.  Register a "static view", which answers requests whose URL
+   paths start with ``/static``, using the
    :meth:`pyramid.config.Configurator.add_static_view` method.  This
    statement registers a view that will serve up static assets, such as CSS
    and image files, for us, in this case, at
@@ -63,7 +67,7 @@ point happens to be the ``main`` function within the file named
    :meth:`pyramid.config.Configurator.make_wsgi_app` method
    to return a :term:`WSGI` application.
 
-Resources and Models with ``models.py``
+Resources and models with ``models.py``
 ---------------------------------------
 
 :app:`Pyramid` uses the word :term:`resource` to describe objects arranged
@@ -93,13 +97,12 @@ Here is the source for ``models.py``:
    root* object.  It is called on *every request* to the
    :app:`Pyramid` application.  It also performs bootstrapping by
    *creating* an application root (inside the ZODB root object) if one
-   does not already exist.  It is used by the "root_factory" we've defined
+   does not already exist.  It is used by the ``root_factory`` we've defined
    in our ``__init__.py``.
  
-   We do so by first seeing if the database has the persistent
-   application root.  If not, we make an instance, store it, and
-   commit the transaction.  We then return the application root
-   object.
+   Bootstrapping is done by first seeing if the database has the persistent
+   application root.  If not, we make an instance, store it, and commit the
+   transaction.  We then return the application root object.
 
 Views With ``views.py``
 -----------------------
@@ -171,6 +174,6 @@ opposed to the tutorial :term:`package` directory) looks like this:
 Note the existence of a ``[app:main]`` section which specifies our WSGI
 application.  Our ZODB database settings are specified as the
 ``zodbconn.uri`` setting within this section.  This value, and the other
-values within this section are passed as ``**settings`` to the ``main``
+values within this section, are passed as ``**settings`` to the ``main``
 function we defined in ``__init__.py`` when the server is started via
 ``pserve``.
-- 
cgit v1.2.3


From dd6232d43ca974e95742275312a06863c2bd0744 Mon Sep 17 00:00:00 2001
From: Steve Piercy <web@stevepiercy.com>
Date: Mon, 25 May 2015 15:52:53 -0700
Subject: wikis consistency, grammar, wrapping

---
 docs/tutorials/wiki/definingmodels.rst | 25 +++++++++++--------------
 1 file changed, 11 insertions(+), 14 deletions(-)

(limited to 'docs/tutorials/wiki')

diff --git a/docs/tutorials/wiki/definingmodels.rst b/docs/tutorials/wiki/definingmodels.rst
index 49372179f..859e902ab 100644
--- a/docs/tutorials/wiki/definingmodels.rst
+++ b/docs/tutorials/wiki/definingmodels.rst
@@ -15,7 +15,7 @@ single instance of the "Wiki" class will serve as a container for "Page"
 objects, which will be instances of the "Page" class.
 
 
-Delete the Database
+Delete the database
 -------------------
 
 In the next step, we're going to remove the ``MyModel`` Python model
@@ -32,12 +32,19 @@ Edit ``models.py``
 
 .. note::
 
-  There is nothing automagically special about the filename ``models.py``.  A
+  There is nothing special about the filename ``models.py``.  A
   project may have many models throughout its codebase in arbitrarily named
-  files.  Files implementing models often have ``model`` in their filenames,
+  files.  Files implementing models often have ``model`` in their filenames
   or they may live in a Python subpackage of your application package named
   ``models``, but this is only by convention.
 
+Open ``tutorial/tutorial/models.py`` file and edit it to look like the
+following:
+
+.. literalinclude:: src/models/tutorial/models.py
+   :linenos:
+   :language: python
+
 The first thing we want to do is remove the ``MyModel`` class from the
 generated ``models.py`` file.  The ``MyModel`` class is only a sample and
 we're not going to use it.
@@ -70,17 +77,7 @@ front page) into the Wiki within the ``appmaker``.  This will provide
 :term:`traversal` a :term:`resource tree` to work against when it attempts to
 resolve URLs to resources.
 
-Look at the Result of Our Edits to ``models.py``
-------------------------------------------------
-
-The result of all of our edits to ``models.py`` will end up looking
-something like this:
-
-.. literalinclude:: src/models/tutorial/models.py
-   :linenos:
-   :language: python
-
-View the Application in a Browser
+View the application in a browser
 ---------------------------------
 
 We can't.  At this point, our system is in a "non-runnable" state; we'll need
-- 
cgit v1.2.3


From 1204f0f285daf28e08dbfbae683a0aa8f27bd205 Mon Sep 17 00:00:00 2001
From: Steve Piercy <web@stevepiercy.com>
Date: Mon, 25 May 2015 16:01:14 -0700
Subject: update static assets, mytemplate.pt, caps

---
 .../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
 .../wiki/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
 .../wiki/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 ++++---
 13 files changed, 215 insertions(+), 447 deletions(-)
 delete mode 100644 docs/tutorials/wiki/src/basiclayout/tutorial/static/favicon.ico
 delete mode 100644 docs/tutorials/wiki/src/basiclayout/tutorial/static/footerbg.png
 delete mode 100644 docs/tutorials/wiki/src/basiclayout/tutorial/static/headerbg.png
 delete mode 100644 docs/tutorials/wiki/src/basiclayout/tutorial/static/ie6.css
 delete mode 100644 docs/tutorials/wiki/src/basiclayout/tutorial/static/middlebg.png
 delete mode 100644 docs/tutorials/wiki/src/basiclayout/tutorial/static/pylons.css
 create mode 100644 docs/tutorials/wiki/src/basiclayout/tutorial/static/pyramid-16x16.png
 delete mode 100644 docs/tutorials/wiki/src/basiclayout/tutorial/static/pyramid-small.png
 create mode 100644 docs/tutorials/wiki/src/basiclayout/tutorial/static/theme.css
 create mode 100644 docs/tutorials/wiki/src/basiclayout/tutorial/static/theme.min.css
 delete mode 100644 docs/tutorials/wiki/src/basiclayout/tutorial/static/transparent.gif

(limited to 'docs/tutorials/wiki')

diff --git a/docs/tutorials/wiki/src/basiclayout/tutorial/static/favicon.ico b/docs/tutorials/wiki/src/basiclayout/tutorial/static/favicon.ico
deleted file mode 100644
index 71f837c9e..000000000
Binary files a/docs/tutorials/wiki/src/basiclayout/tutorial/static/favicon.ico and /dev/null differ
diff --git a/docs/tutorials/wiki/src/basiclayout/tutorial/static/footerbg.png b/docs/tutorials/wiki/src/basiclayout/tutorial/static/footerbg.png
deleted file mode 100644
index 1fbc873da..000000000
Binary files a/docs/tutorials/wiki/src/basiclayout/tutorial/static/footerbg.png and /dev/null differ
diff --git a/docs/tutorials/wiki/src/basiclayout/tutorial/static/headerbg.png b/docs/tutorials/wiki/src/basiclayout/tutorial/static/headerbg.png
deleted file mode 100644
index 0596f2020..000000000
Binary files a/docs/tutorials/wiki/src/basiclayout/tutorial/static/headerbg.png and /dev/null differ
diff --git a/docs/tutorials/wiki/src/basiclayout/tutorial/static/ie6.css b/docs/tutorials/wiki/src/basiclayout/tutorial/static/ie6.css
deleted file mode 100644
index b7c8493d8..000000000
--- a/docs/tutorials/wiki/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/wiki/src/basiclayout/tutorial/static/middlebg.png b/docs/tutorials/wiki/src/basiclayout/tutorial/static/middlebg.png
deleted file mode 100644
index 2369cfb7d..000000000
Binary files a/docs/tutorials/wiki/src/basiclayout/tutorial/static/middlebg.png and /dev/null differ
diff --git a/docs/tutorials/wiki/src/basiclayout/tutorial/static/pylons.css b/docs/tutorials/wiki/src/basiclayout/tutorial/static/pylons.css
deleted file mode 100644
index 4b1c017cd..000000000
--- a/docs/tutorials/wiki/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/wiki/src/basiclayout/tutorial/static/pyramid-16x16.png b/docs/tutorials/wiki/src/basiclayout/tutorial/static/pyramid-16x16.png
new file mode 100644
index 000000000..979203112
Binary files /dev/null and b/docs/tutorials/wiki/src/basiclayout/tutorial/static/pyramid-16x16.png differ
diff --git a/docs/tutorials/wiki/src/basiclayout/tutorial/static/pyramid-small.png b/docs/tutorials/wiki/src/basiclayout/tutorial/static/pyramid-small.png
deleted file mode 100644
index a5bc0ade7..000000000
Binary files a/docs/tutorials/wiki/src/basiclayout/tutorial/static/pyramid-small.png and /dev/null differ
diff --git a/docs/tutorials/wiki/src/basiclayout/tutorial/static/pyramid.png b/docs/tutorials/wiki/src/basiclayout/tutorial/static/pyramid.png
index 347e05549..4ab837be9 100644
Binary files a/docs/tutorials/wiki/src/basiclayout/tutorial/static/pyramid.png and b/docs/tutorials/wiki/src/basiclayout/tutorial/static/pyramid.png differ
diff --git a/docs/tutorials/wiki/src/basiclayout/tutorial/static/theme.css b/docs/tutorials/wiki/src/basiclayout/tutorial/static/theme.css
new file mode 100644
index 000000000..0f4b1a4d4
--- /dev/null
+++ b/docs/tutorials/wiki/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/wiki/src/basiclayout/tutorial/static/theme.min.css b/docs/tutorials/wiki/src/basiclayout/tutorial/static/theme.min.css
new file mode 100644
index 000000000..2f924bcc5
--- /dev/null
+++ b/docs/tutorials/wiki/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/wiki/src/basiclayout/tutorial/static/transparent.gif b/docs/tutorials/wiki/src/basiclayout/tutorial/static/transparent.gif
deleted file mode 100644
index 0341802e5..000000000
Binary files a/docs/tutorials/wiki/src/basiclayout/tutorial/static/transparent.gif and /dev/null differ
diff --git a/docs/tutorials/wiki/src/basiclayout/tutorial/templates/mytemplate.pt b/docs/tutorials/wiki/src/basiclayout/tutorial/templates/mytemplate.pt
index 13b41f823..29dacef19 100644
--- a/docs/tutorials/wiki/src/basiclayout/tutorial/templates/mytemplate.pt
+++ b/docs/tutorials/wiki/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="/static/favicon.ico" />
-  <link rel="stylesheet" href="/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" />
-  <!--[if lte IE 6]>
-  <link rel="stylesheet" href="/static/ie6.css" type="text/css" media="screen" charset="utf-8" />
-  <![endif]-->
-</head>
-<body>
-  <div id="wrap">
-    <div id="top">
-      <div class="top align-center">
-        <div><img src="/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>
+
+    <!-- Bootstrap core CSS -->
+    <link href="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
+
+    <!-- Custom styles for this scaffold -->
+    <link href="${request.static_url('tutorial:static/theme.css')}" rel="stylesheet">
+
+    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
+    <!--[if lt IE 9]>
+      <script src="//oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
+      <script src="//oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
+    <![endif]-->
+  </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">ZODB scaffold</span></h1>
+              <p class="lead">Welcome to <span class="font-normal">${project}</span>, an&nbsp;application generated&nbsp;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 &copy; Pylons Project
+          </div>
         </div>
       </div>
     </div>
-  </div>
-</body>
+
+
+    <!-- Bootstrap core JavaScript
+    ================================================== -->
+    <!-- Placed at the end of the document so the pages load faster -->
+    <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 8f0758a0a4ea5b9b4da25fe7ba8ca814ea7de66b Mon Sep 17 00:00:00 2001
From: Steve Piercy <web@stevepiercy.com>
Date: Mon, 25 May 2015 16:06:13 -0700
Subject: update template and static assets to current

---
 .../wiki/src/models/tutorial/static/favicon.ico    | Bin 1406 -> 0 bytes
 .../wiki/src/models/tutorial/static/footerbg.png   | Bin 333 -> 0 bytes
 .../wiki/src/models/tutorial/static/headerbg.png   | Bin 203 -> 0 bytes
 .../wiki/src/models/tutorial/static/ie6.css        |   8 -
 .../wiki/src/models/tutorial/static/middlebg.png   | Bin 2797 -> 0 bytes
 .../wiki/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
 .../wiki/src/models/tutorial/static/pyramid.png    | Bin 33055 -> 12901 bytes
 .../wiki/src/models/tutorial/static/theme.css      | 154 +++++++++
 .../wiki/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 ++++---
 13 files changed, 215 insertions(+), 447 deletions(-)
 delete mode 100644 docs/tutorials/wiki/src/models/tutorial/static/favicon.ico
 delete mode 100644 docs/tutorials/wiki/src/models/tutorial/static/footerbg.png
 delete mode 100644 docs/tutorials/wiki/src/models/tutorial/static/headerbg.png
 delete mode 100644 docs/tutorials/wiki/src/models/tutorial/static/ie6.css
 delete mode 100644 docs/tutorials/wiki/src/models/tutorial/static/middlebg.png
 delete mode 100644 docs/tutorials/wiki/src/models/tutorial/static/pylons.css
 create mode 100644 docs/tutorials/wiki/src/models/tutorial/static/pyramid-16x16.png
 delete mode 100644 docs/tutorials/wiki/src/models/tutorial/static/pyramid-small.png
 create mode 100644 docs/tutorials/wiki/src/models/tutorial/static/theme.css
 create mode 100644 docs/tutorials/wiki/src/models/tutorial/static/theme.min.css
 delete mode 100644 docs/tutorials/wiki/src/models/tutorial/static/transparent.gif

(limited to 'docs/tutorials/wiki')

diff --git a/docs/tutorials/wiki/src/models/tutorial/static/favicon.ico b/docs/tutorials/wiki/src/models/tutorial/static/favicon.ico
deleted file mode 100644
index 71f837c9e..000000000
Binary files a/docs/tutorials/wiki/src/models/tutorial/static/favicon.ico and /dev/null differ
diff --git a/docs/tutorials/wiki/src/models/tutorial/static/footerbg.png b/docs/tutorials/wiki/src/models/tutorial/static/footerbg.png
deleted file mode 100644
index 1fbc873da..000000000
Binary files a/docs/tutorials/wiki/src/models/tutorial/static/footerbg.png and /dev/null differ
diff --git a/docs/tutorials/wiki/src/models/tutorial/static/headerbg.png b/docs/tutorials/wiki/src/models/tutorial/static/headerbg.png
deleted file mode 100644
index 0596f2020..000000000
Binary files a/docs/tutorials/wiki/src/models/tutorial/static/headerbg.png and /dev/null differ
diff --git a/docs/tutorials/wiki/src/models/tutorial/static/ie6.css b/docs/tutorials/wiki/src/models/tutorial/static/ie6.css
deleted file mode 100644
index b7c8493d8..000000000
--- a/docs/tutorials/wiki/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/wiki/src/models/tutorial/static/middlebg.png b/docs/tutorials/wiki/src/models/tutorial/static/middlebg.png
deleted file mode 100644
index 2369cfb7d..000000000
Binary files a/docs/tutorials/wiki/src/models/tutorial/static/middlebg.png and /dev/null differ
diff --git a/docs/tutorials/wiki/src/models/tutorial/static/pylons.css b/docs/tutorials/wiki/src/models/tutorial/static/pylons.css
deleted file mode 100644
index 4b1c017cd..000000000
--- a/docs/tutorials/wiki/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/wiki/src/models/tutorial/static/pyramid-16x16.png b/docs/tutorials/wiki/src/models/tutorial/static/pyramid-16x16.png
new file mode 100644
index 000000000..979203112
Binary files /dev/null and b/docs/tutorials/wiki/src/models/tutorial/static/pyramid-16x16.png differ
diff --git a/docs/tutorials/wiki/src/models/tutorial/static/pyramid-small.png b/docs/tutorials/wiki/src/models/tutorial/static/pyramid-small.png
deleted file mode 100644
index a5bc0ade7..000000000
Binary files a/docs/tutorials/wiki/src/models/tutorial/static/pyramid-small.png and /dev/null differ
diff --git a/docs/tutorials/wiki/src/models/tutorial/static/pyramid.png b/docs/tutorials/wiki/src/models/tutorial/static/pyramid.png
index 347e05549..4ab837be9 100644
Binary files a/docs/tutorials/wiki/src/models/tutorial/static/pyramid.png and b/docs/tutorials/wiki/src/models/tutorial/static/pyramid.png differ
diff --git a/docs/tutorials/wiki/src/models/tutorial/static/theme.css b/docs/tutorials/wiki/src/models/tutorial/static/theme.css
new file mode 100644
index 000000000..0f4b1a4d4
--- /dev/null
+++ b/docs/tutorials/wiki/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/wiki/src/models/tutorial/static/theme.min.css b/docs/tutorials/wiki/src/models/tutorial/static/theme.min.css
new file mode 100644
index 000000000..2f924bcc5
--- /dev/null
+++ b/docs/tutorials/wiki/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/wiki/src/models/tutorial/static/transparent.gif b/docs/tutorials/wiki/src/models/tutorial/static/transparent.gif
deleted file mode 100644
index 0341802e5..000000000
Binary files a/docs/tutorials/wiki/src/models/tutorial/static/transparent.gif and /dev/null differ
diff --git a/docs/tutorials/wiki/src/models/tutorial/templates/mytemplate.pt b/docs/tutorials/wiki/src/models/tutorial/templates/mytemplate.pt
index 13b41f823..29dacef19 100644
--- a/docs/tutorials/wiki/src/models/tutorial/templates/mytemplate.pt
+++ b/docs/tutorials/wiki/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="/static/favicon.ico" />
-  <link rel="stylesheet" href="/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" />
-  <!--[if lte IE 6]>
-  <link rel="stylesheet" href="/static/ie6.css" type="text/css" media="screen" charset="utf-8" />
-  <![endif]-->
-</head>
-<body>
-  <div id="wrap">
-    <div id="top">
-      <div class="top align-center">
-        <div><img src="/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>
+
+    <!-- Bootstrap core CSS -->
+    <link href="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
+
+    <!-- Custom styles for this scaffold -->
+    <link href="${request.static_url('tutorial:static/theme.css')}" rel="stylesheet">
+
+    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
+    <!--[if lt IE 9]>
+      <script src="//oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
+      <script src="//oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
+    <![endif]-->
+  </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">ZODB scaffold</span></h1>
+              <p class="lead">Welcome to <span class="font-normal">${project}</span>, an&nbsp;application generated&nbsp;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 &copy; Pylons Project
+          </div>
         </div>
       </div>
     </div>
-  </div>
-</body>
+
+
+    <!-- Bootstrap core JavaScript
+    ================================================== -->
+    <!-- Placed at the end of the document so the pages load faster -->
+    <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 a940e1ccaa6c3ca81b1dec6ba2e505af9b792222 Mon Sep 17 00:00:00 2001
From: Steve Piercy <web@stevepiercy.com>
Date: Tue, 26 May 2015 13:12:01 -0700
Subject: - clean up and make defininingviews consistent between two wiki
 tutorials - sort imports to be consistent with scaffold setup.py - update
 templates, static assets

---
 docs/tutorials/wiki/definingviews.rst              | 289 +++++++++-------
 docs/tutorials/wiki/src/authorization/setup.py     |   4 +-
 .../authorization/tutorial/templates/mytemplate.pt | 127 ++++---
 docs/tutorials/wiki/src/basiclayout/setup.py       |   4 +-
 .../basiclayout/tutorial/templates/mytemplate.pt   |   2 +-
 docs/tutorials/wiki/src/models/setup.py            |   4 +-
 .../src/models/tutorial/templates/mytemplate.pt    |   2 +-
 docs/tutorials/wiki/src/tests/setup.py             |   4 +-
 .../src/tests/tutorial/templates/mytemplate.pt     | 127 ++++---
 docs/tutorials/wiki/src/views/setup.py             |   4 +-
 .../wiki/src/views/tutorial/static/favicon.ico     | Bin 1406 -> 0 bytes
 .../wiki/src/views/tutorial/static/footerbg.png    | Bin 333 -> 0 bytes
 .../wiki/src/views/tutorial/static/headerbg.png    | Bin 203 -> 0 bytes
 .../wiki/src/views/tutorial/static/ie6.css         |   8 -
 .../wiki/src/views/tutorial/static/middlebg.png    | Bin 2797 -> 0 bytes
 .../wiki/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
 .../wiki/src/views/tutorial/static/pyramid.png     | Bin 33055 -> 12901 bytes
 .../wiki/src/views/tutorial/static/theme.css       | 154 +++++++++
 .../wiki/src/views/tutorial/static/theme.min.css   |   1 +
 .../wiki/src/views/tutorial/static/transparent.gif | Bin 49 -> 0 bytes
 .../wiki/src/views/tutorial/templates/edit.pt      | 115 ++++---
 .../src/views/tutorial/templates/mytemplate.pt     | 130 ++++---
 .../wiki/src/views/tutorial/templates/view.pt      | 120 +++----
 25 files changed, 638 insertions(+), 829 deletions(-)
 delete mode 100644 docs/tutorials/wiki/src/views/tutorial/static/favicon.ico
 delete mode 100644 docs/tutorials/wiki/src/views/tutorial/static/footerbg.png
 delete mode 100644 docs/tutorials/wiki/src/views/tutorial/static/headerbg.png
 delete mode 100644 docs/tutorials/wiki/src/views/tutorial/static/ie6.css
 delete mode 100644 docs/tutorials/wiki/src/views/tutorial/static/middlebg.png
 delete mode 100644 docs/tutorials/wiki/src/views/tutorial/static/pylons.css
 create mode 100644 docs/tutorials/wiki/src/views/tutorial/static/pyramid-16x16.png
 delete mode 100644 docs/tutorials/wiki/src/views/tutorial/static/pyramid-small.png
 create mode 100644 docs/tutorials/wiki/src/views/tutorial/static/theme.css
 create mode 100644 docs/tutorials/wiki/src/views/tutorial/static/theme.min.css
 delete mode 100644 docs/tutorials/wiki/src/views/tutorial/static/transparent.gif

(limited to 'docs/tutorials/wiki')

diff --git a/docs/tutorials/wiki/definingviews.rst b/docs/tutorials/wiki/definingviews.rst
index e06468267..2ebddd4c8 100644
--- a/docs/tutorials/wiki/definingviews.rst
+++ b/docs/tutorials/wiki/definingviews.rst
@@ -17,7 +17,7 @@ assumed to return a :term:`response` object.
    interchangeably as necessary. In :term:`traversal` based applications,
    URLs are mapped to a context :term:`resource`, and since our
    :term:`resource tree` also represents our application's
-   "domain model", we're often interested in the context, because
+   "domain model", we're often interested in the context because
    it represents the persistent storage of our application.  For
    this reason, in this tutorial we define views as callables that
    accept ``context`` in the callable argument list.  If you do
@@ -35,35 +35,80 @@ Declaring Dependencies in Our ``setup.py`` File
 The view code in our application will depend on a package which is not a
 dependency of the original "tutorial" application.  The original "tutorial"
 application was generated by the ``pcreate`` command; it doesn't know
-about our custom application requirements.  We need to add a dependency on
-the ``docutils`` package to our ``tutorial`` package's ``setup.py`` file by
-assigning this dependency to the ``install_requires`` parameter in the
-``setup`` function.
+about our custom application requirements.
 
-Our resulting ``setup.py`` should look like so:
+We need to add a dependency on the ``docutils`` package to our ``tutorial``
+package's ``setup.py`` file by assigning this dependency to the ``requires``
+parameter in the ``setup()`` function.
+
+Open ``tutorial/setup.py`` and edit it to look like the following:
 
 .. literalinclude:: src/views/setup.py
    :linenos:
+   :emphasize-lines: 20
    :language: python
 
-.. note:: After these new dependencies are added, you will need to
-   rerun ``python setup.py develop`` inside the root of the
-   ``tutorial`` package to obtain and register the newly added
-   dependency package.
+Only the highlighted line needs to be added.
+
+Running ``setup.py develop``
+============================
+
+Since a new software dependency was added, you will need to run ``python
+setup.py develop`` again inside the root of the ``tutorial`` package to obtain
+and register the newly added dependency distribution.
+
+Make sure your current working directory is the root of the project (the
+directory in which ``setup.py`` lives) and execute the following command.
+
+On UNIX:
+
+.. code-block:: text
+
+   $ cd tutorial
+   $ $VENV/bin/python setup.py develop
+
+On Windows:
+
+.. code-block:: text
 
-Adding View Functions
-=====================
+   c:\pyramidtut> cd tutorial
+   c:\pyramidtut\tutorial> %VENV%\Scripts\python setup.py develop
+
+Success executing this command will end with a line to the console something
+like::
+
+   Finished processing dependencies for tutorial==0.0
+
+Adding view functions in ``views.py``
+=====================================
+
+It's time for a major change.  Open ``tutorial/tutorial/views.py`` and edit it
+to look like the following:
+
+.. literalinclude:: src/views/tutorial/views.py
+   :linenos:
+   :language: python
 
-We're going to add four :term:`view callable` functions to our ``views.py``
-module.  One view named ``view_wiki`` will display the wiki itself (it will
-answer on the root URL), another named ``view_page`` will display an
-individual page, another named ``add_page`` will allow a page to be added,
-and a final view named ``edit_page`` will allow a page to be edited.
+We added some imports and created a regular expression to find "WikiWords".
+
+We got rid of the ``my_view`` view function and its decorator that was added
+when we originally rendered the ``zodb`` scaffold.  It was only an example and
+isn't relevant to our application.
+
+Then we added four :term:`view callable` functions to our ``views.py``
+module: 
+
+* ``view_wiki()`` - Displays the wiki itself. It will answer on the root URL.
+* ``view_page()`` - Displays an individual page.
+* ``add_page()`` - Allows the user to add a page.
+* ``edit_page()`` - Allows the user to edit a page.
+
+We'll describe each one briefly in the following sections.
 
 .. note::
 
   There is nothing special about the filename ``views.py``.  A project may
-  have many view callables throughout its codebase in arbitrarily-named
+  have many view callables throughout its codebase in arbitrarily named
   files.  Files implementing view callables often have ``view`` in their
   filenames (or may live in a Python subpackage of your application package
   named ``views``), but this is only by convention.
@@ -71,44 +116,55 @@ and a final view named ``edit_page`` will allow a page to be edited.
 The ``view_wiki`` view function
 -------------------------------
 
-Here is the code for the ``view_wiki`` view function and its decorator, which
-will be added to ``views.py``:
+Following is the code for the ``view_wiki`` view function and its decorator:
 
 .. literalinclude:: src/views/tutorial/views.py
    :lines: 12-14
+   :lineno-start: 12
+   :linenos:
    :language: python
 
-The ``view_wiki`` function will be configured to respond as the default view
-callable for a Wiki resource.  We'll provide it with a ``@view_config``
-decorator which names the class ``tutorial.models.Wiki`` as its context.
-This means that when a Wiki resource is the context, and no :term:`view name`
-exists in the request, this view will be used.  The view configuration
-associated with ``view_wiki`` does not use a ``renderer`` because the view
-callable always returns a :term:`response` object rather than a dictionary.
-No renderer is necessary when a view returns a response object.
-
-The ``view_wiki`` view callable always redirects to the URL of a Page
-resource named "FrontPage".  To do so, it returns an instance of the
+.. note:: In our code, we use an *import* that is *relative* to our package
+    named ``tutorial``, meaning we can omit the name of the package in the
+    ``import`` and ``context`` statements. In our narrative, however, we refer
+    to a *class* and thus we use the *absolute* form, meaning that the name of
+    the package is included.
+
+``view_wiki()`` is the :term:`default view` that gets called when a request is
+made to the root URL of our wiki.  It always redirects to an URL which
+represents the path to our "FrontPage".
+
+We provide it with a ``@view_config`` decorator which names the class
+``tutorial.models.Wiki`` as its context. This means that when a Wiki resource
+is the context and no :term:`view name` exists in the request, then this view
+will be used.  The view configuration associated with ``view_wiki`` does not
+use a ``renderer`` because the view callable always returns a :term:`response`
+object rather than a dictionary. No renderer is necessary when a view returns
+a response object.
+
+The ``view_wiki`` view callable always redirects to the URL of a Page resource
+named "FrontPage".  To do so, it returns an instance of the
 :class:`pyramid.httpexceptions.HTTPFound` class (instances of which implement
-the :class:`pyramid.interfaces.IResponse` interface like
-:class:`pyramid.response.Response` does).
-:meth:`pyramid.request.Request.resource_url` constructs a URL to the
+the :class:`pyramid.interfaces.IResponse` interface, like
+:class:`pyramid.response.Response` does). It uses the
+:meth:`pyramid.request.Request.route_url` API to construct an URL to the
 ``FrontPage`` page resource (i.e., ``http://localhost:6543/FrontPage``), and
-uses it as the "location" of the HTTPFound response, forming an HTTP
+uses it as the "location" of the ``HTTPFound`` response, forming an HTTP
 redirect.
 
 The ``view_page`` view function
 -------------------------------
 
-Here is the code for the ``view_page`` view function and its decorator, which
-will be added to ``views.py``:
+Here is the code for the ``view_page`` view function and its decorator:
 
 .. literalinclude:: src/views/tutorial/views.py
    :lines: 16-33
+   :lineno-start: 16
+   :linenos:
    :language: python
 
-The ``view_page`` function will be configured to respond as the default view
-of a Page resource.  We'll provide it with a ``@view_config`` decorator which
+The ``view_page`` function is configured to respond as the default view
+of a Page resource.  We provide it with a ``@view_config`` decorator which
 names the class ``tutorial.models.Page`` as its context.  This means that
 when a Page resource is the context, and no :term:`view name` exists in the
 request, this view will be used.  We inform :app:`Pyramid` this view will use
@@ -116,9 +172,9 @@ the ``templates/view.pt`` template file as a ``renderer``.
 
 The ``view_page`` function generates the :term:`reStructuredText` body of a
 page (stored as the ``data`` attribute of the context passed to the view; the
-context will be a Page resource) as HTML.  Then it substitutes an HTML anchor
-for each *WikiWord* reference in the rendered HTML using a compiled regular
-expression.
+context will be a ``Page`` resource) as HTML.  Then it substitutes an HTML
+anchor for each *WikiWord* reference in the rendered HTML using a compiled
+regular expression.
 
 The curried function named ``check`` is used as the first argument to
 ``wikiwords.sub``, indicating that it should be called to provide a value for
@@ -133,8 +189,8 @@ As a result, the ``content`` variable is now a fully formed bit of HTML
 containing various view and add links for WikiWords based on the content of
 our current page resource.
 
-We then generate an edit URL (because it's easier to do here than in the
-template), and we wrap up a number of arguments in a dictionary and return
+We then generate an edit URL because it's easier to do here than in the
+template, and we wrap up a number of arguments in a dictionary and return
 it.
 
 The arguments we wrap into a dictionary include ``page``, ``content``, and
@@ -153,22 +209,23 @@ callable.  In the ``view_wiki`` view callable, we unconditionally return a
 The ``add_page`` view function
 ------------------------------
 
-Here is the code for the ``add_page`` view function and its decorator, which
-will be added to ``views.py``:
+Here is the code for the ``add_page`` view function and its decorator:
 
 .. literalinclude:: src/views/tutorial/views.py
    :lines: 35-50
+   :lineno-start: 35
+   :linenos:
    :language: python
 
-The ``add_page`` function will be configured to respond when the context
-resource is a Wiki and the :term:`view name` is ``add_page``.  We'll provide
-it with a ``@view_config`` decorator which names the string ``add_page`` as
-its :term:`view name` (via name=), the class ``tutorial.models.Wiki`` as its
-context, and the renderer named ``templates/edit.pt``.  This means that when
-a Wiki resource is the context, and a :term:`view name` named ``add_page``
+The ``add_page`` function is configured to respond when the context resource
+is a Wiki and the :term:`view name` is ``add_page``.  We provide it with a
+``@view_config`` decorator which names the string ``add_page`` as its
+:term:`view name` (via ``name=``), the class ``tutorial.models.Wiki`` as its
+context, and the renderer named ``templates/edit.pt``.  This means that when a
+Wiki resource is the context, and a :term:`view name` named ``add_page``
 exists as the result of traversal, this view will be used.  We inform
-:app:`Pyramid` this view will use the ``templates/edit.pt`` template file as
-a ``renderer``.  We share the same template between add and edit views, thus
+:app:`Pyramid` this view will use the ``templates/edit.pt`` template file as a
+``renderer``.  We share the same template between add and edit views, thus
 ``edit.pt`` instead of ``add.pt``.
 
 The ``add_page`` function will be invoked when a user clicks on a WikiWord
@@ -181,7 +238,7 @@ Page resource).
 The request :term:`subpath` in :app:`Pyramid` is the sequence of names that
 are found *after* the :term:`view name` in the URL segments given in the
 ``PATH_INFO`` of the WSGI request as the result of :term:`traversal`.  If our
-add view is invoked via, e.g. ``http://localhost:6543/add_page/SomeName``,
+add view is invoked via, e.g., ``http://localhost:6543/add_page/SomeName``,
 the :term:`subpath` will be a tuple: ``('SomeName',)``.
 
 The add view takes the zeroth element of the subpath (the wiki page name),
@@ -198,7 +255,7 @@ order to satisfy the edit form's desire to have *some* page object exposed as
 ``page``, and we'll render the template to a response.
 
 If the view rendering *is* a result of a form submission (if the expression
-``'form.submitted' in request.params`` is ``True``), we scrape the page body
+``'form.submitted' in request.params`` is ``True``), we grab the page body
 from the form data, create a Page object using the name in the subpath and
 the page body, and save it into "our context" (the Wiki) using the
 ``__setitem__`` method of the context. We then redirect back to the
@@ -207,15 +264,16 @@ the page body, and save it into "our context" (the Wiki) using the
 The ``edit_page`` view function
 -------------------------------
 
-Here is the code for the ``edit_page`` view function and its decorator, which
-will be added to ``views.py``:
+Here is the code for the ``edit_page`` view function and its decorator:
 
 .. literalinclude:: src/views/tutorial/views.py
    :lines: 52-60
+   :lineno-start: 52
+   :linenos:
    :language: python
 
-The ``edit_page`` function will be configured to respond when the context is
-a Page resource and the :term:`view name` is ``edit_page``.  We'll provide it
+The ``edit_page`` function is configured to respond when the context is
+a Page resource and the :term:`view name` is ``edit_page``.  We provide it
 with a ``@view_config`` decorator which names the string ``edit_page`` as its
 :term:`view name` (via ``name=``), the class ``tutorial.models.Page`` as its
 context, and the renderer named ``templates/edit.pt``.  This means that when
@@ -240,26 +298,16 @@ If the view execution *is* a result of a form submission (if the expression
 attribute of the page context.  It then redirects to the default view of the
 context (the page), which will always be the ``view_page`` view.
 
-Viewing the Result of all Our Edits to ``views.py``
-===================================================
-
-The result of all of our edits to ``views.py`` will leave it looking like
-this:
-
-.. literalinclude:: src/views/tutorial/views.py
-   :linenos:
-   :language: python
-
-Adding Templates
+Adding templates
 ================
 
 The ``view_page``, ``add_page`` and ``edit_page`` views that we've added
-reference a :term:`template`.  Each template is a :term:`Chameleon` :term:`ZPT`
-template.  These templates will live in the ``templates`` directory of our
-tutorial package.  Chameleon templates must have a ``.pt`` extension to be
-recognized as such.
+reference a :term:`template`.  Each template is a :term:`Chameleon`
+:term:`ZPT` template.  These templates will live in the ``templates``
+directory of our tutorial package.  Chameleon templates must have a ``.pt``
+extension to be recognized as such.
 
-The ``view.pt`` Template
+The ``view.pt`` template
 ------------------------
 
 Create ``tutorial/tutorial/templates/view.pt`` and add the following
@@ -267,20 +315,18 @@ content:
 
 .. literalinclude:: src/views/tutorial/templates/view.pt
    :linenos:
-   :language: xml
+   :language: html
 
 This template is used by ``view_page()`` for displaying a single
 wiki page. It includes:
 
-- A ``div`` element that is replaced with the ``content``
-  value provided by the view (rows 45-47).  ``content``
-  contains HTML, so the ``structure`` keyword is used
-  to prevent escaping it (i.e. changing ">" to "&gt;", etc.)
-- A link that points
-  at the "edit" URL which invokes the ``edit_page`` view for
-  the page being viewed (rows 49-51).
+- A ``div`` element that is replaced with the ``content`` value provided by
+  the view (lines 36-38).  ``content`` contains HTML, so the ``structure``
+  keyword is used to prevent escaping it (i.e., changing ">" to "&gt;", etc.)
+- A link that points at the "edit" URL which invokes the ``edit_page`` view
+  for the page being viewed (lines 40-42).
 
-The ``edit.pt`` Template
+The ``edit.pt`` template
 ------------------------
 
 Create ``tutorial/tutorial/templates/edit.pt`` and add the following
@@ -288,66 +334,59 @@ content:
 
 .. literalinclude:: src/views/tutorial/templates/edit.pt
    :linenos:
-   :language: xml
+   :language: html
 
-This template is used by ``add_page()`` and ``edit_page()`` for adding
-and editing a wiki page.  It displays
-a page containing a form that includes:
+This template is used by ``add_page()`` and ``edit_page()`` for adding and
+editing a wiki page.  It displays a page containing a form that includes:
 
 - A 10 row by 60 column ``textarea`` field named ``body`` that is filled
-  with any existing page data when it is rendered (rows 46-47).
-- A submit button that has the name ``form.submitted`` (row 48).
+  with any existing page data when it is rendered (line 45).
+- A submit button that has the name ``form.submitted`` (line 48).
 
-The form POSTs back to the "save_url" argument supplied
-by the view (row 45).  The view will use the ``body`` and
-``form.submitted`` values.
+The form POSTs back to the ``save_url`` argument supplied by the view (line
+43).  The view will use the ``body`` and ``form.submitted`` values.
 
-.. note:: Our templates use a ``request`` object that
-   none of our tutorial views return in their dictionary.
-   ``request`` is one of several
-   names that are available "by default" in a template when a template
-   renderer is used.  See :ref:`renderer_system_values` for
-   information about other names that are available by default
-   when a template is used as a renderer.
+.. note:: Our templates use a ``request`` object that none of our tutorial
+   views return in their dictionary. ``request`` is one of several names that
+   are available "by default" in a template when a template renderer is used.
+   See :ref:`renderer_system_values` for information about other names that
+   are available by default when a template is used as a renderer.
 
 Static Assets
 -------------
 
-Our templates name a single static asset named ``pylons.css``.  We don't need
-to create this file within our package's ``static`` directory because it was
-provided at the time we created the project. This file is a little too long to
-replicate within the body of this guide, however it is available `online
-<https://github.com/Pylons/pyramid/blob/master/docs/tutorials/wiki/src/views/tutorial/static/pylons.css>`_.
+Our templates name static assets, including CSS and images.  We don't need
+to create these files within our package's ``static`` directory because they
+were provided at the time we created the project.
 
-This CSS file will be accessed via
-e.g. ``/static/pylons.css`` by virtue of the call to
+As an example, the CSS file will be accessed via
+``http://localhost:6543/static/theme.css`` by virtue of the call to the
 ``add_static_view`` directive we've made in the ``__init__.py`` file.  Any
 number and type of static assets can be placed in this directory (or
-subdirectories) and are just referred to by URL.
+subdirectories) and are just referred to by URL or by using the convenience
+method ``static_url``, e.g.,
+``request.static_url('<package>:static/foo.css')`` within templates.
 
 Viewing the Application in a Browser
 ====================================
 
 We can finally examine our application in a browser (See
 :ref:`wiki-start-the-application`).  Launch a browser and visit
-each of the following URLs, check that the result is as expected:
+each of the following URLs, checking that the result is as expected:
 
-- ``http://localhost:6543/`` invokes the ``view_wiki``
-  view.  This always redirects to the ``view_page`` view of the ``FrontPage``
-  Page resource.
+- ``http://localhost:6543/`` invokes the ``view_wiki`` view.  This always
+  redirects to the ``view_page`` view of the ``FrontPage`` Page resource.
 
-- ``http://localhost:6543/FrontPage/`` invokes
-  the ``view_page`` view of the front page resource.  This is
-  because it's the :term:`default view` (a view without a ``name``) for Page
-  resources.
+- ``http://localhost:6543/FrontPage/`` invokes the ``view_page`` view of the
+  front page resource.  This is because it's the :term:`default view` (a view
+  without a ``name``) for Page resources.
 
-- ``http://localhost:6543/FrontPage/edit_page``
-  invokes the edit view for the ``FrontPage`` Page resource.
+- ``http://localhost:6543/FrontPage/edit_page`` invokes the edit view for the
+  ``FrontPage`` Page resource.
 
-- ``http://localhost:6543/add_page/SomePageName``
-  invokes the add view for a Page.
+- ``http://localhost:6543/add_page/SomePageName`` invokes the add view for a
+  Page.
 
-- To generate an error, visit ``http://localhost:6543/add_page`` which
-  will generate an ``IndexErrorr: tuple index out of range`` error.
-  You'll see an interactive traceback
-  facility provided by :term:`pyramid_debugtoolbar`.
+- To generate an error, visit ``http://localhost:6543/add_page`` which will
+  generate an ``IndexErrorr: tuple index out of range`` error. You'll see an
+  interactive traceback facility provided by :term:`pyramid_debugtoolbar`.
diff --git a/docs/tutorials/wiki/src/authorization/setup.py b/docs/tutorials/wiki/src/authorization/setup.py
index 5ab4f73cd..e2e96379d 100644
--- a/docs/tutorials/wiki/src/authorization/setup.py
+++ b/docs/tutorials/wiki/src/authorization/setup.py
@@ -11,10 +11,10 @@ with open(os.path.join(here, 'CHANGES.txt')) as f:
 requires = [
     'pyramid',
     'pyramid_chameleon',
+    'pyramid_debugtoolbar',
+    'pyramid_tm',
     'pyramid_zodbconn',
     'transaction',
-    'pyramid_tm',
-    'pyramid_debugtoolbar',
     'ZODB3',
     'waitress',
     'docutils',
diff --git a/docs/tutorials/wiki/src/authorization/tutorial/templates/mytemplate.pt b/docs/tutorials/wiki/src/authorization/tutorial/templates/mytemplate.pt
index 13b41f823..1b30f42b6 100644
--- a/docs/tutorials/wiki/src/authorization/tutorial/templates/mytemplate.pt
+++ b/docs/tutorials/wiki/src/authorization/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="/static/favicon.ico" />
-  <link rel="stylesheet" href="/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" />
-  <!--[if lte IE 6]>
-  <link rel="stylesheet" href="/static/ie6.css" type="text/css" media="screen" charset="utf-8" />
-  <![endif]-->
-</head>
-<body>
-  <div id="wrap">
-    <div id="top">
-      <div class="top align-center">
-        <div><img src="/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>ZODB Scaffold for The Pyramid Web Framework</title>
+
+    <!-- Bootstrap core CSS -->
+    <link href="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
+
+    <!-- Custom styles for this scaffold -->
+    <link href="${request.static_url('tutorial:static/theme.css')}" rel="stylesheet">
+
+    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
+    <!--[if lt IE 9]>
+      <script src="//oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
+      <script src="//oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
+    <![endif]-->
+  </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">ZODB scaffold</span></h1>
+              <p class="lead">Welcome to <span class="font-normal">${project}</span>, an&nbsp;application generated&nbsp;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 &copy; Pylons Project
+          </div>
         </div>
       </div>
     </div>
-  </div>
-</body>
+
+
+    <!-- Bootstrap core JavaScript
+    ================================================== -->
+    <!-- Placed at the end of the document so the pages load faster -->
+    <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/wiki/src/basiclayout/setup.py b/docs/tutorials/wiki/src/basiclayout/setup.py
index da79881ab..58a454f80 100644
--- a/docs/tutorials/wiki/src/basiclayout/setup.py
+++ b/docs/tutorials/wiki/src/basiclayout/setup.py
@@ -11,10 +11,10 @@ with open(os.path.join(here, 'CHANGES.txt')) as f:
 requires = [
     'pyramid',
     'pyramid_chameleon',
+    'pyramid_debugtoolbar',
+    'pyramid_tm',
     'pyramid_zodbconn',
     'transaction',
-    'pyramid_tm',
-    'pyramid_debugtoolbar',
     'ZODB3',
     'waitress',
     ]
diff --git a/docs/tutorials/wiki/src/basiclayout/tutorial/templates/mytemplate.pt b/docs/tutorials/wiki/src/basiclayout/tutorial/templates/mytemplate.pt
index 29dacef19..1b30f42b6 100644
--- a/docs/tutorials/wiki/src/basiclayout/tutorial/templates/mytemplate.pt
+++ b/docs/tutorials/wiki/src/basiclayout/tutorial/templates/mytemplate.pt
@@ -8,7 +8,7 @@
     <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>
+    <title>ZODB Scaffold for The Pyramid Web Framework</title>
 
     <!-- Bootstrap core CSS -->
     <link href="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
diff --git a/docs/tutorials/wiki/src/models/setup.py b/docs/tutorials/wiki/src/models/setup.py
index da79881ab..58a454f80 100644
--- a/docs/tutorials/wiki/src/models/setup.py
+++ b/docs/tutorials/wiki/src/models/setup.py
@@ -11,10 +11,10 @@ with open(os.path.join(here, 'CHANGES.txt')) as f:
 requires = [
     'pyramid',
     'pyramid_chameleon',
+    'pyramid_debugtoolbar',
+    'pyramid_tm',
     'pyramid_zodbconn',
     'transaction',
-    'pyramid_tm',
-    'pyramid_debugtoolbar',
     'ZODB3',
     'waitress',
     ]
diff --git a/docs/tutorials/wiki/src/models/tutorial/templates/mytemplate.pt b/docs/tutorials/wiki/src/models/tutorial/templates/mytemplate.pt
index 29dacef19..1b30f42b6 100644
--- a/docs/tutorials/wiki/src/models/tutorial/templates/mytemplate.pt
+++ b/docs/tutorials/wiki/src/models/tutorial/templates/mytemplate.pt
@@ -8,7 +8,7 @@
     <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>
+    <title>ZODB Scaffold for The Pyramid Web Framework</title>
 
     <!-- Bootstrap core CSS -->
     <link href="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
diff --git a/docs/tutorials/wiki/src/tests/setup.py b/docs/tutorials/wiki/src/tests/setup.py
index 2e7ed2398..b67b702cf 100644
--- a/docs/tutorials/wiki/src/tests/setup.py
+++ b/docs/tutorials/wiki/src/tests/setup.py
@@ -11,10 +11,10 @@ with open(os.path.join(here, 'CHANGES.txt')) as f:
 requires = [
     'pyramid',
     'pyramid_chameleon',
+    'pyramid_debugtoolbar',
+    'pyramid_tm',
     'pyramid_zodbconn',
     'transaction',
-    'pyramid_tm',
-    'pyramid_debugtoolbar',
     'ZODB3',
     'waitress',
     'docutils',
diff --git a/docs/tutorials/wiki/src/tests/tutorial/templates/mytemplate.pt b/docs/tutorials/wiki/src/tests/tutorial/templates/mytemplate.pt
index 13b41f823..1b30f42b6 100644
--- a/docs/tutorials/wiki/src/tests/tutorial/templates/mytemplate.pt
+++ b/docs/tutorials/wiki/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="/static/favicon.ico" />
-  <link rel="stylesheet" href="/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" />
-  <!--[if lte IE 6]>
-  <link rel="stylesheet" href="/static/ie6.css" type="text/css" media="screen" charset="utf-8" />
-  <![endif]-->
-</head>
-<body>
-  <div id="wrap">
-    <div id="top">
-      <div class="top align-center">
-        <div><img src="/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>ZODB Scaffold for The Pyramid Web Framework</title>
+
+    <!-- Bootstrap core CSS -->
+    <link href="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
+
+    <!-- Custom styles for this scaffold -->
+    <link href="${request.static_url('tutorial:static/theme.css')}" rel="stylesheet">
+
+    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
+    <!--[if lt IE 9]>
+      <script src="//oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
+      <script src="//oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
+    <![endif]-->
+  </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">ZODB scaffold</span></h1>
+              <p class="lead">Welcome to <span class="font-normal">${project}</span>, an&nbsp;application generated&nbsp;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 &copy; Pylons Project
+          </div>
         </div>
       </div>
     </div>
-  </div>
-</body>
+
+
+    <!-- Bootstrap core JavaScript
+    ================================================== -->
+    <!-- Placed at the end of the document so the pages load faster -->
+    <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/wiki/src/views/setup.py b/docs/tutorials/wiki/src/views/setup.py
index 5ab4f73cd..e2e96379d 100644
--- a/docs/tutorials/wiki/src/views/setup.py
+++ b/docs/tutorials/wiki/src/views/setup.py
@@ -11,10 +11,10 @@ with open(os.path.join(here, 'CHANGES.txt')) as f:
 requires = [
     'pyramid',
     'pyramid_chameleon',
+    'pyramid_debugtoolbar',
+    'pyramid_tm',
     'pyramid_zodbconn',
     'transaction',
-    'pyramid_tm',
-    'pyramid_debugtoolbar',
     'ZODB3',
     'waitress',
     'docutils',
diff --git a/docs/tutorials/wiki/src/views/tutorial/static/favicon.ico b/docs/tutorials/wiki/src/views/tutorial/static/favicon.ico
deleted file mode 100644
index 71f837c9e..000000000
Binary files a/docs/tutorials/wiki/src/views/tutorial/static/favicon.ico and /dev/null differ
diff --git a/docs/tutorials/wiki/src/views/tutorial/static/footerbg.png b/docs/tutorials/wiki/src/views/tutorial/static/footerbg.png
deleted file mode 100644
index 1fbc873da..000000000
Binary files a/docs/tutorials/wiki/src/views/tutorial/static/footerbg.png and /dev/null differ
diff --git a/docs/tutorials/wiki/src/views/tutorial/static/headerbg.png b/docs/tutorials/wiki/src/views/tutorial/static/headerbg.png
deleted file mode 100644
index 0596f2020..000000000
Binary files a/docs/tutorials/wiki/src/views/tutorial/static/headerbg.png and /dev/null differ
diff --git a/docs/tutorials/wiki/src/views/tutorial/static/ie6.css b/docs/tutorials/wiki/src/views/tutorial/static/ie6.css
deleted file mode 100644
index b7c8493d8..000000000
--- a/docs/tutorials/wiki/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/wiki/src/views/tutorial/static/middlebg.png b/docs/tutorials/wiki/src/views/tutorial/static/middlebg.png
deleted file mode 100644
index 2369cfb7d..000000000
Binary files a/docs/tutorials/wiki/src/views/tutorial/static/middlebg.png and /dev/null differ
diff --git a/docs/tutorials/wiki/src/views/tutorial/static/pylons.css b/docs/tutorials/wiki/src/views/tutorial/static/pylons.css
deleted file mode 100644
index 4b1c017cd..000000000
--- a/docs/tutorials/wiki/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/wiki/src/views/tutorial/static/pyramid-16x16.png b/docs/tutorials/wiki/src/views/tutorial/static/pyramid-16x16.png
new file mode 100644
index 000000000..979203112
Binary files /dev/null and b/docs/tutorials/wiki/src/views/tutorial/static/pyramid-16x16.png differ
diff --git a/docs/tutorials/wiki/src/views/tutorial/static/pyramid-small.png b/docs/tutorials/wiki/src/views/tutorial/static/pyramid-small.png
deleted file mode 100644
index a5bc0ade7..000000000
Binary files a/docs/tutorials/wiki/src/views/tutorial/static/pyramid-small.png and /dev/null differ
diff --git a/docs/tutorials/wiki/src/views/tutorial/static/pyramid.png b/docs/tutorials/wiki/src/views/tutorial/static/pyramid.png
index 347e05549..4ab837be9 100644
Binary files a/docs/tutorials/wiki/src/views/tutorial/static/pyramid.png and b/docs/tutorials/wiki/src/views/tutorial/static/pyramid.png differ
diff --git a/docs/tutorials/wiki/src/views/tutorial/static/theme.css b/docs/tutorials/wiki/src/views/tutorial/static/theme.css
new file mode 100644
index 000000000..0f4b1a4d4
--- /dev/null
+++ b/docs/tutorials/wiki/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/wiki/src/views/tutorial/static/theme.min.css b/docs/tutorials/wiki/src/views/tutorial/static/theme.min.css
new file mode 100644
index 000000000..2f924bcc5
--- /dev/null
+++ b/docs/tutorials/wiki/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{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/wiki/src/views/tutorial/static/transparent.gif b/docs/tutorials/wiki/src/views/tutorial/static/transparent.gif
deleted file mode 100644
index 0341802e5..000000000
Binary files a/docs/tutorials/wiki/src/views/tutorial/static/transparent.gif and /dev/null differ
diff --git a/docs/tutorials/wiki/src/views/tutorial/templates/edit.pt b/docs/tutorials/wiki/src/views/tutorial/templates/edit.pt
index 24ed2e592..b23f45d56 100644
--- a/docs/tutorials/wiki/src/views/tutorial/templates/edit.pt
+++ b/docs/tutorials/wiki/src/views/tutorial/templates/edit.pt
@@ -1,58 +1,69 @@
-<!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="/static/favicon.ico" />
-  <link rel="stylesheet"
-        href="/static/pylons.css"
-        type="text/css" media="screen" charset="utf-8" />
-  <!--[if lte IE 6]>
-  <link rel="stylesheet"
-        href="/static/ie6.css"
-        type="text/css" media="screen" charset="utf-8" />
-  <![endif]-->
-</head>
-<body>
-  <div id="wrap">
-    <div id="top-small">
-      <div class="top-small align-center">
-        <div>
-          <img width="220" height="50" alt="pyramid"
-        src="/static/pyramid-small.png" />
+
+    <!-- Bootstrap core CSS -->
+    <link href="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
+
+    <!-- Custom styles for this scaffold -->
+    <link href="${request.static_url('tutorial:static/theme.css')}" rel="stylesheet">
+
+    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
+    <!--[if lt IE 9]>
+      <script src="//oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
+      <script src="//oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
+    <![endif]-->
+  </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"></textarea>
+                </div>
+                <div class="form-group">
+                  <button type="submit" name="form.submitted" value="Save" class="btn btn-default">Save</button>
+                </div>
+              </form>
+            </div>
+          </div>
         </div>
-      </div>
-    </div>
-    <div id="middle">
-      <div class="middle align-right">
-        <div id="left" class="app-welcome align-left">
-          Editing <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 class="row">
+          <div class="copyright">
+            Copyright &copy; Pylons Project
+          </div>
         </div>
-        <div id="right" class="app-welcome align-right"></div>
-      </div>
-    </div>
-    <div id="bottom">
-      <div class="bottom">
-        <form action="${save_url}" method="post">
-          <textarea name="body" tal:content="page.data" rows="10"
-                    cols="60"/><br/>
-          <input type="submit" name="form.submitted" value="Save"/>
-        </form>
       </div>
     </div>
-  </div>
-  <div id="footer">
-    <div class="footer"
-         >&copy; Copyright 2008-2011, Agendaless Consulting.</div>
-  </div>
-</body>
+
+
+    <!-- Bootstrap core JavaScript
+    ================================================== -->
+    <!-- Placed at the end of the document so the pages load faster -->
+    <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/wiki/src/views/tutorial/templates/mytemplate.pt b/docs/tutorials/wiki/src/views/tutorial/templates/mytemplate.pt
index 50102aa20..1b30f42b6 100644
--- a/docs/tutorials/wiki/src/views/tutorial/templates/mytemplate.pt
+++ b/docs/tutorials/wiki/src/views/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="/static/favicon.ico" />
-  <link rel="stylesheet" href="/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" />
-  <!--[if lte IE 6]>
-  <link rel="stylesheet" href="/static/ie6.css" type="text/css" media="screen" charset="utf-8" />
-  <![endif]-->
-</head>
-<body>
-  <div id="wrap">
-    <div id="top">
-      <div class="top align-center">
-        <div><img src="/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>ZODB Scaffold for The Pyramid Web Framework</title>
+
+    <!-- Bootstrap core CSS -->
+    <link href="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
+
+    <!-- Custom styles for this scaffold -->
+    <link href="${request.static_url('tutorial:static/theme.css')}" rel="stylesheet">
+
+    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
+    <!--[if lt IE 9]>
+      <script src="//oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
+      <script src="//oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
+    <![endif]-->
+  </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">ZODB scaffold</span></h1>
+              <p class="lead">Welcome to <span class="font-normal">${project}</span>, an&nbsp;application generated&nbsp;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 &copy; Pylons Project
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <div id="footer">
-    <div class="footer">&copy; Copyright 2008-2012, Agendaless Consulting.</div>
-  </div>
-</body>
+
+
+    <!-- Bootstrap core JavaScript
+    ================================================== -->
+    <!-- Placed at the end of the document so the pages load faster -->
+    <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/wiki/src/views/tutorial/templates/view.pt b/docs/tutorials/wiki/src/views/tutorial/templates/view.pt
index 424c4302a..e7b0dc23e 100644
--- a/docs/tutorials/wiki/src/views/tutorial/templates/view.pt
+++ b/docs/tutorials/wiki/src/views/tutorial/templates/view.pt
@@ -1,61 +1,69 @@
-<!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
-      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="/static/favicon.ico" />
-  <link rel="stylesheet"
-        href="/static/pylons.css"
-        type="text/css" media="screen" charset="utf-8" />
-  <!--[if lte IE 6]>
-  <link rel="stylesheet"
-        href="/static/ie6.css"
-        type="text/css" media="screen" charset="utf-8" />
-  <![endif]-->
-</head>
-<body>
-  <div id="wrap">
-    <div id="top-small">
-      <div class="top-small align-center">
-        <div>
-          <img width="220" height="50" alt="pyramid"
-        src="/static/pyramid-small.png" />
+<!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>
+
+    <!-- Bootstrap core CSS -->
+    <link href="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
+
+    <!-- Custom styles for this scaffold -->
+    <link href="${request.static_url('tutorial:static/theme.css')}" rel="stylesheet">
+
+    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
+    <!--[if lt IE 9]>
+      <script src="//oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
+      <script src="//oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
+    <![endif]-->
+  </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 &copy; 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"
-         >&copy; Copyright 2008-2011, Agendaless Consulting.</div>
-  </div>
-</body>
+
+
+    <!-- Bootstrap core JavaScript
+    ================================================== -->
+    <!-- Placed at the end of the document so the pages load faster -->
+    <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 5f375c7603c0e240a60b884bf0ef39352c25c879 Mon Sep 17 00:00:00 2001
From: Steve Piercy <web@stevepiercy.com>
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/wiki/authorization.rst              | 370 ++++++++++----------
 .../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
 .../wiki/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   | 120 ++++---
 .../src/authorization/tutorial/templates/login.pt  | 118 ++++---
 .../src/authorization/tutorial/templates/view.pt   | 121 ++++---
 16 files changed, 539 insertions(+), 725 deletions(-)
 delete mode 100644 docs/tutorials/wiki/src/authorization/tutorial/static/favicon.ico
 delete mode 100644 docs/tutorials/wiki/src/authorization/tutorial/static/footerbg.png
 delete mode 100644 docs/tutorials/wiki/src/authorization/tutorial/static/headerbg.png
 delete mode 100644 docs/tutorials/wiki/src/authorization/tutorial/static/ie6.css
 delete mode 100644 docs/tutorials/wiki/src/authorization/tutorial/static/middlebg.png
 delete mode 100644 docs/tutorials/wiki/src/authorization/tutorial/static/pylons.css
 create mode 100644 docs/tutorials/wiki/src/authorization/tutorial/static/pyramid-16x16.png
 delete mode 100644 docs/tutorials/wiki/src/authorization/tutorial/static/pyramid-small.png
 create mode 100644 docs/tutorials/wiki/src/authorization/tutorial/static/theme.css
 create mode 100644 docs/tutorials/wiki/src/authorization/tutorial/static/theme.min.css
 delete mode 100644 docs/tutorials/wiki/src/authorization/tutorial/static/transparent.gif

(limited to 'docs/tutorials/wiki')

diff --git a/docs/tutorials/wiki/authorization.rst b/docs/tutorials/wiki/authorization.rst
index 6c98b6f3a..161e251bc 100644
--- a/docs/tutorials/wiki/authorization.rst
+++ b/docs/tutorials/wiki/authorization.rst
@@ -1,19 +1,20 @@
+.. _wiki_adding_authorization:
+
 ====================
-Adding Authorization
+Adding authorization
 ====================
 
 :app:`Pyramid` provides facilities for :term:`authentication` and
-:term:`authorization`.  We'll make use of both features to provide security
-to our application.  Our application currently allows anyone with access to
-the server to view, edit, and add pages to our wiki.  We'll change that
-to allow only people who are members of a *group* named ``group:editors``
-to add and edit wiki pages but we'll continue allowing
-anyone with access to the server to view pages.
-
-We will also add a login page and a logout link on all the
-pages.  The login page will be shown when a user is denied
-access to any of the views that require a permission, instead of
-a default "403 Forbidden" page.
+::term:`authorization`.  We'll make use of both features to provide security
+:to our application.  Our application currently allows anyone with access to
+:the server to view, edit, and add pages to our wiki.  We'll change that to
+:allow only people who are members of a *group* named ``group:editors`` to add
+:and edit wiki pages but we'll continue allowing anyone with access to the
+:server to view pages.
+
+We will also add a login page and a logout link on all the pages.  The login
+page will be shown when a user is denied access to any of the views that
+require permission, instead of a default "403 Forbidden" page.
 
 We will implement the access control with the following steps:
 
@@ -28,12 +29,13 @@ Then we will add the login and logout feature:
 
 * Add ``login`` and ``logout`` views (``views.py``).
 * Add a login template (``login.pt``).
-* Make the existing views return a ``logged_in`` flag to the renderer (``views.py``).
+* Make the existing views return a ``logged_in`` flag to the renderer
+  (``views.py``).
 * Add a "Logout" link to be shown when logged in and viewing or editing a page
   (``view.pt``, ``edit.pt``).
 
 
-Access Control
+Access control
 --------------
 
 Add users and groups
@@ -49,11 +51,9 @@ following content:
 The ``groupfinder`` function accepts a userid and a request and
 returns one of these values:
 
-- If the userid exists in the system, it will return a
-  sequence of group identifiers (or an empty sequence if the user
-  isn't a member of any groups).
-- If the userid *does not* exist in the system, it will
-  return ``None``.
+- If the userid exists in the system, it will return a sequence of group
+  identifiers (or an empty sequence if the user isn't a member of any groups).
+- If the userid *does not* exist in the system, it will return ``None``.
 
 For example, ``groupfinder('editor', request )`` returns ``['group:editor']``,
 ``groupfinder('viewer', request)`` returns ``[]``, and ``groupfinder('admin',
@@ -61,9 +61,8 @@ request)`` returns ``None``.  We will use ``groupfinder()`` as an
 :term:`authentication policy` "callback" that will provide the
 :term:`principal` or principals for a user.
 
-In a production system, user and group
-data will most often come from a database, but here we use "dummy"
-data to represent user and groups sources.
+In a production system, user and group data will most often come from a
+database, but here we use "dummy" data to represent user and groups sources.
 
 Add an ACL
 ~~~~~~~~~~
@@ -81,44 +80,42 @@ Add the following lines to the ``Wiki`` class:
 .. literalinclude:: src/authorization/tutorial/models.py
    :lines: 9-13
    :linenos:
+   :lineno-start: 9
    :emphasize-lines: 4-5
    :language: python
 
-We import :data:`~pyramid.security.Allow`, an action that
-means that permission is allowed, and
-:data:`~pyramid.security.Everyone`, a special :term:`principal`
-that is associated to all requests.  Both are used in the
+We import :data:`~pyramid.security.Allow`, an action that means that
+permission is allowed, and :data:`~pyramid.security.Everyone`, a special
+:term:`principal` that is associated to all requests.  Both are used in the
 :term:`ACE` entries that make up the ACL.
 
-The ACL is a list that needs to be named `__acl__` and be an
-attribute of a class.  We define an :term:`ACL` with two
-:term:`ACE` entries: the first entry allows any user the `view`
-permission, and the second entry allows the ``group:editors``
-principal the `edit` permission.
+The ACL is a list that needs to be named `__acl__` and be an attribute of a
+class.  We define an :term:`ACL` with two :term:`ACE` entries: the first entry
+allows any user the `view` permission.  The second entry allows the
+``group:editors`` principal the `edit` permission.
 
-The ``Wiki`` class that contains the ACL is the :term:`resource`
-constructor for the :term:`root` resource, which is
-a ``Wiki`` instance.  The ACL is
-provided to each view in the :term:`context` of the request, as
-the ``context`` attribute.
+The ``Wiki`` class that contains the ACL is the :term:`resource` constructor
+for the :term:`root` resource, which is a ``Wiki`` instance.  The ACL is
+provided to each view in the :term:`context` of the request as the ``context``
+attribute.
 
 It's only happenstance that we're assigning this ACL at class scope.  An ACL
 can be attached to an object *instance* too; this is how "row level security"
 can be achieved in :app:`Pyramid` applications.  We actually need only *one*
 ACL for the entire system, however, because our security requirements are
-simple, so this feature is not demonstrated.  See
-:ref:`assigning_acls` for more information about what an
-:term:`ACL` represents.
+simple, so this feature is not demonstrated.  See :ref:`assigning_acls` for
+more information about what an :term:`ACL` represents.
 
-Add Authentication and Authorization Policies
+Add authentication and authorization policies
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 
-Open ``tutorial/__init__.py`` and
-add these import statements:
+Open ``tutorial/tutorial/__init__.py`` and add the highlighted import
+statements:
 
 .. literalinclude:: src/authorization/tutorial/__init__.py
-   :lines: 4-5,8
+   :lines: 1-8
    :linenos:
+   :emphasize-lines: 4-5,8
    :language: python
 
 Now add those policies to the configuration:
@@ -126,15 +123,16 @@ Now add those policies to the configuration:
 .. literalinclude:: src/authorization/tutorial/__init__.py
    :lines: 18-23
    :linenos:
+   :lineno-start: 18
    :emphasize-lines: 1-3,5-6
    :language: python
 
-(Only the highlighted lines need to be added.)
+Only the highlighted lines need to be added.
 
-We are enabling an ``AuthTktAuthenticationPolicy``, it is based in an
-auth ticket that may be included in the request, and an
-``ACLAuthorizationPolicy`` that uses an ACL to determine the allow or deny
-outcome for a view.
+We are enabling an ``AuthTktAuthenticationPolicy``, which is based in an auth
+ticket that may be included in the request. We are also enabling an
+``ACLAuthorizationPolicy``, which uses an ACL to determine the *allow* or
+*deny* outcome for a view.
 
 Note that the :class:`pyramid.authentication.AuthTktAuthenticationPolicy`
 constructor accepts two arguments: ``secret`` and ``callback``.  ``secret`` is
@@ -144,235 +142,231 @@ machinery represented by this policy: it is required.  The ``callback`` is the
 
 Add permission declarations
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~
-Open ``tutorial/tutorial/views.py``.  Add a ``permission='edit'`` parameter
-to the ``@view_config`` decorator for ``add_page()`` and
-``edit_page()``, for example:
+Open ``tutorial/tutorial/views.py`` and add a ``permission='edit'`` parameter
+to the ``@view_config`` decorators for ``add_page()`` and ``edit_page()``:
 
-.. code-block:: python
-    :linenos:
-    :emphasize-lines: 3
+.. literalinclude:: src/authorization/tutorial/views.py
+   :lines: 50-52
+   :emphasize-lines: 2-3
+   :language: python
 
-    @view_config(name='add_page', context='.models.Wiki',
-                 renderer='templates/edit.pt',
-                 permission='edit')
+.. literalinclude:: src/authorization/tutorial/views.py
+   :lines: 70-72
+   :emphasize-lines: 2-3
+   :language: python
 
-(Only the highlighted line, along with its preceding comma,
-needs to be added.)
+Only the highlighted lines, along with their preceding commas, need to be
+edited and added.
 
-The result is that only users who possess the ``edit``
-permission at the time of the request may invoke those two views.
+The result is that only users who possess the ``edit`` permission at the time
+of the request may invoke those two views.
 
-Add a ``permission='view'`` parameter to the ``@view_config``
-decorator for ``view_wiki()`` and ``view_page()``, like this:
+Add a ``permission='view'`` parameter to the ``@view_config`` decorator for
+``view_wiki()`` and ``view_page()`` as follows:
 
-.. code-block:: python
-   :linenos:
-   :emphasize-lines: 2
+.. literalinclude:: src/authorization/tutorial/views.py
+   :lines: 23-24
+   :emphasize-lines: 1-2
+   :language: python
 
-   @view_config(context='.models.Page', renderer='templates/view.pt',
-                permission='view')
+.. literalinclude:: src/authorization/tutorial/views.py
+   :lines: 28-29
+   :emphasize-lines: 1-2
+   :language: python
 
-(Only the highlighted line, along with its preceding comma,
-needs to be added.)
+Only the highlighted lines, along with their preceding commas, need to be
+edited and added.
 
 This allows anyone to invoke these two views.
 
-We are done with the changes needed to control access.  The
-changes that follow will add the login and logout feature.
+We are done with the changes needed to control access.  The changes that
+follow will add the login and logout feature.
 
-Login, Logout
+Login, logout
 -------------
 
-Add Login and Logout Views
+Add login and logout views
 ~~~~~~~~~~~~~~~~~~~~~~~~~~
 
-We'll add a ``login`` view which renders a login form and processes
-the post from the login form, checking credentials.
+We'll add a ``login`` view which renders a login form and processes the post
+from the login form, checking credentials.
 
-We'll also add a ``logout`` view callable to our application and
-provide a link to it.  This view will clear the credentials of the
-logged in user and redirect back to the front page.
+We'll also add a ``logout`` view callable to our application and provide a
+link to it.  This view will clear the credentials of the logged in user and
+redirect back to the front page.
 
-Add the following import statements to the
-head of ``tutorial/tutorial/views.py``:
+Add the following import statements to the head of
+``tutorial/tutorial/views.py``:
 
 .. literalinclude:: src/authorization/tutorial/views.py
    :lines: 6-17
-   :linenos:
-   :emphasize-lines: 3,6-11
+   :emphasize-lines: 1-12
    :language: python
 
-(Only the highlighted lines, with other necessary modifications,
-need to be added.)
+All the highlighted lines need to be added or edited.
 
-:meth:`~pyramid.view.forbidden_view_config` will be used
-to customize the default 403 Forbidden page.
-:meth:`~pyramid.security.remember` and
-:meth:`~pyramid.security.forget` help to create and
-expire an auth ticket cookie.
+:meth:`~pyramid.view.forbidden_view_config` will be used to customize the
+default 403 Forbidden page. :meth:`~pyramid.security.remember` and
+:meth:`~pyramid.security.forget` help to create and expire an auth ticket
+cookie.
 
-Now add the ``login`` and ``logout`` views:
+Now add the ``login`` and ``logout`` views at the end of the file:
 
 .. literalinclude:: src/authorization/tutorial/views.py
-   :lines: 82-120
+   :lines: 82-116
    :linenos:
+   :lineno-start: 82
    :language: python
 
 ``login()`` has two decorators:
 
-- a ``@view_config`` decorator which associates it with the
-  ``login`` route and makes it visible when we visit ``/login``,
-- a ``@forbidden_view_config`` decorator which turns it into
-  a :term:`forbidden view`. ``login()`` will be invoked
-  when a user tries to execute a view callable for which they lack
-  authorization.  For example, if a user has not logged in
-  and tries to add or edit a Wiki page, they will be shown the
-  login form before being allowed to continue.
+- a ``@view_config`` decorator which associates it with the ``login`` route
+  and makes it visible when we visit ``/login``,
+- a ``@forbidden_view_config`` decorator which turns it into a
+  :term:`forbidden view`. ``login()`` will be invoked when a user tries to
+  execute a view callable for which they lack authorization.  For example, if
+  a user has not logged in and tries to add or edit a Wiki page, they will be
+  shown the login form before being allowed to continue.
 
-The order of these two :term:`view configuration` decorators
-is unimportant.
+The order of these two :term:`view configuration` decorators is unimportant.
 
-``logout()`` is decorated with a ``@view_config`` decorator
-which associates it with the ``logout`` route.  It will be
-invoked when we visit ``/logout``.
+``logout()`` is decorated with a ``@view_config`` decorator which associates
+it with the ``logout`` route.  It will be invoked when we visit ``/logout``.
 
 Add the ``login.pt`` Template
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 
-Create ``tutorial/tutorial/templates/login.pt`` with the following
-content:
+Create ``tutorial/tutorial/templates/login.pt`` with the following content:
 
 .. literalinclude:: src/authorization/tutorial/templates/login.pt
-   :language: xml
+   :language: html
 
-The above template is referred in the login view that we just added
-in ``views.py``.
+The above template is referenced in the login view that we just added in
+``views.py``.
 
-Return a logged_in flag to the renderer
-~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+Return a ``logged_in`` flag to the renderer
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 
-Add a  ``logged_in`` parameter to the return value of
-``view_page()``, ``edit_page()`` and  ``add_page()``,
-like this:
+Open ``tutorial/tutorial/views.py`` again. Add a ``logged_in`` parameter to
+the return value of ``view_page()``, ``edit_page()``, and ``add_page()`` as
+follows:
 
-.. code-block:: python
-   :linenos:
-   :emphasize-lines: 4
+.. literalinclude:: src/authorization/tutorial/views.py
+   :lines: 47-48
+   :emphasize-lines: 1-2
+   :language: python
 
-   return dict(page = page,
-               content = content,
-               edit_url = edit_url,
-               logged_in = request.authenticated_userid)
+.. literalinclude:: src/authorization/tutorial/views.py
+   :lines: 67-68
+   :emphasize-lines: 1-2
+   :language: python
 
-(Only the highlighted line and a trailing comma on the preceding
-line need to be added.)
+.. literalinclude:: src/authorization/tutorial/views.py
+   :lines: 75-77
+   :emphasize-lines: 2-3
+   :language: python
+
+Only the highlighted lines need to be added or edited.
 
 The :meth:`pyramid.request.Request.authenticated_userid` will be ``None`` if
-the user is not authenticated, or a user id if the user is authenticated.
+the user is not authenticated, or a userid if the user is authenticated.
 
 Add a "Logout" link when logged in
 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 
 Open ``tutorial/tutorial/templates/edit.pt`` and
-``tutorial/tutorial/templates/view.pt``  and add this within the
-``<div id="right" class="app-welcome align-right">`` div:
+``tutorial/tutorial/templates/view.pt`` and add the following code as
+indicated by the highlighted lines.
 
-.. code-block:: xml
-
-   <span tal:condition="logged_in">
-      <a href="${request.application_url}/logout">Logout</a>
-   </span>
+.. literalinclude:: src/authorization/tutorial/templates/edit.pt
+   :lines: 34-38
+   :emphasize-lines: 3-5
+   :language: html
 
-The attribute ``tal:condition="logged_in"`` will make the element be
-included when ``logged_in`` is any user id. The link will invoke
-the logout view.  The above element will not be included if ``logged_in``
-is ``None``, such as when a user is not authenticated.
+The attribute ``tal:condition="logged_in"`` will make the element be included
+when ``logged_in`` is any user id. The link will invoke the logout view.  The
+above element will not be included if ``logged_in`` is ``None``, such as when
+a user is not authenticated.
 
-Seeing Our Changes
-------------------
+Reviewing our changes
+---------------------
 
-Our ``tutorial/tutorial/__init__.py`` will look something like this
-when we're done:
+Our ``tutorial/tutorial/__init__.py`` will look like this when we're done:
 
 .. literalinclude:: src/authorization/tutorial/__init__.py
    :linenos:
    :emphasize-lines: 4-5,8,18-20,22-23
    :language: python
 
-(Only the highlighted lines need to be added.)
+Only the highlighted lines need to be added or edited.
 
-Our ``tutorial/tutorial/models.py`` will look something like this
-when we're done:
+Our ``tutorial/tutorial/models.py`` will look like this when we're done:
 
 .. literalinclude:: src/authorization/tutorial/models.py
    :linenos:
    :emphasize-lines: 4-7,12-13
    :language: python
 
-(Only the highlighted lines need to be added.)
+Only the highlighted lines need to be added or edited.
 
-Our ``tutorial/tutorial/views.py`` will look something like this
-when we're done:
+Our ``tutorial/tutorial/views.py`` will look like this when we're done:
 
 .. literalinclude:: src/authorization/tutorial/views.py
    :linenos:
    :emphasize-lines: 8,11-15,17,24,29,48,52,68,72,80,82-120
    :language: python
 
-(Only the highlighted lines need to be added.)
+Only the highlighted lines need to be added or edited.
 
-Our ``tutorial/tutorial/templates/edit.pt`` template will look
-something like this when we're done:
+Our ``tutorial/tutorial/templates/edit.pt`` template will look like this when
+we're done:
 
 .. literalinclude:: src/authorization/tutorial/templates/edit.pt
    :linenos:
-   :emphasize-lines: 41-43
-   :language: xml
+   :emphasize-lines: 36-38
+   :language: html
 
-(Only the highlighted lines need to be added.)
+Only the highlighted lines need to be added or edited.
 
-Our ``tutorial/tutorial/templates/view.pt`` template will look
-something like this when we're done:
+Our ``tutorial/tutorial/templates/view.pt`` template will look like this when
+we're done:
 
 .. literalinclude:: src/authorization/tutorial/templates/view.pt
    :linenos:
-   :emphasize-lines: 41-43
-   :language: xml
+   :emphasize-lines: 36-38
+   :language: html
 
-(Only the highlighted lines need to be added.)
+Only the highlighted lines need to be added or edited.
 
 Viewing the Application in a Browser
 ------------------------------------
 
 We can finally examine our application in a browser (See
-:ref:`wiki-start-the-application`).  Launch a browser and visit
-each of the following URLs, check that the result is as expected:
-
-- ``http://localhost:6543/`` invokes the
-  ``view_wiki`` view.  This always redirects to the ``view_page`` view
-  of the ``FrontPage`` Page resource.  It is executable by any user.
-
-- ``http://localhost:6543/FrontPage`` invokes
-  the ``view_page`` view of the ``FrontPage`` Page resource. This is because
-  it's the :term:`default view` (a view without a ``name``) for ``Page``
-  resources.  It is executable by any user.
-
-- ``http://localhost:6543/FrontPage/edit_page``
-  invokes the edit view for the FrontPage object.  It is executable by
-  only the ``editor`` user.  If a different user (or the anonymous
-  user) invokes it, a login form will be displayed.  Supplying the
-  credentials with the username ``editor``, password ``editor`` will
-  display the edit page form.
-
-- ``http://localhost:6543/add_page/SomePageName``
-  invokes the add view for a page.  It is executable by only
-  the ``editor`` user.  If a different user (or the anonymous user)
-  invokes it, a login form will be displayed.  Supplying the
-  credentials with the username ``editor``, password ``editor`` will
-  display the edit page form.
-
-- After logging in (as a result of hitting an edit or add page
-  and submitting the login form with the ``editor``
-  credentials), we'll see a Logout link in the upper right hand
-  corner.  When we click it, we're logged out, and redirected
-  back to the front page.
+:ref:`wiki-start-the-application`).  Launch a browser and visit each of the
+following URLs, checking that the result is as expected:
+
+- http://localhost:6543/ invokes the ``view_wiki`` view.  This always
+  redirects to the ``view_page`` view of the ``FrontPage`` Page resource.  It
+  is executable by any user.
+
+- http://localhost:6543/FrontPage invokes the ``view_page`` view of the
+  ``FrontPage`` Page resource. This is because it's the :term:`default view`
+  (a view without a ``name``) for ``Page`` resources.  It is executable by any
+  user.
+
+- http://localhost:6543/FrontPage/edit_page invokes the edit view for the
+  FrontPage object.  It is executable by only the ``editor`` user.  If a
+  different user (or the anonymous user) invokes it, a login form will be
+  displayed.  Supplying the credentials with the username ``editor``, password
+  ``editor`` will display the edit page form.
+
+- http://localhost:6543/add_page/SomePageName invokes the add view for a page.
+  It is executable by only the ``editor`` user.  If a different user (or the
+  anonymous user) invokes it, a login form will be displayed. Supplying the
+  credentials with the username ``editor``, password ``editor`` will display
+  the edit page form.
+
+- After logging in (as a result of hitting an edit or add page and submitting
+  the login form with the ``editor`` credentials), we'll see a Logout link in
+  the upper right hand corner.  When we click it, we're logged out, and
+  redirected back to the front page.
diff --git a/docs/tutorials/wiki/src/authorization/tutorial/static/favicon.ico b/docs/tutorials/wiki/src/authorization/tutorial/static/favicon.ico
deleted file mode 100644
index 71f837c9e..000000000
Binary files a/docs/tutorials/wiki/src/authorization/tutorial/static/favicon.ico and /dev/null differ
diff --git a/docs/tutorials/wiki/src/authorization/tutorial/static/footerbg.png b/docs/tutorials/wiki/src/authorization/tutorial/static/footerbg.png
deleted file mode 100644
index 1fbc873da..000000000
Binary files a/docs/tutorials/wiki/src/authorization/tutorial/static/footerbg.png and /dev/null differ
diff --git a/docs/tutorials/wiki/src/authorization/tutorial/static/headerbg.png b/docs/tutorials/wiki/src/authorization/tutorial/static/headerbg.png
deleted file mode 100644
index 0596f2020..000000000
Binary files a/docs/tutorials/wiki/src/authorization/tutorial/static/headerbg.png and /dev/null differ
diff --git a/docs/tutorials/wiki/src/authorization/tutorial/static/ie6.css b/docs/tutorials/wiki/src/authorization/tutorial/static/ie6.css
deleted file mode 100644
index b7c8493d8..000000000
--- a/docs/tutorials/wiki/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/wiki/src/authorization/tutorial/static/middlebg.png b/docs/tutorials/wiki/src/authorization/tutorial/static/middlebg.png
deleted file mode 100644
index 2369cfb7d..000000000
Binary files a/docs/tutorials/wiki/src/authorization/tutorial/static/middlebg.png and /dev/null differ
diff --git a/docs/tutorials/wiki/src/authorization/tutorial/static/pylons.css b/docs/tutorials/wiki/src/authorization/tutorial/static/pylons.css
deleted file mode 100644
index 4b1c017cd..000000000
--- a/docs/tutorials/wiki/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/wiki/src/authorization/tutorial/static/pyramid-16x16.png b/docs/tutorials/wiki/src/authorization/tutorial/static/pyramid-16x16.png
new file mode 100644
index 000000000..979203112
Binary files /dev/null and b/docs/tutorials/wiki/src/authorization/tutorial/static/pyramid-16x16.png differ
diff --git a/docs/tutorials/wiki/src/authorization/tutorial/static/pyramid-small.png b/docs/tutorials/wiki/src/authorization/tutorial/static/pyramid-small.png
deleted file mode 100644
index a5bc0ade7..000000000
Binary files a/docs/tutorials/wiki/src/authorization/tutorial/static/pyramid-small.png and /dev/null differ
diff --git a/docs/tutorials/wiki/src/authorization/tutorial/static/pyramid.png b/docs/tutorials/wiki/src/authorization/tutorial/static/pyramid.png
index 347e05549..4ab837be9 100644
Binary files a/docs/tutorials/wiki/src/authorization/tutorial/static/pyramid.png and b/docs/tutorials/wiki/src/authorization/tutorial/static/pyramid.png differ
diff --git a/docs/tutorials/wiki/src/authorization/tutorial/static/theme.css b/docs/tutorials/wiki/src/authorization/tutorial/static/theme.css
new file mode 100644
index 000000000..0f4b1a4d4
--- /dev/null
+++ b/docs/tutorials/wiki/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/wiki/src/authorization/tutorial/static/theme.min.css b/docs/tutorials/wiki/src/authorization/tutorial/static/theme.min.css
new file mode 100644
index 000000000..2f924bcc5
--- /dev/null
+++ b/docs/tutorials/wiki/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/wiki/src/authorization/tutorial/static/transparent.gif b/docs/tutorials/wiki/src/authorization/tutorial/static/transparent.gif
deleted file mode 100644
index 0341802e5..000000000
Binary files a/docs/tutorials/wiki/src/authorization/tutorial/static/transparent.gif and /dev/null differ
diff --git a/docs/tutorials/wiki/src/authorization/tutorial/templates/edit.pt b/docs/tutorials/wiki/src/authorization/tutorial/templates/edit.pt
index c3a0acf6b..823fa8972 100644
--- a/docs/tutorials/wiki/src/authorization/tutorial/templates/edit.pt
+++ b/docs/tutorials/wiki/src/authorization/tutorial/templates/edit.pt
@@ -1,58 +1,72 @@
-<!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
-      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="/static/favicon.ico" />
-  <link rel="stylesheet"
-        href="/static/pylons.css"
-        type="text/css" media="screen" charset="utf-8" />
-  <!--[if lte IE 6]>
-  <link rel="stylesheet"
-        href="/static/ie6.css"
-        type="text/css" media="screen" charset="utf-8" />
-  <![endif]-->
-</head>
-<body>
-  <div id="wrap">
-    <div id="top-small">
-      <div class="top-small align-center">
-        <div>
-          <img width="220" height="50" alt="pyramid"
-        src="/static/pyramid-small.png" />
+<!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>
+
+    <!-- Bootstrap core CSS -->
+    <link href="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
+
+    <!-- Custom styles for this scaffold -->
+    <link href="${request.static_url('tutorial:static/theme.css')}" rel="stylesheet">
+
+    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
+    <!--[if lt IE 9]>
+      <script src="//oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
+      <script src="//oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
+    <![endif]-->
+  </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 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>
+              </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"></textarea>
+                </div>
+                <div class="form-group">
+                  <button type="submit" name="form.submitted" value="Save" class="btn btn-default">Save</button>
+                </div>
+              </form>
+            </div>
+          </div>
         </div>
-      </div>
-    </div>
-    <div id="middle">
-      <div class="middle align-right">
-        <div id="left" class="app-welcome align-left">
-          Editing <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 class="row">
+          <div class="copyright">
+            Copyright &copy; Pylons Project
+          </div>
         </div>
       </div>
     </div>
-    <div id="bottom">
-      <div class="bottom">
-        <form action="${save_url}" method="post">
-          <textarea name="body" tal:content="page.data" rows="10"
-                    cols="60"/><br/>
-          <input type="submit" name="form.submitted" value="Save"/>
-        </form>
-      </div>
-    </div>
-  </div>
-</body>
+
+
+    <!-- Bootstrap core JavaScript
+    ================================================== -->
+    <!-- Placed at the end of the document so the pages load faster -->
+    <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/wiki/src/authorization/tutorial/templates/login.pt b/docs/tutorials/wiki/src/authorization/tutorial/templates/login.pt
index 3612dccde..4a938e9bb 100644
--- a/docs/tutorials/wiki/src/authorization/tutorial/templates/login.pt
+++ b/docs/tutorials/wiki/src/authorization/tutorial/templates/login.pt
@@ -1,54 +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>Login - 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="/static/favicon.ico" />
-  <link rel="stylesheet"
-        href="/static/pylons.css"
-        type="text/css" media="screen" charset="utf-8" />
-  <!--[if lte IE 6]>
-  <link rel="stylesheet"
-        href="/static/ie6.css"
-        type="text/css" media="screen" charset="utf-8" />
-  <![endif]-->
-</head>
-<body>
-  <div id="wrap">
-    <div id="top-small">
-      <div class="top-small align-center">
-        <div>
-          <img width="220" height="50" alt="pyramid"
-        src="/static/pyramid-small.png" />
+<!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>Login - Pyramid tutorial wiki (based on
+    TurboGears 20-Minute Wiki)</title>
+
+    <!-- Bootstrap core CSS -->
+    <link href="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
+
+    <!-- Custom styles for this scaffold -->
+    <link href="${request.static_url('tutorial:static/theme.css')}" rel="stylesheet">
+
+    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
+    <!--[if lt IE 9]>
+      <script src="//oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
+      <script src="//oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
+    <![endif]-->
+  </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>
+                <strong>
+                  Login
+                </strong><br>
+                <span tal:replace="message"></span>
+              </p>
+              <form action="${url}" method="post">
+                <input type="hidden" name="came_from" value="${came_from}">
+                <div class="form-group">
+                  <label for="login">Username</label>
+                  <input type="text" name="login" value="${login}">
+                </div>
+                <div class="form-group">
+                  <label for="password">Password</label>
+                  <input type="password" name="password" value="${password}">
+                </div>
+                <div class="form-group">
+                  <button type="submit" name="form.submitted" value="Log In" class="btn btn-default">Log In</button>
+                </div>
+              </form>
+            </div>
+          </div>
         </div>
-      </div>
-    </div>
-    <div id="middle">
-      <div class="middle align-right">
-        <div id="left" class="app-welcome align-left">
-          <b>Login</b><br/>
-          <span tal:replace="message"/>
+        <div class="row">
+          <div class="copyright">
+            Copyright &copy; Pylons Project
+          </div>
         </div>
-        <div id="right" class="app-welcome align-right"></div>
-      </div>
-    </div>
-    <div id="bottom">
-      <div class="bottom">
-        <form action="${url}" method="post">
-          <input type="hidden" name="came_from" value="${came_from}"/>
-          <input type="text" name="login" value="${login}"/><br/>
-          <input type="password" name="password"
-                 value="${password}"/><br/>
-          <input type="submit" name="form.submitted" value="Log In"/>
-        </form>
       </div>
     </div>
-  </div>
-</body>
+
+
+    <!-- Bootstrap core JavaScript
+    ================================================== -->
+    <!-- Placed at the end of the document so the pages load faster -->
+    <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/wiki/src/authorization/tutorial/templates/view.pt b/docs/tutorials/wiki/src/authorization/tutorial/templates/view.pt
index 90e20764d..fa35d758d 100644
--- a/docs/tutorials/wiki/src/authorization/tutorial/templates/view.pt
+++ b/docs/tutorials/wiki/src/authorization/tutorial/templates/view.pt
@@ -1,61 +1,72 @@
-<!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="/static/favicon.ico" />
-  <link rel="stylesheet"
-        href="/static/pylons.css"
-        type="text/css" media="screen" charset="utf-8" />
-  <!--[if lte IE 6]>
-  <link rel="stylesheet"
-        href="/static/ie6.css"
-        type="text/css" media="screen" charset="utf-8" />
-  <![endif]-->
-</head>
-<body>
-  <div id="wrap">
-    <div id="top-small">
-      <div class="top-small align-center">
-        <div>
-          <img width="220" height="50" alt="pyramid"
-        src="/static/pyramid-small.png" />
+
+    <!-- Bootstrap core CSS -->
+    <link href="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
+
+    <!-- Custom styles for this scaffold -->
+    <link href="${request.static_url('tutorial:static/theme.css')}" rel="stylesheet">
+
+    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
+    <!--[if lt IE 9]>
+      <script src="//oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
+      <script src="//oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
+    <![endif]-->
+  </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 tal:condition="logged_in" class="pull-right">
+                <a href="${request.application_url}/logout">Logout</a>
+              </p>
+              <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">
-          <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 &copy; Pylons Project
+          </div>
         </div>
-        <p>
-          <a tal:attributes="href edit_url" href="">
-            Edit this page
-          </a>
-        </p>
       </div>
     </div>
-  </div>
-</body>
+
+
+    <!-- Bootstrap core JavaScript
+    ================================================== -->
+    <!-- Placed at the end of the document so the pages load faster -->
+    <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 6901d74698da7b8457f92f0771fe03015acb9261 Mon Sep 17 00:00:00 2001
From: Steve Piercy <web@stevepiercy.com>
Date: Wed, 27 May 2015 03:38:39 -0700
Subject: - clean up and make consistent across wiki tutorials - update
 templates and static assets for new design

---
 docs/tutorials/wiki/authorization.rst              |   2 +-
 docs/tutorials/wiki/definingviews.rst              |  17 +-
 .../wiki/src/tests/tutorial/static/favicon.ico     | Bin 1406 -> 0 bytes
 .../wiki/src/tests/tutorial/static/footerbg.png    | Bin 333 -> 0 bytes
 .../wiki/src/tests/tutorial/static/headerbg.png    | Bin 203 -> 0 bytes
 .../wiki/src/tests/tutorial/static/ie6.css         |   8 -
 .../wiki/src/tests/tutorial/static/middlebg.png    | Bin 2797 -> 0 bytes
 .../wiki/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
 .../wiki/src/tests/tutorial/static/pyramid.png     | Bin 33055 -> 12901 bytes
 .../wiki/src/tests/tutorial/static/theme.css       | 154 +++++++++
 .../wiki/src/tests/tutorial/static/theme.min.css   |   1 +
 .../wiki/src/tests/tutorial/static/transparent.gif | Bin 49 -> 0 bytes
 .../wiki/src/tests/tutorial/templates/edit.pt      | 120 ++++---
 .../wiki/src/tests/tutorial/templates/login.pt     | 118 ++++---
 .../wiki/src/tests/tutorial/templates/view.pt      | 121 ++++---
 docs/tutorials/wiki/tests.rst                      |  44 ++-
 18 files changed, 387 insertions(+), 570 deletions(-)
 delete mode 100644 docs/tutorials/wiki/src/tests/tutorial/static/favicon.ico
 delete mode 100644 docs/tutorials/wiki/src/tests/tutorial/static/footerbg.png
 delete mode 100644 docs/tutorials/wiki/src/tests/tutorial/static/headerbg.png
 delete mode 100644 docs/tutorials/wiki/src/tests/tutorial/static/ie6.css
 delete mode 100644 docs/tutorials/wiki/src/tests/tutorial/static/middlebg.png
 delete mode 100644 docs/tutorials/wiki/src/tests/tutorial/static/pylons.css
 create mode 100644 docs/tutorials/wiki/src/tests/tutorial/static/pyramid-16x16.png
 delete mode 100644 docs/tutorials/wiki/src/tests/tutorial/static/pyramid-small.png
 create mode 100644 docs/tutorials/wiki/src/tests/tutorial/static/theme.css
 create mode 100644 docs/tutorials/wiki/src/tests/tutorial/static/theme.min.css
 delete mode 100644 docs/tutorials/wiki/src/tests/tutorial/static/transparent.gif

(limited to 'docs/tutorials/wiki')

diff --git a/docs/tutorials/wiki/authorization.rst b/docs/tutorials/wiki/authorization.rst
index 161e251bc..b0a8c155d 100644
--- a/docs/tutorials/wiki/authorization.rst
+++ b/docs/tutorials/wiki/authorization.rst
@@ -338,7 +338,7 @@ we're done:
 
 Only the highlighted lines need to be added or edited.
 
-Viewing the Application in a Browser
+Viewing the application in a browser
 ------------------------------------
 
 We can finally examine our application in a browser (See
diff --git a/docs/tutorials/wiki/definingviews.rst b/docs/tutorials/wiki/definingviews.rst
index 2ebddd4c8..ed173a706 100644
--- a/docs/tutorials/wiki/definingviews.rst
+++ b/docs/tutorials/wiki/definingviews.rst
@@ -352,7 +352,7 @@ The form POSTs back to the ``save_url`` argument supplied by the view (line
    See :ref:`renderer_system_values` for information about other names that
    are available by default when a template is used as a renderer.
 
-Static Assets
+Static assets
 -------------
 
 Our templates name static assets, including CSS and images.  We don't need
@@ -367,26 +367,25 @@ subdirectories) and are just referred to by URL or by using the convenience
 method ``static_url``, e.g.,
 ``request.static_url('<package>:static/foo.css')`` within templates.
 
-Viewing the Application in a Browser
+Viewing the application in a browser
 ====================================
 
 We can finally examine our application in a browser (See
 :ref:`wiki-start-the-application`).  Launch a browser and visit
 each of the following URLs, checking that the result is as expected:
 
-- ``http://localhost:6543/`` invokes the ``view_wiki`` view.  This always
+- http://localhost:6543/ invokes the ``view_wiki`` view.  This always
   redirects to the ``view_page`` view of the ``FrontPage`` Page resource.
 
-- ``http://localhost:6543/FrontPage/`` invokes the ``view_page`` view of the
-  front page resource.  This is because it's the :term:`default view` (a view
+- http://localhost:6543/FrontPage/ invokes the ``view_page`` view of the front
+  page resource.  This is because it's the :term:`default view` (a view
   without a ``name``) for Page resources.
 
-- ``http://localhost:6543/FrontPage/edit_page`` invokes the edit view for the
+- http://localhost:6543/FrontPage/edit_page invokes the edit view for the
   ``FrontPage`` Page resource.
 
-- ``http://localhost:6543/add_page/SomePageName`` invokes the add view for a
-  Page.
+- http://localhost:6543/add_page/SomePageName invokes the add view for a Page.
 
-- To generate an error, visit ``http://localhost:6543/add_page`` which will
+- To generate an error, visit http://localhost:6543/add_page which will
   generate an ``IndexErrorr: tuple index out of range`` error. You'll see an
   interactive traceback facility provided by :term:`pyramid_debugtoolbar`.
diff --git a/docs/tutorials/wiki/src/tests/tutorial/static/favicon.ico b/docs/tutorials/wiki/src/tests/tutorial/static/favicon.ico
deleted file mode 100644
index 71f837c9e..000000000
Binary files a/docs/tutorials/wiki/src/tests/tutorial/static/favicon.ico and /dev/null differ
diff --git a/docs/tutorials/wiki/src/tests/tutorial/static/footerbg.png b/docs/tutorials/wiki/src/tests/tutorial/static/footerbg.png
deleted file mode 100644
index 1fbc873da..000000000
Binary files a/docs/tutorials/wiki/src/tests/tutorial/static/footerbg.png and /dev/null differ
diff --git a/docs/tutorials/wiki/src/tests/tutorial/static/headerbg.png b/docs/tutorials/wiki/src/tests/tutorial/static/headerbg.png
deleted file mode 100644
index 0596f2020..000000000
Binary files a/docs/tutorials/wiki/src/tests/tutorial/static/headerbg.png and /dev/null differ
diff --git a/docs/tutorials/wiki/src/tests/tutorial/static/ie6.css b/docs/tutorials/wiki/src/tests/tutorial/static/ie6.css
deleted file mode 100644
index b7c8493d8..000000000
--- a/docs/tutorials/wiki/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/wiki/src/tests/tutorial/static/middlebg.png b/docs/tutorials/wiki/src/tests/tutorial/static/middlebg.png
deleted file mode 100644
index 2369cfb7d..000000000
Binary files a/docs/tutorials/wiki/src/tests/tutorial/static/middlebg.png and /dev/null differ
diff --git a/docs/tutorials/wiki/src/tests/tutorial/static/pylons.css b/docs/tutorials/wiki/src/tests/tutorial/static/pylons.css
deleted file mode 100644
index 4b1c017cd..000000000
--- a/docs/tutorials/wiki/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/wiki/src/tests/tutorial/static/pyramid-16x16.png b/docs/tutorials/wiki/src/tests/tutorial/static/pyramid-16x16.png
new file mode 100644
index 000000000..979203112
Binary files /dev/null and b/docs/tutorials/wiki/src/tests/tutorial/static/pyramid-16x16.png differ
diff --git a/docs/tutorials/wiki/src/tests/tutorial/static/pyramid-small.png b/docs/tutorials/wiki/src/tests/tutorial/static/pyramid-small.png
deleted file mode 100644
index a5bc0ade7..000000000
Binary files a/docs/tutorials/wiki/src/tests/tutorial/static/pyramid-small.png and /dev/null differ
diff --git a/docs/tutorials/wiki/src/tests/tutorial/static/pyramid.png b/docs/tutorials/wiki/src/tests/tutorial/static/pyramid.png
index 347e05549..4ab837be9 100644
Binary files a/docs/tutorials/wiki/src/tests/tutorial/static/pyramid.png and b/docs/tutorials/wiki/src/tests/tutorial/static/pyramid.png differ
diff --git a/docs/tutorials/wiki/src/tests/tutorial/static/theme.css b/docs/tutorials/wiki/src/tests/tutorial/static/theme.css
new file mode 100644
index 000000000..0f4b1a4d4
--- /dev/null
+++ b/docs/tutorials/wiki/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/wiki/src/tests/tutorial/static/theme.min.css b/docs/tutorials/wiki/src/tests/tutorial/static/theme.min.css
new file mode 100644
index 000000000..2f924bcc5
--- /dev/null
+++ b/docs/tutorials/wiki/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/wiki/src/tests/tutorial/static/transparent.gif b/docs/tutorials/wiki/src/tests/tutorial/static/transparent.gif
deleted file mode 100644
index 0341802e5..000000000
Binary files a/docs/tutorials/wiki/src/tests/tutorial/static/transparent.gif and /dev/null differ
diff --git a/docs/tutorials/wiki/src/tests/tutorial/templates/edit.pt b/docs/tutorials/wiki/src/tests/tutorial/templates/edit.pt
index c3a0acf6b..823fa8972 100644
--- a/docs/tutorials/wiki/src/tests/tutorial/templates/edit.pt
+++ b/docs/tutorials/wiki/src/tests/tutorial/templates/edit.pt
@@ -1,58 +1,72 @@
-<!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
-      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="/static/favicon.ico" />
-  <link rel="stylesheet"
-        href="/static/pylons.css"
-        type="text/css" media="screen" charset="utf-8" />
-  <!--[if lte IE 6]>
-  <link rel="stylesheet"
-        href="/static/ie6.css"
-        type="text/css" media="screen" charset="utf-8" />
-  <![endif]-->
-</head>
-<body>
-  <div id="wrap">
-    <div id="top-small">
-      <div class="top-small align-center">
-        <div>
-          <img width="220" height="50" alt="pyramid"
-        src="/static/pyramid-small.png" />
+<!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>
+
+    <!-- Bootstrap core CSS -->
+    <link href="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
+
+    <!-- Custom styles for this scaffold -->
+    <link href="${request.static_url('tutorial:static/theme.css')}" rel="stylesheet">
+
+    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
+    <!--[if lt IE 9]>
+      <script src="//oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
+      <script src="//oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
+    <![endif]-->
+  </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 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>
+              </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"></textarea>
+                </div>
+                <div class="form-group">
+                  <button type="submit" name="form.submitted" value="Save" class="btn btn-default">Save</button>
+                </div>
+              </form>
+            </div>
+          </div>
         </div>
-      </div>
-    </div>
-    <div id="middle">
-      <div class="middle align-right">
-        <div id="left" class="app-welcome align-left">
-          Editing <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 class="row">
+          <div class="copyright">
+            Copyright &copy; Pylons Project
+          </div>
         </div>
       </div>
     </div>
-    <div id="bottom">
-      <div class="bottom">
-        <form action="${save_url}" method="post">
-          <textarea name="body" tal:content="page.data" rows="10"
-                    cols="60"/><br/>
-          <input type="submit" name="form.submitted" value="Save"/>
-        </form>
-      </div>
-    </div>
-  </div>
-</body>
+
+
+    <!-- Bootstrap core JavaScript
+    ================================================== -->
+    <!-- Placed at the end of the document so the pages load faster -->
+    <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/wiki/src/tests/tutorial/templates/login.pt b/docs/tutorials/wiki/src/tests/tutorial/templates/login.pt
index 3612dccde..4a938e9bb 100644
--- a/docs/tutorials/wiki/src/tests/tutorial/templates/login.pt
+++ b/docs/tutorials/wiki/src/tests/tutorial/templates/login.pt
@@ -1,54 +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>Login - 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="/static/favicon.ico" />
-  <link rel="stylesheet"
-        href="/static/pylons.css"
-        type="text/css" media="screen" charset="utf-8" />
-  <!--[if lte IE 6]>
-  <link rel="stylesheet"
-        href="/static/ie6.css"
-        type="text/css" media="screen" charset="utf-8" />
-  <![endif]-->
-</head>
-<body>
-  <div id="wrap">
-    <div id="top-small">
-      <div class="top-small align-center">
-        <div>
-          <img width="220" height="50" alt="pyramid"
-        src="/static/pyramid-small.png" />
+<!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>Login - Pyramid tutorial wiki (based on
+    TurboGears 20-Minute Wiki)</title>
+
+    <!-- Bootstrap core CSS -->
+    <link href="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
+
+    <!-- Custom styles for this scaffold -->
+    <link href="${request.static_url('tutorial:static/theme.css')}" rel="stylesheet">
+
+    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
+    <!--[if lt IE 9]>
+      <script src="//oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
+      <script src="//oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
+    <![endif]-->
+  </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>
+                <strong>
+                  Login
+                </strong><br>
+                <span tal:replace="message"></span>
+              </p>
+              <form action="${url}" method="post">
+                <input type="hidden" name="came_from" value="${came_from}">
+                <div class="form-group">
+                  <label for="login">Username</label>
+                  <input type="text" name="login" value="${login}">
+                </div>
+                <div class="form-group">
+                  <label for="password">Password</label>
+                  <input type="password" name="password" value="${password}">
+                </div>
+                <div class="form-group">
+                  <button type="submit" name="form.submitted" value="Log In" class="btn btn-default">Log In</button>
+                </div>
+              </form>
+            </div>
+          </div>
         </div>
-      </div>
-    </div>
-    <div id="middle">
-      <div class="middle align-right">
-        <div id="left" class="app-welcome align-left">
-          <b>Login</b><br/>
-          <span tal:replace="message"/>
+        <div class="row">
+          <div class="copyright">
+            Copyright &copy; Pylons Project
+          </div>
         </div>
-        <div id="right" class="app-welcome align-right"></div>
-      </div>
-    </div>
-    <div id="bottom">
-      <div class="bottom">
-        <form action="${url}" method="post">
-          <input type="hidden" name="came_from" value="${came_from}"/>
-          <input type="text" name="login" value="${login}"/><br/>
-          <input type="password" name="password"
-                 value="${password}"/><br/>
-          <input type="submit" name="form.submitted" value="Log In"/>
-        </form>
       </div>
     </div>
-  </div>
-</body>
+
+
+    <!-- Bootstrap core JavaScript
+    ================================================== -->
+    <!-- Placed at the end of the document so the pages load faster -->
+    <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/wiki/src/tests/tutorial/templates/view.pt b/docs/tutorials/wiki/src/tests/tutorial/templates/view.pt
index 90e20764d..fa35d758d 100644
--- a/docs/tutorials/wiki/src/tests/tutorial/templates/view.pt
+++ b/docs/tutorials/wiki/src/tests/tutorial/templates/view.pt
@@ -1,61 +1,72 @@
-<!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="/static/favicon.ico" />
-  <link rel="stylesheet"
-        href="/static/pylons.css"
-        type="text/css" media="screen" charset="utf-8" />
-  <!--[if lte IE 6]>
-  <link rel="stylesheet"
-        href="/static/ie6.css"
-        type="text/css" media="screen" charset="utf-8" />
-  <![endif]-->
-</head>
-<body>
-  <div id="wrap">
-    <div id="top-small">
-      <div class="top-small align-center">
-        <div>
-          <img width="220" height="50" alt="pyramid"
-        src="/static/pyramid-small.png" />
+
+    <!-- Bootstrap core CSS -->
+    <link href="//oss.maxcdn.com/libs/twitter-bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
+
+    <!-- Custom styles for this scaffold -->
+    <link href="${request.static_url('tutorial:static/theme.css')}" rel="stylesheet">
+
+    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
+    <!--[if lt IE 9]>
+      <script src="//oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
+      <script src="//oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
+    <![endif]-->
+  </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 tal:condition="logged_in" class="pull-right">
+                <a href="${request.application_url}/logout">Logout</a>
+              </p>
+              <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">
-          <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 &copy; Pylons Project
+          </div>
         </div>
-        <p>
-          <a tal:attributes="href edit_url" href="">
-            Edit this page
-          </a>
-        </p>
       </div>
     </div>
-  </div>
-</body>
+
+
+    <!-- Bootstrap core JavaScript
+    ================================================== -->
+    <!-- Placed at the end of the document so the pages load faster -->
+    <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/wiki/tests.rst b/docs/tutorials/wiki/tests.rst
index e724f3e18..e255812fc 100644
--- a/docs/tutorials/wiki/tests.rst
+++ b/docs/tutorials/wiki/tests.rst
@@ -2,38 +2,36 @@
 Adding Tests
 ============
 
-We will now add tests for the models and the views and a few functional
-tests in the ``tests.py``.  Tests ensure that an application works, and
-that it continues to work after some changes are made in the future.
+We will now add tests for the models and the views and a few functional tests
+in ``tests.py``.  Tests ensure that an application works, and that it
+continues to work when changes are made in the future.
 
-
-Test the Models
+Test the models
 ===============
 
-We write tests for the model classes and the appmaker.  Changing
-``tests.py``, we'll write a separate test class for each model class, and
+We write tests for the ``model`` classes and the ``appmaker``.  Changing
+``tests.py``, we'll write a separate test class for each ``model`` class, and
 we'll write a test class for the ``appmaker``.
 
 To do so, we'll retain the ``tutorial.tests.ViewTests`` class that was
-generated as part of the ``zodb`` scaffold.  We'll add three test
-classes: one for the ``Page`` model named ``PageModelTests``, one for the
-``Wiki`` model named ``WikiModelTests``, and one for the appmaker named
-``AppmakerTests``.
+generated as part of the ``zodb`` scaffold.  We'll add three test classes: one
+for the ``Page`` model named ``PageModelTests``, one for the ``Wiki`` model
+named ``WikiModelTests``, and one for the appmaker named ``AppmakerTests``.
 
-Test the Views
+Test the views
 ==============
 
 We'll modify our ``tests.py`` file, adding tests for each view function we
-added above.  As a result, we'll *delete* the ``ViewTests`` test in the file,
-and add four other test classes: ``ViewWikiTests``, ``ViewPageTests``,
-``AddPageTests``, and ``EditPageTests``.  These test the ``view_wiki``,
-``view_page``, ``add_page``, and ``edit_page`` views respectively.
-
+added previously.  As a result, we'll *delete* the ``ViewTests`` class that
+the ``zodb`` scaffold provided, and add four other test classes:
+``ViewWikiTests``, ``ViewPageTests``, ``AddPageTests``, and ``EditPageTests``.
+These test the ``view_wiki``, ``view_page``, ``add_page``, and ``edit_page``
+views.
 
 Functional tests
 ================
 
-We test the whole application, covering security aspects that are not
+We'll test the whole application, covering security aspects that are not
 tested in the unit tests, like logging in, logging out, checking that
 the ``viewer`` user cannot add or edit pages, but the ``editor`` user
 can, and so on.
@@ -41,14 +39,14 @@ can, and so on.
 View the results of all our edits to ``tests.py``
 =================================================
 
-Once we're done with the ``tests.py`` module, it will look a lot like the
-below:
+Open the ``tutorial/tests.py`` module, and edit it such that it appears as
+follows:
 
 .. literalinclude:: src/tests/tutorial/tests.py
    :linenos:
    :language: python
 
-Running the Tests
+Running the tests
 =================
 
 We can run these tests by using ``setup.py test`` in the same way we did in
@@ -62,7 +60,7 @@ Change the ``requires`` list in ``setup.py`` to include ``WebTest``.
    :lines: 11-22
    :emphasize-lines: 11
 
-After we've added a dependency on WebTest in ``setup.py``, we need to rerun
+After we've added a dependency on WebTest in ``setup.py``, we need to run
 ``setup.py develop`` to get WebTest installed into our virtualenv.  Assuming
 our shell's current working directory is the "tutorial" distribution
 directory:
@@ -94,7 +92,7 @@ On Windows:
 
    c:\pyramidtut\tutorial> %VENV%\Scripts\python setup.py test -q
 
-The expected result looks something like:
+The expected result should look like the following:
 
 .. code-block:: text
 
-- 
cgit v1.2.3


From 4a8e9a385336ad1ebcd89801587c4242804d110a Mon Sep 17 00:00:00 2001
From: Steve Piercy <web@stevepiercy.com>
Date: Wed, 27 May 2015 03:48:07 -0700
Subject: clean up and make consistent across wikis

---
 docs/tutorials/wiki/distributing.rst | 34 ++++++++++++++++------------------
 1 file changed, 16 insertions(+), 18 deletions(-)

(limited to 'docs/tutorials/wiki')

diff --git a/docs/tutorials/wiki/distributing.rst b/docs/tutorials/wiki/distributing.rst
index 9c63cf0bd..fee50a1cf 100644
--- a/docs/tutorials/wiki/distributing.rst
+++ b/docs/tutorials/wiki/distributing.rst
@@ -2,11 +2,11 @@
 Distributing Your Application
 =============================
 
-Once your application works properly, you can create a "tarball" from
-it by using the ``setup.py sdist`` command.  The following commands
-assume your current working directory is the ``tutorial`` package
-we've created and that the parent directory of the ``tutorial``
-package is a virtualenv representing a :app:`Pyramid` environment.
+Once your application works properly, you can create a "tarball" from it by
+using the ``setup.py sdist`` command.  The following commands assume your
+current working directory is the ``tutorial`` package we've created and that
+the parent directory of the ``tutorial`` package is a virtualenv representing
+a :app:`Pyramid` environment.
 
 On UNIX:
 
@@ -27,16 +27,14 @@ The output of such a command will be something like:
    running sdist
    # .. more output ..
    creating dist
-   tar -cf dist/tutorial-0.1.tar tutorial-0.1
-   gzip -f9 dist/tutorial-0.1.tar
-   removing 'tutorial-0.1' (and everything under it)
-
-Note that this command creates a tarball in the "dist" subdirectory
-named ``tutorial-0.1.tar.gz``.  You can send this file to your friends
-to show them your cool new application.  They should be able to
-install it by pointing the ``easy_install`` command directly at it.
-Or you can upload it to `PyPI <http://pypi.python.org>`_ and share it
-with the rest of the world, where it can be downloaded via
-``easy_install`` remotely like any other package people download from
-PyPI.
-
+   tar -cf dist/tutorial-0.0.tar tutorial-0.0
+   gzip -f9 dist/tutorial-0.0.tar
+   removing 'tutorial-0.0' (and everything under it)
+
+Note that this command creates a tarball in the "dist" subdirectory named
+``tutorial-0.0.tar.gz``.  You can send this file to your friends to show them
+your cool new application.  They should be able to install it by pointing the
+``easy_install`` command directly at it. Or you can upload it to `PyPI
+<http://pypi.python.org>`_ and share it with the rest of the world, where it
+can be downloaded via ``easy_install`` remotely like any other package people
+download from PyPI.
-- 
cgit v1.2.3