forked from varia/varia.website
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
403 lines
10 KiB
403 lines
10 KiB
.. default-role:: code
|
|
|
|
.. role:: text-muted
|
|
.. role:: text-primary
|
|
.. role:: text-success
|
|
.. role:: text-info
|
|
.. role:: text-warning
|
|
.. role:: text-danger
|
|
|
|
|
|
.. ----------------------------------------------------------------------------
|
|
.. header:: bs-docs-header
|
|
|
|
.. container:: container
|
|
|
|
:h1:`Bootstrap RST`
|
|
|
|
An overview of Bootstrap RST, basic templates and examples, and more.
|
|
.. ----------------------------------------------------------------------------
|
|
|
|
.. ----------------------------------------------------------------------------
|
|
.. footer:: bs-docs-footer
|
|
|
|
Bootstrap RST - Copyright (c) 2014 Nicolas P. Rougier
|
|
|
|
`Bootstrap <http://getbootstrap.com>`_ - Copyright (c) 2011-2014 Twitter, Inc
|
|
|
|
Code licensed under MIT, documentation under CC BY 3.0.
|
|
|
|
`Get page source <doc/index.rst>`_
|
|
|
|
.. class:: bs-docs-footer-links muted
|
|
|
|
* `GitHub <https://github.com/rougier/bootstrap-rst>`_
|
|
* ·
|
|
* `Examples <examples.html>`_
|
|
* ·
|
|
* `Documentation <about.html>`_
|
|
* ·
|
|
* `About <about.html>`_
|
|
* ·
|
|
* `Issues <https://github.com/rougier/bootstrap-rst/issues>`_
|
|
* ·
|
|
* `Releases <https://github.com/rougier/bootstrap-rst/releases>`_
|
|
.. ----------------------------------------------------------------------------
|
|
|
|
|
|
.. ----------------------------------------------------------------------------
|
|
.. sidebar:: sidebar
|
|
|
|
.. contents:: content
|
|
:depth: 2
|
|
.. ----------------------------------------------------------------------------
|
|
|
|
Bootstrap RST
|
|
===============================================================================
|
|
.. lead:: Bootstrap RST provides easy acces to bootstrap using the restructured
|
|
text markup language.
|
|
|
|
Bootstrap RST offers an easy access to the `bootstrap
|
|
<http://getbootstrap.com/>`_ framework using the `restructured text`_ markup
|
|
language. Bootstrap RST provides a set of new directives and roles (row,
|
|
column, button, list, etc.) that allow seamless integration of the bootstrap
|
|
framework. Have a look at the `source`_ of this page for example and see below
|
|
for what is available so far.
|
|
|
|
.. _Nicolas P. Rougier: http://www.loria.fr/~rougier/
|
|
.. _restructured text: http://docutils.sourceforge.net/rst.html
|
|
.. _source: doc/index.rst
|
|
|
|
|
|
|
|
Work in Progress
|
|
===============================================================================
|
|
.. lead:: Bootstrap RST is work in progress. We report here what has been done
|
|
so far, what needs to be done and what is not relevant.
|
|
.. ----------------------------------------------------------------------------
|
|
|
|
|
|
CSS
|
|
---
|
|
|
|
Global CSS settings, fundamental HTML elements styled and enhanced with
|
|
extensible classes, and an advanced grid system.
|
|
|
|
|
|
.. row::
|
|
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Grid system`
|
|
|
|
.. progress:: 100%
|
|
:class: success
|
|
:label: Done !
|
|
See `grids <CSS.html#grid-system>`_
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Typography`
|
|
|
|
.. progress:: 100%
|
|
:class: success
|
|
:label: Done !
|
|
See `typography <CSS.html#typography>`_
|
|
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Code`
|
|
|
|
.. progress:: 100%
|
|
:class: success
|
|
:label: Done !
|
|
See `code <CSS.html#code>`_
|
|
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Tables`
|
|
|
|
.. progress:: 100%
|
|
:class: success
|
|
:label: Done !
|
|
|
|
See `tables <CSS.html#tables>`_
|
|
.. -------------------------------------------------------------------------
|
|
|
|
|
|
.. row::
|
|
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Forms`
|
|
:text-muted:`N/A`
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Buttons`
|
|
|
|
.. progress:: 100%
|
|
:class: success
|
|
:label: Done !
|
|
See `buttons <CSS.html#buttons>`_
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Images`
|
|
|
|
.. progress:: 100%
|
|
:class: success
|
|
:label: Done !
|
|
See `images <CSS.html#images>`_
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Helper classes`
|
|
|
|
.. progress:: 50%
|
|
:class: warning
|
|
:label: WIP
|
|
|
|
See `helper classes <CSS.html#helper-classes>`_
|
|
.. -------------------------------------------------------------------------
|
|
|
|
|
|
|
|
Components
|
|
----------
|
|
|
|
Over a dozen reusable components built to provide iconography, dropdowns, input
|
|
groups, navigation, alerts, and much more.
|
|
|
|
|
|
.. row::
|
|
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Glyphicons`
|
|
|
|
.. progress:: 100%
|
|
:class: success
|
|
:label: Done !
|
|
See `glyphicons <components.html#glyphicons>`_
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Dropdowns`
|
|
|
|
.. progress:: 100%
|
|
:class: success
|
|
:label: Done !
|
|
See `dropdowns <components.html#dropdowns>`_
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Button groups`
|
|
|
|
.. progress:: 100%
|
|
:class: success
|
|
:label: Done !
|
|
See `button groups <components.html#button-groups>`_
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Glyphicons`
|
|
|
|
.. progress:: 100%
|
|
:class: success
|
|
:label: Done !
|
|
See `button dropdowns <components.html#button-dropdowns>`_
|
|
.. -------------------------------------------------------------------------
|
|
|
|
|
|
.. row::
|
|
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Input groups`
|
|
:text-muted:`N/A`
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Navs`
|
|
|
|
.. progress:: 25%
|
|
:class: danger
|
|
:label: WIP
|
|
See `navs <components.html#navs>`_
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Navbar`
|
|
|
|
.. progress:: 25%
|
|
:class: danger
|
|
:label: WIP
|
|
See `navbar <components.html#navbar>`_
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Breadcrumbs`
|
|
|
|
.. progress:: 100%
|
|
:class: success
|
|
:label: Done !
|
|
See `breadcrumbs <components.html#breadcrumbs>`_
|
|
.. -------------------------------------------------------------------------
|
|
|
|
|
|
.. row::
|
|
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Pagination`
|
|
|
|
.. progress:: 25%
|
|
:class: danger
|
|
:label: WIP
|
|
See `pagination <components.html#pagination>`_
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Labels`
|
|
|
|
.. progress:: 100%
|
|
:class: success
|
|
:label: Done !
|
|
See `labels <components.html#labels>`_
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Badges`
|
|
|
|
.. progress:: 100%
|
|
:class: success
|
|
:label: Done !
|
|
See `badges <components.html#badges>`_
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Jumbotron`
|
|
|
|
.. progress:: 100%
|
|
:class: success
|
|
:label: Done !
|
|
See `jumbotron <components.html#jumbotron>`_
|
|
.. -------------------------------------------------------------------------
|
|
|
|
|
|
.. row::
|
|
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Page header`
|
|
|
|
.. progress:: 100%
|
|
:class: success
|
|
:label: Done !
|
|
See `page header <components.html#page-header>`_
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Thumbnails`
|
|
|
|
.. progress:: 100%
|
|
:class: success
|
|
:label: Done !
|
|
See `thumbnails <components.html#thumbnails>`_
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Alerts`
|
|
|
|
.. progress:: 100%
|
|
:class: success
|
|
:label: Done !
|
|
See `alerts <components.html#alerts>`_
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Progress bars`
|
|
|
|
.. progress:: 100%
|
|
:class: success
|
|
:label: Done !
|
|
See `progress bars <components.html#progress-bars>`_
|
|
.. -------------------------------------------------------------------------
|
|
|
|
|
|
.. row::
|
|
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Media object`
|
|
|
|
.. progress:: 25%
|
|
:class: danger
|
|
:label: WIP
|
|
See `media object <components.html#media-object>`_
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`List group`
|
|
|
|
.. progress:: 25%
|
|
:class: danger
|
|
:label: WIP
|
|
See `list group <components.html#list-group>`_
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Panels`
|
|
|
|
.. progress:: 25%
|
|
:class: danger
|
|
:label: WIP
|
|
See `panels <components.html#panels>`_
|
|
.. -------------------------------------------------------------------------
|
|
.. column::
|
|
:width: 3
|
|
|
|
:h4:`Wells`
|
|
|
|
.. progress:: 100%
|
|
:class: success
|
|
:label: Done !
|
|
See `wells <components.html#wells>`_
|
|
.. -------------------------------------------------------------------------
|
|
|