diff options
| author | Mark Otto <[email protected]> | 2013-12-08 02:00:37 -0800 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2013-12-08 02:00:37 -0800 |
| commit | c37b710e85e379ddffb305af8a765013c0cd0333 (patch) | |
| tree | 8c23e05b150a14a39c2be90b39d03343b8c994f7 /less | |
| parent | b5008ebf9ca1c9c90a6ec73ae12e55a8f155017f (diff) | |
| parent | e43e87b2f30a9f4967818f1ce8d25a4f88a1f490 (diff) | |
| download | bootstrap-c37b710e85e379ddffb305af8a765013c0cd0333.tar.xz bootstrap-c37b710e85e379ddffb305af8a765013c0cd0333.zip | |
Merge branch 'master' into pr/11744
Conflicts:
dist/css/bootstrap.min.css
Diffstat (limited to 'less')
| -rw-r--r-- | less/buttons.less | 8 | ||||
| -rw-r--r-- | less/code.less | 10 | ||||
| -rw-r--r-- | less/grid.less | 27 | ||||
| -rw-r--r-- | less/list-group.less | 26 | ||||
| -rw-r--r-- | less/mixins.less | 63 | ||||
| -rw-r--r-- | less/navbar.less | 22 | ||||
| -rw-r--r-- | less/tables.less | 3 | ||||
| -rw-r--r-- | less/type.less | 1 | ||||
| -rw-r--r-- | less/variables.less | 5 |
9 files changed, 127 insertions, 38 deletions
diff --git a/less/buttons.less b/less/buttons.less index 62e693bee..b728f332c 100644 --- a/less/buttons.less +++ b/less/buttons.less @@ -56,6 +56,10 @@ .btn-primary { .button-variant(@btn-primary-color; @btn-primary-bg; @btn-primary-border); } +// Success appears as green +.btn-success { + .button-variant(@btn-success-color; @btn-success-bg; @btn-success-border); +} // Warning appears as orange .btn-warning { .button-variant(@btn-warning-color; @btn-warning-bg; @btn-warning-border); @@ -64,10 +68,6 @@ .btn-danger { .button-variant(@btn-danger-color; @btn-danger-bg; @btn-danger-border); } -// Success appears as green -.btn-success { - .button-variant(@btn-success-color; @btn-success-bg; @btn-success-border); -} // Info appears as blue-green .btn-info { .button-variant(@btn-info-color; @btn-info-bg; @btn-info-border); diff --git a/less/code.less b/less/code.less index 44e9e8937..3eed26c05 100644 --- a/less/code.less +++ b/less/code.less @@ -21,6 +21,16 @@ code { border-radius: @border-radius-base; } +// User input typically entered via keyboard +kbd { + padding: 2px 4px; + font-size: 90%; + color: @kbd-color; + background-color: @kbd-bg; + border-radius: @border-radius-small; + box-shadow: inset 0 -1px 0 rgba(0,0,0,.25); +} + // Blocks of code pre { display: block; diff --git a/less/grid.less b/less/grid.less index 279d80368..dfae6999b 100644 --- a/less/grid.less +++ b/less/grid.less @@ -2,7 +2,11 @@ // Grid system // -------------------------------------------------- -// Set the container width, and override it for fixed navbars in media queries + +// Container widths +// +// Set the container width, and override it for fixed navbars in media queries. + .container { .container-fixed(); @@ -17,12 +21,30 @@ } } -// mobile first defaults + +// Fluid container +// +// Utilizes the mixin meant for fixed width containers, but without any defined +// width for fluid, full width layouts. + +.container-fluid { + .container-fixed(); +} + + +// Row +// +// Rows contain and clear the floats of your columns. + .row { .make-row(); } + +// Columns +// // Common styles for small and large grid columns + .make-grid-columns(); @@ -76,4 +98,3 @@ .make-grid(@grid-columns, lg, push); .make-grid(@grid-columns, lg, offset); } - diff --git a/less/list-group.less b/less/list-group.less index 2cee52973..35fff05d4 100644 --- a/less/list-group.less +++ b/less/list-group.less @@ -2,17 +2,21 @@ // List groups // -------------------------------------------------- + // Base class // // Easily usable on <ul>, <ol>, or <div>. + .list-group { // No need to set list-style: none; since .list-group-item is block level margin-bottom: 20px; padding-left: 0; // reset padding because ul and ol } + // Individual list items -// ------------------------- +// +// Use on `li`s or `div`s within the `.list-group` parent. .list-group-item { position: relative; @@ -41,7 +45,12 @@ } } + // Linked list items +// +// Use anchor elements instead of `li`s or `div`s to create linked list items. +// Includes an extra `.active` modifier class for showing selected items. + a.list-group-item { color: @list-group-link-color; @@ -75,8 +84,21 @@ a.list-group-item { } } + +// Contextual variants +// +// Add modifier classes to change text and background color on individual items. +// Organizationally, this must come after the `:hover` states. + +.list-group-item-variant(success; @state-success-bg; @state-success-text); +.list-group-item-variant(warning; @state-warning-bg; @state-warning-text); +.list-group-item-variant(danger; @state-danger-bg; @state-danger-text); +.list-group-item-variant(info; @state-info-bg; @state-info-text); + + // Custom content options -// ------------------------- +// +// Extra classes for creating well-formatted content within `.list-group-item`s. .list-group-item-heading { margin-top: 0; diff --git a/less/mixins.less b/less/mixins.less index 5c54c64c7..9ef72fef7 100644 --- a/less/mixins.less +++ b/less/mixins.less @@ -150,10 +150,10 @@ -ms-transform: rotate(@degrees); // IE9+ transform: rotate(@degrees); } -.scale(@ratio) { - -webkit-transform: scale(@ratio); - -ms-transform: scale(@ratio); // IE9+ - transform: scale(@ratio); +.scale(@ratio; @ratio-y...) { + -webkit-transform: scale(@ratio, @ratio-y); + -ms-transform: scale(@ratio, @ratio-y); // IE9+ + transform: scale(@ratio, @ratio-y); } .translate(@x; @y) { -webkit-transform: translate(@x, @y); @@ -414,26 +414,53 @@ .table-row-variant(@state; @background) { // Exact selectors below required to override `.table-striped` and prevent // inheritance to nested tables. - .table { - > thead, - > tbody, - > tfoot { - > tr > .@{state}, - > .@{state} > td, - > .@{state} > th { - background-color: @background; - } + .table > thead > tr, + .table > tbody > tr, + .table > tfoot > tr { + > td.@{state}, + > th.@{state}, + &.@{state} > td, + &.@{state} > th { + background-color: @background; } } // Hover states for `.table-hover` // Note: this is not available for cells or rows within `thead` or `tfoot`. - .table-hover > tbody { - > tr > .@{state}:hover, - > .@{state}:hover > td, - > .@{state}:hover > th { + .table-hover > tbody > tr { + > td.@{state}:hover, + > th.@{state}:hover, + &.@{state}:hover > td, + &.@{state}:hover > th { + background-color: darken(@background, 5%); + } + } +} + +// List Groups +// ------------------------- +.list-group-item-variant(@state; @background; @color) { + .list-group-item-@{state} { + color: @color; + background-color: @background; + } + a.list-group-item-@{state} { + color: @color; + + .list-group-item-heading { color: inherit; } + + &:hover, + &:focus { + color: @color; background-color: darken(@background, 5%); } + &.active, + &.active:hover, + &.active:focus { + color: #fff; + background-color: @color; + border-color: @color; + } } } @@ -475,7 +502,7 @@ .badge { color: @background; - background-color: #fff; + background-color: @color; } } diff --git a/less/navbar.less b/less/navbar.less index ea284fede..e9633d855 100644 --- a/less/navbar.less +++ b/less/navbar.less @@ -93,14 +93,17 @@ // // When a container is present, change the behavior of the header and collapse. -.container > .navbar-header, -.container > .navbar-collapse { - margin-right: -@navbar-padding-horizontal; - margin-left: -@navbar-padding-horizontal; - - @media (min-width: @grid-float-breakpoint) { - margin-right: 0; - margin-left: 0; +.container, +.container-fluid { + > .navbar-header, + > .navbar-collapse { + margin-right: -@navbar-padding-horizontal; + margin-left: -@navbar-padding-horizontal; + + @media (min-width: @grid-float-breakpoint) { + margin-right: 0; + margin-left: 0; + } } } @@ -159,7 +162,8 @@ } @media (min-width: @grid-float-breakpoint) { - .navbar > .container & { + .navbar > .container &, + .navbar > .container-fluid & { margin-left: -@navbar-padding-horizontal; } } diff --git a/less/tables.less b/less/tables.less index ca565f4b7..f8c05fecf 100644 --- a/less/tables.less +++ b/less/tables.less @@ -156,8 +156,9 @@ table { // Generate the contextual variants .table-row-variant(active; @table-bg-active); .table-row-variant(success; @state-success-bg); -.table-row-variant(danger; @state-danger-bg); .table-row-variant(warning; @state-warning-bg); +.table-row-variant(danger; @state-danger-bg); +.table-row-variant(info; @state-info-bg); // Responsive tables diff --git a/less/type.less b/less/type.less index ac07ac7ce..0c9600d50 100644 --- a/less/type.less +++ b/less/type.less @@ -120,6 +120,7 @@ cite { font-style: normal; } .text-left { text-align: left; } .text-right { text-align: right; } .text-center { text-align: center; } +.text-justify { text-align: justify; } // Page header diff --git a/less/variables.less b/less/variables.less index 8b5f2184d..3681e99b5 100644 --- a/less/variables.less +++ b/less/variables.less @@ -286,7 +286,7 @@ // Navbar toggle @navbar-default-toggle-hover-bg: #ddd; -@navbar-default-toggle-icon-bar-bg: #ccc; +@navbar-default-toggle-icon-bar-bg: #888; @navbar-default-toggle-border-color: #ddd; @@ -602,6 +602,9 @@ @code-color: #c7254e; @code-bg: #f9f2f4; +@kbd-color: #fff; +@kbd-bg: #333; + @pre-bg: #f5f5f5; @pre-color: @gray-dark; @pre-border-color: #ccc; |
