#853 flex workarounds until pulls are accepted - gets us back on the main twbs/bootstrap upstream branch

This commit is contained in:
Kevin Ross 2016-01-29 11:28:11 -06:00
parent 8a6cd36e17
commit fba636e11e
5 changed files with 55 additions and 189 deletions

View File

@ -31,12 +31,12 @@
"js/tests", "js/tests",
"test-infra" "test-infra"
], ],
"dependencies": { "x-private-dependencies": {
"bootstrap": "git@github.com:rosskevin/bootstrap.git#v4-tmp-flex-master", "bootstrap": "git@github.com:rosskevin/bootstrap.git#v4-tmp-flex-master",
"tether": "^1.1" "tether": "^1.1"
}, },
"old-dependencies": { "dependencies": {
"bootstrap": "v4-dev", "bootstrap": "git@github.com:twbs/bootstrap.git#v4-dev",
"tether": "^1.1" "tether": "^1.1"
} }
} }

View File

@ -33,7 +33,7 @@
}, },
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"bootstrap": "rosskevin/bootstrap#v4-tmp-flex-master", "bootstrap": "twbs/bootstrap#v4-dev",
"jquery": "^2.0", "jquery": "^2.0",
"tether": "^1.1.1" "tether": "^1.1.1"
}, },

View File

@ -1,4 +1,4 @@
// FIXME: temporarily use the local bootstrap - waiting on flex enable navbar https://github.com/twbs/bootstrap/pull/18976 // FIXME: only necessary because there isn't an underscored file - see https://github.com/twbs/bootstrap/issues/18350
//@import "../bower_components/bootstrap/scss/ //@import "../bower_components/bootstrap/scss/
//@import "../../bootstrap/scss/ //@import "../../bootstrap/scss/
@ -7,6 +7,23 @@
@import "bootstrap/scss/variables"; @import "bootstrap/scss/variables";
@import "bootstrap/scss/mixins"; @import "bootstrap/scss/mixins";
// #853 start - https://github.com/twbs/bootstrap/pull/18976/files
// hack
@mixin pull-left {
float: left !important;
@if $enable-flex {
margin-right: auto;
}
}
@mixin pull-right {
float: right !important;
@if $enable-flex {
margin-left: auto;
}
}
// #853 end - https://github.com/twbs/bootstrap/pull/18976/files
// Reset and dependencies // Reset and dependencies
@import "bootstrap/scss/normalize"; @import "bootstrap/scss/normalize";
@import "bootstrap/scss/print"; @import "bootstrap/scss/print";

View File

@ -6,6 +6,13 @@
// - triple line 88dp // - triple line 88dp
.list-group { .list-group {
// #853 start -- https://github.com/twbs/bootstrap/pull/18981/files
@if $enable-flex {
display: flex;
flex-direction: column;
}
// #853 end -- https://github.com/twbs/bootstrap/pull/18981/files
flex-grow: 1; flex-grow: 1;
// Add 8dp of padding at the top and bottom of a list. One exception is at the top of a list with a subheader, because subheaders contain their own padding. // Add 8dp of padding at the top and bottom of a list. One exception is at the top of a list with a subheader, because subheaders contain their own padding.
@ -29,13 +36,22 @@
} }
.list-group-item { .list-group-item {
// #853 start -- https://github.com/twbs/bootstrap/pull/18981/files
@if $enable-flex {
display: flex;
flex-flow: row wrap;
align-items: center;
} @else {
display: block;
}
// #853 end -- https://github.com/twbs/bootstrap/pull/18981/files
padding: 1rem; padding: 1rem;
line-height: 1; line-height: 1;
.list-group-item-text { // word wrap? http://stackoverflow.com/a/26535469/2363935 .list-group-item-text { // word wrap? http://stackoverflow.com/a/26535469/2363935
//flex-flow: row wrap; //flex-flow: row wrap;
min-width: 0; min-width: 0;
max-height: 2.188rem; // 88dp tile total height max-height: 2.188rem; // 88dp tile total height
// FIXME: text overflow with ellipsis is not working // FIXME: text overflow with ellipsis is not working
//flex: 0 1 auto; // http://stackoverflow.com/questions/12022288/how-to-keep-a-flex-item-from-overflowing-due-to-its-text //flex: 0 1 auto; // http://stackoverflow.com/questions/12022288/how-to-keep-a-flex-item-from-overflowing-due-to-its-text
overflow: hidden; overflow: hidden;

View File

@ -4,186 +4,19 @@
border-radius: 0; border-radius: 0;
@include box-shadow($mdb-shadow-2dp); @include box-shadow($mdb-shadow-2dp);
//.navbar-brand { // #853 start - https://github.com/twbs/bootstrap/pull/18976/files
// position: relative; @if $enable-flex {
// height: 60px; display: flex;
// line-height: 30px; flex-flow: row nowrap;
// color: inherit; flex-shrink: 0;
// &:hover, align-items: center;
// &:focus { align-self: stretch;
// color: inherit;
// background-color: transparent; > * {
// } flex-shrink: 0;
//} }
// } @else {
//.navbar-text { @include clearfix;
// color: inherit; }
// margin-top: 20px; // #853 end - https://github.com/twbs/bootstrap/pull/18976/files
// margin-bottom: 20px;
//}
//
//.navbar-nav {
// > li > a {
// color: inherit;
// padding-top: 20px;
// padding-bottom: 20px;
//
// &:hover,
// &:focus {
// color: inherit;
// background-color: transparent;
// }
// }
// > .active > a {
// &,
// &:hover,
// &:focus {
// color: inherit;
// background-color: rgba($white, 0.1);
// }
// }
// > .disabled > a {
// &,
// &:hover,
// &:focus {
// color: inherit;
// background-color: transparent;
// opacity: 0.9;
// }
// }
//}
//
//// Darken the responsive nav toggle
//.navbar-toggle {
// border: 0;
// &:hover,
// &:focus {
// background-color: transparent;
// }
// .icon-bar {
// background-color: inherit;
// border: 1px solid;
// }
//}
//
//.navbar-default .navbar-toggle,
//.navbar-inverse .navbar-toggle {
// border-color: transparent;
//}
//
//.navbar-collapse,
//
//// Dropdowns
//.navbar-nav {
// > .open > a {
// &,
// &:hover,
// &:focus {
// background-color: transparent;
// color: inherit;
// }
// }
//
// @include media-breakpoint-down(md) {
// //@media (max-width: $grid-float-breakpoint-max) { //768px
// .navbar-text {
// color: inherit;
// margin-top: 15px;
// margin-bottom: 15px;
// }
//
// // Dropdowns get custom display
// .open .dropdown-menu {
// > .dropdown-header {
// border: 0;
// color: inherit;
// }
// .divider {
// border-bottom: 1px solid;
// opacity: 0.08;
// }
// > li > a {
// color: inherit;
// &:hover,
// &:focus {
// color: inherit;
// background-color: transparent;
// }
// }
// > .active > a {
// &,
// &:hover,
// &:focus {
// color: inherit;
// background-color: transparent;
// }
// }
// > .disabled > a {
// &,
// &:hover,
// &:focus {
// color: inherit;
// background-color: transparent;
// }
// }
// }
// }
//}
//
//.navbar-link {
// color: inherit;
// &:hover {
// color: inherit;
// }
//}
//
//.btn-link {
// color: inherit;
// &:hover,
// &:focus {
// color: inherit;
// }
// &[disabled],
// fieldset[disabled] & {
// &:hover,
// &:focus {
// color: inherit;
// }
// }
//}
//
// .mdb-form-group {
// margin: 0;
// padding: 0;
// }
//
// .mdb-form-group .form-control,
// .form-control {
// border-color: inherit;
// color: inherit;
// padding: 0;
// margin: 0;
// }
//
//// SASS conversion note: please mirror any content change in _mixins-shared.scss navbar-variations-content
//@include navbar-variations(unquote(".navbar"), unquote(""), $brand-primary);
//
//
//&-inverse {
// background-color: $indigo;
//}
//
//@include media-breakpoint-down(lg) {
// //@media (max-width: $screen-md-max) { // 1200-1
//
// .navbar-brand {
// height: 50px;
// padding: 10px 15px;
// }
//
// .navbar-nav > li > a {
// padding-top: 15px;
// padding-bottom: 15px;
// }
//}
} }