diff options
| author | Mark Otto <[email protected]> | 2013-09-08 18:37:39 -0700 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2013-09-08 18:37:39 -0700 |
| commit | 77549410d52f86c2d42136014f5a2ae21f4cabee (patch) | |
| tree | c6b2bd111d66d60dc258cd63bc38b55f18cea312 | |
| parent | afb6cf1d01c28bd0a1c6803f727eb7408b70c16e (diff) | |
| download | bootstrap-77549410d52f86c2d42136014f5a2ae21f4cabee.tar.xz bootstrap-77549410d52f86c2d42136014f5a2ae21f4cabee.zip | |
Add Welcome section to docs
* Fixes unrelated typo in readme
* Add new Welcome section with history, team, callouts, and community
subsections
* Redesigns callouts to be a bit lighterweight with colored headings
| -rw-r--r-- | README.md | 2 | ||||
| -rw-r--r-- | _includes/nav-getting-started.html | 9 | ||||
| -rw-r--r-- | assets/css/docs.css | 64 | ||||
| -rw-r--r-- | getting-started.html | 67 |
4 files changed, 132 insertions, 10 deletions
@@ -97,7 +97,7 @@ Editor preferences are available in the [editor config](.editorconfig) for easy Keep track of development and community news. * Follow [@twbootstrap on Twitter](http://twitter.com/twbootstrap). -* Read and subscribe to the [The Official Bootstrap Blog](http://blog.getbootstrap.com). +* Read and subscribe to [The Official Bootstrap Blog](http://blog.getbootstrap.com). * Have a question that's not a feature request or bug report? [Ask on the mailing list.](http://groups.google.com/group/twitter-bootstrap) * Chat with fellow Bootstrappers in IRC. On the `irc.freenode.net` server, in the `##twitter-bootstrap` channel. diff --git a/_includes/nav-getting-started.html b/_includes/nav-getting-started.html index 243c05fb0..c06896e6a 100644 --- a/_includes/nav-getting-started.html +++ b/_includes/nav-getting-started.html @@ -1,4 +1,13 @@ <li> + <a href="#welcome">Welcome</a> + <ul class="nav"> + <li><a href="#welcome-history">Brief history</a></li> + <li><a href="#welcome-core-team">Core team</a></li> + <li><a href="#welcome-callouts">Callouts</a></li> + <li><a href="#welcome-community">Community</a></li> + </ul> +</li> +<li> <a href="#download">Download Bootstrap</a> <ul class="nav"> <li><a href="#download-compiled">Compiled CSS, JS, and fonts</a></li> diff --git a/assets/css/docs.css b/assets/css/docs.css index 2b800732d..0979af07c 100644 --- a/assets/css/docs.css +++ b/assets/css/docs.css @@ -514,33 +514,79 @@ h1[id] { /* Common styles for all types */ .bs-callout { + /*position: relative;*/ margin: 20px 0; - padding: 15px 30px 15px 15px; - border-left: 5px solid #eee; + padding: 20px; + border-left: 3px solid #eee; + /*border-width: 1px 1px 1px 10px;*/ } +/*.bs-callout:before { + position: absolute; + top: 0; + left: -20px; + color: #fff; + width: 20px; + height: 20px; +}*/ .bs-callout h4 { margin-top: 0; + margin-bottom: 5px; } .bs-callout p:last-child { margin-bottom: 0; } .bs-callout code, .bs-callout .highlight { - background-color: #fff; + /*background-color: #fff;*/ } /* Variations */ .bs-callout-danger { - background-color: #fcf2f2; - border-color: #dFb5b4; + background-color: #fdf7f7; + border-color: #eed3d7; +} +.bs-callout-danger h4 { + color: #b94a48; } .bs-callout-warning { - background-color: #fefbed; - border-color: #f1e7bc; + background-color: #faf8f0; + border-color: #faebcc; +} +.bs-callout-warning h4 { + color: #c09853; } .bs-callout-info { - background-color: #f0f7fd; - border-color: #d0e3f0; + background-color: #f4f8fa; + border-color: #bce8f1; +} +.bs-callout-info h4 { + color: #3a87ad; +} + + +/* + * Team members + * + * Avatars, names, and usernames for core team. + */ + +.bs-team .team-member { + color: #555; + line-height: 32px; +} +.bs-team .team-member:hover { + color: #333; + text-decoration: none; +} +.bs-team iframe { + float: right; + margin-top: 6px; +} +.bs-team img { + float: left; + width: 32px; + margin-right: 10px; + border-radius: 4px; } diff --git a/getting-started.html b/getting-started.html index 5986f43eb..146063590 100644 --- a/getting-started.html +++ b/getting-started.html @@ -7,6 +7,72 @@ base_url: "../" --- + <!-- Welcome + ================================================== --> + <div class="bs-docs-section"> + <div class="page-header"> + <h1 id="welcome">Welcome!</h1> + </div> + <p class="lead">You're looking at the official documentation for Bootstrap, a front-end framework for building on the Web. Get the background story on Bootstrap, useful tidbits about the docs, helpful community links, and more.</p> + + <h2 id="welcome-history">Brief history</h3> + <p>Bootstrap was created at Twitter in mid-2010 by <a href="https://twitter.com/mdo">@mdo</a> and <a href="https://twitter.com/fat">@fat</a>. Before being an open source framework, Bootstrap was known as Twitter Blueprint. A few months into development, Twitter held it's <a href="https://blog.twitter.com/2010/hack-week">first Hack Week</a> and the project exploded. It served as the style guide for internal tools development at the company for over a year before it's public release.</p> + <p>Originally <a href="https://dev.twitter.com/blog/bootstrap-twitter">released</a> on <a href="https://twitter.com/mdo/statuses/104620039650557952">Friday, August 19, 2011</a>, we've had over <a href="https://github.com/twbs/bootstrap/releases">twenty releases</a>, including two major rewrites with v2 and v3.</p> + + <h2 id="welcome-core-team">Core team</h2> + <p>Bootstrap is maintained by the founding team and a small group of invaluable core contributors, with the massive support and involvement of our community.</p> + <div class="list-group bs-team"> + <a class="list-group-item team-member" href="https://github.com/mdo"> + <iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=mdo&type=follow" width="120" height="20"></iframe> + <img src="https://0.gravatar.com/avatar/bc4ab438f7a4ce1c406aadc688427f2c?d=https%3A%2F%2Fidenticons.github.com%2F10339ec809c5a79dbf25614ba22eee40.png" alt="@mdo"> + <strong>Mark Otto</strong> <small>@mdo</small> + </a> + <a class="list-group-item team-member" href="https://github.com/fat"> + <iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=fat&type=follow" width="120" height="20"></iframe> + <img src="https://2.gravatar.com/avatar/a98244cbdacaf1c0b55499466002f7a8?d=https%3A%2F%2Fidenticons.github.com%2F313701b540df992682dccc8f70dc12a0.png" alt="@fat"> + <strong>Jacob Thornton</strong> <small>@fat</small> + </a> + <a class="list-group-item team-member" href="https://github.com/juthilo"> + <iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=cvrebert&type=follow" width="120" height="20"></iframe> + <img src="https://0.gravatar.com/avatar/edec428c425453955f770095a7d26c50?d=https%3A%2F%2Fidenticons.github.com%2F1b08c04e9008c9f801938b05a1bb8d88.png" alt="@cvrebert"> + <strong>Chris Rebert</strong> <small>@cvrebert</small> + </a> + <a class="list-group-item team-member" href="https://github.com/juthilo"> + <iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=juthilo&type=follow" width="120" height="20"></iframe> + <img src="https://0.gravatar.com/avatar/0f7dd3ce58a416be5685ea6194f82b11?d=https%3A%2F%2Fidenticons.github.com%2Fafd0c2227d136850c00b96f7359a70c6.png" alt="@juthilo"> + <strong>Julian Thilo</strong> <small>@juthilo</small> + </a> + </div> + <p>Get involved with Bootstrap development by <a href="https://github.com/twbs/bootstrap/issues/new">opening an issue</a> or submitting a pull request. Read our <a href="https://github.com/twbs/bootstrap/blob/master/CONTRIBUTING.md">contributing guidelines</a> for more information.</p> + + <h2 id="welcome-callouts">Callouts</h2> + <p>We use callouts throughout the docs to direct attention to important contextual information. These callouts can be informative and optional (blue), warnings (yellow), or dangerously important (red).</p> + <div class="bs-callout bs-callout-info"> + <h4>Extra information</h4> + <p>These are helpful notes that provide background information or additional context.</p> + </div> + <div class="bs-callout bs-callout-warning"> + <h4>Heads up</h4> + <p>This is a warning used to highlight pertinent, though not necessarily required, information.</p> + </div> + <div class="bs-callout bs-callout-danger"> + <h4>Potential danger ahead</h4> + <p>Pay attention to these for potentially dangerous or tricky requirements, bugs, and more.</p> + </div> + <p>See something worth calling out? Let us know with an <a href="https://github.com/twbs/bootstrap/issues/new">issue on GitHub</a>.</p> + + <h2 id="welcome-community">Community</h2> + <p>Stay up to date on the development of Bootstrap and reach out to the community with these helpful resources.</p> + <ul> + <li>Read and subscribe to <a href="http://blog.getbootstrap.com/">The Official Bootstrap Blog</a>.</li> + <li>Have a question that's not a feature request or bug report? <a href="http://groups.google.com/group/twitter-bootstrap">Ask on the mailing list.</a></li> + <li>Chat with fellow Bootstrappers in IRC. On the <code>irc.freenode.net</code> server, in the <code>##twitter-bootstrap</code> channel.</li> + <li>Find inspiring examples of Bootstrap at the <a href="http://expo.getbootstrap.com">Bootstrap Expo</a>.</li> + </ul> + <p>You can also follow <a href="https://twitter.com/twbootstrap">@twbootstrap on Twitter</a> for the latest gossip and awesome music videos.</p> + </div> + + <!-- Getting started ================================================== --> <div class="bs-docs-section"> @@ -55,6 +121,7 @@ base_url: "../" </div> </div> + <!-- File structure ================================================== --> <div class="bs-docs-section"> |
