mirrors/bootstrap
2
0
Fork 0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-05-30 15:24:08 +03:00
Code Activity

Update inline forms (updated docs and new flexbox styles) (#21212)

Browse Source 
* fix form-inline with flex enabled
* grunt
* fix alignment of labels
* shorter if syntax
* add new form example to docs for now
* update inline form docs usage guidelines
* responsive margins
* better margin utils
* fix sizing of .form-check
* flexbox alignment of .form-check
* no need to change direction
* support custom controls in inline form, for default and flex modes
* add example of custom select and checks to docs
* remove hidden and visible label variants since we cover that in the usage guidelines at the start and include hidden labels everywhere
* use property value instead of layout name
* apply to all labels
* add a visible label, space it out
* add id
This commit is contained in:
Mark Otto
2016-11-26 16:55:18 -08:00
committed by GitHub
parent b456cb351d
commit e17e75b757
4 changed files with 125 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dist/css/bootstrap-flex.css
Vendored
+21 -12
View File
@@ -2565,11 +2565,30 @@ select.form-control-lg:not([size]):not([multiple]), .input-group-lg > select.for
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23d9534f' viewBox='-2 -2 7 7'%3E%3Cpath stroke='%23d9534f' d='M0 0l3 3m0-3L0 3'/%3E%3Ccircle r='.5'/%3E%3Ccircle cx='3' r='.5'/%3E%3Ccircle cy='3' r='.5'/%3E%3Ccircle cx='3' cy='3' r='.5'/%3E%3C/svg%3E");
}
.form-inline {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row wrap;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
}
@media (min-width: 576px) {
.form-inline .form-group {
display: inline-block;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 0;
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
-webkit-flex-flow: row wrap;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
margin-bottom: 0;
vertical-align: middle;
}
.form-inline .form-control {
display: inline-block;
@@ -2580,17 +2599,7 @@ select.form-control-lg:not([size]):not([multiple]), .input-group-lg > select.for
display: inline-block;
}
.form-inline .input-group {
display: inline-table;
width: auto;
vertical-align: middle;
}
.form-inline .input-group .input-group-addon,
.form-inline .input-group .input-group-btn,
.form-inline .input-group .form-control {
width: auto;
}
.form-inline .input-group > .form-control {
width: 100%;
}
.form-inline .form-control-label {
margin-bottom: 0;