From 857fe32a70270ea8d80319782ff8125c3a9db060 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Wed, 9 Jul 2014 16:04:31 -0700 Subject: Refactor navs: new classes, remove separate pills & tabs files, drop justified nav because it never really worked --- docs/dist/css/bootstrap.css | 324 +++++++++----------------------------------- 1 file changed, 65 insertions(+), 259 deletions(-) (limited to 'docs/dist/css/bootstrap.css') diff --git a/docs/dist/css/bootstrap.css b/docs/dist/css/bootstrap.css index 872cbdab5..b015163e7 100644 --- a/docs/dist/css/bootstrap.css +++ b/docs/dist/css/bootstrap.css @@ -2963,15 +2963,14 @@ select[multiple].input-group-sm > .input-group-btn > .btn { } .nav { padding-left: 0; - margin-bottom: 24px; list-style: none; } .nav-item { position: relative; - display: block; + display: inline-block; } .nav-link { - display: block; + display: inline-block; padding: .5em 1em; line-height: 1.5; } @@ -2980,198 +2979,103 @@ select[multiple].input-group-sm > .input-group-btn > .btn { text-decoration: none; background-color: #eceeef; } -.open > .nav-link, -.active > .nav-link, -.open > .nav-link:hover, -.active > .nav-link:hover, -.open > .nav-link:focus, -.active > .nav-link:focus { - color: #fff; - background-color: #027de7; -} -.disabled > .nav-link { +.disabled > .nav-link, +.nav-link.disabled { color: #818a91; } .disabled > .nav-link, +.nav-link.disabled, .disabled > .nav-link:hover, -.disabled > .nav-link:focus { - color: #818a91; - cursor: not-allowed; - background-color: transparent; -} -.nav { - padding-left: 0; - margin-bottom: 0; - list-style: none; -} -.nav > li { - position: relative; - display: block; -} -.nav > li > a { - position: relative; - display: block; - padding: .5em 1em; - line-height: 1.5; -} -.nav > li > a:hover, -.nav > li > a:focus { - text-decoration: none; - background-color: #eceeef; -} -.nav > li.disabled > a { - color: #818a91; -} -.nav > li.disabled > a:hover, -.nav > li.disabled > a:focus { +.nav-link.disabled:hover, +.disabled > .nav-link:focus, +.nav-link.disabled:focus { color: #818a91; - text-decoration: none; cursor: not-allowed; background-color: transparent; } -.nav .open > a, -.nav .open > a:hover, -.nav .open > a:focus { - background-color: #eceeef; - border-color: #027de7; -} .nav-tabs { + margin-bottom: 24px; border-bottom: 1px solid #ddd; } -.nav-tabs > li { +.nav-tabs .nav-item { float: left; margin-bottom: -1px; } -.nav-tabs > li > a { - margin-right: 2px; - line-height: 1.5; +.nav-tabs .nav-item + .nav-item { + margin-left: .2rem; +} +.nav-tabs .nav-link { + display: block; border: 1px solid transparent; border-radius: .2rem .2rem 0 0; } -.nav-tabs > li > a:hover { +.nav-tabs .nav-link:hover, +.nav-tabs .nav-link:focus { border-color: #eceeef #eceeef #ddd; } -.nav-tabs > li.active > a, -.nav-tabs > li.active > a:hover, -.nav-tabs > li.active > a:focus { +.nav-tabs .open > .nav-link, +.nav-tabs .active > .nav-link, +.nav-tabs .nav-link.open, +.nav-tabs .nav-link.active, +.nav-tabs .open > .nav-link:hover, +.nav-tabs .active > .nav-link:hover, +.nav-tabs .nav-link.open:hover, +.nav-tabs .nav-link.active:hover, +.nav-tabs .open > .nav-link:focus, +.nav-tabs .active > .nav-link:focus, +.nav-tabs .nav-link.open:focus, +.nav-tabs .nav-link.active:focus { color: #55595c; - cursor: default; background-color: #fff; - border: 1px solid #ddd; - border-bottom-color: transparent; -} -.nav-tabs.nav-justified { - width: 100%; - border-bottom: 0; -} -.nav-tabs.nav-justified > li { - float: none; -} -.nav-tabs.nav-justified > li > a { - margin-bottom: 5px; - text-align: center; -} -.nav-tabs.nav-justified > .dropdown .dropdown-menu { - top: auto; - left: auto; -} -@media (min-width: 48em) { - .nav-tabs.nav-justified > li { - display: table-cell; - width: 1%; - } - .nav-tabs.nav-justified > li > a { - margin-bottom: 0; - } -} -.nav-tabs.nav-justified > li > a { - margin-right: 0; - border-radius: .2rem; -} -.nav-tabs.nav-justified > .active > a, -.nav-tabs.nav-justified > .active > a:hover, -.nav-tabs.nav-justified > .active > a:focus { - border: 1px solid #ddd; + border-color: #ddd #ddd transparent; +} +.nav-tabs .disabled > .nav-link, +.nav-tabs .nav-link.disabled, +.nav-tabs .disabled > .nav-link:hover, +.nav-tabs .nav-link.disabled:hover, +.nav-tabs .disabled > .nav-link:focus, +.nav-tabs .nav-link.disabled:focus { + color: #818a91; + background-color: transparent; + border-color: transparent; } -@media (min-width: 48em) { - .nav-tabs.nav-justified > li > a { - border-bottom: 1px solid #ddd; - border-radius: .2rem .2rem 0 0; - } - .nav-tabs.nav-justified > .active > a, - .nav-tabs.nav-justified > .active > a:hover, - .nav-tabs.nav-justified > .active > a:focus { - border-bottom-color: #fff; - } +.nav-pills { + margin-bottom: 24px; } -.nav-pills > li { +.nav-pills .nav-item { float: left; } -.nav-pills > li > a { - border-radius: .2rem; +.nav-pills .nav-item + .nav-item { + margin-left: .2rem; } -.nav-pills > li + li { - margin-left: 2px; +.nav-pills .nav-link { + display: block; + border-radius: .2rem; } -.nav-pills > li.active > a, -.nav-pills > li.active > a:hover, -.nav-pills > li.active > a:focus { +.nav-pills .open > .nav-link, +.nav-pills .active > .nav-link, +.nav-pills .nav-link.open, +.nav-pills .nav-link.active, +.nav-pills .open > .nav-link:hover, +.nav-pills .active > .nav-link:hover, +.nav-pills .nav-link.open:hover, +.nav-pills .nav-link.active:hover, +.nav-pills .open > .nav-link:focus, +.nav-pills .active > .nav-link:focus, +.nav-pills .nav-link.open:focus, +.nav-pills .nav-link.active:focus { color: #fff; + cursor: default; background-color: #027de7; } -.nav-stacked > li { +.nav-stacked .nav-item { + display: block; float: none; } -.nav-stacked > li + li { - margin-top: 2px; +.nav-stacked .nav-item + .nav-item { + margin-top: .2rem; margin-left: 0; } -.nav-justified { - width: 100%; -} -.nav-justified > li { - float: none; -} -.nav-justified > li > a { - margin-bottom: 5px; - text-align: center; -} -.nav-justified > .dropdown .dropdown-menu { - top: auto; - left: auto; -} -@media (min-width: 48em) { - .nav-justified > li { - display: table-cell; - width: 1%; - } - .nav-justified > li > a { - margin-bottom: 0; - } -} -.nav-tabs-justified { - border-bottom: 0; -} -.nav-tabs-justified > li > a { - margin-right: 0; - border-radius: .2rem; -} -.nav-tabs-justified > .active > a, -.nav-tabs-justified > .active > a:hover, -.nav-tabs-justified > .active > a:focus { - border: 1px solid #ddd; -} -@media (min-width: 48em) { - .nav-tabs-justified > li > a { - border-bottom: 1px solid #ddd; - border-radius: .2rem .2rem 0 0; - } - .nav-tabs-justified > .active > a, - .nav-tabs-justified > .active > a:hover, - .nav-tabs-justified > .active > a:focus { - border-bottom-color: #fff; - } -} .tab-content > .tab-pane { display: none; } @@ -3183,95 +3087,6 @@ select[multiple].input-group-sm > .input-group-btn > .btn { border-top-left-radius: 0; border-top-right-radius: 0; } -.nav-tab { - padding-left: 0; - margin-bottom: 24px; - list-style: none; - border-bottom: 1px solid #ddd; -} -.nav-tab-item { - position: relative; - display: block; - float: left; - margin-bottom: -1px; -} -.nav-tab-link { - display: block; - padding: .5em 1em; - margin-right: .2rem; - line-height: 1.5; - border: 1px solid transparent; - border-radius: .2rem .2rem 0 0; -} -.nav-tab-link:hover, -.nav-tab-link:focus { - text-decoration: none; - background-color: #eceeef; - border-color: #eceeef #eceeef #ddd; -} -.open > .nav-tab-link, -.active > .nav-tab-link, -.open > .nav-tab-link:hover, -.active > .nav-tab-link:hover, -.open > .nav-tab-link:focus, -.active > .nav-tab-link:focus { - color: #55595c; - cursor: default; - background-color: #fff; - border: 1px solid #ddd; - border-bottom-color: transparent; -} -.disabled > .nav-tab-link, -.disabled > .nav-tab-link:hover, -.disabled > .nav-tab-link:focus { - color: #818a91; - cursor: not-allowed; - background-color: transparent; - border-color: transparent; -} -.nav-pill { - padding-left: 0; - margin-bottom: 24px; - list-style: none; -} -.nav-pill-item { - position: relative; - display: block; - float: left; -} -.nav-pill-item + .nav-pill-item { - margin-left: .2rem; -} -.nav-pill-link { - position: relative; - display: block; - padding: .5em 1em; - border-radius: .2rem; -} -.nav-pill-link:hover, -.nav-pill-link:focus { - text-decoration: none; - background-color: #eceeef; -} -.open > .nav-pill-link, -.active > .nav-pill-link, -.open > .nav-pill-link:hover, -.active > .nav-pill-link:hover, -.open > .nav-pill-link:focus, -.active > .nav-pill-link:focus { - color: #fff; - background-color: #027de7; -} -.disabled > .nav-pill-link { - color: #818a91; -} -.disabled > .nav-pill-link, -.disabled > .nav-pill-link:hover, -.disabled > .nav-pill-link:focus { - color: #818a91; - cursor: not-allowed; - background-color: transparent; -} .navbar { position: relative; min-height: 50px; @@ -5128,12 +4943,6 @@ button.close { .btn-group-vertical > .btn-group:after, .nav:before, .nav:after, -.nav:before, -.nav:after, -.nav-tab:before, -.nav-tab:after, -.nav-pill:before, -.nav-pill:after, .navbar:before, .navbar:after, .navbar-header:before, @@ -5156,9 +4965,6 @@ button.close { .btn-toolbar:after, .btn-group-vertical > .btn-group:after, .nav:after, -.nav:after, -.nav-tab:after, -.nav-pill:after, .navbar:after, .navbar-header:after, .navbar-collapse:after, -- cgit v1.2.3