- [Twitter Bootstrap v3.0.0](http://twitter.github.com/bootstrap) [](http://travis-ci.org/twitter/bootstrap)
- =================
-# [Twitter Bootstrap v2.2.2](http://twitter.github.com/bootstrap) [](http://travis-ci.org/twitter/bootstrap)
++# [Twitter Bootstrap v3.0.0](http://twitter.github.com/bootstrap) [](http://travis-ci.org/twitter/bootstrap)
Bootstrap is a sleek, intuitive, and powerful front-end framework for faster and easier web development, created and maintained by [Mark Otto](http://twitter.com/mdo) and [Jacob Thornton](http://twitter.com/fat).
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
- background-image: linear-gradient(top, #ffffff, #e6e6e6);
+ background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
background-repeat: repeat-x;
border: 1px solid #bbbbbb;
- *border: 0;
border-color: #e6e6e6 #e6e6e6 #bfbfbf;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
border-bottom-color: #a2a2a2;
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#f2f2f2));
background-image: -webkit-linear-gradient(top, #ffffff, #f2f2f2);
background-image: -o-linear-gradient(top, #ffffff, #f2f2f2);
- background-image: linear-gradient(top, #ffffff, #f2f2f2);
+ background-image: linear-gradient(to bottom, #ffffff, #f2f2f2);
background-repeat: repeat-x;
border: 1px solid #d4d4d4;
- -webkit-border-radius: 4px;
- -moz-border-radius: 4px;
- border-radius: 4px;
+ border-radius: 4px;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff2f2f2', GradientType=0);
- *zoom: 1;
-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
- -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
}
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#222222), to(#111111));
background-image: -webkit-linear-gradient(top, #222222, #111111);
background-image: -o-linear-gradient(top, #222222, #111111);
- background-image: linear-gradient(top, #222222, #111111);
+ background-image: linear-gradient(to bottom, #222222, #111111);
background-repeat: repeat-x;
- border-color: #252525;
+ border-color: #111111;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff222222', endColorstr='#ff111111', GradientType=0);
}
margin: 0 0 20px;
list-style: none;
background-color: #f5f5f5;
- -webkit-border-radius: 4px;
- -moz-border-radius: 4px;
- border-radius: 4px;
+ border-radius: 4px;
}
- .breadcrumb li {
+ .breadcrumb > li {
display: inline-block;
- *display: inline;
- text-shadow: 0 1px 0 #ffffff;
- *zoom: 1;
+ text-shadow: 0 1px 0 #fff;
}
- .breadcrumb li:after {
-.breadcrumb > .divider {
++.breadcrumb > li:after {
+ display: inline-block;
padding: 0 5px;
color: #ccc;
+ content: "\00a0 /";
}
- .breadcrumb .active {
+ .breadcrumb > .active {
color: #999999;
}
content: "";
}
--.popover {
-- /*
-- &.top .arrow {
- bottom: -@popover-arrow-width;
- bottom: -@popoverArrowWidth;
-- left: 50%;
- margin-left: -@popover-arrow-width;
- border-width: @popover-arrow-width @popover-arrow-width 0;
- //border-top-color: @popover-arrow-color;
- margin-left: -@popoverArrowWidth;
- border-width: @popoverArrowWidth @popoverArrowWidth 0;
- //border-top-color: @popoverArrowColor;
-- border-top-color: blue;
-- &:after {
- border-width: @popover-arrow-outer-width @popover-arrow-outer-width 0;
- //border-top-color: @popover-arrow-outer-color;
- border-width: @popoverArrowOuterWidth @popoverArrowOuterWidth 0;
- //border-top-color: @popoverArrowOuterColor;
-- border-top-color: red;
- top: -@popover-arrow-width;
- top: -@popoverArrowWidth;
-- //bottom: -1px;
- left: -@popover-arrow-outer-width;
- left: -@popoverArrowOuterWidth;
-- }
-- }
-- &.right .arrow {
-- top: 50%;
- left: -@popover-arrow-width;
- margin-top: -@popover-arrow-width;
- border-width: @popover-arrow-width @popover-arrow-width @popover-arrow-width 0;
- border-right-color: @popover-arrow-color;
- left: -@popoverArrowWidth;
- margin-top: -@popoverArrowWidth;
- border-width: @popoverArrowWidth @popoverArrowWidth @popoverArrowWidth 0;
- border-right-color: @popoverArrowColor;
-- &:after {
- border-width: @popover-arrow-outer-width @popover-arrow-outer-width @popover-arrow-outer-width 0;
- border-right-color: @popover-arrow-outer-color;
- bottom: -@popover-arrow-outer-width;
- border-width: @popoverArrowOuterWidth @popoverArrowOuterWidth @popoverArrowOuterWidth 0;
- border-right-color: @popoverArrowOuterColor;
- bottom: -@popoverArrowOuterWidth;
-- left: -1px;
-- }
-- }
-- &.bottom .arrow {
- top: -@popover-arrow-width;
- top: -@popoverArrowWidth;
-- left: 50%;
- margin-left: -@popover-arrow-width;
- border-width: 0 @popover-arrow-width @popover-arrow-width;
- border-bottom-color: @popover-arrow-color;
- margin-left: -@popoverArrowWidth;
- border-width: 0 @popoverArrowWidth @popoverArrowWidth;
- border-bottom-color: @popoverArrowColor;
-- &:after {
- border-width: 0 @popover-arrow-outer-width @popover-arrow-outer-width;
- border-bottom-color: @popover-arrow-outer-color;
- border-width: 0 @popoverArrowOuterWidth @popoverArrowOuterWidth;
- border-bottom-color: @popoverArrowOuterColor;
-- top: -1px;
- left: -@popover-arrow-outer-width;
- left: -@popoverArrowOuterWidth;
-- }
-- }
-- &.left .arrow {
-- top: 50%;
- right: -@popover-arrow-width;
- margin-top: -@popover-arrow-width;
- border-width: @popover-arrow-width 0 @popover-arrow-width @popover-arrow-width;
- border-left-color: @popover-arrow-color;
- right: -@popoverArrowWidth;
- margin-top: -@popoverArrowWidth;
- border-width: @popoverArrowWidth 0 @popoverArrowWidth @popoverArrowWidth;
- border-left-color: @popoverArrowColor;
-- &:after {
- border-width: @popover-arrow-outer-width 0 @popover-arrow-outer-width @popover-arrow-outer-width;
- border-left-color: @popover-arrow-outer-color;
- bottom: -@popover-arrow-outer-width;
- border-width: @popoverArrowOuterWidth 0 @popoverArrowOuterWidth @popoverArrowOuterWidth;
- border-left-color: @popoverArrowOuterColor;
- bottom: -@popoverArrowOuterWidth;
-- right: -1px;
-- }
-- }*/
--
--}
--
.popover.top .arrow {
bottom: -11px;
left: 50%;
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f5f5f5), to(#f9f9f9));
background-image: -webkit-linear-gradient(top, #f5f5f5, #f9f9f9);
background-image: -o-linear-gradient(top, #f5f5f5, #f9f9f9);
- background-image: linear-gradient(top, #f5f5f5, #f9f9f9);
+ background-image: linear-gradient(to bottom, #f5f5f5, #f9f9f9);
background-repeat: repeat-x;
- -webkit-border-radius: 4px;
- -moz-border-radius: 4px;
- border-radius: 4px;
+ border-radius: 4px;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#fff9f9f9', GradientType=0);
-webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
- -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
}
placement: 'right'
, trigger: 'click'
, content: ''
- , template: '<div class="popover"><div class="arrow"></div><div class="popover-inner"><h3 class="popover-title"></h3><div class="popover-content"><p></p></div></div></div>'
+ , template: '<div class="popover"><div class="arrow"></div><div class="popover-inner"><h3 class="popover-title"></h3><div class="popover-content"></div></div></div>'
})
- }(window.jQuery);/* =============================================================
+ }(window.jQuery);
+ /* =============================================================
- * bootstrap-scrollspy.js v2.2.2
+ * bootstrap-scrollspy.js v3.0.0
* http://twitter.github.com/bootstrap/javascript.html#scrollspy
* =============================================================
* Copyright 2012 Twitter, Inc.
--- /dev/null
- <link rel="shortcut icon" href="assets/ico/favicon.png">
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <title>Gallery · Bootstrap</title>
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta name="description" content="">
+ <meta name="author" content="">
+
+ <!-- Le styles -->
+ <link href="assets/css/bootstrap.css" rel="stylesheet">
+ <link href="assets/css/docs.css" rel="stylesheet">
+ <link href="assets/js/google-code-prettify/prettify.css" rel="stylesheet">
+
+ <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
+ <!--[if lt IE 9]>
+ <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
+ <![endif]-->
+
+ <!-- Le fav and touch icons -->
- <link rel="apple-touch-icon-precomposed" sizes="72x72" href="assets/ico/apple-touch-icon-72-precomposed.png">
- <link rel="apple-touch-icon-precomposed" href="assets/ico/apple-touch-icon-57-precomposed.png">
+ <link rel="apple-touch-icon-precomposed" sizes="144x144" href="assets/ico/apple-touch-icon-144-precomposed.png">
+ <link rel="apple-touch-icon-precomposed" sizes="114x114" href="assets/ico/apple-touch-icon-114-precomposed.png">
++ <link rel="apple-touch-icon-precomposed" sizes="72x72" href="assets/ico/apple-touch-icon-72-precomposed.png">
++ <link rel="apple-touch-icon-precomposed" href="assets/ico/apple-touch-icon-57-precomposed.png">
++ <link rel="shortcut icon" href="assets/ico/favicon.png">
+
+ </head>
+
+ <body data-spy="scroll" data-target=".bs-docs-sidebar">
+
+ <!-- Navbar
+ ================================================== -->
+ <div class="navbar navbar-inverse navbar-fixed-top">
+ <div class="container">
+ <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ <span class="icon-bar"></span>
+ </button>
+ <a class="brand" href="./index.html">Bootstrap</a>
+ <div class="nav-collapse collapse">
+ <ul class="nav">
+ <li class="">
+ <a href="./index.html">Home</a>
+ </li>
+ <li class="">
+ <a href="./getting-started.html">Get started</a>
+ </li>
+ <li class="">
+ <a href="./css.html">Core CSS</a>
+ </li>
+ <li class="">
+ <a href="./components.html">Components</a>
+ </li>
+ <li class="">
+ <a href="./javascript.html">JavaScript</a>
+ </li>
+ <li class="">
+ <a href="./customize.html">Customize</a>
+ </li>
+ <li class="active">
+ <a href="./gallery.html">Gallery</a>
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+
+<!-- Subhead
+================================================== -->
+<header class="jumbotron subhead" id="overview">
+ <div class="container">
+ <h1>Gallery</h1>
+ <p class="lead">Showcase of sites using Bootstrap.</p>
+ </div>
+</header>
+
+
+<div class="container">
+
+ <section class="bs-docs-gallery">
+ <div class="row">
+ <div class="span4">
+ <a class="thumbnail" href="https://yourkarma.com">
+ <img src="assets/img/example-sites/example-karma.jpg">
+ </a>
+ </div>
+ <div class="span4">
+ <a class="thumbnail" href="http://metrotwit.com">
+ <img src="assets/img/example-sites/example-metrotwit.jpg">
+ </a>
+ </div>
+ <div class="span4">
+ <a class="thumbnail" href="http://scriptogr.am">
+ <img src="assets/img/example-sites/example-scriptogram.jpg">
+ </a>
+ </div>
+ <div class="span4">
+ <a class="thumbnail" href="http://translate.twttr.com">
+ <img src="assets/img/example-sites/example-twitter-translation-center.jpg">
+ </a>
+ </div>
+ <div class="span4">
+ <a class="thumbnail" href="http://soundready.fm">
+ <img src="assets/img/example-sites/example-soundready.jpg">
+ </a>
+ </div>
+ <div class="span4">
+ <a class="thumbnail" href="http://breakingnews.com">
+ <img src="assets/img/example-sites/example-breakingnews.jpg">
+ </a>
+ </div>
+ <div class="span4">
+ <a class="thumbnail" href="http://desk.com">
+ <img src="assets/img/example-sites/example-desk.jpg">
+ </a>
+ </div>
+ <div class="span4">
+ <a class="thumbnail" href="http://jumpstartui.com">
+ <img src="assets/img/example-sites/example-jumpstart-ui.jpg">
+ </a>
+ </div>
+ <div class="span4">
+ <a class="thumbnail" href="http://atheycreek.com">
+ <img src="assets/img/example-sites/example-athey-creek.jpg">
+ </a>
+ </div>
+ </div>
+ </section>
+
+</div>
+
+
+
+ <!-- Footer
+ ================================================== -->
+ <footer class="footer">
+ <div class="container">
+
+ <div class="bs-docs-social">
+ <ul class="bs-docs-social-buttons">
+ <li>
+ <iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=twitter&repo=bootstrap&type=watch&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="100px" height="20px"></iframe>
+ </li>
+ <li>
+ <iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=twitter&repo=bootstrap&type=fork&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="102px" height="20px"></iframe>
+ </li>
+ <li class="follow-btn">
+ <a href="https://twitter.com/twbootstrap" class="twitter-follow-button" data-link-color="#0069D6" data-show-count="true">Follow @twbootstrap</a>
+ </li>
+ <li class="tweet-btn">
+ <a href="https://twitter.com/share" class="twitter-share-button" data-url="http://twitter.github.com/bootstrap/" data-count="horizontal" data-via="twbootstrap" data-related="mdo:Creator of Twitter Bootstrap">Tweet</a>
+ </li>
+ </ul>
+ </div>
+
+
+ <p>Designed and built with all the love in the world by <a href="http://twitter.com/mdo" target="_blank">@mdo</a> and <a href="http://twitter.com/fat" target="_blank">@fat</a>.</p>
+ <p>Code licensed under <a href="http://www.apache.org/licenses/LICENSE-2.0" target="_blank">Apache License v2.0</a>, documentation under <a href="http://creativecommons.org/licenses/by/3.0/">CC BY 3.0</a>.</p>
+ <p><a href="http://glyphicons.com">Glyphicons Free</a> licensed under <a href="http://creativecommons.org/licenses/by/3.0/">CC BY 3.0</a>.</p>
+ <ul class="footer-links">
+ <li><a href="http://blog.getbootstrap.com">Blog</a></li>
+ <li class="muted">·</li>
+ <li><a href="https://github.com/twitter/bootstrap/issues?state=open">Issues</a></li>
+ <li class="muted">·</li>
+ <li><a href="https://github.com/twitter/bootstrap/wiki">Roadmap and changelog</a></li>
+ </ul>
+ </div>
+ </footer>
+
+
+
+ <!-- Le javascript
+ ================================================== -->
+ <!-- Placed at the end of the document so the pages load faster -->
+ <script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
+ <script src="assets/js/jquery.js"></script>
+ <script src="assets/js/bootstrap-transition.js"></script>
+ <script src="assets/js/bootstrap-alert.js"></script>
+ <script src="assets/js/bootstrap-modal.js"></script>
+ <script src="assets/js/bootstrap-dropdown.js"></script>
+ <script src="assets/js/bootstrap-scrollspy.js"></script>
+ <script src="assets/js/bootstrap-tab.js"></script>
+ <script src="assets/js/bootstrap-tooltip.js"></script>
+ <script src="assets/js/bootstrap-popover.js"></script>
+ <script src="assets/js/bootstrap-button.js"></script>
+ <script src="assets/js/bootstrap-collapse.js"></script>
+ <script src="assets/js/bootstrap-carousel.js"></script>
+ <script src="assets/js/bootstrap-typeahead.js"></script>
+ <script src="assets/js/bootstrap-affix.js"></script>
+
+ <script src="assets/js/holder/holder.js"></script>
+ <script src="assets/js/google-code-prettify/prettify.js"></script>
+
+ <script src="assets/js/application.js"></script>
+
+
+
+ </body>
+</html>
// -------------------------
.alert-success {
- background-color: @successBackground;
- border-color: @successBorder;
- color: @successText;
+ background-color: @state-success-background;
+ border-color: @state-success-border;
+ color: @state-success-text;
}
- color: @successText;
+ .alert-success h4 {
++ color: @state-success-text;
+ }
.alert-danger,
.alert-error {
- background-color: @errorBackground;
- border-color: @errorBorder;
- color: @errorText;
+ background-color: @state-error-background;
+ border-color: @state-error-border;
+ color: @state-error-text;
}
- color: @errorText;
+ .alert-danger h4,
+ .alert-error h4 {
++ color: @state-error-text;
+ }
.alert-info {
- background-color: @infoBackground;
- border-color: @infoBorder;
- color: @infoText;
+ background-color: @state-info-background;
+ border-color: @state-info-border;
+ color: @state-info-text;
}
- color: @infoText;
+ .alert-info h4 {
++ color: @state-info-text;
+ }
// Block alerts
.breadcrumb {
padding: 8px 15px;
- margin: 0 0 @baseLineHeight;
+ margin: 0 0 @line-height-base;
list-style: none;
background-color: #f5f5f5;
- .border-radius(@baseBorderRadius);
+ border-radius: @border-radius-base;
- li {
+ > li {
display: inline-block;
- .ie7-inline-block();
- text-shadow: 0 1px 0 @white;
- }
- > .divider {
- padding: 0 5px;
- color: #ccc;
+ text-shadow: 0 1px 0 #fff;
+ &:after {
+ display: inline-block;
+ content: "\00a0 /"; // Unicode space added since inline-block means non-collapsing white-space
+ padding: 0 5px;
+ color: #ccc;
+ }
}
- .active {
+ > .active {
color: @grayLight;
}
}
// Mixin for form field states
- .formFieldState(@text-color: #555, @borderColor: #ccc, @backgroundColor: #f5f5f5) {
-.formFieldState(@textColor: #555, @borderColor: #ccc, @backgroundColor: #f5f5f5) {
++.formFieldState(@text-color: #555, @border-color: #ccc, @background-color: #f5f5f5) {
// Set the text color
.control-label,
.help-block,
input,
select,
textarea {
-- border-color: @borderColor;
++ border-color: @border-color;
.box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work
&:focus {
-- border-color: darken(@borderColor, 10%);
-- @shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten(@borderColor, 20%);
++ border-color: darken(@border-color, 10%);
++ @shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten(@border-color, 20%);
.box-shadow(@shadow);
}
}
// Give a small background color for input-prepend/-append
.input-prepend .add-on,
.input-append .add-on {
- color: @textColor;
- background-color: @backgroundColor;
- border-color: @textColor;
+ color: @text-color;
- background-color: @backgroundColor;
++ background-color: @background-color;
+ border-color: @text-color;
}
}
}
// CSS3 Content Columns
- .content-columns(@columnCount, @columnGap: @grid-gutter-width) {
-.content-columns(@columnCount, @columnGap: @gridGutterWidth) {
-- -webkit-column-count: @columnCount;
-- -moz-column-count: @columnCount;
-- column-count: @columnCount;
-- -webkit-column-gap: @columnGap;
-- -moz-column-gap: @columnGap;
-- column-gap: @columnGap;
++.content-columns(@column-count, @column-gap: @grid-gutter-width) {
++ -webkit-column-count: @column-count;
++ -moz-column-count: @column-count;
++ column-count: @column-count;
++ -webkit-column-gap: @column-gap;
++ -moz-column-gap: @column-gap;
++ column-gap: @column-gap;
}
// Optional hyphenation
// -------------------------
// Vertically center elements in the navbar.
// Example: an element has a height of 30px, so write out `.navbarVerticalAlign(30px);` to calculate the appropriate top margin.
--.navbarVerticalAlign(@elementHeight) {
- margin-top: (@navbar-height - @elementHeight) / 2;
- margin-top: (@navbarHeight - @elementHeight) / 2;
++.navbarVerticalAlign(@element-height) {
++ margin-top: (@navbar-height - @element-height) / 2;
}
display: none;
width: 236px;
padding: 1px;
- background-color: @popoverBackground;
+ text-align: left; // Reset given new insertion method
+ background-color: @popover-background;
-webkit-background-clip: padding-box;
-moz-background-clip: padding;
background-clip: padding-box;
}
}
--
--
--/*
-- &.top .arrow {
- bottom: -@popover-arrow-width;
- bottom: -@popoverArrowWidth;
-- left: 50%;
- margin-left: -@popover-arrow-width;
- border-width: @popover-arrow-width @popover-arrow-width 0;
- //border-top-color: @popover-arrow-color;
- margin-left: -@popoverArrowWidth;
- border-width: @popoverArrowWidth @popoverArrowWidth 0;
- //border-top-color: @popoverArrowColor;
-- border-top-color: blue;
-- &:after {
- border-width: @popover-arrow-outer-width @popover-arrow-outer-width 0;
- //border-top-color: @popover-arrow-outer-color;
- border-width: @popoverArrowOuterWidth @popoverArrowOuterWidth 0;
- //border-top-color: @popoverArrowOuterColor;
-- border-top-color: red;
- top: -@popover-arrow-width;
- top: -@popoverArrowWidth;
-- //bottom: -1px;
- left: -@popover-arrow-outer-width;
- left: -@popoverArrowOuterWidth;
-- }
-- }
-- &.right .arrow {
-- top: 50%;
- left: -@popover-arrow-width;
- margin-top: -@popover-arrow-width;
- border-width: @popover-arrow-width @popover-arrow-width @popover-arrow-width 0;
- border-right-color: @popover-arrow-color;
- left: -@popoverArrowWidth;
- margin-top: -@popoverArrowWidth;
- border-width: @popoverArrowWidth @popoverArrowWidth @popoverArrowWidth 0;
- border-right-color: @popoverArrowColor;
-- &:after {
- border-width: @popover-arrow-outer-width @popover-arrow-outer-width @popover-arrow-outer-width 0;
- border-right-color: @popover-arrow-outer-color;
- bottom: -@popover-arrow-outer-width;
- border-width: @popoverArrowOuterWidth @popoverArrowOuterWidth @popoverArrowOuterWidth 0;
- border-right-color: @popoverArrowOuterColor;
- bottom: -@popoverArrowOuterWidth;
-- left: -1px;
-- }
-- }
-- &.bottom .arrow {
- top: -@popover-arrow-width;
- top: -@popoverArrowWidth;
-- left: 50%;
- margin-left: -@popover-arrow-width;
- border-width: 0 @popover-arrow-width @popover-arrow-width;
- border-bottom-color: @popover-arrow-color;
- margin-left: -@popoverArrowWidth;
- border-width: 0 @popoverArrowWidth @popoverArrowWidth;
- border-bottom-color: @popoverArrowColor;
-- &:after {
- border-width: 0 @popover-arrow-outer-width @popover-arrow-outer-width;
- border-bottom-color: @popover-arrow-outer-color;
- border-width: 0 @popoverArrowOuterWidth @popoverArrowOuterWidth;
- border-bottom-color: @popoverArrowOuterColor;
-- top: -1px;
- left: -@popover-arrow-outer-width;
- left: -@popoverArrowOuterWidth;
-- }
-- }
-- &.left .arrow {
-- top: 50%;
- right: -@popover-arrow-width;
- margin-top: -@popover-arrow-width;
- border-width: @popover-arrow-width 0 @popover-arrow-width @popover-arrow-width;
- border-left-color: @popover-arrow-color;
- right: -@popoverArrowWidth;
- margin-top: -@popoverArrowWidth;
- border-width: @popoverArrowWidth 0 @popoverArrowWidth @popoverArrowWidth;
- border-left-color: @popoverArrowColor;
-- &:after {
- border-width: @popover-arrow-outer-width 0 @popover-arrow-outer-width @popover-arrow-outer-width;
- border-left-color: @popover-arrow-outer-color;
- bottom: -@popover-arrow-outer-width;
- border-width: @popoverArrowOuterWidth 0 @popoverArrowOuterWidth @popoverArrowOuterWidth;
- border-left-color: @popoverArrowOuterColor;
- bottom: -@popoverArrowOuterWidth;
-- right: -1px;
-- }
-- }*/
}