Skip to content

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

remove static popovers, modals, and twipsies from components in favor of full javascript page

parent 83c08969
Hide whitespace changes
Inline Side-by-side
Showing with 14 additions and 107 deletions
bootstrap.css
View file @ 5032ef9b
......@@ -6,7 +6,7 @@
* http://www.apache.org/licenses/LICENSE-2.0
*
* Designed and built with all the love in the world @twitter by @mdo and @fat.
* Date: Sun Jan 8 19:32:37 PST 2012
* Date: Sun Jan 8 21:54:13 PST 2012
*/
html, body {
margin: 0;
......@@ -1577,6 +1577,7 @@ i {
filter: alpha(opacity=40);
-moz-opacity: 0.4;
opacity: 0.4;
cursor: pointer;
}
.navbar {
overflow: visible;
......
bootstrap.min.css
View file @ 5032ef9b
......@@ -309,7 +309,7 @@ i{background-image:url(docs/assets/img/glyphicons-halflings-sprite.png);backgrou
.well{min-height:20px;padding:19px;margin-bottom:20px;background-color:#f5f5f5;border:1px solid #eee;border:1px solid rgba(0, 0, 0, 0.05);-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.05);-moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.05);box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.05);}.well blockquote{border-color:#ddd;border-color:rgba(0, 0, 0, 0.15);}
.fade{-webkit-transition:opacity 0.15s linear;-moz-transition:opacity 0.15s linear;-ms-transition:opacity 0.15s linear;-o-transition:opacity 0.15s linear;transition:opacity 0.15s linear;opacity:0;}.fade.in{opacity:1;}
.collapse{-webkit-transition:height 0.35s ease;-moz-transition:height 0.35s ease;-ms-transition:height 0.35s ease;-o-transition:height 0.35s ease;transition:height 0.35s ease;position:relative;overflow:hidden;height:0;}.collapse.in{height:auto;}
.close{float:right;font-size:20px;font-weight:bold;line-height:13.5px;color:#000000;text-shadow:0 1px 0 #ffffff;filter:alpha(opacity=20);-moz-opacity:0.2;opacity:0.2;}.close:hover{color:#000000;text-decoration:none;filter:alpha(opacity=40);-moz-opacity:0.4;opacity:0.4;}
.close{float:right;font-size:20px;font-weight:bold;line-height:13.5px;color:#000000;text-shadow:0 1px 0 #ffffff;filter:alpha(opacity=20);-moz-opacity:0.2;opacity:0.2;}.close:hover{color:#000000;text-decoration:none;filter:alpha(opacity=40);-moz-opacity:0.4;opacity:0.4;cursor:pointer;}
.navbar{overflow:visible;}
.navbar-inner{background-color:#222222;background-color:#222222;background-image:-khtml-gradient(linear, left top, left bottom, from(#333333), to(#222222));background-image:-moz-linear-gradient(top, #333333, #222222);background-image:-ms-linear-gradient(top, #333333, #222222);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #333333), color-stop(100%, #222222));background-image:-webkit-linear-gradient(top, #333333, #222222);background-image:-o-linear-gradient(top, #333333, #222222);background-image:linear-gradient(top, #333333, #222222);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#333333', endColorstr='#222222', GradientType=0);-webkit-box-shadow:0 1px 3px rgba(0, 0, 0, 0.25),inset 0 -1px 0 rgba(0, 0, 0, 0.1);-moz-box-shadow:0 1px 3px rgba(0, 0, 0, 0.25),inset 0 -1px 0 rgba(0, 0, 0, 0.1);box-shadow:0 1px 3px rgba(0, 0, 0, 0.25),inset 0 -1px 0 rgba(0, 0, 0, 0.1);}
.navbar .brand:hover{color:#ffffff;text-decoration:none;}
......
docs/components.html
View file @ 5032ef9b
......@@ -1010,26 +1010,26 @@
</div>
<div class="span9">
<div class="alert-message warning">
<a class="close" href="#">&times;</a>
<a class="close">&times;</a>
<p><strong>Holy guacamole!</strong> Best check yo self, you’re not looking too good.</p>
</div>
<div class="alert-message error">
<a class="close" href="#">&times;</a>
<a class="close">&times;</a>
<p><strong>Oh snap!</strong> Change this and that and try again.</p>
</div>
<div class="alert-message success">
<a class="close" href="#">&times;</a>
<a class="close">&times;</a>
<p><strong>Well done!</strong> You successfully read this alert message.</p>
</div>
<div class="alert-message info">
<a class="close" href="#">&times;</a>
<a class="close">&times;</a>
<p><strong>Heads up!</strong> This is an alert that needs your attention, but it’s not a huge priority just yet.</p>
</div>
<h4>Example code</h4>
<pre class="prettyprint linenums">
&lt;div class="alert-message warning"&gt;
&lt;a class="close" href="#"&gt;&times;&lt;/a&gt;
&lt;a class="close"&gt;&times;&lt;/a&gt;
&lt;p&gt;&lt;strong&gt;Holy guacamole!&lt;/strong&gt; Best check yo self, you’re not looking too good.&lt;/p&gt;
&lt;/div&gt;
</pre>
......@@ -1048,14 +1048,14 @@
</div>
<div class="span9">
<div class="alert-message block-message warning">
<a class="close" href="#">&times;</a>
<a class="close">&times;</a>
<p><strong>Holy guacamole! This is a warning!</strong> Best check yo self, you’re not looking too good. Nulla vitae elit libero, a pharetra augue. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
<div class="alert-actions">
<a class="btn small" href="#">Take this action</a> <a class="btn small" href="#">Or do this</a>
</div>
</div>
<div class="alert-message block-message error">
<a class="close" href="#">&times;</a>
<a class="close">&times;</a>
<p><strong>Oh snap! You got an error!</strong> Change this and that and try again.</p>
<ul>
<li>Duis mollis est non commodo luctus</li>
......@@ -1067,14 +1067,14 @@
</div>
</div>
<div class="alert-message block-message success">
<a class="close" href="#">&times;</a>
<a class="close">&times;</a>
<p><strong>Well done!</strong> You successfully read this alert message. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Maecenas faucibus mollis interdum.</p>
<div class="alert-actions">
<a class="btn small" href="#">Take this action</a> <a class="btn small" href="#">Or do this</a>
</div>
</div>
<div class="alert-message block-message info">
<a class="close" href="#">&times;</a>
<a class="close">&times;</a>
<p><strong>Heads up!</strong> This is an alert that needs your attention, but it’s not a huge priority just yet.</p>
<div class="alert-actions">
<a class="btn small" href="#">Take this action</a> <a class="btn small" href="#">Or do this</a>
......@@ -1084,7 +1084,7 @@
<h4>Example code</h4>
<pre class="prettyprint linenums">
&lt;div class="alert-message block-message warning"&gt;
&lt;a class="close" href="#"&gt;&times;&lt;/a&gt;
&lt;a class="close"&gt;&times;&lt;/a&gt;
&lt;p&gt;&lt;strong&gt;Holy guacamole! This is a warning!&lt;/strong&gt; Best check yo self, you’re not looking too good. Nulla vitae elit libero, a pharetra augue. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.&lt;/p&gt;
&lt;div class="alert-actions"&gt;
&lt;a class="btn small" href="#"&gt;Take this action&lt;/a&gt; &lt;a class="btn small" href="#"&gt;Or do this&lt;/a>
......@@ -1096,101 +1096,6 @@
</section>
<!-- Modals
================================================== -->
<section id="popovers">
<div class="page-header">
<h1>Modals <small></small></h1>
</div>
<div class="row">
<div class="span3">
<h2>Modals</h2>
<p>Modals&mdash;dialogs or lightboxes&mdash;are great for contextual actions in situations where it’s important that the background context be maintained.</p>
<p><a class="btn js-btn" href="./javascript.html#modal">Get the javascript &raquo;</a></p>
</div>
<div class="span9">
<div class="well" style="background-color: #888; border: none; ">
<!-- Modal -->
<div class="modal" style="position: relative; top: auto; left: auto; margin: 0 auto; z-index: 1">
<div class="modal-header">
<a href="#" class="close js-dismiss">&times;</a>
<h3>Modal Heading</h3>
</div>
<div class="modal-body">
<p>One fine body…</p>
</div>
<div class="modal-footer">
<a href="#" class="btn primary">Primary</a>
<a href="#" class="btn">Secondary</a>
</div>
</div>
</div>
</div>
</div><!-- /row -->
</section>
<!-- Twipsies
================================================== -->
<section id="carousel">
<div class="page-header">
<h1>Twipsy tooltips <small></small></h1>
</div>
<div class="row">
<div class="span3">
<h2>Tooltips</h2>
<p>Twipsies are super useful for aiding a confused user and pointing them in the right direction.</p>
<p><a class="btn js-btn" href="./javascript.html#twipsy">Get the javascript &raquo;</a></p>
</div>
<div class="span9">
<div class="twipsies well">
<div style="position: relative">
<p class="muted" style="margin-bottom: 0">
Lorem ipsum dolar sit amet illo error <a href="#" title="bottom">ipsum</a> veritatis aut iste perspiciatis iste voluptas natus illo quasi odit aut natus consequuntur consequuntur, aut natus illo voluptatem odit perspiciatis laudantium rem doloremque totam voluptas. <a href="#" title="right">Voluptasdicta</a> eaque beatae aperiam ut enim voluptatem explicabo explicabo, voluptas quia odit fugit accusantium totam totam architecto explicabo sit quasi fugit fugit, totam doloremque unde sunt <a href="#" title="left">sed</a> dicta quae accusantium fugit voluptas nemo voluptas voluptatem <a href="#" title="top">rem</a> quae aut veritatis quasi quae.
</p>
</div>
</div>
</div>
</div><!-- /row -->
</section>
<!-- Popovers
================================================== -->
<section id="popovers">
<div class="page-header">
<h1>Popovers <small></small></h1>
</div>
<div class="row">
<div class="span3">
<h2>Popovers</h2>
<p>Use popovers to provide subtextual information to a page without affecting layout.</p>
<p><a class="btn js-btn" href="./javascript.html#popover">Get the javascript &raquo;</a></p>
</div>
<div class="span9">
<div class="well popover-well">
<div class="popover-wrapper">
<div class="popover left">
<div class="arrow"></div>
<div class="inner">
<h3 class="title">Popover Title</h3>
<div class="content">
<p>Etiam porta sem malesuada magna mollis euismod. Maecenas faucibus mollis interdum. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
</div>
</div>
</div>
<img class="large-bird" src="assets/img/bird.png" >
</div>
</div>
</div>
</div><!-- /row -->
</section>
<!-- Progress bars
================================================== -->
......
lib/close.less
View file @ 5032ef9b
......@@ -13,5 +13,6 @@
color: @black;
text-decoration: none;
.opacity(40);
cursor: pointer;
}
}
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