mirror of https://github.com/twbs/bootstrap.git
start breaking down patterns.less into more distinct files, update docs for forms to use correct classes
This commit is contained in:
Mark Otto
parent
cabf993bc6
commit
a017932285
|
|
@ -6,7 +6,7 @@
|
||||||
* http://www.apache.org/licenses/LICENSE-2.0
|
* http://www.apache.org/licenses/LICENSE-2.0
|
||||||
*
|
*
|
||||||
* Designed and built with all the love in the world @twitter by @mdo and @fat.
|
* Designed and built with all the love in the world @twitter by @mdo and @fat.
|
||||||
* Date: Mon Nov 7 21:14:04 PST 2011
|
* Date: Wed Nov 16 23:58:14 PST 2011
|
||||||
*/
|
*/
|
||||||
/* Reset.less
|
/* Reset.less
|
||||||
* Props to Eric Meyer (meyerweb.com) for his CSS reset file. We're using an adapted version here that cuts out some of the reset HTML elements we will never need here (i.e., dfn, samp, etc).
|
* Props to Eric Meyer (meyerweb.com) for his CSS reset file. We're using an adapted version here that cuts out some of the reset HTML elements we will never need here (i.e., dfn, samp, etc).
|
||||||
|
|
@ -1440,238 +1440,6 @@ table .headerSortUp.purple, table .headerSortDown.purple {
|
||||||
.dropdown.open .dropdown-menu {
|
.dropdown.open .dropdown-menu {
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
.tabs, .pills {
|
|
||||||
margin: 0 0 20px;
|
|
||||||
padding: 0;
|
|
||||||
list-style: none;
|
|
||||||
zoom: 1;
|
|
||||||
}
|
|
||||||
.tabs:before,
|
|
||||||
.pills:before,
|
|
||||||
.tabs:after,
|
|
||||||
.pills:after {
|
|
||||||
display: table;
|
|
||||||
content: "";
|
|
||||||
zoom: 1;
|
|
||||||
*display: inline;
|
|
||||||
}
|
|
||||||
.tabs:after, .pills:after {
|
|
||||||
clear: both;
|
|
||||||
}
|
|
||||||
.tabs > li, .pills > li {
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
.tabs > li > a, .pills > li > a {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
.tabs {
|
|
||||||
border-color: #ddd;
|
|
||||||
border-style: solid;
|
|
||||||
border-width: 0 0 1px;
|
|
||||||
}
|
|
||||||
.tabs > li {
|
|
||||||
position: relative;
|
|
||||||
margin-bottom: -1px;
|
|
||||||
}
|
|
||||||
.tabs > li > a {
|
|
||||||
padding: 0 15px;
|
|
||||||
margin-right: 2px;
|
|
||||||
line-height: 36px;
|
|
||||||
border: 1px solid transparent;
|
|
||||||
-webkit-border-radius: 4px 4px 0 0;
|
|
||||||
-moz-border-radius: 4px 4px 0 0;
|
|
||||||
border-radius: 4px 4px 0 0;
|
|
||||||
}
|
|
||||||
.tabs > li > a:hover {
|
|
||||||
text-decoration: none;
|
|
||||||
background-color: #eee;
|
|
||||||
border-color: #eee #eee #ddd;
|
|
||||||
}
|
|
||||||
.tabs .active > a, .tabs .active > a:hover {
|
|
||||||
color: #808080;
|
|
||||||
background-color: #ffffff;
|
|
||||||
border: 1px solid #ddd;
|
|
||||||
border-bottom-color: transparent;
|
|
||||||
cursor: default;
|
|
||||||
}
|
|
||||||
.tabbable {
|
|
||||||
margin-bottom: 18px;
|
|
||||||
}
|
|
||||||
.tabbable .tabs {
|
|
||||||
margin-bottom: 0;
|
|
||||||
border-bottom: 0;
|
|
||||||
}
|
|
||||||
.tabbable .tab-content {
|
|
||||||
padding: 19px;
|
|
||||||
border: 1px solid #ddd;
|
|
||||||
}
|
|
||||||
.tabbable.tabs-bottom .tabs > li {
|
|
||||||
margin-top: -1px;
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
.tabbable.tabs-bottom .tabs > li > a {
|
|
||||||
-webkit-border-radius: 0 0 4px 4px;
|
|
||||||
-moz-border-radius: 0 0 4px 4px;
|
|
||||||
border-radius: 0 0 4px 4px;
|
|
||||||
}
|
|
||||||
.tabbable.tabs-bottom .tabs > li > a:hover {
|
|
||||||
border-bottom-color: transparent;
|
|
||||||
border-top-color: #ddd;
|
|
||||||
}
|
|
||||||
.tabbable.tabs-bottom .tabs > .active > a, .tabbable.tabs-bottom .tabs > .active > a:hover {
|
|
||||||
border-color: transparent #ddd #ddd #ddd;
|
|
||||||
}
|
|
||||||
.tabbable.tabs-left, .tabbable.tabs-right {
|
|
||||||
zoom: 1;
|
|
||||||
}
|
|
||||||
.tabbable.tabs-left:before,
|
|
||||||
.tabbable.tabs-right:before,
|
|
||||||
.tabbable.tabs-left:after,
|
|
||||||
.tabbable.tabs-right:after {
|
|
||||||
display: table;
|
|
||||||
content: "";
|
|
||||||
zoom: 1;
|
|
||||||
*display: inline;
|
|
||||||
}
|
|
||||||
.tabbable.tabs-left:after, .tabbable.tabs-right:after {
|
|
||||||
clear: both;
|
|
||||||
}
|
|
||||||
.tabbable.tabs-left .tabs, .tabbable.tabs-right .tabs {
|
|
||||||
width: 100px;
|
|
||||||
}
|
|
||||||
.tabbable.tabs-left .tabs > li, .tabbable.tabs-right .tabs > li {
|
|
||||||
float: none;
|
|
||||||
margin-bottom: -1px;
|
|
||||||
}
|
|
||||||
.tabbable.tabs-left .tabs > li > a, .tabbable.tabs-right .tabs > li > a {
|
|
||||||
margin-bottom: 2px;
|
|
||||||
}
|
|
||||||
.tabbable.tabs-left .tabs > li > a:hover, .tabbable.tabs-right .tabs > li > a:hover {
|
|
||||||
border-color: transparent;
|
|
||||||
}
|
|
||||||
.tabbable.tabs-left .tab-content {
|
|
||||||
margin-left: 100px;
|
|
||||||
}
|
|
||||||
.tabbable.tabs-left .tabs {
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
.tabbable.tabs-left .tabs > li {
|
|
||||||
margin-right: -1px;
|
|
||||||
}
|
|
||||||
.tabbable.tabs-left .tabs > li > a {
|
|
||||||
margin-right: 0;
|
|
||||||
-webkit-border-radius: 4px 0 0 4px;
|
|
||||||
-moz-border-radius: 4px 0 0 4px;
|
|
||||||
border-radius: 4px 0 0 4px;
|
|
||||||
}
|
|
||||||
.tabbable.tabs-left .tabs > li > a:hover {
|
|
||||||
border-right-color: #ddd;
|
|
||||||
}
|
|
||||||
.tabbable.tabs-left .tabs .active > a, .tabbable.tabs-left .tabs .active > a:hover {
|
|
||||||
border-color: #ddd;
|
|
||||||
border-right-color: transparent;
|
|
||||||
}
|
|
||||||
.tabbable.tabs-right .tab-content {
|
|
||||||
margin-right: 100px;
|
|
||||||
}
|
|
||||||
.tabbable.tabs-right .tabs {
|
|
||||||
float: right;
|
|
||||||
}
|
|
||||||
.tabbable.tabs-right .tabs > li {
|
|
||||||
margin-left: -1px;
|
|
||||||
}
|
|
||||||
.tabbable.tabs-right .tabs > li > a {
|
|
||||||
margin-left: 0;
|
|
||||||
-webkit-border-radius: 0 4px 4px 0;
|
|
||||||
-moz-border-radius: 0 4px 4px 0;
|
|
||||||
border-radius: 0 4px 4px 0;
|
|
||||||
}
|
|
||||||
.tabbable.tabs-right .tabs > li > a:hover {
|
|
||||||
border-left-color: #ddd;
|
|
||||||
}
|
|
||||||
.tabbable.tabs-right .tabs .active > a, .tabbable.tabs-right .tabs .active > a:hover {
|
|
||||||
border-color: #ddd;
|
|
||||||
border-left-color: transparent;
|
|
||||||
}
|
|
||||||
.tabs .menu-dropdown, .tabs .dropdown-menu {
|
|
||||||
top: 35px;
|
|
||||||
border-width: 1px;
|
|
||||||
-webkit-border-radius: 0 6px 6px 6px;
|
|
||||||
-moz-border-radius: 0 6px 6px 6px;
|
|
||||||
border-radius: 0 6px 6px 6px;
|
|
||||||
}
|
|
||||||
.tabs a.menu:after, .tabs .dropdown-toggle:after {
|
|
||||||
border-top-color: #999;
|
|
||||||
margin-top: 15px;
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
.tabs li.open.menu .menu, .tabs .open.dropdown .dropdown-toggle {
|
|
||||||
border-color: #999;
|
|
||||||
}
|
|
||||||
.tabs li.open a.menu:after, .tabs .dropdown.open .dropdown-toggle:after {
|
|
||||||
border-top-color: #555;
|
|
||||||
}
|
|
||||||
.pills a {
|
|
||||||
margin: 5px 3px 5px 0;
|
|
||||||
padding: 0 15px;
|
|
||||||
line-height: 30px;
|
|
||||||
text-shadow: 0 1px 1px #ffffff;
|
|
||||||
-webkit-border-radius: 15px;
|
|
||||||
-moz-border-radius: 15px;
|
|
||||||
border-radius: 15px;
|
|
||||||
}
|
|
||||||
.pills a:hover {
|
|
||||||
color: #ffffff;
|
|
||||||
text-decoration: none;
|
|
||||||
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.25);
|
|
||||||
background-color: #00438a;
|
|
||||||
}
|
|
||||||
.pills .active a {
|
|
||||||
color: #ffffff;
|
|
||||||
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.25);
|
|
||||||
background-color: #0069d6;
|
|
||||||
}
|
|
||||||
.pills-vertical > li {
|
|
||||||
float: none;
|
|
||||||
}
|
|
||||||
.tab-content > .tab-pane, .pill-content > .pill-pane {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
.tab-content > .active, .pill-content > .active {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
.breadcrumb {
|
|
||||||
margin: 0 0 18px;
|
|
||||||
padding: 7px 14px;
|
|
||||||
background-color: #f5f5f5;
|
|
||||||
background-image: -khtml-gradient(linear, left top, left bottom, from(#ffffff), to(#f5f5f5));
|
|
||||||
background-image: -moz-linear-gradient(top, #ffffff, #f5f5f5);
|
|
||||||
background-image: -ms-linear-gradient(top, #ffffff, #f5f5f5);
|
|
||||||
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #f5f5f5));
|
|
||||||
background-image: -webkit-linear-gradient(top, #ffffff, #f5f5f5);
|
|
||||||
background-image: -o-linear-gradient(top, #ffffff, #f5f5f5);
|
|
||||||
background-image: linear-gradient(top, #ffffff, #f5f5f5);
|
|
||||||
background-repeat: repeat-x;
|
|
||||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f5f5f5', GradientType=0);
|
|
||||||
border: 1px solid #ddd;
|
|
||||||
-webkit-border-radius: 3px;
|
|
||||||
-moz-border-radius: 3px;
|
|
||||||
border-radius: 3px;
|
|
||||||
-webkit-box-shadow: inset 0 1px 0 #ffffff;
|
|
||||||
-moz-box-shadow: inset 0 1px 0 #ffffff;
|
|
||||||
box-shadow: inset 0 1px 0 #ffffff;
|
|
||||||
}
|
|
||||||
.breadcrumb li {
|
|
||||||
display: inline;
|
|
||||||
text-shadow: 0 1px 0 #ffffff;
|
|
||||||
}
|
|
||||||
.breadcrumb .divider {
|
|
||||||
padding: 0 5px;
|
|
||||||
color: #bfbfbf;
|
|
||||||
}
|
|
||||||
.breadcrumb .active a {
|
|
||||||
color: #404040;
|
|
||||||
}
|
|
||||||
.hero-unit {
|
.hero-unit {
|
||||||
background-color: #f5f5f5;
|
background-color: #f5f5f5;
|
||||||
margin-bottom: 30px;
|
margin-bottom: 30px;
|
||||||
|
|
@ -2038,6 +1806,296 @@ button.btn::-moz-focus-inner, input[type=submit].btn::-moz-focus-inner {
|
||||||
background-color: #ddf4fb;
|
background-color: #ddf4fb;
|
||||||
border-color: #c6edf9;
|
border-color: #c6edf9;
|
||||||
}
|
}
|
||||||
|
.well {
|
||||||
|
background-color: #f5f5f5;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
padding: 19px;
|
||||||
|
min-height: 20px;
|
||||||
|
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;
|
||||||
|
}
|
||||||
|
.label {
|
||||||
|
padding: 1px 3px 2px;
|
||||||
|
background-color: #bfbfbf;
|
||||||
|
font-size: 9.75px;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #ffffff;
|
||||||
|
text-transform: uppercase;
|
||||||
|
-webkit-border-radius: 3px;
|
||||||
|
-moz-border-radius: 3px;
|
||||||
|
border-radius: 3px;
|
||||||
|
}
|
||||||
|
.label.important {
|
||||||
|
background-color: #c43c35;
|
||||||
|
}
|
||||||
|
.label.warning {
|
||||||
|
background-color: #f89406;
|
||||||
|
}
|
||||||
|
.label.success {
|
||||||
|
background-color: #46a546;
|
||||||
|
}
|
||||||
|
.label.notice {
|
||||||
|
background-color: #62cffc;
|
||||||
|
}
|
||||||
|
.pull-right {
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
|
.pull-left {
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
.tabs, .pills {
|
||||||
|
margin: 0 0 20px;
|
||||||
|
padding: 0;
|
||||||
|
list-style: none;
|
||||||
|
zoom: 1;
|
||||||
|
}
|
||||||
|
.tabs:before,
|
||||||
|
.pills:before,
|
||||||
|
.tabs:after,
|
||||||
|
.pills:after {
|
||||||
|
display: table;
|
||||||
|
content: "";
|
||||||
|
zoom: 1;
|
||||||
|
*display: inline;
|
||||||
|
}
|
||||||
|
.tabs:after, .pills:after {
|
||||||
|
clear: both;
|
||||||
|
}
|
||||||
|
.tabs > li, .pills > li {
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
.tabs > li > a, .pills > li > a {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
.tabs {
|
||||||
|
border-color: #ddd;
|
||||||
|
border-style: solid;
|
||||||
|
border-width: 0 0 1px;
|
||||||
|
}
|
||||||
|
.tabs > li {
|
||||||
|
position: relative;
|
||||||
|
margin-bottom: -1px;
|
||||||
|
}
|
||||||
|
.tabs > li > a {
|
||||||
|
padding: 0 15px;
|
||||||
|
margin-right: 2px;
|
||||||
|
line-height: 36px;
|
||||||
|
border: 1px solid transparent;
|
||||||
|
-webkit-border-radius: 4px 4px 0 0;
|
||||||
|
-moz-border-radius: 4px 4px 0 0;
|
||||||
|
border-radius: 4px 4px 0 0;
|
||||||
|
}
|
||||||
|
.tabs > li > a:hover {
|
||||||
|
text-decoration: none;
|
||||||
|
background-color: #eee;
|
||||||
|
border-color: #eee #eee #ddd;
|
||||||
|
}
|
||||||
|
.tabs .active > a, .tabs .active > a:hover {
|
||||||
|
color: #808080;
|
||||||
|
background-color: #ffffff;
|
||||||
|
border: 1px solid #ddd;
|
||||||
|
border-bottom-color: transparent;
|
||||||
|
cursor: default;
|
||||||
|
}
|
||||||
|
.tabbable {
|
||||||
|
margin-bottom: 18px;
|
||||||
|
}
|
||||||
|
.tabbable .tabs {
|
||||||
|
margin-bottom: 0;
|
||||||
|
border-bottom: 0;
|
||||||
|
}
|
||||||
|
.tabbable .tab-content {
|
||||||
|
padding: 19px;
|
||||||
|
border: 1px solid #ddd;
|
||||||
|
}
|
||||||
|
.tabbable.tabs-bottom .tabs > li {
|
||||||
|
margin-top: -1px;
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
.tabbable.tabs-bottom .tabs > li > a {
|
||||||
|
-webkit-border-radius: 0 0 4px 4px;
|
||||||
|
-moz-border-radius: 0 0 4px 4px;
|
||||||
|
border-radius: 0 0 4px 4px;
|
||||||
|
}
|
||||||
|
.tabbable.tabs-bottom .tabs > li > a:hover {
|
||||||
|
border-bottom-color: transparent;
|
||||||
|
border-top-color: #ddd;
|
||||||
|
}
|
||||||
|
.tabbable.tabs-bottom .tabs > .active > a, .tabbable.tabs-bottom .tabs > .active > a:hover {
|
||||||
|
border-color: transparent #ddd #ddd #ddd;
|
||||||
|
}
|
||||||
|
.tabbable.tabs-left, .tabbable.tabs-right {
|
||||||
|
zoom: 1;
|
||||||
|
}
|
||||||
|
.tabbable.tabs-left:before,
|
||||||
|
.tabbable.tabs-right:before,
|
||||||
|
.tabbable.tabs-left:after,
|
||||||
|
.tabbable.tabs-right:after {
|
||||||
|
display: table;
|
||||||
|
content: "";
|
||||||
|
zoom: 1;
|
||||||
|
*display: inline;
|
||||||
|
}
|
||||||
|
.tabbable.tabs-left:after, .tabbable.tabs-right:after {
|
||||||
|
clear: both;
|
||||||
|
}
|
||||||
|
.tabbable.tabs-left .tabs, .tabbable.tabs-right .tabs {
|
||||||
|
width: 100px;
|
||||||
|
}
|
||||||
|
.tabbable.tabs-left .tabs > li, .tabbable.tabs-right .tabs > li {
|
||||||
|
float: none;
|
||||||
|
margin-bottom: -1px;
|
||||||
|
}
|
||||||
|
.tabbable.tabs-left .tabs > li > a, .tabbable.tabs-right .tabs > li > a {
|
||||||
|
margin-bottom: 2px;
|
||||||
|
}
|
||||||
|
.tabbable.tabs-left .tabs > li > a:hover, .tabbable.tabs-right .tabs > li > a:hover {
|
||||||
|
border-color: transparent;
|
||||||
|
}
|
||||||
|
.tabbable.tabs-left .tab-content {
|
||||||
|
margin-left: 100px;
|
||||||
|
}
|
||||||
|
.tabbable.tabs-left .tabs {
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
.tabbable.tabs-left .tabs > li {
|
||||||
|
margin-right: -1px;
|
||||||
|
}
|
||||||
|
.tabbable.tabs-left .tabs > li > a {
|
||||||
|
margin-right: 0;
|
||||||
|
-webkit-border-radius: 4px 0 0 4px;
|
||||||
|
-moz-border-radius: 4px 0 0 4px;
|
||||||
|
border-radius: 4px 0 0 4px;
|
||||||
|
}
|
||||||
|
.tabbable.tabs-left .tabs > li > a:hover {
|
||||||
|
border-right-color: #ddd;
|
||||||
|
}
|
||||||
|
.tabbable.tabs-left .tabs .active > a, .tabbable.tabs-left .tabs .active > a:hover {
|
||||||
|
border-color: #ddd;
|
||||||
|
border-right-color: transparent;
|
||||||
|
}
|
||||||
|
.tabbable.tabs-right .tab-content {
|
||||||
|
margin-right: 100px;
|
||||||
|
}
|
||||||
|
.tabbable.tabs-right .tabs {
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
|
.tabbable.tabs-right .tabs > li {
|
||||||
|
margin-left: -1px;
|
||||||
|
}
|
||||||
|
.tabbable.tabs-right .tabs > li > a {
|
||||||
|
margin-left: 0;
|
||||||
|
-webkit-border-radius: 0 4px 4px 0;
|
||||||
|
-moz-border-radius: 0 4px 4px 0;
|
||||||
|
border-radius: 0 4px 4px 0;
|
||||||
|
}
|
||||||
|
.tabbable.tabs-right .tabs > li > a:hover {
|
||||||
|
border-left-color: #ddd;
|
||||||
|
}
|
||||||
|
.tabbable.tabs-right .tabs .active > a, .tabbable.tabs-right .tabs .active > a:hover {
|
||||||
|
border-color: #ddd;
|
||||||
|
border-left-color: transparent;
|
||||||
|
}
|
||||||
|
.tabs .menu-dropdown, .tabs .dropdown-menu {
|
||||||
|
top: 35px;
|
||||||
|
border-width: 1px;
|
||||||
|
-webkit-border-radius: 0 6px 6px 6px;
|
||||||
|
-moz-border-radius: 0 6px 6px 6px;
|
||||||
|
border-radius: 0 6px 6px 6px;
|
||||||
|
}
|
||||||
|
.tabs a.menu:after, .tabs .dropdown-toggle:after {
|
||||||
|
border-top-color: #999;
|
||||||
|
margin-top: 15px;
|
||||||
|
margin-left: 5px;
|
||||||
|
}
|
||||||
|
.tabs li.open.menu .menu, .tabs .open.dropdown .dropdown-toggle {
|
||||||
|
border-color: #999;
|
||||||
|
}
|
||||||
|
.tabs li.open a.menu:after, .tabs .dropdown.open .dropdown-toggle:after {
|
||||||
|
border-top-color: #555;
|
||||||
|
}
|
||||||
|
.pills a {
|
||||||
|
margin: 5px 3px 5px 0;
|
||||||
|
padding: 0 15px;
|
||||||
|
line-height: 30px;
|
||||||
|
text-shadow: 0 1px 1px #ffffff;
|
||||||
|
-webkit-border-radius: 15px;
|
||||||
|
-moz-border-radius: 15px;
|
||||||
|
border-radius: 15px;
|
||||||
|
}
|
||||||
|
.pills a:hover {
|
||||||
|
color: #ffffff;
|
||||||
|
text-decoration: none;
|
||||||
|
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.25);
|
||||||
|
background-color: #00438a;
|
||||||
|
}
|
||||||
|
.pills .active a {
|
||||||
|
color: #ffffff;
|
||||||
|
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.25);
|
||||||
|
background-color: #0069d6;
|
||||||
|
}
|
||||||
|
.pills-vertical > li {
|
||||||
|
float: none;
|
||||||
|
}
|
||||||
|
.tab-content > .tab-pane, .pill-content > .pill-pane {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.tab-content > .active, .pill-content > .active {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
.breadcrumb {
|
||||||
|
margin: 0 0 18px;
|
||||||
|
padding: 7px 14px;
|
||||||
|
background-color: #f5f5f5;
|
||||||
|
background-image: -khtml-gradient(linear, left top, left bottom, from(#ffffff), to(#f5f5f5));
|
||||||
|
background-image: -moz-linear-gradient(top, #ffffff, #f5f5f5);
|
||||||
|
background-image: -ms-linear-gradient(top, #ffffff, #f5f5f5);
|
||||||
|
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #f5f5f5));
|
||||||
|
background-image: -webkit-linear-gradient(top, #ffffff, #f5f5f5);
|
||||||
|
background-image: -o-linear-gradient(top, #ffffff, #f5f5f5);
|
||||||
|
background-image: linear-gradient(top, #ffffff, #f5f5f5);
|
||||||
|
background-repeat: repeat-x;
|
||||||
|
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f5f5f5', GradientType=0);
|
||||||
|
border: 1px solid #ddd;
|
||||||
|
-webkit-border-radius: 3px;
|
||||||
|
-moz-border-radius: 3px;
|
||||||
|
border-radius: 3px;
|
||||||
|
-webkit-box-shadow: inset 0 1px 0 #ffffff;
|
||||||
|
-moz-box-shadow: inset 0 1px 0 #ffffff;
|
||||||
|
box-shadow: inset 0 1px 0 #ffffff;
|
||||||
|
}
|
||||||
|
.breadcrumb li {
|
||||||
|
display: inline;
|
||||||
|
text-shadow: 0 1px 0 #ffffff;
|
||||||
|
}
|
||||||
|
.breadcrumb .divider {
|
||||||
|
padding: 0 5px;
|
||||||
|
color: #bfbfbf;
|
||||||
|
}
|
||||||
|
.breadcrumb .active a {
|
||||||
|
color: #404040;
|
||||||
|
}
|
||||||
.pagination {
|
.pagination {
|
||||||
height: 36px;
|
height: 36px;
|
||||||
margin: 18px 0;
|
margin: 18px 0;
|
||||||
|
|
@ -2079,24 +2137,6 @@ button.btn::-moz-focus-inner, input[type=submit].btn::-moz-focus-inner {
|
||||||
.pagination .next a {
|
.pagination .next a {
|
||||||
border: 0;
|
border: 0;
|
||||||
}
|
}
|
||||||
.well {
|
|
||||||
background-color: #f5f5f5;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
padding: 19px;
|
|
||||||
min-height: 20px;
|
|
||||||
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);
|
|
||||||
}
|
|
||||||
.modal-backdrop {
|
.modal-backdrop {
|
||||||
background-color: #000000;
|
background-color: #000000;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
|
|
@ -2331,40 +2371,6 @@ button.btn::-moz-focus-inner, input[type=submit].btn::-moz-focus-inner {
|
||||||
.popover .content p, .popover .content ul, .popover .content ol {
|
.popover .content p, .popover .content ul, .popover .content ol {
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
.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;
|
|
||||||
}
|
|
||||||
.label {
|
|
||||||
padding: 1px 3px 2px;
|
|
||||||
background-color: #bfbfbf;
|
|
||||||
font-size: 9.75px;
|
|
||||||
font-weight: bold;
|
|
||||||
color: #ffffff;
|
|
||||||
text-transform: uppercase;
|
|
||||||
-webkit-border-radius: 3px;
|
|
||||||
-moz-border-radius: 3px;
|
|
||||||
border-radius: 3px;
|
|
||||||
}
|
|
||||||
.label.important {
|
|
||||||
background-color: #c43c35;
|
|
||||||
}
|
|
||||||
.label.warning {
|
|
||||||
background-color: #f89406;
|
|
||||||
}
|
|
||||||
.label.success {
|
|
||||||
background-color: #46a546;
|
|
||||||
}
|
|
||||||
.label.notice {
|
|
||||||
background-color: #62cffc;
|
|
||||||
}
|
|
||||||
.media-grid {
|
.media-grid {
|
||||||
margin-left: -20px;
|
margin-left: -20px;
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
|
|
@ -2403,12 +2409,6 @@ button.btn::-moz-focus-inner, input[type=submit].btn::-moz-focus-inner {
|
||||||
-moz-box-shadow: 0 1px 4px rgba(0, 105, 214, 0.25);
|
-moz-box-shadow: 0 1px 4px rgba(0, 105, 214, 0.25);
|
||||||
box-shadow: 0 1px 4px rgba(0, 105, 214, 0.25);
|
box-shadow: 0 1px 4px rgba(0, 105, 214, 0.25);
|
||||||
}
|
}
|
||||||
.pull-right {
|
|
||||||
float: right;
|
|
||||||
}
|
|
||||||
.pull-left {
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
/* Responsive.less
|
/* Responsive.less
|
||||||
* For phone and tablet devices
|
* For phone and tablet devices
|
||||||
* ------------------------------------------------------------- */
|
* ------------------------------------------------------------- */
|
||||||
|
|
|
||||||
|
|
@ -236,37 +236,6 @@ table .headerSortUp.purple,table .headerSortDown.purple{background-color:#e2d5f0
|
||||||
.topbar .dropdown-menu a,.dropdown-menu a{display:block;padding:4px 15px;clear:both;font-weight:normal;line-height:18px;color:#808080;text-shadow:0 1px 0 #ffffff;}.topbar .dropdown-menu a:hover,.dropdown-menu a:hover{background-color:#dddddd;background-image:-khtml-gradient(linear, left top, left bottom, from(#eeeeee), to(#dddddd));background-image:-moz-linear-gradient(top, #eeeeee, #dddddd);background-image:-ms-linear-gradient(top, #eeeeee, #dddddd);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #eeeeee), color-stop(100%, #dddddd));background-image:-webkit-linear-gradient(top, #eeeeee, #dddddd);background-image:-o-linear-gradient(top, #eeeeee, #dddddd);background-image:linear-gradient(top, #eeeeee, #dddddd);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#dddddd', GradientType=0);color:#404040;text-decoration:none;-webkit-box-shadow:inset 0 1px 0 rgba(0, 0, 0, 0.025),inset 0 -1px rgba(0, 0, 0, 0.025);-moz-box-shadow:inset 0 1px 0 rgba(0, 0, 0, 0.025),inset 0 -1px rgba(0, 0, 0, 0.025);box-shadow:inset 0 1px 0 rgba(0, 0, 0, 0.025),inset 0 -1px rgba(0, 0, 0, 0.025);}
|
.topbar .dropdown-menu a,.dropdown-menu a{display:block;padding:4px 15px;clear:both;font-weight:normal;line-height:18px;color:#808080;text-shadow:0 1px 0 #ffffff;}.topbar .dropdown-menu a:hover,.dropdown-menu a:hover{background-color:#dddddd;background-image:-khtml-gradient(linear, left top, left bottom, from(#eeeeee), to(#dddddd));background-image:-moz-linear-gradient(top, #eeeeee, #dddddd);background-image:-ms-linear-gradient(top, #eeeeee, #dddddd);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #eeeeee), color-stop(100%, #dddddd));background-image:-webkit-linear-gradient(top, #eeeeee, #dddddd);background-image:-o-linear-gradient(top, #eeeeee, #dddddd);background-image:linear-gradient(top, #eeeeee, #dddddd);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#dddddd', GradientType=0);color:#404040;text-decoration:none;-webkit-box-shadow:inset 0 1px 0 rgba(0, 0, 0, 0.025),inset 0 -1px rgba(0, 0, 0, 0.025);-moz-box-shadow:inset 0 1px 0 rgba(0, 0, 0, 0.025),inset 0 -1px rgba(0, 0, 0, 0.025);box-shadow:inset 0 1px 0 rgba(0, 0, 0, 0.025),inset 0 -1px rgba(0, 0, 0, 0.025);}
|
||||||
.dropdown.open .dropdown-toggle{color:#ffffff;background:#ccc;background:rgba(0, 0, 0, 0.3);}
|
.dropdown.open .dropdown-toggle{color:#ffffff;background:#ccc;background:rgba(0, 0, 0, 0.3);}
|
||||||
.dropdown.open .dropdown-menu{display:block;}
|
.dropdown.open .dropdown-menu{display:block;}
|
||||||
.tabs,.pills{margin:0 0 20px;padding:0;list-style:none;zoom:1;}.tabs:before,.pills:before,.tabs:after,.pills:after{display:table;content:"";zoom:1;*display:inline;}
|
|
||||||
.tabs:after,.pills:after{clear:both;}
|
|
||||||
.tabs>li,.pills>li{float:left;}.tabs>li>a,.pills>li>a{display:block;}
|
|
||||||
.tabs{border-color:#ddd;border-style:solid;border-width:0 0 1px;}.tabs>li{position:relative;margin-bottom:-1px;}.tabs>li>a{padding:0 15px;margin-right:2px;line-height:36px;border:1px solid transparent;-webkit-border-radius:4px 4px 0 0;-moz-border-radius:4px 4px 0 0;border-radius:4px 4px 0 0;}.tabs>li>a:hover{text-decoration:none;background-color:#eee;border-color:#eee #eee #ddd;}
|
|
||||||
.tabs .active>a,.tabs .active>a:hover{color:#808080;background-color:#ffffff;border:1px solid #ddd;border-bottom-color:transparent;cursor:default;}
|
|
||||||
.tabbable{margin-bottom:18px;}.tabbable .tabs{margin-bottom:0;border-bottom:0;}
|
|
||||||
.tabbable .tab-content{padding:19px;border:1px solid #ddd;}
|
|
||||||
.tabbable.tabs-bottom .tabs>li{margin-top:-1px;margin-bottom:0;}
|
|
||||||
.tabbable.tabs-bottom .tabs>li>a{-webkit-border-radius:0 0 4px 4px;-moz-border-radius:0 0 4px 4px;border-radius:0 0 4px 4px;}.tabbable.tabs-bottom .tabs>li>a:hover{border-bottom-color:transparent;border-top-color:#ddd;}
|
|
||||||
.tabbable.tabs-bottom .tabs>.active>a,.tabbable.tabs-bottom .tabs>.active>a:hover{border-color:transparent #ddd #ddd #ddd;}
|
|
||||||
.tabbable.tabs-left,.tabbable.tabs-right{zoom:1;}.tabbable.tabs-left:before,.tabbable.tabs-right:before,.tabbable.tabs-left:after,.tabbable.tabs-right:after{display:table;content:"";zoom:1;*display:inline;}
|
|
||||||
.tabbable.tabs-left:after,.tabbable.tabs-right:after{clear:both;}
|
|
||||||
.tabbable.tabs-left .tabs,.tabbable.tabs-right .tabs{width:100px;}.tabbable.tabs-left .tabs>li,.tabbable.tabs-right .tabs>li{float:none;margin-bottom:-1px;}.tabbable.tabs-left .tabs>li>a,.tabbable.tabs-right .tabs>li>a{margin-bottom:2px;}.tabbable.tabs-left .tabs>li>a:hover,.tabbable.tabs-right .tabs>li>a:hover{border-color:transparent;}
|
|
||||||
.tabbable.tabs-left .tab-content{margin-left:100px;}
|
|
||||||
.tabbable.tabs-left .tabs{float:left;}.tabbable.tabs-left .tabs>li{margin-right:-1px;}.tabbable.tabs-left .tabs>li>a{margin-right:0;-webkit-border-radius:4px 0 0 4px;-moz-border-radius:4px 0 0 4px;border-radius:4px 0 0 4px;}.tabbable.tabs-left .tabs>li>a:hover{border-right-color:#ddd;}
|
|
||||||
.tabbable.tabs-left .tabs .active>a,.tabbable.tabs-left .tabs .active>a:hover{border-color:#ddd;border-right-color:transparent;}
|
|
||||||
.tabbable.tabs-right .tab-content{margin-right:100px;}
|
|
||||||
.tabbable.tabs-right .tabs{float:right;}.tabbable.tabs-right .tabs>li{margin-left:-1px;}.tabbable.tabs-right .tabs>li>a{margin-left:0;-webkit-border-radius:0 4px 4px 0;-moz-border-radius:0 4px 4px 0;border-radius:0 4px 4px 0;}.tabbable.tabs-right .tabs>li>a:hover{border-left-color:#ddd;}
|
|
||||||
.tabbable.tabs-right .tabs .active>a,.tabbable.tabs-right .tabs .active>a:hover{border-color:#ddd;border-left-color:transparent;}
|
|
||||||
.tabs .menu-dropdown,.tabs .dropdown-menu{top:35px;border-width:1px;-webkit-border-radius:0 6px 6px 6px;-moz-border-radius:0 6px 6px 6px;border-radius:0 6px 6px 6px;}
|
|
||||||
.tabs a.menu:after,.tabs .dropdown-toggle:after{border-top-color:#999;margin-top:15px;margin-left:5px;}
|
|
||||||
.tabs li.open.menu .menu,.tabs .open.dropdown .dropdown-toggle{border-color:#999;}
|
|
||||||
.tabs li.open a.menu:after,.tabs .dropdown.open .dropdown-toggle:after{border-top-color:#555;}
|
|
||||||
.pills a{margin:5px 3px 5px 0;padding:0 15px;line-height:30px;text-shadow:0 1px 1px #ffffff;-webkit-border-radius:15px;-moz-border-radius:15px;border-radius:15px;}.pills a:hover{color:#ffffff;text-decoration:none;text-shadow:0 1px 1px rgba(0, 0, 0, 0.25);background-color:#00438a;}
|
|
||||||
.pills .active a{color:#ffffff;text-shadow:0 1px 1px rgba(0, 0, 0, 0.25);background-color:#0069d6;}
|
|
||||||
.pills-vertical>li{float:none;}
|
|
||||||
.tab-content>.tab-pane,.pill-content>.pill-pane{display:none;}
|
|
||||||
.tab-content>.active,.pill-content>.active{display:block;}
|
|
||||||
.breadcrumb{margin:0 0 18px;padding:7px 14px;background-color:#f5f5f5;background-image:-khtml-gradient(linear, left top, left bottom, from(#ffffff), to(#f5f5f5));background-image:-moz-linear-gradient(top, #ffffff, #f5f5f5);background-image:-ms-linear-gradient(top, #ffffff, #f5f5f5);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #f5f5f5));background-image:-webkit-linear-gradient(top, #ffffff, #f5f5f5);background-image:-o-linear-gradient(top, #ffffff, #f5f5f5);background-image:linear-gradient(top, #ffffff, #f5f5f5);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f5f5f5', GradientType=0);border:1px solid #ddd;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;-webkit-box-shadow:inset 0 1px 0 #ffffff;-moz-box-shadow:inset 0 1px 0 #ffffff;box-shadow:inset 0 1px 0 #ffffff;}.breadcrumb li{display:inline;text-shadow:0 1px 0 #ffffff;}
|
|
||||||
.breadcrumb .divider{padding:0 5px;color:#bfbfbf;}
|
|
||||||
.breadcrumb .active a{color:#404040;}
|
|
||||||
.hero-unit{background-color:#f5f5f5;margin-bottom:30px;padding:60px;-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;}.hero-unit h1{margin-bottom:0;font-size:60px;line-height:1;letter-spacing:-1px;}
|
.hero-unit{background-color:#f5f5f5;margin-bottom:30px;padding:60px;-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;}.hero-unit h1{margin-bottom:0;font-size:60px;line-height:1;letter-spacing:-1px;}
|
||||||
.hero-unit p{font-size:18px;font-weight:200;line-height:27px;}
|
.hero-unit p{font-size:18px;font-weight:200;line-height:27px;}
|
||||||
footer{margin-top:17px;padding-top:17px;border-top:1px solid #eee;}
|
footer{margin-top:17px;padding-top:17px;border-top:1px solid #eee;}
|
||||||
|
|
@ -307,13 +276,51 @@ button.btn::-moz-focus-inner,input[type=submit].btn::-moz-focus-inner{padding:0;
|
||||||
.alert-message.block-message.error{background-color:#fddfde;border-color:#fbc7c6;}
|
.alert-message.block-message.error{background-color:#fddfde;border-color:#fbc7c6;}
|
||||||
.alert-message.block-message.success{background-color:#d1eed1;border-color:#bfe7bf;}
|
.alert-message.block-message.success{background-color:#d1eed1;border-color:#bfe7bf;}
|
||||||
.alert-message.block-message.info{background-color:#ddf4fb;border-color:#c6edf9;}
|
.alert-message.block-message.info{background-color:#ddf4fb;border-color:#c6edf9;}
|
||||||
|
.well{background-color:#f5f5f5;margin-bottom:20px;padding:19px;min-height:20px;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;}
|
||||||
|
.label{padding:1px 3px 2px;background-color:#bfbfbf;font-size:9.75px;font-weight:bold;color:#ffffff;text-transform:uppercase;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}.label.important{background-color:#c43c35;}
|
||||||
|
.label.warning{background-color:#f89406;}
|
||||||
|
.label.success{background-color:#46a546;}
|
||||||
|
.label.notice{background-color:#62cffc;}
|
||||||
|
.pull-right{float:right;}
|
||||||
|
.pull-left{float:left;}
|
||||||
|
.tabs,.pills{margin:0 0 20px;padding:0;list-style:none;zoom:1;}.tabs:before,.pills:before,.tabs:after,.pills:after{display:table;content:"";zoom:1;*display:inline;}
|
||||||
|
.tabs:after,.pills:after{clear:both;}
|
||||||
|
.tabs>li,.pills>li{float:left;}.tabs>li>a,.pills>li>a{display:block;}
|
||||||
|
.tabs{border-color:#ddd;border-style:solid;border-width:0 0 1px;}.tabs>li{position:relative;margin-bottom:-1px;}.tabs>li>a{padding:0 15px;margin-right:2px;line-height:36px;border:1px solid transparent;-webkit-border-radius:4px 4px 0 0;-moz-border-radius:4px 4px 0 0;border-radius:4px 4px 0 0;}.tabs>li>a:hover{text-decoration:none;background-color:#eee;border-color:#eee #eee #ddd;}
|
||||||
|
.tabs .active>a,.tabs .active>a:hover{color:#808080;background-color:#ffffff;border:1px solid #ddd;border-bottom-color:transparent;cursor:default;}
|
||||||
|
.tabbable{margin-bottom:18px;}.tabbable .tabs{margin-bottom:0;border-bottom:0;}
|
||||||
|
.tabbable .tab-content{padding:19px;border:1px solid #ddd;}
|
||||||
|
.tabbable.tabs-bottom .tabs>li{margin-top:-1px;margin-bottom:0;}
|
||||||
|
.tabbable.tabs-bottom .tabs>li>a{-webkit-border-radius:0 0 4px 4px;-moz-border-radius:0 0 4px 4px;border-radius:0 0 4px 4px;}.tabbable.tabs-bottom .tabs>li>a:hover{border-bottom-color:transparent;border-top-color:#ddd;}
|
||||||
|
.tabbable.tabs-bottom .tabs>.active>a,.tabbable.tabs-bottom .tabs>.active>a:hover{border-color:transparent #ddd #ddd #ddd;}
|
||||||
|
.tabbable.tabs-left,.tabbable.tabs-right{zoom:1;}.tabbable.tabs-left:before,.tabbable.tabs-right:before,.tabbable.tabs-left:after,.tabbable.tabs-right:after{display:table;content:"";zoom:1;*display:inline;}
|
||||||
|
.tabbable.tabs-left:after,.tabbable.tabs-right:after{clear:both;}
|
||||||
|
.tabbable.tabs-left .tabs,.tabbable.tabs-right .tabs{width:100px;}.tabbable.tabs-left .tabs>li,.tabbable.tabs-right .tabs>li{float:none;margin-bottom:-1px;}.tabbable.tabs-left .tabs>li>a,.tabbable.tabs-right .tabs>li>a{margin-bottom:2px;}.tabbable.tabs-left .tabs>li>a:hover,.tabbable.tabs-right .tabs>li>a:hover{border-color:transparent;}
|
||||||
|
.tabbable.tabs-left .tab-content{margin-left:100px;}
|
||||||
|
.tabbable.tabs-left .tabs{float:left;}.tabbable.tabs-left .tabs>li{margin-right:-1px;}.tabbable.tabs-left .tabs>li>a{margin-right:0;-webkit-border-radius:4px 0 0 4px;-moz-border-radius:4px 0 0 4px;border-radius:4px 0 0 4px;}.tabbable.tabs-left .tabs>li>a:hover{border-right-color:#ddd;}
|
||||||
|
.tabbable.tabs-left .tabs .active>a,.tabbable.tabs-left .tabs .active>a:hover{border-color:#ddd;border-right-color:transparent;}
|
||||||
|
.tabbable.tabs-right .tab-content{margin-right:100px;}
|
||||||
|
.tabbable.tabs-right .tabs{float:right;}.tabbable.tabs-right .tabs>li{margin-left:-1px;}.tabbable.tabs-right .tabs>li>a{margin-left:0;-webkit-border-radius:0 4px 4px 0;-moz-border-radius:0 4px 4px 0;border-radius:0 4px 4px 0;}.tabbable.tabs-right .tabs>li>a:hover{border-left-color:#ddd;}
|
||||||
|
.tabbable.tabs-right .tabs .active>a,.tabbable.tabs-right .tabs .active>a:hover{border-color:#ddd;border-left-color:transparent;}
|
||||||
|
.tabs .menu-dropdown,.tabs .dropdown-menu{top:35px;border-width:1px;-webkit-border-radius:0 6px 6px 6px;-moz-border-radius:0 6px 6px 6px;border-radius:0 6px 6px 6px;}
|
||||||
|
.tabs a.menu:after,.tabs .dropdown-toggle:after{border-top-color:#999;margin-top:15px;margin-left:5px;}
|
||||||
|
.tabs li.open.menu .menu,.tabs .open.dropdown .dropdown-toggle{border-color:#999;}
|
||||||
|
.tabs li.open a.menu:after,.tabs .dropdown.open .dropdown-toggle:after{border-top-color:#555;}
|
||||||
|
.pills a{margin:5px 3px 5px 0;padding:0 15px;line-height:30px;text-shadow:0 1px 1px #ffffff;-webkit-border-radius:15px;-moz-border-radius:15px;border-radius:15px;}.pills a:hover{color:#ffffff;text-decoration:none;text-shadow:0 1px 1px rgba(0, 0, 0, 0.25);background-color:#00438a;}
|
||||||
|
.pills .active a{color:#ffffff;text-shadow:0 1px 1px rgba(0, 0, 0, 0.25);background-color:#0069d6;}
|
||||||
|
.pills-vertical>li{float:none;}
|
||||||
|
.tab-content>.tab-pane,.pill-content>.pill-pane{display:none;}
|
||||||
|
.tab-content>.active,.pill-content>.active{display:block;}
|
||||||
|
.breadcrumb{margin:0 0 18px;padding:7px 14px;background-color:#f5f5f5;background-image:-khtml-gradient(linear, left top, left bottom, from(#ffffff), to(#f5f5f5));background-image:-moz-linear-gradient(top, #ffffff, #f5f5f5);background-image:-ms-linear-gradient(top, #ffffff, #f5f5f5);background-image:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #f5f5f5));background-image:-webkit-linear-gradient(top, #ffffff, #f5f5f5);background-image:-o-linear-gradient(top, #ffffff, #f5f5f5);background-image:linear-gradient(top, #ffffff, #f5f5f5);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f5f5f5', GradientType=0);border:1px solid #ddd;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;-webkit-box-shadow:inset 0 1px 0 #ffffff;-moz-box-shadow:inset 0 1px 0 #ffffff;box-shadow:inset 0 1px 0 #ffffff;}.breadcrumb li{display:inline;text-shadow:0 1px 0 #ffffff;}
|
||||||
|
.breadcrumb .divider{padding:0 5px;color:#bfbfbf;}
|
||||||
|
.breadcrumb .active a{color:#404040;}
|
||||||
.pagination{height:36px;margin:18px 0;}.pagination ul{float:left;margin:0;border:1px solid #ddd;border:1px solid rgba(0, 0, 0, 0.15);-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;-webkit-box-shadow:0 1px 2px rgba(0, 0, 0, 0.05);-moz-box-shadow:0 1px 2px rgba(0, 0, 0, 0.05);box-shadow:0 1px 2px rgba(0, 0, 0, 0.05);}
|
.pagination{height:36px;margin:18px 0;}.pagination ul{float:left;margin:0;border:1px solid #ddd;border:1px solid rgba(0, 0, 0, 0.15);-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;-webkit-box-shadow:0 1px 2px rgba(0, 0, 0, 0.05);-moz-box-shadow:0 1px 2px rgba(0, 0, 0, 0.05);box-shadow:0 1px 2px rgba(0, 0, 0, 0.05);}
|
||||||
.pagination li{display:inline;}
|
.pagination li{display:inline;}
|
||||||
.pagination a{float:left;padding:0 14px;line-height:34px;border-right:1px solid;border-right-color:#ddd;border-right-color:rgba(0, 0, 0, 0.15);*border-right-color:#ddd;text-decoration:none;}
|
.pagination a{float:left;padding:0 14px;line-height:34px;border-right:1px solid;border-right-color:#ddd;border-right-color:rgba(0, 0, 0, 0.15);*border-right-color:#ddd;text-decoration:none;}
|
||||||
.pagination a:hover,.pagination .active a{background-color:#c7eefe;}
|
.pagination a:hover,.pagination .active a{background-color:#c7eefe;}
|
||||||
.pagination .disabled a,.pagination .disabled a:hover{background-color:transparent;color:#bfbfbf;}
|
.pagination .disabled a,.pagination .disabled a:hover{background-color:transparent;color:#bfbfbf;}
|
||||||
.pagination .next a{border:0;}
|
.pagination .next a{border:0;}
|
||||||
.well{background-color:#f5f5f5;margin-bottom:20px;padding:19px;min-height:20px;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);}
|
|
||||||
.modal-backdrop{background-color:#000000;position:fixed;top:0;left:0;right:0;bottom:0;z-index:10000;}.modal-backdrop.fade{opacity:0;}
|
.modal-backdrop{background-color:#000000;position:fixed;top:0;left:0;right:0;bottom:0;z-index:10000;}.modal-backdrop.fade{opacity:0;}
|
||||||
.modal-backdrop,.modal-backdrop.fade.in{filter:alpha(opacity=80);-khtml-opacity:0.8;-moz-opacity:0.8;opacity:0.8;}
|
.modal-backdrop,.modal-backdrop.fade.in{filter:alpha(opacity=80);-khtml-opacity:0.8;-moz-opacity:0.8;opacity:0.8;}
|
||||||
.modal{position:fixed;top:50%;left:50%;z-index:11000;width:560px;margin:-250px 0 0 -250px;background-color:#ffffff;border:1px solid #999;border:1px solid rgba(0, 0, 0, 0.3);*border:1px solid #999;-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;-webkit-box-shadow:0 3px 7px rgba(0, 0, 0, 0.3);-moz-box-shadow:0 3px 7px rgba(0, 0, 0, 0.3);box-shadow:0 3px 7px rgba(0, 0, 0, 0.3);-webkit-background-clip:padding-box;-moz-background-clip:padding-box;background-clip:padding-box;}.modal .close{margin-top:7px;}
|
.modal{position:fixed;top:50%;left:50%;z-index:11000;width:560px;margin:-250px 0 0 -250px;background-color:#ffffff;border:1px solid #999;border:1px solid rgba(0, 0, 0, 0.3);*border:1px solid #999;-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;-webkit-box-shadow:0 3px 7px rgba(0, 0, 0, 0.3);-moz-box-shadow:0 3px 7px rgba(0, 0, 0, 0.3);box-shadow:0 3px 7px rgba(0, 0, 0, 0.3);-webkit-background-clip:padding-box;-moz-background-clip:padding-box;background-clip:padding-box;}.modal .close{margin-top:7px;}
|
||||||
|
|
@ -339,16 +346,9 @@ button.btn::-moz-focus-inner,input[type=submit].btn::-moz-focus-inner{padding:0;
|
||||||
.popover .inner{background-color:#000000;background-color:rgba(0, 0, 0, 0.8);padding:3px;overflow:hidden;width:280px;-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;-webkit-box-shadow:0 3px 7px rgba(0, 0, 0, 0.3);-moz-box-shadow:0 3px 7px rgba(0, 0, 0, 0.3);box-shadow:0 3px 7px rgba(0, 0, 0, 0.3);}
|
.popover .inner{background-color:#000000;background-color:rgba(0, 0, 0, 0.8);padding:3px;overflow:hidden;width:280px;-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;-webkit-box-shadow:0 3px 7px rgba(0, 0, 0, 0.3);-moz-box-shadow:0 3px 7px rgba(0, 0, 0, 0.3);box-shadow:0 3px 7px rgba(0, 0, 0, 0.3);}
|
||||||
.popover .title{background-color:#f5f5f5;padding:9px 15px;line-height:1;-webkit-border-radius:3px 3px 0 0;-moz-border-radius:3px 3px 0 0;border-radius:3px 3px 0 0;border-bottom:1px solid #eee;}
|
.popover .title{background-color:#f5f5f5;padding:9px 15px;line-height:1;-webkit-border-radius:3px 3px 0 0;-moz-border-radius:3px 3px 0 0;border-radius:3px 3px 0 0;border-bottom:1px solid #eee;}
|
||||||
.popover .content{background-color:#ffffff;padding:14px;-webkit-border-radius:0 0 3px 3px;-moz-border-radius:0 0 3px 3px;border-radius:0 0 3px 3px;-webkit-background-clip:padding-box;-moz-background-clip:padding-box;background-clip:padding-box;}.popover .content p,.popover .content ul,.popover .content ol{margin-bottom:0;}
|
.popover .content{background-color:#ffffff;padding:14px;-webkit-border-radius:0 0 3px 3px;-moz-border-radius:0 0 3px 3px;border-radius:0 0 3px 3px;-webkit-background-clip:padding-box;-moz-background-clip:padding-box;background-clip:padding-box;}.popover .content p,.popover .content ul,.popover .content ol{margin-bottom:0;}
|
||||||
.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;}
|
|
||||||
.label{padding:1px 3px 2px;background-color:#bfbfbf;font-size:9.75px;font-weight:bold;color:#ffffff;text-transform:uppercase;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}.label.important{background-color:#c43c35;}
|
|
||||||
.label.warning{background-color:#f89406;}
|
|
||||||
.label.success{background-color:#46a546;}
|
|
||||||
.label.notice{background-color:#62cffc;}
|
|
||||||
.media-grid{margin-left:-20px;margin-bottom:0;zoom:1;}.media-grid:before,.media-grid:after{display:table;content:"";zoom:1;*display:inline;}
|
.media-grid{margin-left:-20px;margin-bottom:0;zoom:1;}.media-grid:before,.media-grid:after{display:table;content:"";zoom:1;*display:inline;}
|
||||||
.media-grid:after{clear:both;}
|
.media-grid:after{clear:both;}
|
||||||
.media-grid li{display:inline;}
|
.media-grid li{display:inline;}
|
||||||
.media-grid a{float:left;padding:4px;margin:0 0 20px 20px;border:1px solid #ddd;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:0 1px 1px rgba(0, 0, 0, 0.075);-moz-box-shadow:0 1px 1px rgba(0, 0, 0, 0.075);box-shadow:0 1px 1px rgba(0, 0, 0, 0.075);}.media-grid a img{display:block;}
|
.media-grid a{float:left;padding:4px;margin:0 0 20px 20px;border:1px solid #ddd;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:0 1px 1px rgba(0, 0, 0, 0.075);-moz-box-shadow:0 1px 1px rgba(0, 0, 0, 0.075);box-shadow:0 1px 1px rgba(0, 0, 0, 0.075);}.media-grid a img{display:block;}
|
||||||
.media-grid a:hover{border-color:#0069d6;-webkit-box-shadow:0 1px 4px rgba(0, 105, 214, 0.25);-moz-box-shadow:0 1px 4px rgba(0, 105, 214, 0.25);box-shadow:0 1px 4px rgba(0, 105, 214, 0.25);}
|
.media-grid a:hover{border-color:#0069d6;-webkit-box-shadow:0 1px 4px rgba(0, 105, 214, 0.25);-moz-box-shadow:0 1px 4px rgba(0, 105, 214, 0.25);box-shadow:0 1px 4px rgba(0, 105, 214, 0.25);}
|
||||||
.pull-right{float:right;}
|
|
||||||
.pull-left{float:left;}
|
|
||||||
@media (max-width: 480px){.container{width:auto;padding:0 15px;} .row{margin-left:0;} [class*="span"]{float:none;display:block;width:auto;margin:0;} .modal{width:auto;margin:0;} .form-horizontal .control-group>label{float:none;width:auto;padding-top:0;text-align:left;} .form-horizontal .controls{margin-left:0;} .form-horizontal .control-list{padding-top:0;} .form-horizontal .form-actions{padding-left:0;}}@media (min-width: 480px) and (max-width: 768px){.container{width:auto;padding:0 10px;} .row{margin-left:0;} [class*="span"]{float:none;display:block;width:auto;margin:0;}}@media (min-width: 768px) and (max-width: 940px){.container{width:748px;} .span1{width:44px;} .span2{width:108px;} .span3{width:172px;} .span4{width:236px;} .span5{width:300px;} .span6{width:364px;} .span7{width:428px;} .span8{width:492px;} .span9{width:556px;} .span10{width:620px;} .span11{width:684px;} .span12{width:748px;} .offset1{margin-left:64px;} .offset2{margin-left:128px;} .offset3{margin-left:192px;} .offset4{margin-left:256px;} .offset5{margin-left:320px;} .offset6{margin-left:384px;} .offset7{margin-left:448px;} .offset8{margin-left:512px;} .offset9{margin-left:576px;} .offset10{margin-left:640px;} .offset11{margin-left:704px;} .offset12{margin-left:768px;}}
|
@media (max-width: 480px){.container{width:auto;padding:0 15px;} .row{margin-left:0;} [class*="span"]{float:none;display:block;width:auto;margin:0;} .modal{width:auto;margin:0;} .form-horizontal .control-group>label{float:none;width:auto;padding-top:0;text-align:left;} .form-horizontal .controls{margin-left:0;} .form-horizontal .control-list{padding-top:0;} .form-horizontal .form-actions{padding-left:0;}}@media (min-width: 480px) and (max-width: 768px){.container{width:auto;padding:0 10px;} .row{margin-left:0;} [class*="span"]{float:none;display:block;width:auto;margin:0;}}@media (min-width: 768px) and (max-width: 940px){.container{width:748px;} .span1{width:44px;} .span2{width:108px;} .span3{width:172px;} .span4{width:236px;} .span5{width:300px;} .span6{width:364px;} .span7{width:428px;} .span8{width:492px;} .span9{width:556px;} .span10{width:620px;} .span11{width:684px;} .span12{width:748px;} .offset1{margin-left:64px;} .offset2{margin-left:128px;} .offset3{margin-left:192px;} .offset4{margin-left:256px;} .offset5{margin-left:320px;} .offset6{margin-left:384px;} .offset7{margin-left:448px;} .offset8{margin-left:512px;} .offset9{margin-left:576px;} .offset10{margin-left:640px;} .offset11{margin-left:704px;} .offset12{margin-left:768px;}}
|
||||||
|
|
|
||||||
|
|
@ -696,22 +696,22 @@
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr>
|
<tr>
|
||||||
<th>Vertical (default)</th>
|
<th>Vertical (default)</th>
|
||||||
<td><code>.vertical-form</code> <span class="muted">(not required)</span></td>
|
<td><code>.form-vertical</code> <span class="muted">(not required)</span></td>
|
||||||
<td>Stacked, left-aligned labels over controls</td>
|
<td>Stacked, left-aligned labels over controls</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<th>Horiztonal</th>
|
<th>Horiztonal</th>
|
||||||
<td><code>.horizontal-form</code></td>
|
<td><code>.form-horizontal</code></td>
|
||||||
<td>Float left, right-aligned labels on same line as controls</td>
|
<td>Float left, right-aligned labels on same line as controls</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<th>Inline</th>
|
<th>Inline</th>
|
||||||
<td><code>.inline-form</code></td>
|
<td><code>.form-inline</code></td>
|
||||||
<td>Left-aligned label and inline-block controls for compact style</td>
|
<td>Left-aligned label and inline-block controls for compact style</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<th>Search</th>
|
<th>Search</th>
|
||||||
<td><code>.search-form</code></td>
|
<td><code>.form-search</code></td>
|
||||||
<td>Extra-rounded text input for a typical search aesthetic</td>
|
<td>Extra-rounded text input for a typical search aesthetic</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
|
|
|
||||||
197
docs/less.html
197
docs/less.html
|
|
@ -95,15 +95,208 @@
|
||||||
<!-- VARIABLES
|
<!-- VARIABLES
|
||||||
================================================== -->
|
================================================== -->
|
||||||
<div class="page-header" id="variables">
|
<div class="page-header" id="variables">
|
||||||
<h1>Variables</h1>
|
<h1>Variables <small>from variables.less</small></h1>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="row">
|
||||||
|
<div class="span3">
|
||||||
|
<h3>Hyperlinks</h3>
|
||||||
|
</div>
|
||||||
|
<div class="span9">
|
||||||
|
<table class="bordered-table striped-table">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th>Variable</th>
|
||||||
|
<th>Value</th>
|
||||||
|
<th>Usage</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td><code>@linkColor</code></td>
|
||||||
|
<td>#0069d6</td>
|
||||||
|
<td>Default link text color</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>@linkColorHover</code></td>
|
||||||
|
<td><code>darken(@linkColor, 15)</code></td>
|
||||||
|
<td>Default link text hover color</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row">
|
||||||
|
<div class="span3">
|
||||||
|
<h3>Grayscale colors</h3>
|
||||||
|
</div>
|
||||||
|
<div class="span9">
|
||||||
|
<table class="bordered-table striped-table">
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td><code>@black</code></td>
|
||||||
|
<td>#000</td>
|
||||||
|
<td>Black</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>@grayDark</code></td>
|
||||||
|
<td><code>lighten(@black, 25%)</code></td>
|
||||||
|
<td>Dark gray</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>@gray</code></td>
|
||||||
|
<td><code>lighten(@black, 50%)</code></td>
|
||||||
|
<td>Medium gray</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>@grayLight</code></td>
|
||||||
|
<td><code>lighten(@black, 75%)</code></td>
|
||||||
|
<td>Light gray</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>@grayLighter</code></td>
|
||||||
|
<td><code>lighten(@black, 90%)</code></td>
|
||||||
|
<td>Lighter gray</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>@white</code></td>
|
||||||
|
<td>#fff</td>
|
||||||
|
<td>White</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row">
|
||||||
|
<div class="span3">
|
||||||
|
<h3>Accent colors</h3>
|
||||||
|
</div>
|
||||||
|
<div class="span9">
|
||||||
|
<table class="bordered-table striped-table">
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td><code>@blue</code></td>
|
||||||
|
<td>#049CDB</td>
|
||||||
|
<td></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>@green</code></td>
|
||||||
|
<td>#46a546</td>
|
||||||
|
<td></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>@red</code></td>
|
||||||
|
<td>#9d261d</td>
|
||||||
|
<td></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>@yellow</code></td>
|
||||||
|
<td>#ffc40d</td>
|
||||||
|
<td></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>@orange</code></td>
|
||||||
|
<td>#f89406</td>
|
||||||
|
<td></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>@pink</code></td>
|
||||||
|
<td>#c3325f</td>
|
||||||
|
<td></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>@purple</code></td>
|
||||||
|
<td>#7a43b6</td>
|
||||||
|
<td></td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row">
|
||||||
|
<div class="span3">
|
||||||
|
<h3>Grid system</h3>
|
||||||
|
</div>
|
||||||
|
<div class="span9">
|
||||||
|
<table class="bordered-table striped-table">
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td><code>@gridColumns</code></td>
|
||||||
|
<td>12</td>
|
||||||
|
<td></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>@gridColumnWidth</code></td>
|
||||||
|
<td>60px</td>
|
||||||
|
<td></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>@gridGutterWidth</code></td>
|
||||||
|
<td>20px</td>
|
||||||
|
<td></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>@siteWidth</code></td>
|
||||||
|
<td><code>(@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1))</code></td>
|
||||||
|
<td></td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row">
|
||||||
|
<div class="span3">
|
||||||
|
<h3>Typography</h3>
|
||||||
|
</div>
|
||||||
|
<div class="span9">
|
||||||
|
<table class="bordered-table striped-table">
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td><code>@baseFontSize</code></td>
|
||||||
|
<td>13px</td>
|
||||||
|
<td></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>@baseFontFamily</code></td>
|
||||||
|
<td><code>"Helvetica Neue", Helvetica, Arial, sans-serif</code></td>
|
||||||
|
<td></td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td><code>@baseLineHeight</code></td>
|
||||||
|
<td>18px</td>
|
||||||
|
<td></td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row">
|
||||||
|
<div class="span3">
|
||||||
|
<h3>Visuals</h3>
|
||||||
|
</div>
|
||||||
|
<div class="span9">
|
||||||
|
<table class="bordered-table striped-table">
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td><code>@primaryButtonColor</code></td>
|
||||||
|
<td><code>@blue</code></td>
|
||||||
|
<td></td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<!-- MIXINS
|
<!-- MIXINS
|
||||||
================================================== -->
|
================================================== -->
|
||||||
<div class="page-header" id="mixins">
|
<div class="page-header" id="mixins">
|
||||||
<h1>Mixins</h1>
|
<h1>Mixins <small>from mixins.less</small></h1>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -23,7 +23,17 @@
|
||||||
@import "type.less";
|
@import "type.less";
|
||||||
@import "forms.less";
|
@import "forms.less";
|
||||||
@import "tables.less";
|
@import "tables.less";
|
||||||
|
|
||||||
|
// Temp catchall for what's missing thus far
|
||||||
@import "patterns.less";
|
@import "patterns.less";
|
||||||
|
|
||||||
|
@import "tabs-pills.less";
|
||||||
|
@import "breadcrumbs.less";
|
||||||
|
@import "pagination.less";
|
||||||
|
@import "modals.less";
|
||||||
|
@import "twipsy.less";
|
||||||
|
@import "popovers.less";
|
||||||
|
@import "media-grids.less";
|
||||||
|
|
||||||
// Responsive
|
// Responsive
|
||||||
@import "responsive.less";
|
@import "responsive.less";
|
||||||
|
|
@ -0,0 +1,22 @@
|
||||||
|
// BREADCRUMBS
|
||||||
|
// -----------
|
||||||
|
|
||||||
|
.breadcrumb {
|
||||||
|
margin: 0 0 @baseLineHeight;
|
||||||
|
padding: 7px 14px;
|
||||||
|
#gradient > .vertical(#ffffff, #f5f5f5);
|
||||||
|
border: 1px solid #ddd;
|
||||||
|
.border-radius(3px);
|
||||||
|
.box-shadow(inset 0 1px 0 @white);
|
||||||
|
li {
|
||||||
|
display: inline;
|
||||||
|
text-shadow: 0 1px 0 @white;
|
||||||
|
}
|
||||||
|
.divider {
|
||||||
|
padding: 0 5px;
|
||||||
|
color: @grayLight;
|
||||||
|
}
|
||||||
|
.active a {
|
||||||
|
color: @grayDark;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,26 @@
|
||||||
|
// MEDIA GRIDS
|
||||||
|
// -----------
|
||||||
|
|
||||||
|
.media-grid {
|
||||||
|
margin-left: -20px;
|
||||||
|
margin-bottom: 0;
|
||||||
|
.clearfix();
|
||||||
|
li {
|
||||||
|
display: inline;
|
||||||
|
}
|
||||||
|
a {
|
||||||
|
float: left;
|
||||||
|
padding: 4px;
|
||||||
|
margin: 0 0 20px 20px;
|
||||||
|
border: 1px solid #ddd;
|
||||||
|
.border-radius(4px);
|
||||||
|
.box-shadow(0 1px 1px rgba(0,0,0,.075));
|
||||||
|
img {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
&:hover {
|
||||||
|
border-color: @linkColor;
|
||||||
|
.box-shadow(0 1px 4px rgba(0,105,214,.25));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -272,4 +272,41 @@
|
||||||
-khtml-opacity: @opacity / 100;
|
-khtml-opacity: @opacity / 100;
|
||||||
-moz-opacity: @opacity / 100;
|
-moz-opacity: @opacity / 100;
|
||||||
opacity: @opacity / 100;
|
opacity: @opacity / 100;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Popover arrows
|
||||||
|
// For tipsies and popovers
|
||||||
|
#popoverArrow {
|
||||||
|
.above(@arrowWidth: 5px) {
|
||||||
|
bottom: 0;
|
||||||
|
left: 50%;
|
||||||
|
margin-left: -@arrowWidth;
|
||||||
|
border-left: @arrowWidth solid transparent;
|
||||||
|
border-right: @arrowWidth solid transparent;
|
||||||
|
border-top: @arrowWidth solid @black;
|
||||||
|
}
|
||||||
|
.left(@arrowWidth: 5px) {
|
||||||
|
top: 50%;
|
||||||
|
right: 0;
|
||||||
|
margin-top: -@arrowWidth;
|
||||||
|
border-top: @arrowWidth solid transparent;
|
||||||
|
border-bottom: @arrowWidth solid transparent;
|
||||||
|
border-left: @arrowWidth solid @black;
|
||||||
|
}
|
||||||
|
.below(@arrowWidth: 5px) {
|
||||||
|
top: 0;
|
||||||
|
left: 50%;
|
||||||
|
margin-left: -@arrowWidth;
|
||||||
|
border-left: @arrowWidth solid transparent;
|
||||||
|
border-right: @arrowWidth solid transparent;
|
||||||
|
border-bottom: @arrowWidth solid @black;
|
||||||
|
}
|
||||||
|
.right(@arrowWidth: 5px) {
|
||||||
|
top: 50%;
|
||||||
|
left: 0;
|
||||||
|
margin-top: -@arrowWidth;
|
||||||
|
border-top: @arrowWidth solid transparent;
|
||||||
|
border-bottom: @arrowWidth solid transparent;
|
||||||
|
border-right: @arrowWidth solid @black;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,60 @@
|
||||||
|
// MODALS
|
||||||
|
// ------
|
||||||
|
|
||||||
|
.modal-backdrop {
|
||||||
|
background-color: @black;
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
z-index: 10000;
|
||||||
|
// Fade for backdrop
|
||||||
|
&.fade { opacity: 0; }
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-backdrop, .modal-backdrop.fade.in {
|
||||||
|
.opacity(80);
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal {
|
||||||
|
position: fixed;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
z-index: 11000;
|
||||||
|
width: 560px;
|
||||||
|
margin: -250px 0 0 -250px;
|
||||||
|
background-color: @white;
|
||||||
|
border: 1px solid #999;
|
||||||
|
border: 1px solid rgba(0,0,0,.3);
|
||||||
|
*border: 1px solid #999; /* IE6-7 */
|
||||||
|
.border-radius(6px);
|
||||||
|
.box-shadow(0 3px 7px rgba(0,0,0,0.3));
|
||||||
|
.background-clip(padding-box);
|
||||||
|
.close { margin-top: 7px; }
|
||||||
|
&.fade {
|
||||||
|
.transition(e('opacity .3s linear, top .3s ease-out'));
|
||||||
|
top: -25%;
|
||||||
|
}
|
||||||
|
&.fade.in { top: 50%; }
|
||||||
|
}
|
||||||
|
.modal-header {
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
padding: 5px 15px;
|
||||||
|
}
|
||||||
|
.modal-body {
|
||||||
|
padding: 15px;
|
||||||
|
}
|
||||||
|
.modal-footer {
|
||||||
|
background-color: #f5f5f5;
|
||||||
|
padding: 14px 15px 15px;
|
||||||
|
border-top: 1px solid #ddd;
|
||||||
|
.border-radius(0 0 6px 6px);
|
||||||
|
.box-shadow(inset 0 1px 0 @white);
|
||||||
|
.clearfix();
|
||||||
|
margin-bottom: 0;
|
||||||
|
.btn {
|
||||||
|
float: right;
|
||||||
|
margin-left: 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,40 @@
|
||||||
|
// PAGINATION
|
||||||
|
// ----------
|
||||||
|
|
||||||
|
.pagination {
|
||||||
|
height: @baseLineHeight * 2;
|
||||||
|
margin: @baseLineHeight 0;
|
||||||
|
ul {
|
||||||
|
float: left;
|
||||||
|
margin: 0;
|
||||||
|
border: 1px solid #ddd;
|
||||||
|
border: 1px solid rgba(0,0,0,.15);
|
||||||
|
.border-radius(3px);
|
||||||
|
.box-shadow(0 1px 2px rgba(0,0,0,.05));
|
||||||
|
}
|
||||||
|
li {
|
||||||
|
display: inline;
|
||||||
|
}
|
||||||
|
a {
|
||||||
|
float: left;
|
||||||
|
padding: 0 14px;
|
||||||
|
line-height: (@baseLineHeight * 2) - 2;
|
||||||
|
border-right: 1px solid;
|
||||||
|
border-right-color: #ddd;
|
||||||
|
border-right-color: rgba(0,0,0,.15);
|
||||||
|
*border-right-color: #ddd; /* IE6-7 */
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
a:hover,
|
||||||
|
.active a {
|
||||||
|
background-color: lighten(@blue, 45%);
|
||||||
|
}
|
||||||
|
.disabled a,
|
||||||
|
.disabled a:hover {
|
||||||
|
background-color: transparent;
|
||||||
|
color: @grayLight;
|
||||||
|
}
|
||||||
|
.next a {
|
||||||
|
border: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -301,251 +301,8 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// Tabs and Pills
|
|
||||||
.tabs,
|
|
||||||
.pills {
|
|
||||||
margin: 0 0 20px;
|
|
||||||
padding: 0;
|
|
||||||
list-style: none;
|
|
||||||
.clearfix();
|
|
||||||
> li {
|
|
||||||
float: left;
|
|
||||||
> a {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Tabs
|
|
||||||
.tabs {
|
|
||||||
border-color: #ddd;
|
|
||||||
border-style: solid;
|
|
||||||
border-width: 0 0 1px;
|
|
||||||
> li {
|
|
||||||
position: relative; // For the dropdowns mostly
|
|
||||||
margin-bottom: -1px;
|
|
||||||
> a {
|
|
||||||
padding: 0 15px;
|
|
||||||
margin-right: 2px;
|
|
||||||
line-height: @baseLineHeight * 2;
|
|
||||||
border: 1px solid transparent;
|
|
||||||
.border-radius(4px 4px 0 0);
|
|
||||||
&:hover {
|
|
||||||
text-decoration: none;
|
|
||||||
background-color: #eee;
|
|
||||||
border-color: #eee #eee #ddd;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
// Active state, and it's :hover to override normal :hover
|
|
||||||
.active > a,
|
|
||||||
.active > a:hover {
|
|
||||||
color: @gray;
|
|
||||||
background-color: @white;
|
|
||||||
border: 1px solid #ddd;
|
|
||||||
border-bottom-color: transparent;
|
|
||||||
cursor: default;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.tabbable {
|
|
||||||
margin-bottom: @baseLineHeight;
|
|
||||||
|
|
||||||
// Tabs on top
|
|
||||||
.tabs {
|
|
||||||
margin-bottom: 0;
|
|
||||||
border-bottom: 0;
|
|
||||||
}
|
|
||||||
.tab-content {
|
|
||||||
padding: 19px;
|
|
||||||
border: 1px solid #ddd;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Tabs on bottom
|
|
||||||
&.tabs-bottom .tabs > li {
|
|
||||||
margin-top: -1px;
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
&.tabs-bottom .tabs > li > a {
|
|
||||||
.border-radius(0 0 4px 4px);
|
|
||||||
&:hover {
|
|
||||||
border-bottom-color: transparent;
|
|
||||||
border-top-color: #ddd;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&.tabs-bottom .tabs > .active > a,
|
|
||||||
&.tabs-bottom .tabs > .active > a:hover {
|
|
||||||
border-color: transparent #ddd #ddd #ddd;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Tabs on left and right
|
|
||||||
&.tabs-left,
|
|
||||||
&.tabs-right {
|
|
||||||
.clearfix();
|
|
||||||
.tabs {
|
|
||||||
// Give a fixed width to avoid floating .tab-con
|
|
||||||
width: 100px;
|
|
||||||
// Unfloat them so they stack
|
|
||||||
> li {
|
|
||||||
float: none;
|
|
||||||
margin-bottom: -1px;
|
|
||||||
> a {
|
|
||||||
margin-bottom: 2px;
|
|
||||||
&:hover {
|
|
||||||
border-color: transparent;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Tabs on left
|
|
||||||
&.tabs-left {
|
|
||||||
.tab-content {
|
|
||||||
margin-left: 100px;
|
|
||||||
}
|
|
||||||
.tabs {
|
|
||||||
float: left;
|
|
||||||
> li {
|
|
||||||
margin-right: -1px;
|
|
||||||
> a {
|
|
||||||
margin-right: 0;
|
|
||||||
.border-radius(4px 0 0 4px);
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
border-right-color: #ddd;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
// Active state
|
|
||||||
.active > a,
|
|
||||||
.active > a:hover {
|
|
||||||
border-color: #ddd;
|
|
||||||
border-right-color: transparent;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Tabs on right
|
|
||||||
&.tabs-right {
|
|
||||||
.tab-content {
|
|
||||||
margin-right: 100px;
|
|
||||||
}
|
|
||||||
.tabs {
|
|
||||||
float: right;
|
|
||||||
> li {
|
|
||||||
margin-left: -1px;
|
|
||||||
> a {
|
|
||||||
margin-left: 0;
|
|
||||||
.border-radius(0 4px 4px 0);
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
border-left-color: #ddd;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
// Active state
|
|
||||||
.active > a,
|
|
||||||
.active > a:hover {
|
|
||||||
border-color: #ddd;
|
|
||||||
border-left-color: transparent;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
// Dropdowns in tabs
|
|
||||||
.tabs {
|
|
||||||
// first one for backwards compatibility
|
|
||||||
.menu-dropdown,
|
|
||||||
.dropdown-menu {
|
|
||||||
top: 35px;
|
|
||||||
border-width: 1px;
|
|
||||||
.border-radius(0 6px 6px 6px);
|
|
||||||
}
|
|
||||||
// first one for backwards compatibility
|
|
||||||
a.menu:after,
|
|
||||||
.dropdown-toggle:after {
|
|
||||||
border-top-color: #999;
|
|
||||||
margin-top: 15px;
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
// first one for backwards compatibility
|
|
||||||
li.open.menu .menu,
|
|
||||||
.open.dropdown .dropdown-toggle {
|
|
||||||
border-color: #999;
|
|
||||||
}
|
|
||||||
// first one for backwards compatibility
|
|
||||||
li.open a.menu:after,
|
|
||||||
.dropdown.open .dropdown-toggle:after {
|
|
||||||
border-top-color: #555;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Pills
|
|
||||||
.pills {
|
|
||||||
a {
|
|
||||||
margin: 5px 3px 5px 0;
|
|
||||||
padding: 0 15px;
|
|
||||||
line-height: 30px;
|
|
||||||
text-shadow: 0 1px 1px @white;
|
|
||||||
.border-radius(15px);
|
|
||||||
&:hover {
|
|
||||||
color: @white;
|
|
||||||
text-decoration: none;
|
|
||||||
text-shadow: 0 1px 1px rgba(0,0,0,.25);
|
|
||||||
background-color: @linkColorHover;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.active a {
|
|
||||||
color: @white;
|
|
||||||
text-shadow: 0 1px 1px rgba(0,0,0,.25);
|
|
||||||
background-color: @linkColor;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Stacked pills
|
|
||||||
.pills-vertical > li {
|
|
||||||
float: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Tabbable areas
|
|
||||||
.tab-content,
|
|
||||||
.pill-content {
|
|
||||||
}
|
|
||||||
.tab-content > .tab-pane,
|
|
||||||
.pill-content > .pill-pane {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
.tab-content > .active,
|
|
||||||
.pill-content > .active {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
// BREADCRUMBS
|
|
||||||
// -----------
|
|
||||||
|
|
||||||
.breadcrumb {
|
|
||||||
margin: 0 0 @baseLineHeight;
|
|
||||||
padding: 7px 14px;
|
|
||||||
#gradient > .vertical(#ffffff, #f5f5f5);
|
|
||||||
border: 1px solid #ddd;
|
|
||||||
.border-radius(3px);
|
|
||||||
.box-shadow(inset 0 1px 0 @white);
|
|
||||||
li {
|
|
||||||
display: inline;
|
|
||||||
text-shadow: 0 1px 0 @white;
|
|
||||||
}
|
|
||||||
.divider {
|
|
||||||
padding: 0 5px;
|
|
||||||
color: @grayLight;
|
|
||||||
}
|
|
||||||
.active a {
|
|
||||||
color: @grayDark;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
// PAGE HEADERS
|
// PAGE HEADERS
|
||||||
|
|
@ -852,46 +609,6 @@ input[type=submit].btn {
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// PAGINATION
|
|
||||||
// ----------
|
|
||||||
|
|
||||||
.pagination {
|
|
||||||
height: @baseLineHeight * 2;
|
|
||||||
margin: @baseLineHeight 0;
|
|
||||||
ul {
|
|
||||||
float: left;
|
|
||||||
margin: 0;
|
|
||||||
border: 1px solid #ddd;
|
|
||||||
border: 1px solid rgba(0,0,0,.15);
|
|
||||||
.border-radius(3px);
|
|
||||||
.box-shadow(0 1px 2px rgba(0,0,0,.05));
|
|
||||||
}
|
|
||||||
li {
|
|
||||||
display: inline;
|
|
||||||
}
|
|
||||||
a {
|
|
||||||
float: left;
|
|
||||||
padding: 0 14px;
|
|
||||||
line-height: (@baseLineHeight * 2) - 2;
|
|
||||||
border-right: 1px solid;
|
|
||||||
border-right-color: #ddd;
|
|
||||||
border-right-color: rgba(0,0,0,.15);
|
|
||||||
*border-right-color: #ddd; /* IE6-7 */
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
a:hover,
|
|
||||||
.active a {
|
|
||||||
background-color: lighten(@blue, 45%);
|
|
||||||
}
|
|
||||||
.disabled a,
|
|
||||||
.disabled a:hover {
|
|
||||||
background-color: transparent;
|
|
||||||
color: @grayLight;
|
|
||||||
}
|
|
||||||
.next a {
|
|
||||||
border: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
// WELLS
|
// WELLS
|
||||||
|
|
@ -913,186 +630,12 @@ input[type=submit].btn {
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// MODALS
|
|
||||||
// ------
|
|
||||||
|
|
||||||
.modal-backdrop {
|
|
||||||
background-color: @black;
|
|
||||||
position: fixed;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
bottom: 0;
|
|
||||||
z-index: 10000;
|
|
||||||
// Fade for backdrop
|
|
||||||
&.fade { opacity: 0; }
|
|
||||||
}
|
|
||||||
|
|
||||||
.modal-backdrop, .modal-backdrop.fade.in {
|
|
||||||
.opacity(80);
|
|
||||||
}
|
|
||||||
|
|
||||||
.modal {
|
|
||||||
position: fixed;
|
|
||||||
top: 50%;
|
|
||||||
left: 50%;
|
|
||||||
z-index: 11000;
|
|
||||||
width: 560px;
|
|
||||||
margin: -250px 0 0 -250px;
|
|
||||||
background-color: @white;
|
|
||||||
border: 1px solid #999;
|
|
||||||
border: 1px solid rgba(0,0,0,.3);
|
|
||||||
*border: 1px solid #999; /* IE6-7 */
|
|
||||||
.border-radius(6px);
|
|
||||||
.box-shadow(0 3px 7px rgba(0,0,0,0.3));
|
|
||||||
.background-clip(padding-box);
|
|
||||||
.close { margin-top: 7px; }
|
|
||||||
&.fade {
|
|
||||||
.transition(e('opacity .3s linear, top .3s ease-out'));
|
|
||||||
top: -25%;
|
|
||||||
}
|
|
||||||
&.fade.in { top: 50%; }
|
|
||||||
}
|
|
||||||
.modal-header {
|
|
||||||
border-bottom: 1px solid #eee;
|
|
||||||
padding: 5px 15px;
|
|
||||||
}
|
|
||||||
.modal-body {
|
|
||||||
padding: 15px;
|
|
||||||
}
|
|
||||||
.modal-footer {
|
|
||||||
background-color: #f5f5f5;
|
|
||||||
padding: 14px 15px 15px;
|
|
||||||
border-top: 1px solid #ddd;
|
|
||||||
.border-radius(0 0 6px 6px);
|
|
||||||
.box-shadow(inset 0 1px 0 @white);
|
|
||||||
.clearfix();
|
|
||||||
margin-bottom: 0;
|
|
||||||
.btn {
|
|
||||||
float: right;
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
// POPOVER ARROWS
|
|
||||||
// --------------
|
|
||||||
|
|
||||||
#popoverArrow {
|
|
||||||
.above(@arrowWidth: 5px) {
|
|
||||||
bottom: 0;
|
|
||||||
left: 50%;
|
|
||||||
margin-left: -@arrowWidth;
|
|
||||||
border-left: @arrowWidth solid transparent;
|
|
||||||
border-right: @arrowWidth solid transparent;
|
|
||||||
border-top: @arrowWidth solid @black;
|
|
||||||
}
|
|
||||||
.left(@arrowWidth: 5px) {
|
|
||||||
top: 50%;
|
|
||||||
right: 0;
|
|
||||||
margin-top: -@arrowWidth;
|
|
||||||
border-top: @arrowWidth solid transparent;
|
|
||||||
border-bottom: @arrowWidth solid transparent;
|
|
||||||
border-left: @arrowWidth solid @black;
|
|
||||||
}
|
|
||||||
.below(@arrowWidth: 5px) {
|
|
||||||
top: 0;
|
|
||||||
left: 50%;
|
|
||||||
margin-left: -@arrowWidth;
|
|
||||||
border-left: @arrowWidth solid transparent;
|
|
||||||
border-right: @arrowWidth solid transparent;
|
|
||||||
border-bottom: @arrowWidth solid @black;
|
|
||||||
}
|
|
||||||
.right(@arrowWidth: 5px) {
|
|
||||||
top: 50%;
|
|
||||||
left: 0;
|
|
||||||
margin-top: -@arrowWidth;
|
|
||||||
border-top: @arrowWidth solid transparent;
|
|
||||||
border-bottom: @arrowWidth solid transparent;
|
|
||||||
border-right: @arrowWidth solid @black;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// TWIPSY
|
|
||||||
// ------
|
|
||||||
|
|
||||||
.twipsy {
|
|
||||||
display: block;
|
|
||||||
position: absolute;
|
|
||||||
visibility: visible;
|
|
||||||
padding: 5px;
|
|
||||||
font-size: 11px;
|
|
||||||
z-index: 1000;
|
|
||||||
.opacity(80);
|
|
||||||
&.fade.in {
|
|
||||||
.opacity(80);
|
|
||||||
}
|
|
||||||
&.above .twipsy-arrow { #popoverArrow > .above(); }
|
|
||||||
&.left .twipsy-arrow { #popoverArrow > .left(); }
|
|
||||||
&.below .twipsy-arrow { #popoverArrow > .below(); }
|
|
||||||
&.right .twipsy-arrow { #popoverArrow > .right(); }
|
|
||||||
}
|
|
||||||
.twipsy-inner {
|
|
||||||
padding: 3px 8px;
|
|
||||||
background-color: @black;
|
|
||||||
color: white;
|
|
||||||
text-align: center;
|
|
||||||
max-width: 200px;
|
|
||||||
text-decoration: none;
|
|
||||||
.border-radius(4px);
|
|
||||||
}
|
|
||||||
.twipsy-arrow {
|
|
||||||
position: absolute;
|
|
||||||
width: 0;
|
|
||||||
height: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
// POPOVERS
|
|
||||||
// --------
|
|
||||||
|
|
||||||
.popover {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
z-index: 1000;
|
|
||||||
padding: 5px;
|
|
||||||
display: none;
|
|
||||||
&.above .arrow { #popoverArrow > .above(); }
|
|
||||||
&.right .arrow { #popoverArrow > .right(); }
|
|
||||||
&.below .arrow { #popoverArrow > .below(); }
|
|
||||||
&.left .arrow { #popoverArrow > .left(); }
|
|
||||||
.arrow {
|
|
||||||
position: absolute;
|
|
||||||
width: 0;
|
|
||||||
height: 0;
|
|
||||||
}
|
|
||||||
.inner {
|
|
||||||
background-color: @black;
|
|
||||||
background-color: rgba(0,0,0,.8);
|
|
||||||
padding: 3px;
|
|
||||||
overflow: hidden;
|
|
||||||
width: 280px;
|
|
||||||
.border-radius(6px);
|
|
||||||
.box-shadow(0 3px 7px rgba(0,0,0,0.3));
|
|
||||||
}
|
|
||||||
.title {
|
|
||||||
background-color: #f5f5f5;
|
|
||||||
padding: 9px 15px;
|
|
||||||
line-height: 1;
|
|
||||||
.border-radius(3px 3px 0 0);
|
|
||||||
border-bottom:1px solid #eee;
|
|
||||||
}
|
|
||||||
.content {
|
|
||||||
background-color: @white;
|
|
||||||
padding: 14px;
|
|
||||||
.border-radius(0 0 3px 3px);
|
|
||||||
.background-clip(padding-box);
|
|
||||||
p, ul, ol {
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
// PATTERN ANIMATIONS
|
// PATTERN ANIMATIONS
|
||||||
|
|
@ -1125,32 +668,6 @@ input[type=submit].btn {
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// MEDIA GRIDS
|
|
||||||
// -----------
|
|
||||||
|
|
||||||
.media-grid {
|
|
||||||
margin-left: -20px;
|
|
||||||
margin-bottom: 0;
|
|
||||||
.clearfix();
|
|
||||||
li {
|
|
||||||
display: inline;
|
|
||||||
}
|
|
||||||
a {
|
|
||||||
float: left;
|
|
||||||
padding: 4px;
|
|
||||||
margin: 0 0 20px 20px;
|
|
||||||
border: 1px solid #ddd;
|
|
||||||
.border-radius(4px);
|
|
||||||
.box-shadow(0 1px 1px rgba(0,0,0,.075));
|
|
||||||
img {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
&:hover {
|
|
||||||
border-color: @linkColor;
|
|
||||||
.box-shadow(0 1px 4px rgba(0,105,214,.25));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
// MISC
|
// MISC
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,45 @@
|
||||||
|
// POPOVERS
|
||||||
|
// --------
|
||||||
|
|
||||||
|
.popover {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
z-index: 1000;
|
||||||
|
padding: 5px;
|
||||||
|
display: none;
|
||||||
|
&.above .arrow { #popoverArrow > .above(); }
|
||||||
|
&.right .arrow { #popoverArrow > .right(); }
|
||||||
|
&.below .arrow { #popoverArrow > .below(); }
|
||||||
|
&.left .arrow { #popoverArrow > .left(); }
|
||||||
|
.arrow {
|
||||||
|
position: absolute;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
}
|
||||||
|
.inner {
|
||||||
|
background-color: @black;
|
||||||
|
background-color: rgba(0,0,0,.8);
|
||||||
|
padding: 3px;
|
||||||
|
overflow: hidden;
|
||||||
|
width: 280px;
|
||||||
|
.border-radius(6px);
|
||||||
|
.box-shadow(0 3px 7px rgba(0,0,0,0.3));
|
||||||
|
}
|
||||||
|
.title {
|
||||||
|
background-color: #f5f5f5;
|
||||||
|
padding: 9px 15px;
|
||||||
|
line-height: 1;
|
||||||
|
.border-radius(3px 3px 0 0);
|
||||||
|
border-bottom:1px solid #eee;
|
||||||
|
}
|
||||||
|
.content {
|
||||||
|
background-color: @white;
|
||||||
|
padding: 14px;
|
||||||
|
.border-radius(0 0 3px 3px);
|
||||||
|
.background-clip(padding-box);
|
||||||
|
p, ul, ol {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,221 @@
|
||||||
|
// Tabs and Pills
|
||||||
|
.tabs,
|
||||||
|
.pills {
|
||||||
|
margin: 0 0 20px;
|
||||||
|
padding: 0;
|
||||||
|
list-style: none;
|
||||||
|
.clearfix();
|
||||||
|
> li {
|
||||||
|
float: left;
|
||||||
|
> a {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Tabs
|
||||||
|
.tabs {
|
||||||
|
border-color: #ddd;
|
||||||
|
border-style: solid;
|
||||||
|
border-width: 0 0 1px;
|
||||||
|
> li {
|
||||||
|
position: relative; // For the dropdowns mostly
|
||||||
|
margin-bottom: -1px;
|
||||||
|
> a {
|
||||||
|
padding: 0 15px;
|
||||||
|
margin-right: 2px;
|
||||||
|
line-height: @baseLineHeight * 2;
|
||||||
|
border: 1px solid transparent;
|
||||||
|
.border-radius(4px 4px 0 0);
|
||||||
|
&:hover {
|
||||||
|
text-decoration: none;
|
||||||
|
background-color: #eee;
|
||||||
|
border-color: #eee #eee #ddd;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// Active state, and it's :hover to override normal :hover
|
||||||
|
.active > a,
|
||||||
|
.active > a:hover {
|
||||||
|
color: @gray;
|
||||||
|
background-color: @white;
|
||||||
|
border: 1px solid #ddd;
|
||||||
|
border-bottom-color: transparent;
|
||||||
|
cursor: default;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabbable {
|
||||||
|
margin-bottom: @baseLineHeight;
|
||||||
|
|
||||||
|
// Tabs on top
|
||||||
|
.tabs {
|
||||||
|
margin-bottom: 0;
|
||||||
|
border-bottom: 0;
|
||||||
|
}
|
||||||
|
.tab-content {
|
||||||
|
padding: 19px;
|
||||||
|
border: 1px solid #ddd;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Tabs on bottom
|
||||||
|
&.tabs-bottom .tabs > li {
|
||||||
|
margin-top: -1px;
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
&.tabs-bottom .tabs > li > a {
|
||||||
|
.border-radius(0 0 4px 4px);
|
||||||
|
&:hover {
|
||||||
|
border-bottom-color: transparent;
|
||||||
|
border-top-color: #ddd;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.tabs-bottom .tabs > .active > a,
|
||||||
|
&.tabs-bottom .tabs > .active > a:hover {
|
||||||
|
border-color: transparent #ddd #ddd #ddd;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Tabs on left and right
|
||||||
|
&.tabs-left,
|
||||||
|
&.tabs-right {
|
||||||
|
.clearfix();
|
||||||
|
.tabs {
|
||||||
|
// Give a fixed width to avoid floating .tab-con
|
||||||
|
width: 100px;
|
||||||
|
// Unfloat them so they stack
|
||||||
|
> li {
|
||||||
|
float: none;
|
||||||
|
margin-bottom: -1px;
|
||||||
|
> a {
|
||||||
|
margin-bottom: 2px;
|
||||||
|
&:hover {
|
||||||
|
border-color: transparent;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Tabs on left
|
||||||
|
&.tabs-left {
|
||||||
|
.tab-content {
|
||||||
|
margin-left: 100px;
|
||||||
|
}
|
||||||
|
.tabs {
|
||||||
|
float: left;
|
||||||
|
> li {
|
||||||
|
margin-right: -1px;
|
||||||
|
> a {
|
||||||
|
margin-right: 0;
|
||||||
|
.border-radius(4px 0 0 4px);
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
border-right-color: #ddd;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// Active state
|
||||||
|
.active > a,
|
||||||
|
.active > a:hover {
|
||||||
|
border-color: #ddd;
|
||||||
|
border-right-color: transparent;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Tabs on right
|
||||||
|
&.tabs-right {
|
||||||
|
.tab-content {
|
||||||
|
margin-right: 100px;
|
||||||
|
}
|
||||||
|
.tabs {
|
||||||
|
float: right;
|
||||||
|
> li {
|
||||||
|
margin-left: -1px;
|
||||||
|
> a {
|
||||||
|
margin-left: 0;
|
||||||
|
.border-radius(0 4px 4px 0);
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
border-left-color: #ddd;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// Active state
|
||||||
|
.active > a,
|
||||||
|
.active > a:hover {
|
||||||
|
border-color: #ddd;
|
||||||
|
border-left-color: transparent;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Dropdowns in tabs
|
||||||
|
.tabs {
|
||||||
|
// first one for backwards compatibility
|
||||||
|
.menu-dropdown,
|
||||||
|
.dropdown-menu {
|
||||||
|
top: 35px;
|
||||||
|
border-width: 1px;
|
||||||
|
.border-radius(0 6px 6px 6px);
|
||||||
|
}
|
||||||
|
// first one for backwards compatibility
|
||||||
|
a.menu:after,
|
||||||
|
.dropdown-toggle:after {
|
||||||
|
border-top-color: #999;
|
||||||
|
margin-top: 15px;
|
||||||
|
margin-left: 5px;
|
||||||
|
}
|
||||||
|
// first one for backwards compatibility
|
||||||
|
li.open.menu .menu,
|
||||||
|
.open.dropdown .dropdown-toggle {
|
||||||
|
border-color: #999;
|
||||||
|
}
|
||||||
|
// first one for backwards compatibility
|
||||||
|
li.open a.menu:after,
|
||||||
|
.dropdown.open .dropdown-toggle:after {
|
||||||
|
border-top-color: #555;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Pills
|
||||||
|
.pills {
|
||||||
|
a {
|
||||||
|
margin: 5px 3px 5px 0;
|
||||||
|
padding: 0 15px;
|
||||||
|
line-height: 30px;
|
||||||
|
text-shadow: 0 1px 1px @white;
|
||||||
|
.border-radius(15px);
|
||||||
|
&:hover {
|
||||||
|
color: @white;
|
||||||
|
text-decoration: none;
|
||||||
|
text-shadow: 0 1px 1px rgba(0,0,0,.25);
|
||||||
|
background-color: @linkColorHover;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.active a {
|
||||||
|
color: @white;
|
||||||
|
text-shadow: 0 1px 1px rgba(0,0,0,.25);
|
||||||
|
background-color: @linkColor;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Stacked pills
|
||||||
|
.pills-vertical > li {
|
||||||
|
float: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Tabbable areas
|
||||||
|
.tab-content,
|
||||||
|
.pill-content {
|
||||||
|
}
|
||||||
|
.tab-content > .tab-pane,
|
||||||
|
.pill-content > .pill-pane {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.tab-content > .active,
|
||||||
|
.pill-content > .active {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,33 @@
|
||||||
|
// TWIPSY
|
||||||
|
// ------
|
||||||
|
|
||||||
|
.twipsy {
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
visibility: visible;
|
||||||
|
padding: 5px;
|
||||||
|
font-size: 11px;
|
||||||
|
z-index: 1000;
|
||||||
|
.opacity(80);
|
||||||
|
&.fade.in {
|
||||||
|
.opacity(80);
|
||||||
|
}
|
||||||
|
&.above .twipsy-arrow { #popoverArrow > .above(); }
|
||||||
|
&.left .twipsy-arrow { #popoverArrow > .left(); }
|
||||||
|
&.below .twipsy-arrow { #popoverArrow > .below(); }
|
||||||
|
&.right .twipsy-arrow { #popoverArrow > .right(); }
|
||||||
|
}
|
||||||
|
.twipsy-inner {
|
||||||
|
padding: 3px 8px;
|
||||||
|
background-color: @black;
|
||||||
|
color: white;
|
||||||
|
text-align: center;
|
||||||
|
max-width: 200px;
|
||||||
|
text-decoration: none;
|
||||||
|
.border-radius(4px);
|
||||||
|
}
|
||||||
|
.twipsy-arrow {
|
||||||
|
position: absolute;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue