Skip to content

B
bootstrap
Commit aaf9f752 authored by Mark Otto's avatar Mark Otto
Browse files
Options

docs spacing, spare divs in a few places, updating css spacing

parent 14b77f3a
Hide whitespace changes
Inline Side-by-side
Showing with 99 additions and 119 deletions
docs/assets/css/docs.css
View file @ aaf9f752
...@@ -146,34 +146,6 @@ div.quickstart form textarea { ...@@ -146,34 +146,6 @@ div.quickstart form textarea {
.show-grid:hover .column, .show-grid:hover .columns { .show-grid:hover .column, .show-grid:hover .columns {
background: rgba(0, 0, 0, 0.25); background: rgba(0, 0, 0, 0.25);
} }
/* Hashgrid.js grid (press G & H to view)
-------------------------------------------------- */
#grid {
width: 980px;
position: absolute;
top: 0;
left: 50%;
margin-left: -490px;
}
#grid div.vert {
background-color: rgba(0, 206, 209, 0.075);
width: 39px;
border: solid darkturquoise;
border-width: 0 1px;
margin-right: 19px;
}
#grid div.vert.first-line {
margin-left: 19px;
}
#grid div.horiz {
height: 19px;
border-bottom: 1px solid rgba(255, 0, 0, 0.1);
margin: 0;
padding: 0;
}
#grid div.horiz:nth-child(5n) {
border-color: rgba(255, 0, 0, 0.25);
}
/* Render mini layout previews /* Render mini layout previews
-------------------------------------------------- */ -------------------------------------------------- */
div.mini-layout { div.mini-layout {
...@@ -199,7 +171,9 @@ div.mini-layout div.mini-layout-body { ...@@ -199,7 +171,9 @@ div.mini-layout div.mini-layout-body {
width: 450px; width: 450px;
height: 340px; height: 340px;
} }
div.mini-layout.fluid div.mini-layout-sidebar, div.mini-layout.fluid div.mini-layout-header, div.mini-layout.fluid div.mini-layout-body { div.mini-layout.fluid div.mini-layout-sidebar,
div.mini-layout.fluid div.mini-layout-header,
div.mini-layout.fluid div.mini-layout-body {
float: left; float: left;
} }
div.mini-layout.fluid div.mini-layout-sidebar { div.mini-layout.fluid div.mini-layout-sidebar {
......
docs/index.html
View file @ aaf9f752
...@@ -878,7 +878,7 @@ ...@@ -878,7 +878,7 @@
<h2>Fixed topbar</h2> <h2>Fixed topbar</h2>
<div class="topbar-wrapper" style="z-index: 5;"> <div class="topbar-wrapper" style="z-index: 5;">
<div class="topbar"> <div class="topbar">
<div class="container fixed"> <div class="container">
<h3><a href="#">Project Name</a></h3> <h3><a href="#">Project Name</a></h3>
<ul> <ul>
<li class="active"><a href="#">Home</a></li> <li class="active"><a href="#">Home</a></li>
...@@ -920,20 +920,20 @@ ...@@ -920,20 +920,20 @@
<br /> <br />
<div class="row"> <div class="row">
<div class="span4 columns"> <div class="span4 columns">
<h2>Tabs and pills</h2> <h2>Tabs and pills</h2>
<p>Create simple secondary navigation with a <code>&lt;ul&gt;</code>. Swap between tabs or pills by adding the appropriate class.</p> <p>Create simple secondary navigation with a <code>&lt;ul&gt;</code>. Swap between tabs or pills by adding the appropriate class.</p>
<p>Great for sub-sections of content like our account settings pages and user timelines for toggling between pages of like content. Available in tabbed or pill styles.</p> <p>Great for sub-sections of content like our account settings pages and user timelines for toggling between pages of like content. Available in tabbed or pill styles.</p>
</div> </div>
<div class="span12 columns"> <div class="span12 columns">
<ul class="tabs"> <ul class="tabs">
<li class="active"><a href="#">Home</a></li> <li class="active"><a href="#">Home</a></li>
<li><a href="#">Profile</a></li> <li><a href="#">Profile</a></li>
<li><a href="#">Messages</a></li> <li><a href="#">Messages</a></li>
<li><a href="#">Settings</a></li> <li><a href="#">Settings</a></li>
<li><a href="#">Contact</a></li> <li><a href="#">Contact</a></li>
</ul> </ul>
<pre class="prettyprint linenums"> <pre class="prettyprint linenums">
&lt;ul class="tabs"&gt; &lt;ul class="tabs"&gt;
&lt;li class="active"&gt;&lt;a href="#"&gt;Home&lt;/a&gt;&lt;/li&gt; &lt;li class="active"&gt;&lt;a href="#"&gt;Home&lt;/a&gt;&lt;/li&gt;
...@@ -943,13 +943,13 @@ ...@@ -943,13 +943,13 @@
&lt;li&gt;&lt;a href="#"&gt;Contact&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Contact&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt; &lt;/ul&gt;
</pre> </pre>
<ul class="pills"> <ul class="pills">
<li class="active"><a href="#">Home</a></li> <li class="active"><a href="#">Home</a></li>
<li><a href="#">Profile</a></li> <li><a href="#">Profile</a></li>
<li><a href="#">Messages</a></li> <li><a href="#">Messages</a></li>
<li><a href="#">Settings</a></li> <li><a href="#">Settings</a></li>
<li><a href="#">Contact</a></li> <li><a href="#">Contact</a></li>
</ul> </ul>
<pre class="prettyprint linenums"> <pre class="prettyprint linenums">
&lt;ul class="pills"&gt; &lt;ul class="pills"&gt;
&lt;li class="active"&gt;&lt;a href="#"&gt;Home&lt;/a&gt;&lt;/li&gt; &lt;li class="active"&gt;&lt;a href="#"&gt;Home&lt;/a&gt;&lt;/li&gt;
...@@ -959,56 +959,57 @@ ...@@ -959,56 +959,57 @@
&lt;li&gt;&lt;a href="#"&gt;Contact&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Contact&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt; &lt;/ul&gt;
</pre> </pre>
</div>
</div>
<div class="row">
<div class="span4 columns">
<h2>Pagination</h2>
<p>Ultra simplistic and minimally styled pagination inspired by Rdio. The large block is hard to miss, easily scalable, and provides large click areas.</p>
</div>
<div class="span12 columns">
<div class="pagination">
<ul>
<li class="prev disabled"><a href="#">&larr; Previous</a></li>
<li class="active"><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
<li class="next"><a href="#">Next &rarr;</a></li>
</ul>
</div>
<div class="pagination">
<ul>
<li class="prev"><a href="#">&larr; Previous</a></li>
<li class="active"><a href="#">10</a></li>
<li><a href="#">11</a></li>
<li><a href="#">12</a></li>
<li class="disabled"><a href="#">…</a></li>
<li><a href="#">19</a></li>
<li><a href="#">20</a></li>
<li><a href="#">21</a></li>
<li class="next"><a href="#">Next &rarr;</a></li>
</ul>
</div> </div>
<div class="pagination"> </div> <!-- /row -->
<ul>
<li class="prev"><a href="#">&larr; Previous</a></li> <!-- Pagination -->
<li><a href="#">10</a></li> <div class="row">
<li><a href="#">11</a></li> <div class="span4 columns">
<li><a href="#">12</a></li> <h2>Pagination</h2>
<li><a href="#">13</a></li> <p>Ultra simplistic and minimally styled pagination inspired by Rdio. The large block is hard to miss, easily scalable, and provides large click areas.</p>
<li><a href="#">14</a></li>
<li class="active"><a href="#">15</a></li>
<li><a href="#">16</a></li>
<li><a href="#">17</a></li>
<li><a href="#">18</a></li>
<li><a href="#">19</a></li>
<li><a href="#">20</a></li>
<li class="next"><a href="#">Next &rarr;</a></li>
</ul>
</div> </div>
<div class="span12 columns">
<div class="pagination">
<ul>
<li class="prev disabled"><a href="#">&larr; Previous</a></li>
<li class="active"><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
<li class="next"><a href="#">Next &rarr;</a></li>
</ul>
</div>
<div class="pagination">
<ul>
<li class="prev"><a href="#">&larr; Previous</a></li>
<li class="active"><a href="#">10</a></li>
<li><a href="#">11</a></li>
<li><a href="#">12</a></li>
<li class="disabled"><a href="#">…</a></li>
<li><a href="#">19</a></li>
<li><a href="#">20</a></li>
<li><a href="#">21</a></li>
<li class="next"><a href="#">Next &rarr;</a></li>
</ul>
</div>
<div class="pagination">
<ul>
<li class="prev"><a href="#">&larr; Previous</a></li>
<li><a href="#">10</a></li>
<li><a href="#">11</a></li>
<li><a href="#">12</a></li>
<li><a href="#">13</a></li>
<li><a href="#">14</a></li>
<li class="active"><a href="#">15</a></li>
<li><a href="#">16</a></li>
<li><a href="#">17</a></li>
<li><a href="#">18</a></li>
<li><a href="#">19</a></li>
<li><a href="#">20</a></li>
<li class="next"><a href="#">Next &rarr;</a></li>
</ul>
</div>
<pre class="prettyprint linenums"> <pre class="prettyprint linenums">
&lt;div class="pagination"&gt; &lt;div class="pagination"&gt;
&lt;ul&gt; &lt;ul&gt;
...@@ -1022,8 +1023,8 @@ ...@@ -1022,8 +1023,8 @@
&lt;/ul&gt; &lt;/ul&gt;
&lt;/div&gt; &lt;/div&gt;
</pre> </pre>
</div> </div>
</div> </div> <!-- /row -->
</section> </section>
...@@ -1033,6 +1034,7 @@ ...@@ -1033,6 +1034,7 @@
<div class="page-header"> <div class="page-header">
<h1>Alerts &amp; Errors <small>Styles for success, warning, and error messages or alerts</small></h1> <h1>Alerts &amp; Errors <small>Styles for success, warning, and error messages or alerts</small></h1>
</div> </div>
<!-- Basic alert messages -->
<div class="row"> <div class="row">
<div class="span4 columns"> <div class="span4 columns">
<h2>Basic alerts</h2> <h2>Basic alerts</h2>
...@@ -1056,7 +1058,8 @@ ...@@ -1056,7 +1058,8 @@
<p><strong>Heads up!</strong> This is an alert that needs your attention, but it’s not a huge priority just yet.</p> <p><strong>Heads up!</strong> This is an alert that needs your attention, but it’s not a huge priority just yet.</p>
</div> </div>
</div> </div>
</div> </div> <!-- /row -->
<!-- Block messages -->
<div class="row"> <div class="row">
<div class="span4 columns"> <div class="span4 columns">
<h2>Block messages</h2> <h2>Block messages</h2>
...@@ -1084,11 +1087,13 @@ ...@@ -1084,11 +1087,13 @@
<p><a class="btn small" href="#">Take this action</a> <a class="btn small" href="#">Or do this</a></p> <p><a class="btn small" href="#">Take this action</a> <a class="btn small" href="#">Or do this</a></p>
</div> </div>
</div> </div>
</div> </div> <!-- /row -->
</section> </section>
<section id="popovers"> <section id="popovers">
<!-- Popovers, modals, and tooltips -->
<div class="page-header"> <div class="page-header">
<h1>Popovers <small>Components for displaying content in modals, tooltips, and popovers</small></h1> <h1>Popovers <small>Components for displaying content in modals, tooltips, and popovers</small></h1>
</div> </div>
...@@ -1117,6 +1122,7 @@ ...@@ -1117,6 +1122,7 @@
</div> </div>
</div> <!-- /row --> </div> <!-- /row -->
<!-- Tooltips -->
<div class="row"> <div class="row">
<div class="span4 columns"> <div class="span4 columns">
<h2>Tool Tips</h2> <h2>Tool Tips</h2>
...@@ -1149,6 +1155,7 @@ Lorem ipsum dolar sit amet illo error <a href="#" title="below">ipsum</a> verita ...@@ -1149,6 +1155,7 @@ Lorem ipsum dolar sit amet illo error <a href="#" title="below">ipsum</a> verita
</div> </div>
</div> <!-- /row --> </div> <!-- /row -->
<!-- Popovers -->
<div class="row"> <div class="row">
<div class="span4 columns"> <div class="span4 columns">
<h2>Popovers</h2> <h2>Popovers</h2>
...@@ -1172,7 +1179,6 @@ Lorem ipsum dolar sit amet illo error <a href="#" title="below">ipsum</a> verita ...@@ -1172,7 +1179,6 @@ Lorem ipsum dolar sit amet illo error <a href="#" title="below">ipsum</a> verita
</div> </div>
</div> <!-- /row --> </div> <!-- /row -->
</section> </section>
......
lib/preboot.less
View file @ aaf9f752
...@@ -145,39 +145,39 @@ ...@@ -145,39 +145,39 @@
// Border Radius // Border Radius
.border-radius(@radius: 5px) { .border-radius(@radius: 5px) {
-webkit-border-radius: @radius; -webkit-border-radius: @radius;
-moz-border-radius: @radius; -moz-border-radius: @radius;
border-radius: @radius; border-radius: @radius;
} }
// Drop shadows // Drop shadows
.box-shadow(@shadow: 0 1px 3px rgba(0,0,0,.25)) { .box-shadow(@shadow: 0 1px 3px rgba(0,0,0,.25)) {
-webkit-box-shadow: @shadow; -webkit-box-shadow: @shadow;
-moz-box-shadow: @shadow; -moz-box-shadow: @shadow;
box-shadow: @shadow; box-shadow: @shadow;
} }
// Transitions // Transitions
.transition(@transition) { .transition(@transition) {
-webkit-transition: @transition; -webkit-transition: @transition;
-moz-transition: @transition; -moz-transition: @transition;
transition: @transition; transition: @transition;
} }
// Background clipping // Background clipping
.background-clip(@clip) { .background-clip(@clip) {
-webkit-background-clip: @clip; -webkit-background-clip: @clip;
-moz-background-clip: @clip; -moz-background-clip: @clip;
background-clip: @clip; background-clip: @clip;
} }
// CSS3 Content Columns // CSS3 Content Columns
.content-columns(@columnCount, @columnGap: 20px) { .content-columns(@columnCount, @columnGap: 20px) {
-webkit-column-count: @columnCount; -webkit-column-count: @columnCount;
-webkit-column-gap: @columnGap; -moz-column-count: @columnCount;
-moz-column-count: @columnCount; column-count: @columnCount;
-moz-column-gap: @columnGap; -webkit-column-gap: @columnGap;
column-count: @columnCount; -moz-column-gap: @columnGap;
column-gap: @columnGap; column-gap: @columnGap;
} }
// Buttons // Buttons
...@@ -265,6 +265,6 @@ ...@@ -265,6 +265,6 @@
.opacity(@opacity: 100) { .opacity(@opacity: 100) {
filter: e(%("alpha(opacity=%d)", @opacity)); filter: e(%("alpha(opacity=%d)", @opacity));
-khtml-opacity: @opacity / 100; -khtml-opacity: @opacity / 100;
-moz-opacity: @opacity / 100; -moz-opacity: @opacity / 100;
opacity: @opacity / 100; opacity: @opacity / 100;
} }
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment