From d9bb7ddac5c2be077f9d1f250325bb07b4e963ce Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Fri, 11 Jul 2014 22:34:47 -0700 Subject: rearrange docs components --- docs/_includes/components/alerts.html | 85 ----------- docs/_includes/components/badges.html | 72 ---------- docs/_includes/components/dropdowns.html | 98 ------------- docs/_includes/components/navs.html | 235 ------------------------------- 4 files changed, 490 deletions(-) delete mode 100644 docs/_includes/components/alerts.html delete mode 100644 docs/_includes/components/badges.html delete mode 100644 docs/_includes/components/dropdowns.html delete mode 100644 docs/_includes/components/navs.html (limited to 'docs/_includes/components') diff --git a/docs/_includes/components/alerts.html b/docs/_includes/components/alerts.html deleted file mode 100644 index 749ecc2b4..000000000 --- a/docs/_includes/components/alerts.html +++ /dev/null @@ -1,85 +0,0 @@ -
-

Alerts

- -

Provide contextual feedback messages for typical user actions with the handful of available and flexible alert messages. For inline dismissal, use the alerts jQuery plugin.

- -

Examples

-

Wrap any text and an optional dismiss button in .alert and one of the four contextual classes (e.g., .alert-success) for basic alert messages.

- -
-

No default class

-

Alerts don't have default classes, only base and modifier classes. A default gray alert doesn't make too much sense, so you're required to specify a type via contextual class. Choose from success, info, warning, or danger.

-
- -
- - - - -
-{% highlight html %} - - - - -{% endhighlight %} - -

Dismissible alerts

-

Build on any alert by adding an optional .alert-dismissible and close button.

-
- -
-{% highlight html %} - -{% endhighlight %} - -
-

Ensure proper behavior across all devices

-

Be sure to use the <button> element with the data-dismiss="alert" data attribute.

-
- - -

Use the .alert-link utility class to quickly provide matching colored links within any alert.

-
- - - - -
-{% highlight html %} - - - - -{% endhighlight %} -
diff --git a/docs/_includes/components/badges.html b/docs/_includes/components/badges.html deleted file mode 100644 index df5efe476..000000000 --- a/docs/_includes/components/badges.html +++ /dev/null @@ -1,72 +0,0 @@ -
-

Badges

- -

Easily highlight new or unread items by adding a <span class="badge"> to links, Bootstrap navs, and more.

- -
- Inbox 42 -
-{% highlight html %} -Inbox 42 -{% endhighlight %} - -

Self collapsing

-

When there are no new or unread items, badges will simply collapse (via CSS's :empty selector) provided no content exists within.

- -
-

Cross-browser compatibility

-

Badges won't self collapse in Internet Explorer 8 because it lacks support for the :empty selector.

-
- -

Adapts to active nav states

-

Built-in styles are included for placing badges in active states in pill navigations.

-
- -
- -
-

- - - - -

-
-{% highlight html %} - -{% endhighlight %} -
diff --git a/docs/_includes/components/dropdowns.html b/docs/_includes/components/dropdowns.html deleted file mode 100644 index eabfd9ca7..000000000 --- a/docs/_includes/components/dropdowns.html +++ /dev/null @@ -1,98 +0,0 @@ -
-

Dropdowns

- -

Toggleable, contextual menu for displaying lists of links. Made interactive with the dropdown JavaScript plugin.

- - -

Wrap the dropdown's trigger and the dropdown menu within .dropdown, or another element that declares position: relative;. Then add the menu's HTML.

-
- -
-{% highlight html %} - -{% endhighlight %} - - -

By default, a dropdown menu is automatically positioned 100% from the top and along the left side of its parent. Add .dropdown-menu-right to a .dropdown-menu to right align the dropdown menu.

-
-

May require additional positioning

-

Dropdowns are automatically positioned via CSS within the normal flow of the document. This means dropdowns may be cropped by parents with certain overflow properties or appear out of bounds of the viewport. Address these issues on your own as they arise.

-
-{% highlight html %} - -{% endhighlight %} - - -

Add a header to label sections of actions in any dropdown menu.

-
- -
-{% highlight html %} - -{% endhighlight %} - - -

Add .disabled to a <li> in the dropdown to disable the link.

-
- -
-{% highlight html %} - -{% endhighlight %} -
diff --git a/docs/_includes/components/navs.html b/docs/_includes/components/navs.html deleted file mode 100644 index f474a0998..000000000 --- a/docs/_includes/components/navs.html +++ /dev/null @@ -1,235 +0,0 @@ -
-

Navs

- -

Navigation available in Bootstrap share general markup and styles, from the base .nav class to the active and disabled states. Swap modifier classes to switch between each style.

- - -

Roll your own navigation style by extending the base .nav component. All Bootstrap's nav components are built on top of this. Includes styles for the disabled state, but not the active state.

- -{% example html %} - -{% endexample %} - -

Classes are used so your markup can be super flexible.

- -{% highlight html %} - -{% endhighlight %} - - - -

Takes the basic nav from above and adds the .nav-tabs class to generate a tabbed interface.

-
- -
-{% highlight html %} - -{% endhighlight %} -
-

Requires JavaScript tabs plugin

-

For tabs with tabbable areas, you must use the tabs JavaScript plugin.

-
- - -

Take that same HTML, but use .nav-pills instead:

-
- -
-{% highlight html %} - -{% endhighlight %} - - -

Just add .nav-stacked.

-
- -
-{% highlight html %} - -{% endhighlight %} - - - -

Add dropdown menus with a little extra HTML and the dropdowns JavaScript plugin.

- -

Tabs with dropdowns

- -{% highlight html %} - -{% endhighlight %} - -

Pills with dropdowns

- -{% highlight html %} - -{% endhighlight %} -
-- cgit v1.2.3