kotovalexarian-likes-github
/
twbs--bootstrap
mirror of https://github.com/twbs/bootstrap.git
1
0
Fork 0
Code Releases Activity

Unitless line-height 

* Instead of 20px as @line-height-base, use 1.5
* Update typographic scale for headings to use unitless as well--required some twerking of decimals a bit and some rounding
* Introduce new @line-height-computed value, which takes base font-size and multiplies it by 1.5, for use in padding and margin on components
This commit is contained in:
Mark Otto 2013-05-09 17:20:46 -07:00
parent 7b6352d2cf
commit 6fba68eb8b
8 changed files with 124 additions and 128 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

157
docs/assets/css/bootstrap.css vendored
View File

@ -290,7 +290,7 @@ html {
body { body {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 14px; font-size: 14px;
line-height: 20px; line-height: 1.5;
color: #333333; color: #333333;
background-color: #ffffff; background-color: #ffffff;
} }
@ -336,11 +336,11 @@ img {
} }
p { p {
margin: 0 0 10px; margin: 0 0 10.5px;
} }
.lead { .lead {
margin-bottom: 20px; margin-bottom: 21px;
font-size: 21px; font-size: 21px;
font-weight: 200; font-weight: 200;
line-height: 1.4; line-height: 1.4;
@ -424,7 +424,7 @@ h6,
.h6 { .h6 {
font-family: inherit; font-family: inherit;
font-weight: 500; font-weight: 500;
line-height: 20px; line-height: 1.1;
} }
h1 small, h1 small,
@ -447,40 +447,35 @@ h6 small,
h1, h1,
h2, h2,
h3 { h3 {
margin-top: 20px; margin-top: 21px;
margin-bottom: 10px; margin-bottom: 10.5px;
line-height: 40px;
}
h3 {
line-height: 30px;
} }
h4, h4,
h5, h5,
h6 { h6 {
margin-top: 10px; margin-top: 10.5px;
margin-bottom: 10px; margin-bottom: 10.5px;
} }
h1, h1,
.h1 { .h1 {
font-size: 38.5px; font-size: 38px;
} }
h2, h2,
.h2 { .h2 {
font-size: 31.5px; font-size: 32px;
} }
h3, h3,
.h3 { .h3 {
font-size: 24.5px; font-size: 24px;
} }
h4, h4,
.h4 { .h4 {
font-size: 17.5px; font-size: 18px;
} }
h5, h5,
@ -490,39 +485,36 @@ h5,
h6, h6,
.h6 { .h6 {
font-size: 11.9px; font-size: 12px;
} }
h1 small, h1 small,
.h1 small { .h1 small {
font-size: 24.5px; font-size: 24px;
} }
h2 small, h2 small,
.h2 small { .h2 small {
font-size: 17.5px; font-size: 18px;
} }
h3 small, h3 small,
.h3 small { .h3 small,
font-size: 14px;
}
h4 small, h4 small,
.h4 small { .h4 small {
font-size: 14px; font-size: 14px;
} }
.page-header { .page-header {
padding-bottom: 9px; padding-bottom: 9.5px;
margin: 40px 0 20px; margin: 42px 0 21px;
border-bottom: 1px solid #eeeeee; border-bottom: 1px solid #eeeeee;
} }
ul, ul,
ol { ol {
padding: 0; padding: 0;
margin: 0 0 10px 25px; margin: 0 0 10.5px 25px;
} }
ul ul, ul ul,
@ -533,7 +525,7 @@ ol ul {
} }
li { li {
line-height: 20px; line-height: 1.5;
} }
.list-unstyled { .list-unstyled {
@ -553,12 +545,12 @@ li {
} }
dl { dl {
margin-bottom: 20px; margin-bottom: 21px;
} }
dt, dt,
dd { dd {
line-height: 20px; line-height: 1.5;
} }
dt { dt {
@ -566,7 +558,7 @@ dt {
} }
dd { dd {
margin-left: 10px; margin-left: 10.5px;
} }
.dl-horizontal:before, .dl-horizontal:before,
@ -604,7 +596,7 @@ dd {
} }
hr { hr {
margin: 20px 0; margin: 21px 0;
border: 0; border: 0;
border-top: 1px solid #eeeeee; border-top: 1px solid #eeeeee;
border-bottom: 1px solid #fff; border-bottom: 1px solid #fff;
@ -623,8 +615,8 @@ abbr.initialism {
} }
blockquote { blockquote {
padding: 10px 20px; padding: 10.5px 21px;
margin: 0 0 20px; margin: 0 0 21px;
border-left: 5px solid #eeeeee; border-left: 5px solid #eeeeee;
} }
@ -640,7 +632,7 @@ blockquote p:last-child {
blockquote small { blockquote small {
display: block; display: block;
line-height: 20px; line-height: 1.5;
color: #999999; color: #999999;
} }
@ -678,9 +670,9 @@ blockquote:after {
address { address {
display: block; display: block;
margin-bottom: 20px; margin-bottom: 21px;
font-style: normal; font-style: normal;
line-height: 20px; line-height: 1.5;
} }
code, code,
@ -702,10 +694,10 @@ code {
pre { pre {
display: block; display: block;
padding: 9.5px; padding: 0.25;
margin: 0 0 10px; margin: 0 0 0.75;
font-size: 13px; font-size: 13px;
line-height: 20px; line-height: 1.5;
word-break: break-all; word-break: break-all;
word-wrap: break-word; word-wrap: break-word;
white-space: pre; white-space: pre;
@ -717,7 +709,7 @@ pre {
} }
pre.prettyprint { pre.prettyprint {
margin-bottom: 20px; margin-bottom: 1.5;
} }
pre code { pre code {
@ -1025,7 +1017,7 @@ th {
.table { .table {
width: 100%; width: 100%;
margin-bottom: 20px; margin-bottom: 1.5;
} }
.table thead > tr > th, .table thead > tr > th,
@ -1033,7 +1025,7 @@ th {
.table thead > tr > td, .table thead > tr > td,
.table tbody > tr > td { .table tbody > tr > td {
padding: 8px; padding: 8px;
line-height: 20px; line-height: 1.5;
vertical-align: top; vertical-align: top;
border-top: 1px solid #dddddd; border-top: 1px solid #dddddd;
} }
@ -1219,9 +1211,9 @@ legend {
display: block; display: block;
width: 100%; width: 100%;
padding: 0; padding: 0;
margin-bottom: 20px; margin-bottom: 21px;
font-size: 21px; font-size: 21px;
line-height: 40px; line-height: 1.1;
color: #333333; color: #333333;
border: 0; border: 0;
border-bottom: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5;
@ -1250,10 +1242,10 @@ input[type="search"],
input[type="tel"], input[type="tel"],
input[type="color"] { input[type="color"] {
display: block; display: block;
min-height: 34px; min-height: 35px;
padding: 6px 9px; padding: 6px 9px;
font-size: 14px; font-size: 14px;
line-height: 20px; line-height: 1.5;
color: #555555; color: #555555;
vertical-align: middle; vertical-align: middle;
background-color: #ffffff; background-color: #ffffff;
@ -1328,10 +1320,10 @@ input[type="checkbox"] {
select, select,
input[type="file"] { input[type="file"] {
height: 34px; height: 35px;
/* In IE7, the height of the select element cannot be changed by height, only font-size. TODO: Check if this is still needed when dropping IE7 support */ /* In IE7, the height of the select element cannot be changed by height, only font-size. TODO: Check if this is still needed when dropping IE7 support */
line-height: 34px; line-height: 35px;
} }
select[multiple], select[multiple],
@ -1371,7 +1363,7 @@ textarea::-webkit-input-placeholder {
.radio, .radio,
.checkbox { .checkbox {
display: block; display: block;
min-height: 20px; min-height: 21px;
padding-left: 20px; padding-left: 20px;
margin-top: 10px; margin-top: 10px;
margin-bottom: 10px; margin-bottom: 10px;
@ -1460,7 +1452,7 @@ input[type="url"].input-small,
input[type="search"].input-small, input[type="search"].input-small,
input[type="tel"].input-small, input[type="tel"].input-small,
input[type="color"].input-small { input[type="color"].input-small {
min-height: 26px; min-height: 27px;
padding: 2px 10px; padding: 2px 10px;
font-size: 11.9px; font-size: 11.9px;
border-radius: 3px; border-radius: 3px;
@ -1555,9 +1547,9 @@ select:focus:invalid:focus {
} }
.form-actions { .form-actions {
padding: 19px 20px 20px; padding: 21px 20px;
margin-top: 20px; margin-top: 21px;
margin-bottom: 20px; margin-bottom: 21px;
background-color: #f5f5f5; background-color: #f5f5f5;
border-top: 1px solid #e5e5e5; border-top: 1px solid #e5e5e5;
} }
@ -1636,7 +1628,7 @@ select:focus:invalid:focus {
padding: 6px 8px; padding: 6px 8px;
font-size: 14px; font-size: 14px;
font-weight: normal; font-weight: normal;
line-height: 20px; line-height: 1.5;
text-align: center; text-align: center;
text-shadow: 0 1px 0 #fff; text-shadow: 0 1px 0 #fff;
background-color: #eeeeee; background-color: #eeeeee;
@ -1785,7 +1777,7 @@ select:focus:invalid:focus {
margin-bottom: 0; margin-bottom: 0;
font-size: 14px; font-size: 14px;
font-weight: 500; font-weight: 500;
line-height: 20px; line-height: 1.5;
text-align: center; text-align: center;
white-space: nowrap; white-space: nowrap;
vertical-align: middle; vertical-align: middle;
@ -2823,7 +2815,7 @@ input[type="button"].btn-block {
.dropdown-menu .divider { .dropdown-menu .divider {
height: 2px; height: 2px;
margin: 9px 0; margin: -0.25 0;
overflow: hidden; overflow: hidden;
background-color: #e5e5e5; background-color: #e5e5e5;
border-bottom: 1px solid #ffffff; border-bottom: 1px solid #ffffff;
@ -2834,7 +2826,7 @@ input[type="button"].btn-block {
padding: 3px 20px; padding: 3px 20px;
clear: both; clear: both;
font-weight: normal; font-weight: normal;
line-height: 20px; line-height: 1.5;
color: #333333; color: #333333;
white-space: nowrap; white-space: nowrap;
} }
@ -3252,7 +3244,7 @@ button.close {
.nav .nav-divider { .nav .nav-divider {
height: 2px; height: 2px;
margin: 9px 0; margin: -0.25 0;
overflow: hidden; overflow: hidden;
background-color: #e5e5e5; background-color: #e5e5e5;
border-bottom: 1px solid #ffffff; border-bottom: 1px solid #ffffff;
@ -3269,7 +3261,7 @@ button.close {
.nav-tabs > li > a { .nav-tabs > li > a {
margin-right: 2px; margin-right: 2px;
line-height: 20px; line-height: 1.5;
border: 1px solid transparent; border: 1px solid transparent;
border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0;
} }
@ -3359,7 +3351,7 @@ button.close {
padding: 3px 15px; padding: 3px 15px;
font-size: 10.5px; font-size: 10.5px;
font-weight: bold; font-weight: bold;
line-height: 20px; line-height: 1.5;
color: #999999; color: #999999;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
text-transform: uppercase; text-transform: uppercase;
@ -3498,8 +3490,8 @@ button.close {
} }
.navbar-nav > li > a { .navbar-nav > li > a {
padding-top: 15px; padding-top: 14.5px;
padding-bottom: 15px; padding-bottom: 14.5px;
line-height: 20px; line-height: 20px;
color: #777777; color: #777777;
} }
@ -3554,7 +3546,7 @@ button.close {
margin-left: auto; margin-left: auto;
font-size: 17.5px; font-size: 17.5px;
font-weight: 500; font-weight: 500;
line-height: 20px; line-height: 21px;
color: #777777; color: #777777;
text-align: center; text-align: center;
} }
@ -3762,7 +3754,12 @@ button.close {
} }
.navbar-btn { .navbar-btn {
margin-top: 8px; margin-top: 7.5px;
}
.navbar-text {
margin-top: 14.5px;
margin-bottom: 14.5px;
} }
.navbar-link { .navbar-link {
@ -3973,7 +3970,7 @@ button.close {
.breadcrumb { .breadcrumb {
padding: 8px 15px; padding: 8px 15px;
margin: 0 0 20px; margin: 0 0 1.5;
list-style: none; list-style: none;
background-color: #f5f5f5; background-color: #f5f5f5;
border-radius: 4px; border-radius: 4px;
@ -4001,7 +3998,7 @@ button.close {
.pagination { .pagination {
display: inline-block; display: inline-block;
margin: 20px 0; margin: 1.5 0;
border-radius: 4px; border-radius: 4px;
} }
@ -4013,7 +4010,7 @@ button.close {
.pagination > li > span { .pagination > li > span {
float: left; float: left;
padding: 4px 12px; padding: 4px 12px;
line-height: 20px; line-height: 1.5;
text-decoration: none; text-decoration: none;
background-color: #ffffff; background-color: #ffffff;
border: 1px solid #dddddd; border: 1px solid #dddddd;
@ -4102,7 +4099,7 @@ button.close {
} }
.pager { .pager {
margin: 20px 0; margin: 1.5 0;
text-align: center; text-align: center;
list-style: none; list-style: none;
} }
@ -4239,7 +4236,7 @@ button.close {
} }
.modal-header { .modal-header {
min-height: 35px; min-height: 16.5px;
padding: 15px; padding: 15px;
border-bottom: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5;
} }
@ -4250,7 +4247,7 @@ button.close {
.modal-title { .modal-title {
margin: 0; margin: 0;
line-height: 20px; line-height: 1.5;
} }
.modal-body { .modal-body {
@ -4539,8 +4536,8 @@ button.close {
} }
.alert { .alert {
padding: 8px 35px 8px 14px; padding: 10px 35px 10px 15px;
margin-bottom: 20px; margin-bottom: 21px;
color: #c09853; color: #c09853;
background-color: #fcf8e3; background-color: #fcf8e3;
border: 1px solid #fbeed5; border: 1px solid #fbeed5;
@ -4615,8 +4612,8 @@ button.close {
} }
.alert-block { .alert-block {
padding-top: 14px; padding-top: 15px;
padding-bottom: 14px; padding-bottom: 15px;
} }
.alert-block > p, .alert-block > p,
@ -4631,7 +4628,7 @@ button.close {
.thumbnail, .thumbnail,
.img-thumbnail { .img-thumbnail {
padding: 4px; padding: 4px;
line-height: 20px; line-height: 1.5;
background-color: #ffffff; background-color: #ffffff;
border: 1px solid #dddddd; border: 1px solid #dddddd;
border-radius: 4px; border-radius: 4px;
@ -4851,8 +4848,8 @@ a.list-group-item.active > .badge,
} }
.progress { .progress {
height: 20px; height: 21px;
margin-bottom: 20px; margin-bottom: 21px;
overflow: hidden; overflow: hidden;
background-color: #f5f5f5; background-color: #f5f5f5;
border-radius: 4px; border-radius: 4px;
@ -4946,7 +4943,7 @@ a.list-group-item.active > .badge,
} }
.accordion { .accordion {
margin-bottom: 20px; margin-bottom: 1.5;
} }
.accordion-group { .accordion-group {
@ -5158,7 +5155,7 @@ a.list-group-item.active > .badge,
margin-bottom: 30px; margin-bottom: 30px;
font-size: 21px; font-size: 21px;
font-weight: 200; font-weight: 200;
line-height: 30px; line-height: 2.25;
color: inherit; color: inherit;
background-color: #eeeeee; background-color: #eeeeee;
} }

1
docs/assets/css/docs.css
View File

@ -599,6 +599,7 @@ input.focused {
} }
.highlight pre { .highlight pre {
padding: 0; padding: 0;
margin-top: 0;
margin-bottom: 0; margin-bottom: 0;
background-color: transparent; background-color: transparent;
border: 0; border: 0;

8
less/alerts.less
View File

@ -7,8 +7,8 @@
// ------------------------- // -------------------------
.alert { .alert {
padding: 8px 35px 8px 14px; padding: 10px 35px 10px 15px;
margin-bottom: @line-height-base; margin-bottom: @line-height-computed;
color: @alert-text; color: @alert-text;
background-color: @alert-bg; background-color: @alert-bg;
border: 1px solid @alert-border; border: 1px solid @alert-border;
@ -84,8 +84,8 @@
// ------------------------- // -------------------------
.alert-block { .alert-block {
padding-top: 14px; padding-top: 15px;
padding-bottom: 14px; padding-bottom: 15px;
} }
.alert-block > p, .alert-block > p,
.alert-block > ul { .alert-block > ul {

12
less/forms.less
View File

@ -20,9 +20,9 @@ legend {
display: block; display: block;
width: 100%; width: 100%;
padding: 0; padding: 0;
margin-bottom: @line-height-base; margin-bottom: @line-height-computed;
font-size: (@font-size-base * 1.5); font-size: (@font-size-base * 1.5);
line-height: (@line-height-base * 2); line-height: @line-height-headings;
color: @gray-dark; color: @gray-dark;
border: 0; border: 0;
border-bottom: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5;
@ -170,7 +170,7 @@ textarea {
.radio, .radio,
.checkbox { .checkbox {
display: block; display: block;
min-height: @line-height-base; // clear the floating input if there is no label text min-height: @line-height-computed; // clear the floating input if there is no label text
margin-top: 10px; margin-top: 10px;
margin-bottom: 10px; margin-bottom: 10px;
padding-left: 20px; padding-left: 20px;
@ -320,9 +320,9 @@ select:focus:invalid {
// ------------ // ------------
.form-actions { .form-actions {
padding: (@line-height-base - 1) 20px @line-height-base; padding: @line-height-computed 20px;
margin-top: @line-height-base; margin-top: @line-height-computed;
margin-bottom: @line-height-base; margin-bottom: @line-height-computed;
background-color: @form-actions-bg; background-color: @form-actions-bg;
border-top: 1px solid #e5e5e5; border-top: 1px solid #e5e5e5;
.clearfix(); // Adding clearfix to allow for .pull-right button containers .clearfix(); // Adding clearfix to allow for .pull-right button containers

8
less/navbar.less
View File

@ -24,8 +24,8 @@
margin-top: 10px; margin-top: 10px;
> li > a { > li > a {
padding-top: ((@navbar-height - @line-height-base) / 2); padding-top: ((@navbar-height - @line-height-computed) / 2);
padding-bottom: ((@navbar-height - @line-height-base) / 2); padding-bottom: ((@navbar-height - @line-height-computed) / 2);
color: @navbar-link-color; color: @navbar-link-color;
line-height: 20px; line-height: 20px;
} }
@ -91,7 +91,7 @@
padding: 15px; padding: 15px;
font-size: @font-size-large; font-size: @font-size-large;
font-weight: 500; font-weight: 500;
line-height: @line-height-base; line-height: @line-height-computed;
color: @navbar-brand-color; color: @navbar-brand-color;
text-align: center; text-align: center;
&:hover, &:hover,
@ -323,7 +323,7 @@
// Add a class to make any element properly align itself vertically within the navbars. // Add a class to make any element properly align itself vertically within the navbars.
.navbar-text { .navbar-text {
.navbar-vertical-align(@line-height-computed);
} }

4
less/progress-bars.less
View File

@ -44,8 +44,8 @@
// Outer container // Outer container
.progress { .progress {
overflow: hidden; overflow: hidden;
height: @line-height-base; height: @line-height-computed;
margin-bottom: @line-height-base; margin-bottom: @line-height-computed;
background-color: @progress-bg; background-color: @progress-bg;
border-radius: @border-radius-base; border-radius: @border-radius-base;
.box-shadow(inset 0 1px 2px rgba(0,0,0,.1)); .box-shadow(inset 0 1px 2px rgba(0,0,0,.1));

52
less/type.less
View File

@ -7,10 +7,10 @@
// ------------------------- // -------------------------
p { p {
margin: 0 0 (@line-height-base / 2); margin: 0 0 (@line-height-computed / 2);
} }
.lead { .lead {
margin-bottom: @line-height-base; margin-bottom: @line-height-computed;
font-size: (@font-size-base * 1.5); font-size: (@font-size-base * 1.5);
font-weight: 200; font-weight: 200;
line-height: 1.4; line-height: 1.4;
@ -56,7 +56,7 @@ h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 { .h1, .h2, .h3, .h4, .h5, .h6 {
font-family: @headings-font-family; font-family: @headings-font-family;
font-weight: @headings-font-weight; font-weight: @headings-font-weight;
line-height: @line-height-base; line-height: @line-height-headings;
small { small {
font-weight: normal; font-weight: normal;
line-height: 1; line-height: 1;
@ -67,30 +67,26 @@ h1, h2, h3, h4, h5, h6,
h1, h1,
h2, h2,
h3 { h3 {
margin-top: @line-height-base; margin-top: @line-height-computed;
margin-bottom: (@line-height-base / 2); margin-bottom: (@line-height-computed / 2);
line-height: (@line-height-base * 2);
}
h3 {
line-height: (@line-height-base * 1.5);
} }
h4, h4,
h5, h5,
h6 { h6 {
margin-top: (@line-height-base / 2); margin-top: (@line-height-computed / 2);
margin-bottom: (@line-height-base / 2); margin-bottom: (@line-height-computed / 2);
} }
h1, .h1 { font-size: (@font-size-base * 2.75); } // ~38px h1, .h1 { font-size: ceil(@font-size-base * 2.70); } // ~38px
h2, .h2 { font-size: (@font-size-base * 2.25); } // ~32px h2, .h2 { font-size: ceil(@font-size-base * 2.25); } // ~32px
h3, .h3 { font-size: (@font-size-base * 1.75); } // ~24px h3, .h3 { font-size: ceil(@font-size-base * 1.70); } // ~24px
h4, .h4 { font-size: (@font-size-base * 1.25); } // ~18px h4, .h4 { font-size: ceil(@font-size-base * 1.25); } // ~18px
h5, .h5 { font-size: @font-size-base; } h5, .h5 { font-size: @font-size-base; }
h6, .h6 { font-size: (@font-size-base * 0.85); } // ~12px h6, .h6 { font-size: ceil(@font-size-base * 0.85); } // ~12px
h1 small, .h1 small { font-size: (@font-size-base * 1.75); } // ~24px h1 small, .h1 small { font-size: ceil(@font-size-base * 1.70); } // ~24px
h2 small, .h2 small { font-size: (@font-size-base * 1.25); } // ~18px h2 small, .h2 small { font-size: ceil(@font-size-base * 1.25); } // ~18px
h3 small, .h3 small { font-size: @font-size-base; } h3 small, .h3 small,
h4 small, .h4 small { font-size: @font-size-base; } h4 small, .h4 small { font-size: @font-size-base; }
@ -98,8 +94,8 @@ h4 small, .h4 small { font-size: @font-size-base; }
// ------------------------- // -------------------------
.page-header { .page-header {
padding-bottom: ((@line-height-base / 2) - 1); padding-bottom: ((@line-height-computed / 2) - 1);
margin: (@line-height-base * 2) 0 @line-height-base; margin: (@line-height-computed * 2) 0 @line-height-computed;
border-bottom: 1px solid @gray-lighter; border-bottom: 1px solid @gray-lighter;
} }
@ -112,7 +108,7 @@ h4 small, .h4 small { font-size: @font-size-base; }
ul, ul,
ol { ol {
padding: 0; padding: 0;
margin: 0 0 (@line-height-base / 2) 25px; margin: 0 0 (@line-height-computed / 2) 25px;
} }
ul ul, ul ul,
ul ol, ul ol,
@ -143,7 +139,7 @@ li {
// Description Lists // Description Lists
dl { dl {
margin-bottom: @line-height-base; margin-bottom: @line-height-computed;
} }
dt, dt,
dd { dd {
@ -153,7 +149,7 @@ dt {
font-weight: bold; font-weight: bold;
} }
dd { dd {
margin-left: (@line-height-base / 2); margin-left: (@line-height-computed / 2);
} }
// Horizontal layout (like forms) // Horizontal layout (like forms)
.dl-horizontal { .dl-horizontal {
@ -175,7 +171,7 @@ dd {
// Horizontal rules // Horizontal rules
hr { hr {
margin: @line-height-base 0; margin: @line-height-computed 0;
border: 0; border: 0;
border-top: 1px solid @hr-border; border-top: 1px solid @hr-border;
border-bottom: 1px solid #fff; border-bottom: 1px solid #fff;
@ -196,8 +192,8 @@ abbr.initialism {
// Blockquotes // Blockquotes
blockquote { blockquote {
padding: (@line-height-base/2) @line-height-base; padding: (@line-height-computed / 2) @line-height-computed;
margin: 0 0 @line-height-base; margin: 0 0 @line-height-computed;
border-left: 5px solid @gray-lighter; border-left: 5px solid @gray-lighter;
p { p {
font-size: (@font-size-base * 1.25); font-size: (@font-size-base * 1.25);
@ -249,7 +245,7 @@ blockquote:after {
// Addresses // Addresses
address { address {
display: block; display: block;
margin-bottom: @line-height-base; margin-bottom: @line-height-computed;
font-style: normal; font-style: normal;
line-height: @line-height-base; line-height: @line-height-base;
} }

10
less/variables.less
View File

@ -50,7 +50,9 @@
@font-size-small: (@font-size-base * 0.85); // ~12px @font-size-small: (@font-size-base * 0.85); // ~12px
@font-size-mini: (@font-size-base * 0.75); // ~11px @font-size-mini: (@font-size-base * 0.75); // ~11px
@line-height-base: 20px; @line-height-base: 1.5;
@line-height-computed: (@font-size-base * @line-height-base);
@line-height-headings: 1.1;
@headings-font-family: inherit; // empty to use BS default, @font-family-base @headings-font-family: inherit; // empty to use BS default, @font-family-base
@headings-font-weight: 500; @headings-font-weight: 500;
@ -121,9 +123,9 @@
@input-color-placeholder: @gray-light; @input-color-placeholder: @gray-light;
@input-height-base: (@line-height-base + 14px); // base line-height + 12px vertical padding + 2px top/bottom border @input-height-base: (@line-height-computed + 14px); // base line-height + 12px vertical padding + 2px top/bottom border
@input-height-large: (@line-height-base + 24px); // base line-height + 22px vertical padding + 2px top/bottom border @input-height-large: (@line-height-computed + 24px); // base line-height + 22px vertical padding + 2px top/bottom border
@input-height-small: (@line-height-base + 6px); // base line-height + 4px vertical padding + 2px top/bottom border @input-height-small: (@line-height-computed + 6px); // base line-height + 4px vertical padding + 2px top/bottom border
@form-actions-bg: #f5f5f5; @form-actions-bg: #f5f5f5;