From 7c3f5b6d59a3479c92cd85b2a1f72a3c6a346743 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sat, 8 Aug 2015 14:15:09 -0700 Subject: rewrite some forms docs, use new validation styles and icons --- docs/dist/css/bootstrap.css | 169 +++++++++++++------------------------------- 1 file changed, 50 insertions(+), 119 deletions(-) (limited to 'docs/dist/css/bootstrap.css') diff --git a/docs/dist/css/bootstrap.css b/docs/dist/css/bootstrap.css index 8508b64a5..ed6a023d4 100644 --- a/docs/dist/css/bootstrap.css +++ b/docs/dist/css/bootstrap.css @@ -1826,7 +1826,7 @@ pre code { .form-control { display: block; width: 100%; - padding: .5rem .75rem; + padding: .5rem 1rem; font-size: 1rem; line-height: 1.5; color: #55595c; @@ -1834,9 +1834,6 @@ pre code { background-image: none; border: .0625rem solid #ccc; border-radius: .25rem; - -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s; - -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; - transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; } .form-control::-ms-expand { background-color: transparent; @@ -1879,7 +1876,7 @@ pre code { } .form-control-label { - padding: .5625rem .75rem; + padding: .5625rem 1rem; margin-bottom: 0; } @@ -2025,38 +2022,14 @@ fieldset[disabled] .checkbox label { cursor: not-allowed; } -.has-feedback { - position: relative; -} -.has-feedback .form-control { - padding-right: 3.28125rem; -} - -.form-control-feedback { - position: absolute; - top: 0; - right: 0; - z-index: 2; - display: block; - width: 2.625rem; - height: 2.625rem; - line-height: 2.625rem; - text-align: center; - pointer-events: none; -} - -.input-lg + .form-control-feedback, -.input-group-lg + .form-control-feedback { - width: 3.291667rem; - height: 3.291667rem; - line-height: 3.291667rem; -} - -.input-sm + .form-control-feedback, -.input-group-sm + .form-control-feedback { - width: 1.95rem; - height: 1.95rem; - line-height: 1.95rem; +.form-control-success, +.form-control-warning, +.form-control-error { + padding-right: 3rem; + background-repeat: no-repeat; + background-position: center right .65625rem; + -webkit-background-size: 1.70625rem 1.70625rem; + background-size: 1.70625rem 1.70625rem; } .has-success .help-block, @@ -2069,24 +2042,25 @@ fieldset[disabled] .checkbox label { .has-success.checkbox label, .has-success.radio-inline label, .has-success.checkbox-inline label { - color: #3c763d; + color: #5cb85c; } .has-success .form-control { - border-color: #3c763d; -} -.has-success .form-control:focus { - border-color: #2b542c; + border-color: #5cb85c; } .has-success .input-group-addon { - color: #3c763d; - background-color: #dff0d8; - border-color: #3c763d; + color: #5cb85c; + background-color: #eaf6ea; + border-color: #5cb85c; } .has-success .form-control-feedback { - color: #3c763d; + color: #5cb85c; +} + +.has-success .form-control-success { + background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkNoZWNrIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDYxMiA3OTIiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDYxMiA3OTIiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxwYXRoIGZpbGw9IiM1Q0I4NUMiIGQ9Ik0yMzMuOCw2MTAuMWMtMTMuMywwLTI1LjktNi4yLTM0LTE2LjlMOTAuNSw0NDguOEM3Ni4zLDQzMCw4MCw0MDMuMyw5OC44LDM4OS4xYzE4LjgtMTQuMyw0NS41LTEwLjUsNTkuOCw4LjNsNzEuOSw5NWwyMjAuOS0yNTAuNWMxMi41LTIwLDM4LjgtMjYuMSw1OC44LTEzLjZjMjAsMTIuNCwyNi4xLDM4LjcsMTMuNiw1OC44TDI3MCw1OTBjLTcuNCwxMi0yMC4yLDE5LjQtMzQuMywyMC4xQzIzNS4xLDYxMC4xLDIzNC41LDYxMC4xLDIzMy44LDYxMC4xeiIvPjwvc3ZnPg=="); } .has-warning .help-block, @@ -2099,24 +2073,25 @@ fieldset[disabled] .checkbox label { .has-warning.checkbox label, .has-warning.radio-inline label, .has-warning.checkbox-inline label { - color: #8a6d3b; + color: #f0ad4e; } .has-warning .form-control { - border-color: #8a6d3b; -} -.has-warning .form-control:focus { - border-color: #66512c; + border-color: #f0ad4e; } .has-warning .input-group-addon { - color: #8a6d3b; - background-color: #fcf8e3; - border-color: #8a6d3b; + color: #f0ad4e; + background-color: white; + border-color: #f0ad4e; } .has-warning .form-control-feedback { - color: #8a6d3b; + color: #f0ad4e; +} + +.has-warning .form-control-warning { + background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9Ildhcm5pbmciIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgNjEyIDc5MiIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgNjEyIDc5MiIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHBhdGggZmlsbD0iI0YwQUQ0RSIgZD0iTTYwMyw2NDAuMmwtMjc4LjUtNTA5Yy0zLjgtNi42LTEwLjgtMTAuNi0xOC41LTEwLjZzLTE0LjcsNC4xLTE4LjUsMTAuNkw5LDY0MC4yYy0zLjcsNi41LTMuNiwxNC40LDAuMiwyMC44YzMuOCw2LjUsMTAuOCwxMC40LDE4LjMsMTAuNGg1NTcuMWM3LjUsMCwxNC41LTMuOSwxOC4zLTEwLjRDNjA2LjYsNjU0LjYsNjA2LjcsNjQ2LjYsNjAzLDY0MC4yeiBNMzM2LjYsNjEwLjJoLTYxLjJWNTQ5aDYxLjJWNjEwLjJ6IE0zMzYuNiw1MDMuMWgtNjEuMlYzMDQuMmg2MS4yVjUwMy4xeiIvPjwvc3ZnPg=="); } .has-error .help-block, @@ -2129,32 +2104,25 @@ fieldset[disabled] .checkbox label { .has-error.checkbox label, .has-error.radio-inline label, .has-error.checkbox-inline label { - color: #a94442; + color: #d9534f; } .has-error .form-control { - border-color: #a94442; -} -.has-error .form-control:focus { - border-color: #843534; + border-color: #d9534f; } .has-error .input-group-addon { - color: #a94442; - background-color: #f2dede; - border-color: #a94442; + color: #d9534f; + background-color: #fdf7f7; + border-color: #d9534f; } .has-error .form-control-feedback { - color: #a94442; -} - -.has-feedback label ~ .form-control-feedback { - top: 0; + color: #d9534f; } -.has-feedback label.sr-only ~ .form-control-feedback { - top: 0; +.has-error .form-control-error { + background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkNyb3NzIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDYxMiA3OTIiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDYxMiA3OTIiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxwYXRoIGZpbGw9IiNEOTUzNEYiIGQ9Ik00NDcsNTQ0LjRjLTE0LjQsMTQuNC0zNy42LDE0LjQtNTEuOSwwTDMwNiw0NTEuN2wtODkuMSw5Mi43Yy0xNC40LDE0LjQtMzcuNiwxNC40LTUxLjksMGMtMTQuNC0xNC40LTE0LjQtMzcuNiwwLTUxLjlsOTIuNC05Ni40TDE2NSwyOTkuNmMtMTQuNC0xNC40LTE0LjQtMzcuNiwwLTUxLjlzMzcuNi0xNC40LDUxLjksMGw4OS4yLDkyLjdsODkuMS05Mi43YzE0LjQtMTQuNCwzNy42LTE0LjQsNTEuOSwwYzE0LjQsMTQuNCwxNC40LDM3LjYsMCw1MS45TDM1NC43LDM5Nmw5Mi40LDk2LjRDNDYxLjQsNTA2LjgsNDYxLjQsNTMwLDQ0Nyw1NDQuNHoiLz48L3N2Zz4="); } .help-block { @@ -2217,7 +2185,7 @@ fieldset[disabled] .checkbox label { .btn { display: inline-block; - padding: .5rem .75rem; + padding: .5rem 1rem; font-size: 1rem; font-weight: normal; line-height: 1.5; @@ -2999,7 +2967,7 @@ input[type="button"].btn-block { } .input-group-addon { - padding: .5rem .75rem; + padding: .5rem 1rem; font-size: 1rem; font-weight: normal; line-height: 1; @@ -3917,7 +3885,7 @@ input[type="button"].btn-block { .pagination > li > span { position: relative; float: left; - padding: .5rem .75rem; + padding: .5rem 1rem; margin-left: -1px; line-height: 1.5; color: #0275d8; @@ -4087,6 +4055,12 @@ a.label:hover { cursor: pointer; } +.label-pill { + padding-right: .6em; + padding-left: .6em; + border-radius: 1rem; +} + .label-default { background-color: #818a91; } @@ -4135,51 +4109,6 @@ a.label:hover { background-color: #c9302c; } -.badge { - position: relative; - top: -.1em; - display: inline-block; - padding-right: .6em; - padding-left: .6em; - font-size: .75em; - font-weight: bold; - line-height: 1.5; - color: #fff; - text-align: center; - white-space: nowrap; - vertical-align: middle; - background-color: #818a91; - border-radius: 2em; -} -.badge:empty { - display: none; -} -.badge.pull-left, - .badge.pull-right { - top: .2em; -} -.list-group-item.active > .badge, - .nav-pills > .active > a > .badge { - color: #0275d8; - background-color: #fff; -} -.list-group-item > .badge { - float: right; -} -.list-group-item > .badge + .badge { - margin-right: 5px; -} -.nav-pills > li > a > .badge { - margin-left: 3px; -} - -a.badge:focus, -a.badge:hover { - color: #fff; - text-decoration: none; - cursor: pointer; -} - .jumbotron { padding: 2rem 1rem; margin-bottom: 2rem; @@ -4562,7 +4491,9 @@ a.badge:hover { a.list-group-item, button.list-group-item { - color: #555; + width: 100%; + color: #555; + text-align: inherit; } a.list-group-item .list-group-item-heading, button.list-group-item .list-group-item-heading { -- cgit v1.2.3 From 7a50a2cbe84e897ad427afdf63e12acbd75f4f8c Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sun, 9 Aug 2015 21:17:27 -0700 Subject: introduce display heading classes --- docs/dist/css/bootstrap.css | 20 ++++++++++++++++++++ 1 file changed, 20 insertions(+) (limited to 'docs/dist/css/bootstrap.css') diff --git a/docs/dist/css/bootstrap.css b/docs/dist/css/bootstrap.css index ed6a023d4..dd5d9e258 100644 --- a/docs/dist/css/bootstrap.css +++ b/docs/dist/css/bootstrap.css @@ -560,6 +560,26 @@ h6, .h6 { font-weight: 300; } +.display-1 { + font-size: 3.5rem; + font-weight: 300; +} + +.display-2 { + font-size: 4.5rem; + font-weight: 300; +} + +.display-3 { + font-size: 5.5rem; + font-weight: 300; +} + +.display-4 { + font-size: 6rem; + font-weight: 300; +} + hr { margin-top: 1rem; margin-bottom: 1rem; -- cgit v1.2.3 From 08d6dc5b71875d1a91fc6e6d024f326229c35713 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sun, 9 Aug 2015 21:42:47 -0700 Subject: add basic figure support --- docs/dist/css/bootstrap.css | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) (limited to 'docs/dist/css/bootstrap.css') diff --git a/docs/dist/css/bootstrap.css b/docs/dist/css/bootstrap.css index dd5d9e258..b9e830738 100644 --- a/docs/dist/css/bootstrap.css +++ b/docs/dist/css/bootstrap.css @@ -667,7 +667,17 @@ mark, content: "\00A0 \2014"; } -.img-responsive, .carousel-inner > .carousel-item > img, +.figure > img { + margin-bottom: .5rem; + line-height: 1; +} + +.figure-caption { + font-size: 90%; + color: #818a91; +} + +.img-responsive, .figure > img, .carousel-inner > .carousel-item > img, .carousel-inner > .carousel-item > a > img { display: block; max-width: 100%; -- cgit v1.2.3 From 491cc512ad746cd8380916bbccaf38e944301913 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sun, 9 Aug 2015 22:50:04 -0700 Subject: build --- docs/dist/css/bootstrap.css | 55 ++++++++++++++++++++++++--------------------- 1 file changed, 30 insertions(+), 25 deletions(-) (limited to 'docs/dist/css/bootstrap.css') diff --git a/docs/dist/css/bootstrap.css b/docs/dist/css/bootstrap.css index b9e830738..f6c4a6f21 100644 --- a/docs/dist/css/bootstrap.css +++ b/docs/dist/css/bootstrap.css @@ -2272,7 +2272,7 @@ fieldset[disabled] a.btn { .btn-primary { color: #fff; background-color: #0275d8; - border-color: #0267bf; + border-color: #0275d8; } .btn-primary:focus, .btn-primary.focus, @@ -2281,12 +2281,12 @@ fieldset[disabled] a.btn { .open > .btn-primary.dropdown-toggle { color: #fff; background-color: #025aa5; - border-color: #014682; + border-color: #01549b; } .btn-primary:hover { color: #fff; background-color: #025aa5; - border-color: #014682; + border-color: #01549b; } .btn-primary:active, .btn-primary.active, @@ -2300,13 +2300,13 @@ fieldset[disabled] a.btn { fieldset[disabled] .btn-primary:focus, fieldset[disabled] .btn-primary.focus { background-color: #0275d8; - border-color: #0267bf; + border-color: #0275d8; } .btn-primary.disabled:hover, .btn-primary:disabled:hover, fieldset[disabled] .btn-primary:hover { background-color: #0275d8; - border-color: #0267bf; + border-color: #0275d8; } .btn-primary .badge { color: #0275d8; @@ -2360,7 +2360,7 @@ fieldset[disabled] a.btn { .btn-info { color: #fff; background-color: #5bc0de; - border-color: #46b8da; + border-color: #5bc0de; } .btn-info:focus, .btn-info.focus, @@ -2369,12 +2369,12 @@ fieldset[disabled] a.btn { .open > .btn-info.dropdown-toggle { color: #fff; background-color: #31b0d5; - border-color: #269abc; + border-color: #2aabd2; } .btn-info:hover { color: #fff; background-color: #31b0d5; - border-color: #269abc; + border-color: #2aabd2; } .btn-info:active, .btn-info.active, @@ -2388,13 +2388,13 @@ fieldset[disabled] a.btn { fieldset[disabled] .btn-info:focus, fieldset[disabled] .btn-info.focus { background-color: #5bc0de; - border-color: #46b8da; + border-color: #5bc0de; } .btn-info.disabled:hover, .btn-info:disabled:hover, fieldset[disabled] .btn-info:hover { background-color: #5bc0de; - border-color: #46b8da; + border-color: #5bc0de; } .btn-info .badge { color: #5bc0de; @@ -2404,7 +2404,7 @@ fieldset[disabled] a.btn { .btn-success { color: #fff; background-color: #5cb85c; - border-color: #4cae4c; + border-color: #5cb85c; } .btn-success:focus, .btn-success.focus, @@ -2413,12 +2413,12 @@ fieldset[disabled] a.btn { .open > .btn-success.dropdown-toggle { color: #fff; background-color: #449d44; - border-color: #398439; + border-color: #419641; } .btn-success:hover { color: #fff; background-color: #449d44; - border-color: #398439; + border-color: #419641; } .btn-success:active, .btn-success.active, @@ -2432,13 +2432,13 @@ fieldset[disabled] a.btn { fieldset[disabled] .btn-success:focus, fieldset[disabled] .btn-success.focus { background-color: #5cb85c; - border-color: #4cae4c; + border-color: #5cb85c; } .btn-success.disabled:hover, .btn-success:disabled:hover, fieldset[disabled] .btn-success:hover { background-color: #5cb85c; - border-color: #4cae4c; + border-color: #5cb85c; } .btn-success .badge { color: #5cb85c; @@ -2448,7 +2448,7 @@ fieldset[disabled] a.btn { .btn-warning { color: #fff; background-color: #f0ad4e; - border-color: #eea236; + border-color: #f0ad4e; } .btn-warning:focus, .btn-warning.focus, @@ -2457,12 +2457,12 @@ fieldset[disabled] a.btn { .open > .btn-warning.dropdown-toggle { color: #fff; background-color: #ec971f; - border-color: #d58512; + border-color: #eb9316; } .btn-warning:hover { color: #fff; background-color: #ec971f; - border-color: #d58512; + border-color: #eb9316; } .btn-warning:active, .btn-warning.active, @@ -2476,13 +2476,13 @@ fieldset[disabled] a.btn { fieldset[disabled] .btn-warning:focus, fieldset[disabled] .btn-warning.focus { background-color: #f0ad4e; - border-color: #eea236; + border-color: #f0ad4e; } .btn-warning.disabled:hover, .btn-warning:disabled:hover, fieldset[disabled] .btn-warning:hover { background-color: #f0ad4e; - border-color: #eea236; + border-color: #f0ad4e; } .btn-warning .badge { color: #f0ad4e; @@ -2492,7 +2492,7 @@ fieldset[disabled] a.btn { .btn-danger { color: #fff; background-color: #d9534f; - border-color: #d43f3a; + border-color: #d9534f; } .btn-danger:focus, .btn-danger.focus, @@ -2501,12 +2501,12 @@ fieldset[disabled] a.btn { .open > .btn-danger.dropdown-toggle { color: #fff; background-color: #c9302c; - border-color: #ac2925; + border-color: #c12e2a; } .btn-danger:hover { color: #fff; background-color: #c9302c; - border-color: #ac2925; + border-color: #c12e2a; } .btn-danger:active, .btn-danger.active, @@ -2520,19 +2520,24 @@ fieldset[disabled] a.btn { fieldset[disabled] .btn-danger:focus, fieldset[disabled] .btn-danger.focus { background-color: #d9534f; - border-color: #d43f3a; + border-color: #d9534f; } .btn-danger.disabled:hover, .btn-danger:disabled:hover, fieldset[disabled] .btn-danger:hover { background-color: #d9534f; - border-color: #d43f3a; + border-color: #d9534f; } .btn-danger .badge { color: #d9534f; background-color: #fff; } +.btn-outline { + background-color: #fff; + background-image: transparent; +} + .btn-link { font-weight: normal; color: #0275d8; -- cgit v1.2.3