From c33783814bf3d8ac7f67a54dc816460dc1bd5bf3 Mon Sep 17 00:00:00 2001 From: Chris Rebert Date: Thu, 4 Feb 2016 20:38:46 -0800 Subject: Add migration guidance regarding vendor prefix mixins Refs #19080 --- docs/migration.md | 5 +++++ 1 file changed, 5 insertions(+) (limited to 'docs/migration.md') diff --git a/docs/migration.md b/docs/migration.md index effbc90a5..9cc310dcc 100644 --- a/docs/migration.md +++ b/docs/migration.md @@ -151,6 +151,11 @@ Dropped entirely for the new card component. - Added `.pull-{xs,sm,md,lg,xl}-{left,right,none}` classes for responsive floats - Removed `.pull-left` and `.pull-right` since they're redundant to `.pull-xs-left` and `.pull-xs-right` +### Vendor prefix mixins +Bootstrap 3's [vendor prefix](http://webdesign.about.com/od/css/a/css-vendor-prefixes.htm) mixins, which were deprecated in v3.2.0, have been removed in Bootstrap 4. Since we use [Autoprefixer](https://github.com/postcss/autoprefixer), they're no longer necessary. + +Removed the following mixins: `animation`, `animation-delay`, `animation-direction`, `animation-duration`, `animation-fill-mode`, `animation-iteration-count`, `animation-name`, `animation-timing-function`, `backface-visibility`, `box-sizing`, `content-columns`, `hyphens`, `opacity`, `perspective`, `perspective-origin`, `rotate`, `rotateX`, `rotateY`, `scale`, `scaleX`, `scaleY`, `skew`, `transform-origin`, `transition-delay`, `transition-duration`, `transition-property`, `transition-timing-function`, `transition-transform`, `translate`, `translate3d`, `user-select` + ## Documentation Our documentation received an upgrade across the board as well. Here's the low down: -- cgit v1.2.3 From 3076790add974aa0cb2923abba2cdff7ba0b423c Mon Sep 17 00:00:00 2001 From: Quy Date: Fri, 5 Feb 2016 04:40:18 -0800 Subject: Remove pager section from migration --- docs/migration.md | 4 ---- 1 file changed, 4 deletions(-) (limited to 'docs/migration.md') diff --git a/docs/migration.md b/docs/migration.md index effbc90a5..ee3e37235 100644 --- a/docs/migration.md +++ b/docs/migration.md @@ -107,10 +107,6 @@ New to Bootstrap 4 is the Reboot, a new stylesheet that builds on Normalize with - Dropped the `.navbar-form` class entirely. It's no longer necessary. -### Pager - -- Renamed `.previous` and `.next` to `.pager-prev` and `.pager-next`. - ### Pagination - Explicit classes (`.page-item`, `.page-link`) are now required on the descendants of `.pagination`s -- cgit v1.2.3 From ce81dd8537404deff21c59ea9ab917589cc35bf1 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sat, 6 Feb 2016 13:02:59 -0800 Subject: document migration for grid system /cc #17593 --- docs/migration.md | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) (limited to 'docs/migration.md') diff --git a/docs/migration.md b/docs/migration.md index beb3ff581..2d1e54ec1 100644 --- a/docs/migration.md +++ b/docs/migration.md @@ -22,11 +22,20 @@ Here are the big ticket items you'll want to be aware of when moving from v3 to ### Global changes - Switched from [Less](http://lesscss.org/) to [Sass](http://sass-lang.com/) for our source CSS files. -- Switched from `px` to `rem` as our primary CSS unit, though pixels are still used for media queries and more as viewports are not affected by type size. +- Switched from `px` to `rem` as our primary CSS unit, though pixels are still used for media queries and grid behavior as viewports are not affected by type size. - Global font-size increased from `14px` to `16px`. - Added a new grid tier for ~`480px` and below. - Replaced the separate optional theme with configurable options via SCSS variables (e.g., `$enable-gradients: true`). +### Grid system + +- Added support for flexbox (set `$enable-flex: true` and recompile) in the grid mixins and predefined classes. +- As part of flexbox, included support for vertical and horizontal alignment classes. +- Overhauled grid mixins to merge `make-col-span` into `make-col` for a singular mixin. +- Added a new `sm` grid tier below `768px` for more granular control. We now have `xs`, `sm`, `md`, `lg`, and `xl`. This also means every tier has been bumped up one level (so `.col-md-6` in v3 is now `.col-lg-6` in v4). +- Changed grid system media query breakpoints and container widths to account for new grid tier and ensure columns are evenly divisible by `12` at their max width. +- Grid breakpoints and container widths are now handled via Sass maps instead of a handful of separate variables. These replace the `@screen-*` variables entirely and allow you to fully customize the grid tiers. + ### Components - Dropped panels, thumbnails, and wells for a new all-encompassing component, cards. -- cgit v1.2.3 From 844a180fae817b8db027404cd76af9fe6c77382f Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sat, 6 Feb 2016 13:05:54 -0800 Subject: mention media query changes --- docs/migration.md | 1 + 1 file changed, 1 insertion(+) (limited to 'docs/migration.md') diff --git a/docs/migration.md b/docs/migration.md index 2d1e54ec1..acab25c02 100644 --- a/docs/migration.md +++ b/docs/migration.md @@ -35,6 +35,7 @@ Here are the big ticket items you'll want to be aware of when moving from v3 to - Added a new `sm` grid tier below `768px` for more granular control. We now have `xs`, `sm`, `md`, `lg`, and `xl`. This also means every tier has been bumped up one level (so `.col-md-6` in v3 is now `.col-lg-6` in v4). - Changed grid system media query breakpoints and container widths to account for new grid tier and ensure columns are evenly divisible by `12` at their max width. - Grid breakpoints and container widths are now handled via Sass maps instead of a handful of separate variables. These replace the `@screen-*` variables entirely and allow you to fully customize the grid tiers. +- Media queries have also changed. Instead of repeating our media query declarations with the same value each time, we now have `@include media-breakpoint-up/down/only`. Now, instead of writing `@media (min-width: @screen-sm-min) { ... }`, you can write `@include media-breakpoint-up(sm) { ... }`. ### Components -- cgit v1.2.3 From b72e4ed8d675fe197d3ebdd69225eaecdd62e02e Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sat, 6 Feb 2016 15:41:14 -0800 Subject: add note to migration docs --- docs/migration.md | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) (limited to 'docs/migration.md') diff --git a/docs/migration.md b/docs/migration.md index acab25c02..05f15a28f 100644 --- a/docs/migration.md +++ b/docs/migration.md @@ -154,8 +154,9 @@ Dropped entirely for the new card component. ### Utilities -- Added `.pull-{xs,sm,md,lg,xl}-{left,right,none}` classes for responsive floats -- Removed `.pull-left` and `.pull-right` since they're redundant to `.pull-xs-left` and `.pull-xs-right` +- Added `.pull-{xs,sm,md,lg,xl}-{left,right,none}` classes for responsive floats. +- Removed `.pull-left` and `.pull-right` since they're redundant to `.pull-xs-left` and `.pull-xs-right`. +- Dropped `.center-block` for the new `.m-x-auto` class. ### Vendor prefix mixins Bootstrap 3's [vendor prefix](http://webdesign.about.com/od/css/a/css-vendor-prefixes.htm) mixins, which were deprecated in v3.2.0, have been removed in Bootstrap 4. Since we use [Autoprefixer](https://github.com/postcss/autoprefixer), they're no longer necessary. -- cgit v1.2.3 From 856e21757431ca6c1bbe9e183708ec7174fa73a1 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sat, 6 Feb 2016 15:56:33 -0800 Subject: migration notes for the text utils changes --- docs/migration.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'docs/migration.md') diff --git a/docs/migration.md b/docs/migration.md index acab25c02..45f290dcb 100644 --- a/docs/migration.md +++ b/docs/migration.md @@ -154,8 +154,8 @@ Dropped entirely for the new card component. ### Utilities -- Added `.pull-{xs,sm,md,lg,xl}-{left,right,none}` classes for responsive floats -- Removed `.pull-left` and `.pull-right` since they're redundant to `.pull-xs-left` and `.pull-xs-right` +- Added `.pull-{xs,sm,md,lg,xl}-{left,right,none}` classes for responsive floats and removed `.pull-left` and `.pull-right` since they're redundant to `.pull-xs-left` and `.pull-xs-right`. +- Added responsive variations to our text alignment classes `.text-{xs,sm,md,lg,xl}-{left,center,right}` and removed the redundant `.text-{left,center,right}` utilities as they are the same as the `xs` variation. ### Vendor prefix mixins Bootstrap 3's [vendor prefix](http://webdesign.about.com/od/css/a/css-vendor-prefixes.htm) mixins, which were deprecated in v3.2.0, have been removed in Bootstrap 4. Since we use [Autoprefixer](https://github.com/postcss/autoprefixer), they're no longer necessary. -- cgit v1.2.3